From c7fe19f33cca09065cf724d7904a818dd92b625f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Tue, 10 Feb 2026 00:53:41 +0800
Subject: [PATCH] =?UTF-8?q?refactor(order):=20=E9=87=8D=E6=9E=84=E8=AE=A2?=
 =?UTF-8?q?=E5=8D=95=E7=AE=A1=E7=90=86=E7=95=8C=E9=9D=A2=E4=BB=A5=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E6=98=BE=E7=A4=BA=E5=92=8C=E4=BA=A4=E4=BA=92=E4=BD=93?=
 =?UTF-8?q?=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整订单详情抽屉宽度从65%到70%
- 移除订单详情中的顶部操作按钮区域
- 在订单详情中新增买家备注显示字段
- 将商品信息卡片从底部移至收货信息前
- 为表格组件添加缓存键以改善性能
- 合并订单状态标签显示包括支付、发货、开票和订单状态
- 优化表格列宽设置并调整操作列宽度
- 更新表格行双击事件以正确打开编辑窗口
- 注释掉商户管理界面中的组织部门字段显示
---
 src/views/shop/shopAdmin/index.vue            |  12 +-
 .../shop/shopOrder/components/orderInfo.vue   | 168 ++--------
 src/views/shop/shopOrder/index.vue            | 312 +++++++++---------
 3 files changed, 190 insertions(+), 302 deletions(-)

diff --git a/src/views/shop/shopAdmin/index.vue b/src/views/shop/shopAdmin/index.vue
index 9154de6..d9adc6e 100644
--- a/src/views/shop/shopAdmin/index.vue
+++ b/src/views/shop/shopAdmin/index.vue
@@ -232,12 +232,12 @@
       align: 'center',
       showSorterTooltip: false
     },
-    {
-      title: '所属部门',
-      dataIndex: 'organizationName',
-      key: 'organizationName',
-      align: 'center'
-    },
+    // {
+    //   title: '所属部门',
+    //   dataIndex: 'organizationName',
+    //   key: 'organizationName',
+    //   align: 'center'
+    // },
     {
       title: '角色',
       dataIndex: 'roles',
diff --git a/src/views/shop/shopOrder/components/orderInfo.vue b/src/views/shop/shopOrder/components/orderInfo.vue
index 9ae0f29..0de5eb2 100644
--- a/src/views/shop/shopOrder/components/orderInfo.vue
+++ b/src/views/shop/shopOrder/components/orderInfo.vue
@@ -1,7 +1,7 @@
 <!-- 用户编辑弹窗 -->
 <template>
   <a-drawer
-    :width="`65%`"
+    width="70%"
     :visible="visible"
     :confirm-loading="loading"
     :maxable="maxAble"
@@ -11,110 +11,6 @@
     :footer="null"
     @ok="save"
   >
-    <template #extra>
-      <a-space>
-        <!-- 未付款状态的操作 -->
-        <template v-if="!form.payStatus">
-          <!-- 取消订单：未完成且未付款 -->
-          <a-button
-            v-if="form.orderStatus === 0"
-            @click="handleCancelOrder"
-            danger
-            :loading="loading"
-          >
-            取消订单
-          </a-button>
-
-          <!-- 修改订单：未完成且未付款 -->
-          <a-button
-            v-if="form.orderStatus === 0"
-            @click="handleEditOrder"
-            :loading="loading"
-          >
-            修改订单
-          </a-button>
-        </template>
-
-        <!-- 已付款状态的操作 -->
-        <template v-if="form.payStatus">
-          <!-- 发货按钮：已付款且未发货且未取消 -->
-          <a-button
-            v-if="
-              form.deliveryStatus === 10 && !isCancelledStatus(form.orderStatus)
-            "
-            type="primary"
-            @click="handleDelivery"
-            :loading="loading"
-          >
-            发货
-          </a-button>
-
-          <!-- 确认收货：已发货且未完成 -->
-          <a-button
-            v-if="form.deliveryStatus === 20 && form.orderStatus === 0"
-            type="primary"
-            @click="handleConfirmReceive"
-            :loading="loading"
-          >
-            确认收货
-          </a-button>
-        </template>
-
-        <!-- 退款相关操作 -->
-        <template v-if="isRefundStatus(form.orderStatus)">
-          <!-- 同意退款：退款申请中或客户端申请退款 -->
-          <a-button
-            v-if="form.orderStatus === 4 || form.orderStatus === 7"
-            type="primary"
-            @click="handleApproveRefund"
-            :loading="loading"
-          >
-            同意退款
-          </a-button>
-
-          <!-- 拒绝退款：退款申请中或客户端申请退款 -->
-          <a-button
-            v-if="form.orderStatus === 4 || form.orderStatus === 7"
-            danger
-            @click="handleRejectRefund"
-            :loading="loading"
-          >
-            拒绝退款
-          </a-button>
-
-          <!-- 重新处理：退款被拒绝 -->
-          <a-button
-            v-if="form.orderStatus === 5"
-            @click="handleRetryRefund"
-            :loading="loading"
-          >
-            重新处理
-          </a-button>
-        </template>
-
-        <!-- 申请退款：已完成或已发货的订单 -->
-        <a-button
-          v-if="canApplyRefund(form)"
-          @click="handleApplyRefund"
-          :loading="loading"
-        >
-          申请退款
-        </a-button>
-
-        <!-- 删除订单：已完成、已取消、退款成功 -->
-        <a-button
-          v-if="canDeleteOrder(form)"
-          @click="handleDeleteOrder"
-          danger
-          :loading="loading"
-        >
-          删除订单
-        </a-button>
-
-        <!-- 关闭按钮 -->
-        <a-button @click="updateVisible(false)"> 关闭 </a-button>
-      </a-space>
-    </template>
     <a-card title="基本信息" style="margin-bottom: 20px" :bordered="false">
       <a-descriptions :column="3">
         <!-- 第一排-->
@@ -300,6 +196,12 @@
           <a-tag v-if="form.isInvoice == 2" color="blue">不能开具</a-tag>
         </a-descriptions-item>
         <!-- 第六排-->
+        <a-descriptions-item
+          label="买家备注"
+          :labelStyle="{ width: '90px', color: '#808080' }"
+        >
+          {{ form.buyerRemarks }}
+        </a-descriptions-item>
         <!--        <a-descriptions-item-->
         <!--          label="结算状态"-->
         <!--          :labelStyle="{ width: '90px', color: '#808080' }"-->
@@ -318,6 +220,32 @@
       </a-descriptions>
     </a-card>
 
+    <a-card title="商品信息" style="margin-bottom: 20px" :bordered="false">
+      <a-spin :spinning="loading">
+        <a-table
+          :data-source="orderGoods"
+          :columns="columns"
+          :pagination="false"
+        >
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'goodsName'">
+              <div style="display: flex; align-items: center; gap: 12px">
+                <a-avatar
+                  :src="record.image || record.goodsImage"
+                  shape="square"
+                  :size="50"
+                  style="flex-shrink: 0"
+                />
+                <span style="flex: 1">{{
+                    record.goodsName || '未知商品'
+                  }}</span>
+              </div>
+            </template>
+          </template>
+        </a-table>
+      </a-spin>
+    </a-card>
+
     <a-card title="收货信息" style="margin-bottom: 20px" :bordered="false">
       <a-spin :spinning="loading">
         <a-descriptions :column="2">
@@ -449,36 +377,6 @@
       </a-spin>
     </a-card>
 
-    <a-card title="商品信息" style="margin-bottom: 20px" :bordered="false">
-      <a-spin :spinning="loading">
-        <a-table
-          :data-source="orderGoods"
-          :columns="columns"
-          :pagination="false"
-        >
-          <template #bodyCell="{ column, record }">
-            <template v-if="column.key === 'goodsName'">
-              <div style="display: flex; align-items: center; gap: 12px">
-                <a-avatar
-                  :src="record.image || record.goodsImage"
-                  shape="square"
-                  :size="50"
-                  style="flex-shrink: 0"
-                />
-                <span style="flex: 1">{{
-                  record.goodsName || '未知商品'
-                }}</span>
-              </div>
-            </template>
-          </template>
-        </a-table>
-      </a-spin>
-    </a-card>
-    <a-card title="买家留言" style="margin-bottom: 20px" :bordered="false">
-      <a-spin :spinning="loading">
-        {{ form.buyerRemarks || '-' }}
-      </a-spin>
-    </a-card>
     <a-card title="商家备注" style="margin-bottom: 20px" :bordered="false">
       <a-spin :spinning="loading">
         {{ form.merchantRemarks || '-' }}
diff --git a/src/views/shop/shopOrder/index.vue b/src/views/shop/shopOrder/index.vue
index 478afa2..2a5cae3 100644
--- a/src/views/shop/shopOrder/index.vue
+++ b/src/views/shop/shopOrder/index.vue
@@ -25,6 +25,7 @@
         :columns="columns"
         :datasource="datasource"
         :customRow="customRow"
+        cache-key="proShopOrderTable"
         :toolbar="false"
         tool-class="ele-toolbar-form"
         class="sys-org-table"
@@ -59,6 +60,69 @@
               </div>
             </a-space>
           </template>
+          <template v-if="column.key === 'statusInfo'">
+            <div class="py-1">
+              <a-space :size="6" wrap>
+                <!-- 支付状态 -->
+                <a-tag
+                  v-if="record.payStatus == 1"
+                  color="green"
+                  @click.stop="updatePayStatus(record)"
+                  class="cursor-pointer"
+                  >已付款</a-tag
+                >
+                <a-tag
+                  v-else-if="record.payStatus == 0 || record.payStatus == null"
+                  @click.stop="updatePayStatus(record)"
+                  class="cursor-pointer"
+                  >未付款</a-tag
+                >
+                <a-tag
+                  v-else-if="record.payStatus == 3"
+                  color="orange"
+                  @click.stop="updatePayStatus(record)"
+                  class="cursor-pointer"
+                  >占场中</a-tag
+                >
+
+                <!-- 发货状态 -->
+                <a-tag v-if="record.deliveryStatus == 10">未发货</a-tag>
+                <a-tag v-if="record.deliveryStatus == 20" color="green"
+                  >已发货</a-tag
+                >
+                <a-tag v-if="record.deliveryStatus == 30" color="blue"
+                  >部分发货</a-tag
+                >
+
+                <!-- 开票状态 -->
+<!--                <a-tag v-if="record.isInvoice == 0">未开具</a-tag>-->
+                <a-tag v-if="record.isInvoice == 1" color="green">已开具</a-tag>
+                <a-tag v-if="record.isInvoice == 2" color="blue">不能开具</a-tag>
+
+                <!-- 订单状态 -->
+                <a-tag v-if="record.orderStatus === 0">未完成</a-tag>
+                <a-tag v-if="record.orderStatus === 1" color="green"
+                  >已完成</a-tag
+                >
+                <a-tag v-if="record.orderStatus === 2">已关闭</a-tag>
+                <a-tag v-if="record.orderStatus === 3" color="red"
+                  >关闭中</a-tag
+                >
+                <a-tag v-if="record.orderStatus === 4" color="red"
+                  >退款申请中</a-tag
+                >
+                <a-tag v-if="record.orderStatus === 5" color="red"
+                  >退款被拒绝</a-tag
+                >
+                <a-tag v-if="record.orderStatus === 6" color="orange"
+                  >已退款</a-tag
+                >
+                <a-tag v-if="record.orderStatus === 7" color="pink"
+                  >客户端申请退款</a-tag
+                >
+              </a-space>
+            </div>
+          </template>
           <template v-if="column.key === 'orderGoods'">
             <template v-for="(item, index) in record.orderGoods" :key="index">
               <div class="item py-1">
@@ -81,22 +145,6 @@
               </template>
             </template>
           </template>
-          <template v-if="column.key === 'payStatus'">
-            <a-tag
-              v-if="record.payStatus"
-              color="green"
-              @click.stop="updatePayStatus(record)"
-              class="cursor-pointer"
-              >已付款
-            </a-tag>
-            <a-tag
-              v-if="!record.payStatus"
-              @click.stop="updatePayStatus(record)"
-              class="cursor-pointer"
-              >未付款
-            </a-tag>
-            <a-tag v-if="record.payStatus == 3">未付款,占场中</a-tag>
-          </template>
           <template v-if="column.key === 'image'">
             <a-image :src="record.image" :width="50" />
           </template>
@@ -104,146 +152,105 @@
             <a-tag v-if="record.sex === 1">男</a-tag>
             <a-tag v-if="record.sex === 2">女</a-tag>
           </template>
-          <template v-if="column.key === 'deliveryStatus'">
-            <a-tag v-if="record.deliveryStatus == 10">未发货</a-tag>
-            <a-tag v-if="record.deliveryStatus == 20" color="green"
-              >已发货</a-tag
-            >
-            <a-tag v-if="record.deliveryStatus == 30" color="blue"
-              >部分发货</a-tag
-            >
-          </template>
-          <template v-if="column.key === 'orderStatus'">
-            <a-tag v-if="record.orderStatus === 0">未完成</a-tag>
-            <a-tag v-if="record.orderStatus === 1" color="green">已完成</a-tag>
-            <a-tag v-if="record.orderStatus === 2">已关闭</a-tag>
-            <a-tag v-if="record.orderStatus === 3" color="red">关闭中</a-tag>
-            <a-tag v-if="record.orderStatus === 4" color="red"
-              >退款申请中</a-tag
-            >
-            <a-tag v-if="record.orderStatus === 5" color="red"
-              >退款被拒绝</a-tag
-            >
-            <a-tag v-if="record.orderStatus === 6" color="orange"
-              >退款成功</a-tag
-            >
-            <a-tag v-if="record.orderStatus === 7" color="pink"
-              >客户端申请退款</a-tag
-            >
-          </template>
-          <template v-if="column.key === 'isInvoice'">
-            <a-tag v-if="record.isInvoice == 0">未开具</a-tag>
-            <a-tag v-if="record.isInvoice == 1" color="green">已开具</a-tag>
-            <a-tag v-if="record.isInvoice == 2" color="blue">不能开具</a-tag>
-          </template>
           <template v-if="column.key === 'status'">
             <a-tag v-if="record.status === 0" color="green">显示</a-tag>
             <a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
           </template>
           <template v-if="column.key === 'action'">
-            <!-- 查看详情 - 所有状态都可以查看 -->
-            <a @click.stop="openEdit(record)"> <EyeOutlined /> 详情 </a>
+            <a-space>
+              <!-- 查看详情 - 所有状态都可以查看 -->
+              <a @click.stop="openEdit(record)"> <EyeOutlined /> 详情 </a>
 
-            <!-- 未付款状态的操作 -->
-            <template v-if="!record.payStatus && record.orderStatus === 0">
-              <a-divider type="vertical" />
-              <a @click.stop="handleEditOrder(record)">
-                <EditOutlined /> 修改
-              </a>
-              <a-divider type="vertical" />
-              <a @click.stop="handleCancelOrder(record)">
-                <span class="ele-text-warning"> <CloseOutlined /> 关闭 </span>
-              </a>
-            </template>
+              <!-- 未付款状态的操作 -->
+              <template v-if="!record.payStatus && record.orderStatus === 0">
+                <a @click.stop="handleEditOrder(record)">
+                  <EditOutlined /> 修改
+                </a>
+                <a @click.stop="handleCancelOrder(record)">
+                  <span class="ele-text-warning"> <CloseOutlined /> 关闭 </span>
+                </a>
+              </template>
 
-            <!-- 已付款未发货状态的操作 -->
-            <template
-              v-if="
+              <!-- 已付款未发货状态的操作 -->
+              <template
+                v-if="
                 record.payStatus &&
                 record.deliveryStatus === 10 &&
                 !isCancelledStatus(record.orderStatus)
               "
-            >
-              <a-divider type="vertical" />
-              <a @click.stop="handleDelivery(record)" class="ele-text-primary">
-                <SendOutlined /> 发货
-              </a>
-              <a-divider type="vertical" />
-              <a @click.stop="handleApplyRefund(record)">
-                <UndoOutlined /> 退款
-              </a>
-            </template>
+              >
+                <a @click.stop="handleDelivery(record)" class="ele-text-primary">
+                  <SendOutlined /> 发货
+                </a>
+                <a @click.stop="handleApplyRefund(record)">
+                  <UndoOutlined /> 退款
+                </a>
+              </template>
 
-            <!-- 已发货未完成状态的操作 -->
-            <template
-              v-if="
+              <!-- 已发货未完成状态的操作 -->
+              <template
+                v-if="
                 record.payStatus &&
                 record.deliveryStatus === 20 &&
                 record.orderStatus === 0
               "
-            >
-              <a-divider type="vertical" />
-              <a
-                @click.stop="handleConfirmReceive(record)"
-                class="ele-text-primary"
               >
-                <CheckOutlined /> 确认收货
-              </a>
-              <a-divider type="vertical" />
-              <a @click.stop="handleApplyRefund(record)">
-                <UndoOutlined /> 退款
-              </a>
-            </template>
-
-            <!-- 退款相关状态的操作 -->
-            <template v-if="isRefundStatus(record.orderStatus)">
-              <template
-                v-if="record.orderStatus === 4 || record.orderStatus === 7"
-              >
-                <a-divider type="vertical" />
                 <a
-                  @click.stop="handleApproveRefund(record)"
-                  class="ele-text-success"
+                  @click.stop="handleConfirmReceive(record)"
+                  class="ele-text-primary"
                 >
-                  <CheckCircleOutlined /> 同意退款
+                  <CheckOutlined /> 确认收货
                 </a>
-                <a-divider type="vertical" />
-                <a
-                  @click.stop="handleRejectRefund(record)"
-                  class="ele-text-danger"
-                >
-                  <CloseCircleOutlined /> 拒绝退款
+                <a @click.stop="handleApplyRefund(record)">
+                  <UndoOutlined /> 退款
                 </a>
               </template>
 
-              <template v-if="record.orderStatus === 5">
-                <a-divider type="vertical" />
-                <a @click.stop="handleRetryRefund(record)">
-                  <RedoOutlined /> 重新处理
-                </a>
+              <!-- 退款相关状态的操作 -->
+              <template v-if="isRefundStatus(record.orderStatus)">
+                <template
+                  v-if="record.orderStatus === 4 || record.orderStatus === 7"
+                >
+                  <a
+                    @click.stop="handleApproveRefund(record)"
+                    class="ele-text-success"
+                  >
+                    <CheckCircleOutlined /> 同意退款
+                  </a>
+                  <a
+                    @click.stop="handleRejectRefund(record)"
+                    class="ele-text-danger"
+                  >
+                    <CloseCircleOutlined /> 拒绝退款
+                  </a>
+                </template>
+
+                <template v-if="record.orderStatus === 5">
+                  <a @click.stop="handleRetryRefund(record)">
+                    <RedoOutlined /> 重新处理
+                  </a>
+                </template>
               </template>
-            </template>
 
-            <!-- 已完成状态的操作 -->
-            <template v-if="record.orderStatus === 1">
-              <a-divider type="vertical" />
-              <a @click.stop="handleApplyRefund(record)">
-                <UndoOutlined /> 申请退款
-              </a>
-            </template>
+              <!-- 已完成状态的操作 -->
+              <!--            <template v-if="record.orderStatus === 1">-->
+              <!--              <a @click.stop="handleApplyRefund(record)">-->
+              <!--                <UndoOutlined /> 申请退款-->
+              <!--              </a>-->
+              <!--            </template>-->
 
-            <!-- 删除操作 - 已完成、已关闭、退款成功的订单可以删除 -->
-            <template v-if="canDeleteOrder(record)">
-              <a-divider type="vertical" />
-              <a-popconfirm
-                title="确定要删除此订单吗？删除后无法恢复。"
-                @confirm="remove(record)"
-              >
-                <a class="ele-text-danger" @click.stop>
-                  <DeleteOutlined /> 删除
-                </a>
-              </a-popconfirm>
-            </template>
+              <!-- 删除操作 - 已完成、已关闭、退款成功的订单可以删除 -->
+              <template v-if="canDeleteOrder(record)">
+                <a-popconfirm
+                  title="确定要删除此订单吗？删除后无法恢复。"
+                  @confirm="remove(record)"
+                >
+                  <a class="ele-text-danger" @click.stop>
+                    <DeleteOutlined /> 删除
+                  </a>
+                </a-popconfirm>
+              </template>
+            </a-space>
           </template>
         </template>
       </ele-pro-table>
@@ -346,8 +353,7 @@
     {
       title: '用户信息',
       dataIndex: 'userId',
-      key: 'userInfo',
-      width: 220
+      key: 'userInfo'
     },
     {
       title: '商品信息',
@@ -359,36 +365,20 @@
       dataIndex: 'payPrice',
       key: 'payPrice',
       align: 'center',
+      width: 120,
       customRender: ({ text }) => '￥' + text
     },
+    // {
+    //   title: '支付方式',
+    //   dataIndex: 'payType',
+    //   key: 'payType',
+    //   align: 'center',
+    //   width: 120,
+    // },
     {
-      title: '支付方式',
-      dataIndex: 'payType',
-      key: 'payType',
-      align: 'center'
-    },
-    {
-      title: '支付状态',
-      dataIndex: 'payStatus',
-      key: 'payStatus',
-      align: 'center'
-    },
-    {
-      title: '发货状态',
-      dataIndex: 'deliveryStatus',
-      key: 'deliveryStatus',
-      align: 'center'
-    },
-    {
-      title: '开票状态',
-      dataIndex: 'isInvoice',
-      key: 'isInvoice',
-      align: 'center'
-    },
-    {
-      title: '订单状态',
+      title: '状态',
       dataIndex: 'orderStatus',
-      key: 'orderStatus',
+      key: 'statusInfo',
       align: 'center'
     },
     // {
@@ -417,7 +407,7 @@
     {
       title: '操作',
       key: 'action',
-      width: 220,
+      width: 120,
       fixed: 'right',
       align: 'center',
       hideInSetting: true
@@ -722,11 +712,11 @@
     return {
       // 行点击事件
       onClick: () => {
-        openEdit(record);
+        // openEdit(record);
       },
       // 行双击事件
       onDblclick: () => {
-        // openEdit(record);
+        openEdit(record);
       }
     };
   };