From a3a1c0852781d63b9631a48327b0a3a589367dd3 Mon Sep 17 00:00:00 2001
From: lzhizhao <790086754@qq.com>
Date: Mon, 16 Jun 2025 10:21:11 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=A7=AF=E5=88=86=E8=AE=A2=E5=8D=95?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=E3=80=81=E4=BC=9A=E5=91=98=E7=AD=89=E7=BA=A7?=
 =?UTF-8?q?=E8=AE=BE=E7=BD=AE=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../marketing/level/popup/add-or-update.vue   |  42 +-
 .../modules/marketing/points-order/index.vue  | 548 +++++++-----------
 .../points-order/popup/view-details.vue       | 321 ++++++++++
 3 files changed, 559 insertions(+), 352 deletions(-)
 create mode 100644 src/views/modules/marketing/points-order/popup/view-details.vue

diff --git a/src/views/modules/marketing/level/popup/add-or-update.vue b/src/views/modules/marketing/level/popup/add-or-update.vue
index 9dab80c..4e04d7a 100644
--- a/src/views/modules/marketing/level/popup/add-or-update.vue
+++ b/src/views/modules/marketing/level/popup/add-or-update.vue
@@ -78,24 +78,28 @@ export default {
   },
   methods: {
     queryTableData(pageNo, pageSize) {
-      setTimeout(() => {
-        setTimeout(() => {
-          this.$refs.oTableThree.complete([
-            {
-              levelName: "",
-              requiredGrowthValue: 0,
-              growthValueUpperLimit: 999999999,
-              enableMemberDiscount: false,
-              enablePointsRedemption: false,
-              enableBirthdayCoupons: false,
-              enableBirthdayReward: false,
-              discountRate: "",
-              rewardEffectiveTimeType: "",
-              memberLevelCouponsList: [],
-            },
-          ]);
-        });
-      }, 10);
+      this.$api.marketing.marketingLevelPage(this.modalData).then((res) => {
+        let list = res.data.data ? res.data.data : [];
+        this.$refs.oTableThree.complete(list)
+      });
+      // setTimeout(() => {
+      //   setTimeout(() => {
+      //     this.$refs.oTableThree.complete([
+      //       {
+      //         levelName: "",
+      //         requiredGrowthValue: 0,
+      //         growthValueUpperLimit: 999999999,
+      //         enableMemberDiscount: false,
+      //         enablePointsRedemption: false,
+      //         enableBirthdayCoupons: false,
+      //         enableBirthdayReward: false,
+      //         discountRate: "",
+      //         rewardEffectiveTimeType: "",
+      //         memberLevelCouponsList: [],
+      //       },
+      //     ]);
+      //   });
+      // }, 10);
     },
     toggle(e) {
       if (this.modalConfig.show == false) {
@@ -515,4 +519,4 @@ export default {
   },
   asyncComputed: {},
 };
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/modules/marketing/points-order/index.vue b/src/views/modules/marketing/points-order/index.vue
index d150b36..0cc8b59 100644
--- a/src/views/modules/marketing/points-order/index.vue
+++ b/src/views/modules/marketing/points-order/index.vue
@@ -1,375 +1,257 @@
 <template>
-  <div>
-    <div v-if="isShopId" style="height: calc(100vh - 200px)">
-      <obj-table-plus
-        ref="oTable"
-        style="height: 100%"
-        :tableCols="tableCols"
-        :tableProp="tableProp"
-        @query="queryList"
-        v-model="dataList"
-        :tableEvent="tableEvent"
-        :enableAutoQuery="false"
-      >
-        <template slot="tableTop">
-          <el-form :inline="true" :model="formInline" class="demo-form-inline">
-            <el-form-item label="订单号">
-              <el-input
-                v-model="formInline.name"
-                placeholder="订单号搜索"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="商品名称">
-              <el-input
-                v-model="formInline.name"
-                placeholder="商品名称或id"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="下单时间">
-              <el-date-picker
-                v-model="value1"
-                type="datetimerange"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"
-              >
-              </el-date-picker>
-            </el-form-item>
-            <el-form-item>
-              <el-button type="primary" @click="$refs.oTable.reload()"
-                >查询</el-button
-              >
-              <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>
-          <div class="mb-2">
-            <el-button type="primary" size="small" @click="addProduct"
-              >批量导出</el-button
-            >
+  <div style="height: calc(100vh - 200px)">
+    <el-form
+      v-if="storeList.length > 1"
+      :inline="true"
+      :model="formInline"
+      class="demo-form-inline"
+    >
+      <el-form-item label="摊铺">
+        <el-select
+          class="filter-item"
+          style="width: 200px"
+          v-model="formInline.shopId"
+          placeholder="请选择摊铺"
+        >
+          <el-option
+            v-for="item in storeList"
+            :key="item.shopId"
+            :label="item.shopName"
+            :value="item.shopId"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="商品名称">
+        <el-input
+          v-model="formInline.productName"
+          placeholder="商品名称"
+        ></el-input>
+      </el-form-item>
+      <!-- <el-form-item label="预售时间"> -->
+      <!--   <el-date-picker -->
+      <!--     @change="changeValueOne" -->
+      <!--     value-format="yyyy-MM-dd HH:mm:ss" -->
+      <!--     v-model="valueOne" -->
+      <!--     type="datetimerange" -->
+      <!--     start-placeholder="开始日期" -->
+      <!--     end-placeholder="结束日期" -->
+      <!--   > -->
+      <!--   </el-date-picker> -->
+      <!-- </el-form-item> -->
+      <el-form-item>
+        <el-button type="primary" @click="getList">查询</el-button>
+        <el-button type="primary" @click="Reset">重置</el-button>
+        <el-button
+          type="success"
+          @click="
+            $router.push({ name: 'operation-management-total-order/index' })
+          "
+          >菜市场总订单</el-button
+        >
+      </el-form-item>
+    </el-form>
+    <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" height="70vh" 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.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 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>
           </div>
         </template>
-      </obj-table-plus>
-      <!-- 添加或编辑 -->
-      <!-- <add-or-update
-        :marketId="formInline.marketId"
-        :shopId="formInline.shopId"
-        @queryList="$refs.oTable.reload()"
-        ref="addOrUpdate"
-      ></add-or-update> -->
-    </div>
-    <div style="height: calc(100vh - 200px)" v-else>
-      <el-empty :image-size="200" description="您不是摊主哦"></el-empty>
+      </el-table-column>
+      <el-table-column label="总订单号" prop="orderNo" />
+      <el-table-column label="结算单位订单号" prop="unitOrderNo" />
+      <el-table-column label="总商品数量" prop="productCount" />
+      <el-table-column label="订单状态" prop="preSaleStage">
+        <template slot-scope="scope">
+          {{
+            scope.row.preSaleStage === 1
+              ? '已付定金'
+              : scope.row.preSaleStage === 2
+              ? '已付尾款'
+              : '待付定金'
+          }}
+        </template>
+      </el-table-column>
+      <el-table-column label="顾客实际支付" prop="totalMoney" />
+      <el-table-column label="商品总价" prop="productMoney" />
+      <el-table-column label="配送费" prop="deliveryMoney" />
+      <el-table-column label="优惠券减免" prop="couponMoney" />
+      <el-table-column label="支付时间" prop="payTime" />
+      <el-table-column label="预计送达时间" prop="predictDeliveryTime" />
+      <el-table-column label="预计收入" prop="predictIncome" />
+      <el-table-column label="距离" prop="distance" />
+      <el-table-column label="备注" prop="remark" />
+      <el-table-column fixed="right" width="100px" label="操作" align="center">
+        <template slot-scope="scope">
+          <el-button type="primary" size="mini" @click="view(scope.row)">
+            查看
+          </el-button>
+        </template>
+      </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>
+    <!-- 订单详情 -->
+    <viewDetails ref="viewDetails"></viewDetails>
   </div>
 </template>
 
 <script>
-// import AddDiscount from "./popup/add-discount.vue";
-// import AddPrice from "./popup/add-price.vue";
-// import AddOrUpdate from "./popup/add-or-update.vue";
-// import earlyWarning from "./popup/early-warning.vue";
+import viewDetails from './popup/view-details.vue'
+import { mapState } from 'vuex'
 export default {
-  // components: { earlyWarning, AddOrUpdate },
+  components: { viewDetails },
   data() {
     return {
-      activeName: "5",
-      value1: "1",
-      advanceSellStatus: "",
-      dataList: [],
+      valueOne: [],
       formInline: {
-        name: "",
-        marketId: "",
-        shopId: "",
-      },
-      marketList: [],
-      tableProp: {
-        "auto-resize": true,
-        border: true,
-        height: "auto",
-        "row-id": "id",
-        "show-overflow": false,
+        group: '',
+        shopId: '',
+        pageNumber: 1,
+        pageSize: 10,
+        productName: '',
+        startTime: '',
+        endTime: ''
       },
       statusList: [
         {
-          label: "全部",
-          value: "5",
+          label: '全部订单',
+          value: '0'
         },
         {
-          label: "代发货",
-          value: "0",
+          label: '待备货',
+          value: '1'
         },
         {
-          label: "带收货",
-          value: "1",
+          label: '待取货',
+          value: '2'
         },
         {
-          label: "待评价",
-          value: "2",
+          label: '待收货',
+          value: '3'
         },
         {
-          label: "已取消",
-          value: "3",
-        },
-        {
-          label: "交易关闭",
-          value: "3",
-        },
-        {
-          label: "已完成",
-          value: "3",
-        },
+          label: '已完成',
+          value: '4'
+        }
       ],
-      productFilterType: "SALE",
-      selectList: [],
-      isShopId: "",
-      storeList: [],
-    };
-  },
-  created() {
-    if (JSON.parse(sessionStorage.getItem("userInfo")).markets?.length > 0) {
-      this.isShopId = true;
-      this.formInline.marketId = JSON.parse(
-        sessionStorage.getItem("userInfo")
-      ).markets[0].marketId;
-      this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
-      console.log(this.marketList);
-      this.getData();
-    } else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
-      (this.formInline.shopId = JSON.parse(
-        sessionStorage.getItem("userInfo")
-      ).shopId),
-        (this.isShopId = true);
-      this.$nextTick(() => {
-        this.$refs.oTable.reload();
-      });
-    } else {
-      this.isShopId = false;
+      tableData: [],
+      total: 0
     }
   },
+  created() {
+    this.formInline = {
+      group: '0',
+      // marketId: this.marketId,
+      shopId: this.shopId,
+      productName: '',
+      startTime: '',
+      endTime: ''
+    }
+    this.valueOne = []
+    this.getList()
+  },
   methods: {
-    getData() {
+    changeValueOne(e) {
+      console.log(e)
+      if (e) {
+        this.formInline.startTime = e[0]
+        this.formInline.endTime = e[1]
+      } else {
+        this.formInline.startTime = ''
+        this.formInline.endTime = ''
+      }
+    },
+    getList() {
+      //根据店铺查询
       this.$api.mer_admin
-        .storeList({ marketId: this.formInline.marketId })
-        .then((res) => {
-          this.storeList = res.data.data;
-          this.formInline.shopId = res.data.data[0].shopId;
-          this.$nextTick(() => {
-            this.$refs.oTable.reload();
-          });
-        });
-    },
-    addProduct() {
-      this.$refs.addOrUpdate.toggle().add();
-    },
-    deleteProduct() {
-      console.log(this.selectList);
-      let integers = this.selectList.map((item) => {
-        return item.id;
-      });
-      this.$confirm("此操作将删除该商品, 是否继续?", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(() => {
-          console.log("111");
-          this.$api.mer_admin.BatchDeleteProducts(integers).then((res) => {
-            this.$refs.oTable.reload();
-          });
-        })
-        .catch(() => {
-          this.$message({
-            type: "info",
-            message: "已取消删除",
-          });
-        });
-    },
-    queryList(pageNo, pageSize) {
-      this.$api.preSale
-        .preSaleProducts({
-          pageNumber: pageNo,
-          pageSize: pageSize,
+        .shopOrderPage({
           ...this.formInline,
-          advanceSellStatus: this.advanceSellStatus,
-          merchantId: JSON.parse(sessionStorage.getItem("userInfo")).merchantId,
-          productQuerySortParam: [],
+          orderCategory: 2
         })
-        .then((res) => {
-          console.log(res);
-          this.$refs.oTable.complete(
-            res.data.data.data,
-            Number(res.data.data.total)
-          );
+        .then(res => {
+          console.log(res)
+          this.tableData = res.data.data.data
+          this.total = Number(res.data.data.total)
         })
-        .catch((err) => {
-          this.$refs.oTable.complete(false);
-        });
     },
     Reset() {
       this.formInline = {
-        name: "",
-        marketId: JSON.parse(sessionStorage.getItem("userInfo")).markets[0]
-          .marketId,
-      };
-      this.$refs.oTable.reload();
+        group: '0',
+        shopId: this.shopId,
+        productName: '',
+        startTime: '',
+        endTime: ''
+      }
+      this.valueOne = []
+      this.getList()
     },
     handleClick(e) {
-      console.log(e.name);
-      if (e.name == "5") {
-        this.advanceSellStatus = "";
-      } else {
-        this.advanceSellStatus = e.name;
-      }
-      this.$refs.oTable.reload();
+      this.advanceSellStatus = e.name
+      this.getList()
     },
-    addEarlyWarning() {
-      this.$refs.earlyWarning.toggle().add();
+    view(row) {
+      this.$refs.viewDetails.toggle(row).update()
     },
+    handleSizeChange(val) {
+      this.formInline.pageSize = val
+      this.getList()
+    },
+    handleCurrentChange(val) {
+      this.formInline.pageNumber = val
+      this.getList()
+    }
   },
   computed: {
-    tableCols() {
-      return [
-        { type: "checkbox", width: "60px", fixed: "left" },
-        // { type: "seq", width: "60px", align: "center", title: "序号" },
-        {
-          title: "订单号",
-          align: "center",
-          field: "id",
-        },
-        {
-          title: "订单商品",
-          field: "productPhotoList",
-          align: "center",
-          width: "80px",
-          type: "jsx",
-          render: ({ row }) => {
-            if (row.productPhotoList.length > 0) {
-              return (
-                <el-image
-                  preview-src-list={row.productPhotoList.map((item) => {
-                    return item.url;
-                  })}
-                  src={row.productPhotoList[0].url}
-                ></el-image>
-              );
-            } else {
-              return <span>暂无商品图</span>;
-            }
-          },
-        },
-        {
-          title: "规格/数量",
-          align: "center",
-          field: "startTime",
-          type: "jsx",
-          render: ({ row }) => {
-            return (
-              <span>
-                {row.startTime}至{row.endTime}
-              </span>
-            );
-          },
-        },
-        {
-          title: "兑换积分",
-          align: "center",
-          field: "minSalePrice",
-          type: "jsx",
-          render: ({ row }) => {
-            return (
-              <span>
-                {row.balancePaymentStartTime}至{row.balancePaymentEndTime}
-              </span>
-            );
-          },
-        },
-        {
-          title: "下单时间",
-          align: "center",
-          field: "presalePrice",
-          type: "jsx",
-          render: ({ row }) => {
-            if (
-              Math.min.apply(
-                Math,
-                row.productSpecificationList.map((item) => item.presalePrice)
-              ) ==
-              Math.max.apply(
-                Math,
-                row.productSpecificationList.map((item) => item.presalePrice)
-              )
-            ) {
-              return (
-                <span>
-                  {Math.min.apply(
-                    Math,
-                    row.productSpecificationList.map(
-                      (item) => item.presalePrice
-                    )
-                  )}
-                </span>
-              );
-            } else {
-              return (
-                <span>
-                  {Math.min.apply(
-                    Math,
-                    row.productSpecificationList.map(
-                      (item) => item.presalePrice
-                    )
-                  )}
-                  至
-                  {Math.max.apply(
-                    Math,
-                    row.productSpecificationList.map(
-                      (item) => item.presalePrice
-                    )
-                  )}
-                </span>
-              );
-            }
-          },
-        },
-        {
-          title: "操作",
-          fixed: "right",
-          type: "jsx",
-          align: "center",
-          width: "100px",
-          render: ({ row }) => {
-            let changeInventory = () => {
-              this.$refs.addStock.toggle(row).update();
-            };
-            return (
-              <div>
-                <el-button size="mini" type="primary" onClick={changeInventory}>
-                  查看
-                </el-button>
-              </div>
-            );
-          },
-        },
-      ];
-    },
-    tableEvent() {
-      return {
-        "checkbox-all": ({ records, reserves }) => {
-          this.selectList = [...records, ...reserves];
-        },
-        "checkbox-change": ({ records, reserves }) => {
-          this.selectList = [...records, ...reserves];
-        },
-      };
-    },
-  },
-};
+    ...mapState('userData', [
+      'isMerchant',
+      'marketList',
+      'storeList',
+      'marketId',
+      'shopId'
+    ])
+  }
+}
 </script>
 
-<style lang="scss" scoped></style>
\ No newline at end of file
+<style lang="scss" scoped></style>
diff --git a/src/views/modules/marketing/points-order/popup/view-details.vue b/src/views/modules/marketing/points-order/popup/view-details.vue
new file mode 100644
index 0000000..48277c4
--- /dev/null
+++ b/src/views/modules/marketing/points-order/popup/view-details.vue
@@ -0,0 +1,321 @@
+<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.preSaleStage === 1
+                      ? '已付定金'
+                      : ruleForm.preSaleStage === 2
+                      ? '已付尾款'
+                      : '待付定金'
+                  }}
+                </span>
+              </el-form-item></el-col
+            >
+            <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>{{ ruleForm.createTime }}</span>
+              </el-form-item></el-col
+            >
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="完成取货时间：">
+                <span>{{ ruleForm.pickTime }}</span>
+              </el-form-item></el-col
+            >
+            <el-col :span="8">
+              <el-form-item label="订单完成时间：">
+                <span>{{ ruleForm.completeTime }}</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>