From b4d989e25921cc9cb9e5f6d1bfafdc1a332b95a6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E6=96=87=E5=8F=AF?= <1041367524@qq.com>
Date: Sat, 7 May 2022 18:04:03 +0800
Subject: [PATCH] fix: BUG

---
 src/components/extra/ElImage.vue   |  5 +--
 src/views/sales/order/address.vue  | 12 ++++--
 src/views/sales/order/detail.vue   | 10 +++--
 src/views/sales/order/fees.vue     | 10 ++++-
 src/views/sales/service/detail.vue | 16 +++----
 src/views/sales/service/track.vue  | 67 ++++++++++++++++++++++++++++++
 6 files changed, 101 insertions(+), 19 deletions(-)
 create mode 100644 src/views/sales/service/track.vue

diff --git a/src/components/extra/ElImage.vue b/src/components/extra/ElImage.vue
index 9402030..4278fd6 100644
--- a/src/components/extra/ElImage.vue
+++ b/src/components/extra/ElImage.vue
@@ -89,9 +89,8 @@
 <style lang="less" scoped>
     .image-container {
         position: relative;
-        margin: auto;
-        width: max-content;
-        height: max-content;
+        width: v-bind(width);
+        height: v-bind(height);
         display: flex;
         justify-content: center;
         border-radius: @layout-space;
diff --git a/src/views/sales/order/address.vue b/src/views/sales/order/address.vue
index b7a9c5a..b35de32 100644
--- a/src/views/sales/order/address.vue
+++ b/src/views/sales/order/address.vue
@@ -1,6 +1,12 @@
 <template>
-    <el-dialog v-model="state.visible" title="修改收货人信息">
-        <el-form ref="refsForm" v-loading="state.submitting" :model="state.form" :rules="state.rules">
+    <el-dialog v-model="state.visible" title="修改收货人信息" width="480px">
+        <el-form
+            ref="refsForm"
+            v-loading="state.submitting"
+            label-width="100px"
+            :model="state.form"
+            :rules="state.rules"
+        >
             <el-form-item label="收货人姓名" prop="recipientName">
                 <el-input v-model="state.form.recipientName" />
             </el-form-item>
@@ -8,7 +14,7 @@
                 <el-input v-model="state.form.recipientPhone" />
             </el-form-item>
             <el-form-item label="所在区域" prop="address">
-                <el-area v-model="state.form.address" v-model:info="state.form.addressInfo" />
+                <el-area v-model="state.form.address" v-model:info="state.form.addressInfo" style="width: 100%" />
             </el-form-item>
             <el-form-item label="详细地址" prop="detailAddress">
                 <el-input v-model="state.form.detailAddress" type="textarea" />
diff --git a/src/views/sales/order/detail.vue b/src/views/sales/order/detail.vue
index c142fc7..1545cd4 100644
--- a/src/views/sales/order/detail.vue
+++ b/src/views/sales/order/detail.vue
@@ -28,7 +28,7 @@
                 <h3>基本信息</h3>
                 <el-table border :data="[state.form]">
                     <el-table-column align="center" header-align="center" label="订单编号" prop="orderNo" width="240" />
-                    <el-table-column align="center" header-align="center" label="用户账号" prop="userId" width="240" />
+                    <!-- <el-table-column align="center" header-align="center" label="用户账号" prop="userId" width="240" /> -->
                     <el-table-column
                         align="center"
                         header-align="center"
@@ -48,14 +48,18 @@
                         label="配送方式"
                         prop="logistics.companyName"
                         width="240"
-                    />
+                    >
+                        <template #default="{ row }">{{ row.logistics?.companyName || '未发货' }}</template>
+                    </el-table-column>
                     <el-table-column
                         align="center"
                         header-align="center"
                         label="物流单号"
                         prop="logistics.trackingNo"
                         width="240"
-                    />
+                    >
+                        <template #default="{ row }">{{ row.logistics?.trackingNo || '未发货' }}</template>
+                    </el-table-column>
                     <el-table-column align="center" header-align="center" label="自动确认收货时间" prop="receiveExpire">
                         <template #default="{ row }">{{ row.receiveExpire }}天</template>
                     </el-table-column>
diff --git a/src/views/sales/order/fees.vue b/src/views/sales/order/fees.vue
index 678ef4f..13c4280 100644
--- a/src/views/sales/order/fees.vue
+++ b/src/views/sales/order/fees.vue
@@ -1,6 +1,12 @@
 <template>
-    <el-dialog v-model="state.visible" title="修改费用信息">
-        <el-form ref="refsForm" v-loading="state.submitting" :model="state.form" :rules="state.rules">
+    <el-dialog v-model="state.visible" title="修改费用信息" width="300px">
+        <el-form
+            ref="refsForm"
+            v-loading="state.submitting"
+            label-width="100px"
+            :model="state.form"
+            :rules="state.rules"
+        >
             <el-form-item label="商品合计" prop="totalAmount">￥{{ state.order.totalAmount }}</el-form-item>
             <el-form-item label="运费" prop="shippingAmount">
                 <el-input-number v-model="state.form.shippingAmount" />
diff --git a/src/views/sales/service/detail.vue b/src/views/sales/service/detail.vue
index 1cc61b1..52fb8aa 100644
--- a/src/views/sales/service/detail.vue
+++ b/src/views/sales/service/detail.vue
@@ -88,10 +88,10 @@
                     </el-form-item>
                     <el-form-item label="凭证照片">
                         <el-image
-                            v-for="(item, index) in state.detail.refundEvidences"
-                            :key="index"
                             alt="凭证照片"
-                            :src="item.fileUrl"
+                            :preview-src-list="state.detail.refundEvidences?.map((item) => item.fileUrl)"
+                            :src="state.detail.refundEvidences?.[0]?.fileUrl"
+                            width="100px"
                         />
                     </el-form-item>
                 </el-form>
@@ -239,10 +239,10 @@
                             </el-form-item>
                             <el-form-item label="凭证照片">
                                 <el-image
-                                    v-for="(item, index) in state.detail.logisticsEvidences"
-                                    :key="index"
                                     alt="凭证照片"
-                                    :src="item.fileUrl"
+                                    :preview-src-list="state.detail.logisticsEvidences?.map((item) => item.fileUrl)"
+                                    :src="state.detail.logisticsEvidences?.[0]?.fileUrl"
+                                    width="100px"
                                 />
                             </el-form-item>
                         </el-form>
@@ -263,7 +263,7 @@
 </template>
 
 <script setup lang="jsx">
-    import OrderTrack from '../order/track.vue';
+    import OrderTrack from './track.vue';
     const store = useStore();
     const route = useRoute();
     const { proxy } = getCurrentInstance();
@@ -410,7 +410,7 @@
     };
     const refsOrderTrack = ref(null);
     const handleTrack = () => {
-        unref(refsOrderTrack).show(state.detail.orderId);
+        unref(refsOrderTrack).show(state.detail.refundLogistics);
     };
     /* 同意退货/退款 */
     const handleResolveRefundOrReturn = async () => {
diff --git a/src/views/sales/service/track.vue b/src/views/sales/service/track.vue
new file mode 100644
index 0000000..ae91627
--- /dev/null
+++ b/src/views/sales/service/track.vue
@@ -0,0 +1,67 @@
+<template>
+    <el-dialog v-model="state.visible" title="物流跟踪">
+        <div v-loading="state.loading" class="track-container">
+            <h3>
+                <span class="name">{{ state.info.companyName }}</span>
+                <span class="no">{{ state.info.trackingNo }}</span>
+                <el-button type="text" @click="$copy(`${state.info.companyName} ${state.info.trackingNo}`)">
+                    复制
+                </el-button>
+            </h3>
+            <el-scrollbar max-height="50vh">
+                <el-timeline>
+                    <el-timeline-item
+                        v-for="(item, index) in state.info.logisticsDataList"
+                        :key="index"
+                        placement="top"
+                        :timestamp="item.time"
+                    >
+                        {{ item.context }}
+                    </el-timeline-item>
+                </el-timeline>
+            </el-scrollbar>
+        </div>
+        <template #footer>
+            <el-button @click="close">关闭</el-button>
+        </template>
+    </el-dialog>
+</template>
+
+<script setup lang="jsx">
+    const store = useStore();
+    const opts = computed(() => store.state.order.opts);
+    if (!unref(opts).init) {
+        store.dispatch('order/load');
+    }
+    const state = reactive({
+        loading: false,
+        visible: false,
+        info: {
+            logisticsDataList: [],
+        },
+    });
+
+    const show = async (info) => {
+        state.visible = true;
+        Object.assign(state.info, info);
+        state.loading = false;
+    };
+    const close = () => {
+        state.visible = false;
+    };
+    defineExpose({
+        show,
+        close,
+    });
+</script>
+
+<style lang="less" scoped>
+    .track-container {
+        h3 {
+            margin-bottom: @layout-space;
+            .no {
+                margin: 0 @layout-space;
+            }
+        }
+    }
+</style>