From 715957e8548459d33a0b8596e58c14747fdaea99 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BD=99=E5=90=8C=E5=AD=A6?= <2495967527@qq.com>
Date: Thu, 2 Jan 2025 18:30:02 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=BD=AE=E6=92=AD=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/modules/mer_admin.js                  |  12 +-
 src/router/full-routers.js                    |  13 +
 src/utils/index.js                            |   2 +
 .../brand/config/popup/add-or-update.vue      |   5 +
 .../operation-management/banner/index.vue     |   4 +-
 .../banner/popup/add-or-update.vue            |  30 +-
 .../operation-management/order/index.vue      |  95 +++---
 .../order/popup/view-details.vue              |  12 +-
 .../total-order/index.vue                     | 178 ++++++++++
 .../total-order/popup/content.vue             |  43 +++
 .../total-order/popup/view-details.vue        | 309 ++++++++++++++++++
 11 files changed, 633 insertions(+), 70 deletions(-)
 create mode 100644 src/views/modules/operation-management/total-order/index.vue
 create mode 100644 src/views/modules/operation-management/total-order/popup/content.vue
 create mode 100644 src/views/modules/operation-management/total-order/popup/view-details.vue

diff --git a/src/api/modules/mer_admin.js b/src/api/modules/mer_admin.js
index 82abafa..0f6f260 100644
--- a/src/api/modules/mer_admin.js
+++ b/src/api/modules/mer_admin.js
@@ -212,11 +212,19 @@ export const mer_admin = {
       params: data,
     });
   },
-  //订单管理
+  //全部订单管理
   orderPage: (data) => {
     return $http.request({
       method: "get",
-      url: `/merchant-api/order/page`,
+      url: `/merchant-api/manager/order/page`,
+      params: data,
+    });
+  },
+  //根据店铺查询订单
+  shopOrderPage: (data) => {
+    return $http.request({
+      method: "get",
+      url: `/merchant-api/manager/merchant/order/page`,
       params: data,
     });
   },
diff --git a/src/router/full-routers.js b/src/router/full-routers.js
index 7760a68..6094dcf 100644
--- a/src/router/full-routers.js
+++ b/src/router/full-routers.js
@@ -77,6 +77,19 @@ export default {
           open: null,
           list: [],
         },
+        {
+          menuId: getUUID(),
+          parentId: 0,
+          parentName: null,
+          name: "总订单管理",
+          url: "operation-management/total-order/index",
+          perms: "",
+          type: 1,
+          elIcon: "el-icon-menu",
+          orderNum: 0,
+          open: null,
+          list: [],
+        },
         {
           menuId: getUUID(),
           parentId: 0,
diff --git a/src/utils/index.js b/src/utils/index.js
index 81eeef1..b6b4ed7 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -168,6 +168,8 @@ export function getMenu(role) {
       "wallet/index",
       "ogistics-fare",
       "logistics-fare/logistics-template/index",
+      "bank-card/index",
+      "operation-management/total-order/index"
     ];
   } else if (role == "ROLE_BRAND_MANAGER") {
     return [
diff --git a/src/views/modules/brand/config/popup/add-or-update.vue b/src/views/modules/brand/config/popup/add-or-update.vue
index cb56f78..ea5f25e 100644
--- a/src/views/modules/brand/config/popup/add-or-update.vue
+++ b/src/views/modules/brand/config/popup/add-or-update.vue
@@ -3,6 +3,7 @@
     <obj-modal
       ref="modal"
       labelWidth="190px"
+      class="popup"
       :modalCols="modalCols"
       :modalConfig="modalConfig"
       :modalData="modalData"
@@ -316,4 +317,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+.popup ::v-deep .el-dialog__body {
+  overflow-y: scroll !important;
+  height: 65vh !important;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/modules/operation-management/banner/index.vue b/src/views/modules/operation-management/banner/index.vue
index 7b46852..2f9ca83 100644
--- a/src/views/modules/operation-management/banner/index.vue
+++ b/src/views/modules/operation-management/banner/index.vue
@@ -261,8 +261,8 @@ export default {
             return (
               <el-image
                 style="width: 60px; height: 60px"
-                src={row.img}
-                preview-src-list={[row.img]}
+                src={row.img.split(",")[0]}
+                preview-src-list={row.img.split(",")}
               ></el-image>
             );
           },
diff --git a/src/views/modules/operation-management/banner/popup/add-or-update.vue b/src/views/modules/operation-management/banner/popup/add-or-update.vue
index 50e4e07..4021a5f 100644
--- a/src/views/modules/operation-management/banner/popup/add-or-update.vue
+++ b/src/views/modules/operation-management/banner/popup/add-or-update.vue
@@ -3,6 +3,7 @@
     <obj-modal
       ref="modal"
       labelWidth="150px"
+      class="popup"
       :modalCols="modalCols"
       :modalConfig="modalConfig"
       :modalData="modalData"
@@ -77,12 +78,12 @@ export default {
     },
     init(row) {
       this.modalData = row;
-      this.fileList = [
-        {
+      this.fileList = row.img.split(",").map(item => {
+        return {
           name: "轮播图",
-          url: this.modalData.img,
-        },
-      ];
+          url: item,
+        }
+      })
     },
   },
   computed: {
@@ -200,18 +201,27 @@ export default {
           render: () => {
             const handleAvatarSuccess = (res, file, fileList) => {
               console.log(res, fileList);
-              this.modalData.img = res.data;
+              this.modalData.img = fileList
+                .map((item) => {
+                  return item.response.data;
+                })
+                .join(",");
+              console.log(this.modalData.img);
               this.$refs.modal.validate();
             };
             const handleRemove = (file, fileList) => {
               console.log(file, fileList);
-              this.fileList = [];
-              this.modalData.img = "";
+              this.modalData.img = fileList
+                .map((item) => {
+                  return item.response.data;
+                })
+                .join(",");
             };
             return (
               <el-upload
                 class="upload-demo"
                 drag
+                limit={3}
                 action={this.$api.mer_admin.uploadFile()}
                 {...{
                   props: {
@@ -273,4 +283,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+.popup ::v-deep .el-dialog__body {
+  overflow-y: scroll !important;
+  height: 65vh !important;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/modules/operation-management/order/index.vue b/src/views/modules/operation-management/order/index.vue
index 50cd033..a4ec2a5 100644
--- a/src/views/modules/operation-management/order/index.vue
+++ b/src/views/modules/operation-management/order/index.vue
@@ -12,7 +12,7 @@
     >
       <template slot="tableTop">
         <el-form :inline="true" :model="formInline" class="demo-form-inline">
-          <el-form-item label="订单号">
+          <!-- <el-form-item label="订单号">
             <el-select v-model="formInline.group" placeholder="请选择">
               <el-option
                 v-for="item in statusList"
@@ -22,7 +22,7 @@
               >
               </el-option>
             </el-select>
-          </el-form-item>
+          </el-form-item> -->
           <el-form-item v-if="storeList.length > 1" label="摊铺">
             <el-select
               class="filter-item"
@@ -46,14 +46,14 @@
             <el-button type="primary" @click="Reset">重置</el-button>
           </el-form-item>
         </el-form>
-        <!-- <el-tabs v-model="activeName" @tab-click="handleClick">
-            <el-tab-pane
-              v-for="item in statusList"
-              :key="item.value"
-              :label="item.label"
-              :name="item.value"
-            ></el-tab-pane>
-          </el-tabs> -->
+        <el-tabs v-model="formInline.group" @tab-click="handleClick">
+          <el-tab-pane
+            v-for="item in statusList"
+            :key="item.value"
+            :label="item.label"
+            :name="item.value"
+          ></el-tab-pane>
+        </el-tabs>
         <!-- <div class="mb-2">
             <el-button type="primary" size="small" @click="addProduct"
               >批量导出</el-button
@@ -74,7 +74,7 @@ export default {
   components: { content, viewDetails },
   data() {
     return {
-      activeName: "5",
+      activeName: "0",
       value1: "1",
       advanceSellStatus: "",
       dataList: [],
@@ -91,29 +91,25 @@ export default {
       },
       statusList: [
         {
-          label: "历史订单",
+          label: "全部订单",
           value: "0",
         },
         {
-          label: "进行中",
+          label: "待备货",
           value: "1",
         },
         {
-          label: "新订单",
+          label: "待取货",
           value: "2",
         },
         {
-          label: "待备货",
+          label: "待收货",
           value: "3",
         },
         {
-          label: "待配送",
+          label: "已完成",
           value: "4",
         },
-        {
-          label: "售后订单",
-          value: "5",
-        },
       ],
       productFilterType: "SALE",
       selectList: [],
@@ -122,6 +118,7 @@ export default {
   created() {
     this.formInline = {
       group: "0",
+      // marketId: this.marketId,
       shopId: this.shopId,
     };
     this.$nextTick(() => {
@@ -167,8 +164,26 @@ export default {
         });
     },
     queryList(pageNo, pageSize) {
+      //全部订单
+      // this.$api.mer_admin
+      //   .orderPage({
+      //     pageNumber: pageNo,
+      //     pageSize: pageSize,
+      //     ...this.formInline,
+      //   })
+      //   .then((res) => {
+      //     console.log(res);
+      //     this.$refs.oTable.complete(
+      //       res.data.data.data,
+      //       Number(res.data.data.total)
+      //     );
+      //   })
+      //   .catch((err) => {
+      //     this.$refs.oTable.complete(false);
+      //   });
+      //根据店铺查询
       this.$api.mer_admin
-        .orderPage({
+        .shopOrderPage({
           pageNumber: pageNo,
           pageSize: pageSize,
           ...this.formInline,
@@ -179,9 +194,6 @@ export default {
             res.data.data.data,
             Number(res.data.data.total)
           );
-        })
-        .catch((err) => {
-          this.$refs.oTable.complete(false);
         });
     },
     Reset() {
@@ -326,46 +338,25 @@ export default {
           title: "配送完成时间",
           align: "center",
           width: "120px",
-          field: "startDeliveryTime",
+          field: "completeDeliveryTime",
         },
         {
-          title: "开始配送时间",
+          title: "下单时间",
           align: "center",
           width: "120px",
-          field: "startDeliveryTime",
+          field: "createTime",
         },
         {
-          title: "订单退款状态",
+          title: "完成取货时间",
           align: "center",
           width: "120px",
-          field: "refundStatus",
+          field: "pickTime",
         },
         {
-          title: "申请退款原因",
+          title: "订单完成时间",
           align: "center",
           width: "120px",
-          field: "refundReason",
-        },
-        {
-          title: "订单商品",
-          field: "productPhotoList",
-          align: "center",
-          width: "80px",
-          type: "jsx",
-          render: ({ row }) => {
-            return (
-              <el-image
-                preview-src-list={[row.refundImg]}
-                src={row.refundImg}
-              ></el-image>
-            );
-          },
-        },
-        {
-          title: "申请退款时间",
-          align: "center",
-          width: "120px",
-          field: "applyRefundTime",
+          field: "completeTime",
         },
         {
           title: "操作",
diff --git a/src/views/modules/operation-management/order/popup/view-details.vue b/src/views/modules/operation-management/order/popup/view-details.vue
index 2ecad38..a2e3ba3 100644
--- a/src/views/modules/operation-management/order/popup/view-details.vue
+++ b/src/views/modules/operation-management/order/popup/view-details.vue
@@ -111,20 +111,20 @@
               </el-form-item></el-col
             >
             <el-col :span="8">
-              <el-form-item label="订单退款状态：">
-                <span>{{ getRefundStatus(ruleForm.refundStatus) }}</span>
+              <el-form-item label="下单时间：">
+                <span>{{ruleForm.createTime}}</span>
               </el-form-item></el-col
             >
           </el-row>
           <el-row>
             <el-col :span="8">
-              <el-form-item label="申请退款原因：">
-                <span>{{ ruleForm.refundReason }}</span>
+              <el-form-item label="完成取货时间：">
+                <span>{{ ruleForm.pickTime }}</span>
               </el-form-item></el-col
             >
             <el-col :span="8">
-              <el-form-item label="申请退款时间：">
-                <span>{{ ruleForm.applyRefundTime }}</span>
+              <el-form-item label="订单完成时间：">
+                <span>{{ ruleForm.completeTime }}</span>
               </el-form-item></el-col
             >
             <el-col :span="8">
diff --git a/src/views/modules/operation-management/total-order/index.vue b/src/views/modules/operation-management/total-order/index.vue
new file mode 100644
index 0000000..b59ed65
--- /dev/null
+++ b/src/views/modules/operation-management/total-order/index.vue
@@ -0,0 +1,178 @@
+<template>
+  <div style="height: calc(100vh - 200px)">
+    <el-tabs v-model="formInline.group" @tab-click="handleClick">
+      <el-tab-pane
+        v-for="item in statusList"
+        :key="item.value"
+        :label="item.label"
+        :name="item.value"
+      ></el-tab-pane>
+    </el-tabs>
+    <el-table :data="tableData" border style="width: 100%">
+      <el-table-column type="expand">
+        <template slot-scope="props">
+          <div style="padding-left: 20px" m="4">
+            <el-table :data="props.row.shopOrders" :border="true">
+              <el-table-column type="expand">
+                <template slot-scope="props">
+                  <div style="padding-left: 20px" m="4">
+                    <el-table :data="props.row.productOrders" :border="true">
+                      <el-table-column type="index" width="50" label="序号">
+                      </el-table-column>
+                      <el-table-column
+                        label="商品订单号"
+                        prop="productOrderNo"
+                      />
+                      <el-table-column label="商品名称" prop="productName" />
+                      <el-table-column label="商品原价" prop="originPrice" />
+                      <el-table-column label="商品终价" prop="finalPrice" />
+                      <el-table-column
+                        label="商品订单金额"
+                        prop="productOrderMoney"
+                      />
+                      <el-table-column label="商品数量" prop="productCount" />
+                      <el-table-column
+                        label="商品单价"
+                        prop="productFinalPrice"
+                      />
+                      <el-table-column label="商品图片" prop="productImg">
+                        <template #default="scope">
+                          <el-image
+                            style="width: 100px; height: 100px"
+                            :src="scope.row.productImg"
+                            :zoom-rate="1.2"
+                            :max-scale="7"
+                            :min-scale="0.2"
+                            :preview-src-list="[scope.row.productImg]"
+                            :initial-index="4"
+                            :preview-teleported="true"
+                            fit="cover"
+                          />
+                        </template>
+                      </el-table-column>
+                    </el-table>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column type="index" width="50" label="序号">
+              </el-table-column>
+              <el-table-column label="店铺名称" prop="shopName" />
+            </el-table>
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column label="总订单号" prop="orderNo"> </el-table-column>
+      <el-table-column label="顾客支付" prop="totalMoney"> </el-table-column>
+      <el-table-column label="配送费" prop="deliveryMoney"> </el-table-column>
+      <el-table-column label="优惠券减免" prop="couponMoney"> </el-table-column>
+      <el-table-column label="下单时间" prop="payTime"> </el-table-column>
+      <el-table-column label="预计送达时间" prop="predictDeliveryTime">
+      </el-table-column>
+      <el-table-column label="预计收入" prop="predictIncome"> </el-table-column>
+      <el-table-column label="距离" prop="distance"> </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <div class="pagination-container">
+      <el-pagination
+        :current-page="formInline.pageNumber"
+        :page-sizes="[10, 20, 30, 50]"
+        :page-size="formInline.pageSize"
+        :total="total"
+        background
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+  components: {},
+  data() {
+    return {
+      formInline: {
+        group: "",
+        shopId: "",
+        pageNumber: 1,
+        pageSize: 10,
+      },
+      statusList: [
+        {
+          label: "全部订单",
+          value: "0",
+        },
+        {
+          label: "进行中",
+          value: "1",
+        },
+        {
+          label: "新订单",
+          value: "2",
+        },
+        {
+          label: "待备货",
+          value: "3",
+        },
+        {
+          label: "待配送",
+          value: "4",
+        },
+      ],
+      total: 0,
+      tableData: [],
+    };
+  },
+  created() {
+    this.formInline = {
+      group: "0",
+      marketId: this.marketId,
+    };
+    this.getList();
+  },
+  methods: {
+    getList() {
+      this.$api.mer_admin
+        .orderPage({
+          ...this.formInline,
+        })
+        .then((res) => {
+          console.log(res);
+          this.tableData = res.data.data.data;
+          this.total = Number(res.data.data.total);
+        })
+        .catch((err) => {});
+    },
+    handleClick(e) {
+      console.log(e, "11111111111111111111");
+      if (e.label == "全部订单") {
+        this.formInline.group = "";
+      } else {
+        this.formInline.group = e.name;
+      }
+      this.getList();
+    },
+    handleSizeChange(val) {
+      this.formInline.pageSize = val;
+      this.getList();
+    },
+    handleCurrentChange(val) {
+      this.formInline.pageNumber = val;
+      this.getList();
+    },
+  },
+  computed: {
+    ...mapState("userData", [
+      "isMerchant",
+      "marketList",
+      "storeList",
+      "marketId",
+      "shopId",
+    ]),
+  },
+};
+</script>
+
+<style lang="scss" scoped></style>
\ No newline at end of file
diff --git a/src/views/modules/operation-management/total-order/popup/content.vue b/src/views/modules/operation-management/total-order/popup/content.vue
new file mode 100644
index 0000000..b16f084
--- /dev/null
+++ b/src/views/modules/operation-management/total-order/popup/content.vue
@@ -0,0 +1,43 @@
+<template>
+  <vxe-column type="expand" width="60">
+    <template #content="{ row }">
+      <div class="expand-wrapper">
+        <vxe-table border :data="row.shopOrders.productOrders" height="200">
+          <vxe-column field="productOrderNo" title="商品订单号"></vxe-column>
+          <vxe-column field="productName" title="商品名称"></vxe-column>
+          <vxe-column field="productImg" title="商品图片" width="120">
+            <template slot-scope="{ row }">
+              <el-image
+                :preview-src-list="[row.productImg]"
+                :src="row.productImg"
+                :width="80"
+                :height="80"
+              />
+            </template>
+          </vxe-column>
+          <vxe-column field="productSpecName" title="商品规格名称"></vxe-column>
+          <vxe-column field="originPrice" title="商品原价"></vxe-column>
+          <vxe-column field="finalPrice" title="商品终价"></vxe-column>
+          <vxe-column
+            field="productOrderMoney"
+            title="商品订单金额"
+          ></vxe-column>
+          <vxe-column field="productCount" title="商品数量"></vxe-column>
+          <vxe-column field="productLimit" title="商品限购数量"></vxe-column>
+          <vxe-column field="shopName" title="店铺名称"></vxe-column>
+        </vxe-table>
+      </div>
+    </template>
+  </vxe-column>
+</template>
+
+<script>
+export default {
+  data() {
+    return {};
+  },
+};
+</script>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/src/views/modules/operation-management/total-order/popup/view-details.vue b/src/views/modules/operation-management/total-order/popup/view-details.vue
new file mode 100644
index 0000000..2ecad38
--- /dev/null
+++ b/src/views/modules/operation-management/total-order/popup/view-details.vue
@@ -0,0 +1,309 @@
+<template>
+  <div>
+    <obj-modal
+      ref="modal"
+      labelWidth="150px"
+      :modalConfig="modalConfig"
+      :modalData="modalData"
+      :modalHandles="modalHandles"
+    >
+      <div slot="dialog__content">
+        <el-form
+          :model="ruleForm"
+          ref="ruleForm"
+          label-width="150px"
+          class="demo-ruleForm"
+        >
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="总订单号：">
+                <span>{{ ruleForm.orderNo }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="	结算单位订单号：">
+                <span>{{ ruleForm.unitOrderNo }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="总商品数量：">
+                <span>{{ ruleForm.productCount }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="顾客支付：">
+                <span>{{ ruleForm.totalMoney }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="配送费：">
+                <span>{{ ruleForm.deliveryMoney }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="优惠券减免：">
+                <span>{{ ruleForm.couponMoney }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="下单时间：">
+                <span>{{ ruleForm.payTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="预计送达时间：">
+                <span>{{ ruleForm.predictDeliveryTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="预计收入：">
+                <span>{{ ruleForm.predictIncome }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="距离：">
+                <span>{{ ruleForm.distance }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="预计自动取消时间：">
+                <span>{{ ruleForm.predictAutoCancelTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="备注：">
+                <span>{{ ruleForm.remark }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="包装费：">
+                <span>{{ ruleForm.packageMoney }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="平台服务费：">
+                <span>{{ ruleForm.platformMoney }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="备餐完成时间：">
+                <span>{{ ruleForm.completePrepareTime }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="开始配送时间：">
+                <span>{{ ruleForm.startDeliveryTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="配送完成时间：">
+                <span>{{ ruleForm.completeDeliveryTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="订单退款状态：">
+                <span>{{ getRefundStatus(ruleForm.refundStatus) }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="申请退款原因：">
+                <span>{{ ruleForm.refundReason }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="申请退款时间：">
+                <span>{{ ruleForm.applyRefundTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <!-- <el-form-item label="配送方式：">
+                <span>{{ ruleForm.deliveryType }}</span>
+              </el-form-item> -->
+            </el-col>
+          </el-row>
+          <div style="padding: 0 0 0 20px; font-size: 16px; font-weight: 600">
+            订单商品
+          </div>
+          <div style="padding: 20px">
+            <div style="border-top: 1px solid #ccc; padding: 10px 0 0 0">
+              <el-table
+                border
+                ref="multipleTable"
+                :data="ruleForm.productOrders"
+                tooltip-effect="dark"
+                style="width: 100%"
+                @selection-change="handleSelectionChange"
+              >
+                <el-table-column
+                  prop="shopName"
+                  align="center"
+                  label="店铺名称"
+                  width="80"
+                >
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  label="商品名称"
+                  prop="productName"
+                />
+                <el-table-column
+                  align="center"
+                  label="商品图片"
+                  prop="productImg"
+                >
+                  <template slot-scope="scope">
+                    <el-image
+                      style="width: 60px; height: 60px"
+                      :src="scope.row.productImg"
+                      :preview-src-list="[scope.row.productImg]"
+                    >
+                    </el-image>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  label="规格"
+                  prop="productSpecName"
+                >
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  label="商品原价"
+                  prop="originPrice"
+                >
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  label="商品终价"
+                  prop="finalPrice"
+                  width="120"
+                />
+                <el-table-column
+                  prop="productOrderMoney"
+                  align="center"
+                  label="商品订单金额"
+                  width="200"
+                >
+                </el-table-column>
+              </el-table>
+            </div>
+          </div>
+        </el-form>
+      </div>
+      <!-- 选择商品 -->
+    </obj-modal>
+  </div>
+</template>
+<script>
+import { debounce, cloneDeep } from "lodash";
+export default {
+  components: {},
+  props: {},
+  data() {
+    return {
+      isAdd: true,
+      //表格属性
+      modalConfig: {
+        title: "订单详情",
+        show: false,
+        width: "1200px",
+        fullscreen: true,
+      },
+      modalData: {},
+      ruleForm: {},
+      tableData: [],
+    };
+  },
+  watch: {
+    // "modalConfig.show"(newVal) {
+    //   if (newVal) {
+    //     //关闭弹窗清空校验
+    //     setTimeout(() => {
+    //       this.$refs.ruleForm.resetFields();
+    //     });
+    //   }
+    // },
+  },
+  methods: {
+    queryTableData(pageNo, pageSize) {},
+    toggle(e) {
+      if (this.modalConfig.show == false) {
+        this.modalConfig.show = true;
+      } else {
+        this.modalConfig.show = false;
+      }
+      if (e) {
+        this.init(cloneDeep(e));
+      }
+      return {
+        add: () => {
+          this.modalConfig.title = "订单详情";
+          this.isAdd = true;
+        },
+        update: () => {
+          this.modalConfig.title = "订单详情";
+          this.isAdd = false;
+        },
+      };
+    },
+    init(row) {
+      console.log(row);
+      this.ruleForm = row;
+    },
+    handleSelectionChange(e) {
+      console.log(e);
+    },
+    getRefundStatus(val) {
+      if (val == 0) {
+        return "正常";
+      } else if (val == 1) {
+        return "退款中";
+      } else if (val == 2) {
+        return "完全退款";
+      } else if (val == 3) {
+        return "部分退款";
+      } else if (val == 4) {
+        return "拒绝用户退款";
+      } else if (val == -1) {
+        return "退款失败";
+      } else if (val == -2) {
+        return "用户申请退款中";
+      }
+    },
+  },
+  computed: {
+    modalHandles() {
+      return [
+        {
+          label: "关闭",
+          handle: () => {
+            this.toggle();
+          },
+        },
+        // {
+        //   label: "确认",
+        //   type: "primary",
+        //   // submit: true,
+        //   handle: () => {
+        //   },
+        // },
+      ];
+    },
+  },
+  asyncComputed: {},
+};
+</script>
+<style lang="scss" scoped>
+</style>
\ No newline at end of file