hurx 1 giorno fa
parent
commit
4147482a92
1 ha cambiato i file con 65 aggiunte e 4 eliminazioni
  1. 65 4
      src/views/order/saleOrder/logisticsDetail.vue

+ 65 - 4
src/views/order/saleOrder/logisticsDetail.vue

@@ -26,6 +26,26 @@
               <div>{{ item.time }}</div>
               <div>{{ item.location }}</div>
               <div>{{ item.status }}</div>
+              <div v-if="item.imagesUrl" class="timeline-images">
+                <div class="image-label">签收图片:</div>
+                <div class="image-list">
+                  <el-image
+                    v-for="(url, imgIndex) in item.imagesUrl.split(',')"
+                    :key="imgIndex"
+                    :src="url"
+                    :preview-src-list="item.imagesUrl.split(',')"
+                    :initial-index="imgIndex"
+                    fit="cover"
+                    class="sign-image"
+                  >
+                    <template #error>
+                      <div class="image-error">
+                        <el-icon><Picture /></el-icon>
+                      </div>
+                    </template>
+                  </el-image>
+                </div>
+              </div>
             </div>
           </div>
         </el-timeline-item>
@@ -40,6 +60,7 @@
 import { listOrderDeliver, queryTrack } from '@/api/order/orderDeliver';
 import { OrderDeliverVO } from '@/api/order/orderDeliver/types';
 import { listOrderStatusLog } from '@/api/order/orderStatusLog';
+import { Picture } from '@element-plus/icons-vue';
 interface Props {
   modelValue: boolean;
   orderId?: string | number;
@@ -49,6 +70,7 @@ interface LogisticsInfo {
   time: string;
   location: string;
   status: string;
+  imagesUrl: string;
 }
 
 const props = defineProps<Props>();
@@ -116,10 +138,11 @@ const handleLogisticNoChange = async (logisticNo: string) => {
 
           return {
             time: displayTime,
-            // 3. 建议:保留原始状态字段,方便后续筛选(如“已签收”
+            // 3. 建议:保留原始状态字段,方便后续筛选(如"已签收"
             status: item.context || item.content || '',
             // 4. 建议:如果有地址字段,也可以映射进来,没有则保持订单号
-            location: item.location || (selected.orderCode ? `${selected.orderCode}` : '')
+            location: item.location || (selected.orderCode ? `${selected.orderCode}` : ''),
+            imagesUrl: ''
           };
         });
       }
@@ -134,7 +157,8 @@ const handleLogisticNoChange = async (logisticNo: string) => {
           return {
             time: item.createTime,
             location: item.orderCode ? `${item.orderCode}` : '',
-            status: item.statusName
+            status: item.statusName,
+            imagesUrl: item.imagesUrl
           };
         });
       });
@@ -153,7 +177,8 @@ const handleLogisticNoChange = async (logisticNo: string) => {
       {
         time: (selected as any).createTime || '',
         location: selected.orderCode ? `${selected.orderCode}` : '',
-        status: '已下单'
+        status: '已下单',
+        imagesUrl: ''
       }
     ];
   }
@@ -211,6 +236,42 @@ const handleClose = () => {
           margin-bottom: 0;
         }
       }
+
+      .timeline-images {
+        margin-top: 8px;
+        padding-top: 8px;
+        border-top: 1px dashed #dcdfe6;
+
+        .image-label {
+          font-size: 13px;
+          color: #909399;
+          margin-bottom: 6px;
+        }
+
+        .image-list {
+          display: flex;
+          flex-wrap: wrap;
+          gap: 8px;
+
+          .sign-image {
+            width: 60px;
+            height: 60px;
+            border-radius: 4px;
+            border: 1px solid #dcdfe6;
+            cursor: pointer;
+
+            .image-error {
+              width: 100%;
+              height: 100%;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              background-color: #f5f7fa;
+              color: #c0c4cc;
+            }
+          }
+        }
+      }
     }
   }