From 80ecf0526aa83a13394f796cc759f4bd731e2fd0 Mon Sep 17 00:00:00 2001
From: gyq <875626088@qq.com>
Date: Fri, 5 Jun 2026 09:43:57 +0800
Subject: [PATCH] =?UTF-8?q?=E9=80=80=E8=8F=9C=E6=9B=B4=E6=94=B9=E4=B8=BA?=
 =?UTF-8?q?=E5=A4=9A=E9=80=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../tool/Instead/components/return-cart.vue   | 201 +++++++++++++-----
 1 file changed, 147 insertions(+), 54 deletions(-)

diff --git a/src/views/tool/Instead/components/return-cart.vue b/src/views/tool/Instead/components/return-cart.vue
index ae893ed..59ddd33 100644
--- a/src/views/tool/Instead/components/return-cart.vue
+++ b/src/views/tool/Instead/components/return-cart.vue
@@ -1,6 +1,6 @@
 <template>
-  <el-dialog title="退菜" width="410px" v-model="show" @close="reset" :modal="modal">
-    <div class="u-p-b-16">
+  <el-dialog title="退菜" width="550px" v-model="show" @close="reset" :modal="modal">
+    <!-- <div class="u-p-b-16">
       <div class="flex u-row-between">
         <span>菜品名称</span>
         <div class="u-flex">
@@ -31,15 +31,13 @@
         </div>
       </div>
     </div>
-
-    <div class="u-m-t-10 u-font-12 color-999">菜品已点数量 {{ max }} 份</div>
-    <div class="u-m-t-26">
+    <div class="u-m-t-10 u-font-12 color-999">菜品已点数量 {{ max }} 份</div> -->
+    <div class="u-m-t-0">
       <div>
         <span>退菜原因</span>
         <span class="color-red">*</span>
       </div>
     </div>
-
     <div class="u-flex u-flex-wrap tags">
       <div class="tag" v-for="(tag, index) in tags" @click="changeSel(tag)" :key="index"
         :class="{ active: tag.checked }">
@@ -47,15 +45,49 @@
       </div>
     </div>
     <div class="u-m-t-20">
-      <el-input v-model="note" placeholder="请输入自定义备注"></el-input>
+      <el-input v-model="note" placeholder="请输入自定义备注" clearable></el-input>
+    </div>
+    <!-- <div class="u-m-t-20">
+      <el-checkbox v-model="isPrint">打印退菜单</el-checkbox>
+    </div> -->
+    <div class="u-m-t-20">
+      <span>选择要退的菜品</span>
     </div>
     <div class="u-m-t-20">
-      <el-checkbox v-model="isPrint">打印退菜单</el-checkbox>
+      <el-table :data="orderList" ref="tableRef" row-key="id" border stripe height="280"
+        @selection-change="handleSelectionChange">
+        <el-table-column type="selection"></el-table-column>
+        <el-table-column prop="name" label="菜品信息">
+          <template #default="{ row }">
+            <div>{{ row.productName }}</div>
+            <div class="tag_wrap" v-if="row.sku_name">
+              <el-text type="info" size="small">规格：</el-text>
+              <el-text type="info" size="small" v-for="item in row.sku_name.split(',')">
+                {{ item }}
+              </el-text>
+            </div>
+            <div class="tag_wrap" v-if="row.remark">
+              <el-text type="info" size="small">备注：</el-text>
+              <el-text type="info" size="small">{{ row.remark }}</el-text>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="quantity" label="退菜数量">
+          <template #default="{ row }">
+            <el-input-number v-model="row.customReturnNum" :min="1" :max="row.number - row.returnNum"
+              style="width: 180px" :step="1" step-strictly>
+            </el-input-number>
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
     <template #footer>
-      <div>
-        <el-button @click="close">取消</el-button>
-        <el-button type="primary" @click="confirm">确定</el-button>
+      <div class="footer_wrap">
+        <div class="letf">退菜数量：共{{ _.sumBy(selectData, 'customReturnNum') || 0 }}份</div>
+        <div class="flex">
+          <el-button @click="close">取消</el-button>
+          <el-button type="primary" :disabled="selectData.length == 0" @click="confirm">确定</el-button>
+        </div>
       </div>
     </template>
   </el-dialog>
@@ -63,6 +95,8 @@
   <refundConsModal ref="refundConsModalRef" :list="refundList" @success="refundConsModalSuccess" />
 </template>
 <script>
+import _ from "lodash";
+import { toRaw } from "vue";
 import { ElMessage } from "element-plus";
 import { useCartsStore } from '@/store/modules/carts'
 import refundConsModal from "@/components/refundConsModal.vue";
@@ -76,6 +110,9 @@ export default {
   },
   data() {
     return {
+      _,
+      selectData: [],
+      orderList: [],
       max: 1,
       number: 1,
       isPrint: false,
@@ -85,6 +122,8 @@ export default {
         { label: "不想要了", checked: false },
         { label: "食材不足", checked: false },
         { label: "等待时间过长", checked: false },
+        { label: "点重复了", checked: false },
+        { label: "口味问题", checked: false },
       ],
       note: "",
       goods: {
@@ -102,7 +141,12 @@ export default {
   },
   methods: {
     changeSel(item) {
-      item.checked = !item.checked;
+      // item.checked = !item.checked;
+      if (this.note == '') {
+        this.note = item.label
+      } else {
+        this.note += `，${item.label}`
+      }
     },
     reset() {
       this.note = "";
@@ -121,15 +165,54 @@ export default {
       }
       this.note = tag + "," + this.note;
     },
-    open(item) {
-      this.goods = item ? item : this.goods;
-      this.max = item.num - item.returnNum;
+    // 选择数据变化
+    handleSelectionChange(val) {
+      this.selectData = val
+    },
+    open(goods) {
+      this.goods = goods
+
+      const carts = useCartsStore();
+      let categorys = JSON.parse(localStorage.getItem('categorys'))
+      let shopInfo = JSON.parse(localStorage.getItem('userInfo'))
+
+      this.orderList = _.flatten(_.values(carts.oldOrder.detailMap), 'goods').map(item => ({
+        ...item,
+        customReturnNum: item.number - item.returnNum
+      })).filter(item => item.number - item.returnNum > 0)
+
+      this.orderList.forEach(item => {
+        carts.goods.forEach(val => {
+          if (item.productId == val.id) {
+            if (shopInfo.refundMode == 1) {
+              // 跟随分类退款模式
+              categorys.forEach(v => {
+                if (val.categoryId == v.id) {
+                  item.refundMode = v.refundMode
+                }
+              })
+            } else {
+              // 跟随商品退款模式及
+              item.refundMode = val.refundMode
+            }
+          }
+        })
+      })
+
+      console.log('cartOperationReturn组件打开了', this.orderList)
+
+      setTimeout(() => {
+        this.$refs.tableRef.toggleRowSelection(this.orderList.find(item => item.id == this.goods.id), true)
+      }, 100);
+
       this.show = true;
-      if (item.productId != "-999") {
-        this.number = 1;
-      } else {
-        this.number = this.max;
-      }
+      // this.goods = item ? item : this.goods;
+      // this.max = item.num - item.returnNum;
+      // if (item.productId != "-999") {
+      //   this.number = 1;
+      // } else {
+      //   this.number = this.max;
+      // }
     },
     close() {
       this.show = false;
@@ -144,56 +227,60 @@ export default {
       this.$emit("confirm", {
         refundReason: this.note,
         refundAmount: 0,
-        refundDetails: [{ id: this.goods.id, num: this.number, returnAmount: 0 }],
+        refundDetails: toRaw(this.selectData).map(item => ({
+          id: item.id,
+          returnAmount: item.lowPrice,
+          num: item.customReturnNum
+        })),
         refundStock: this.refundStock
       });
       this.close();
     },
     // 确认退菜
     confirm() {
-      const selTag = this.tags
-        .filter((item) => item.checked)
-        .map((item) => item.label)
-        .join(",");
-      this.note = selTag + (this.note.length > 0 ? "," + this.note : "");
+      // const selTag = this.tags
+      //   .filter((item) => item.checked)
+      //   .map((item) => item.label)
+      //   .join(",");
+      // this.note = selTag + (this.note.length > 0 ? "," + this.note : "");
 
       if (!this.note) {
         return ElMessage.error("请输入退菜原因");
       }
 
-      const carts = useCartsStore();
-      let categorys = JSON.parse(localStorage.getItem('categorys'))
-      let shopInfo = JSON.parse(localStorage.getItem('userInfo'))
+      // const carts = useCartsStore();
+      // let categorys = JSON.parse(localStorage.getItem('categorys'))
+      // let shopInfo = JSON.parse(localStorage.getItem('userInfo'))
 
-      // 在这里给订单的商品补全库存信息 start
-      carts.goods.forEach(val => {
-        if (this.goods.productId == val.id) {
-          if (shopInfo.refundMode == 1) {
-            // 跟随分类退款模式
-            categorys.forEach(v => {
-              if (val.categoryId == v.id) {
-                this.goods.refundMode = v.refundMode
-              }
-            })
-          } else {
-            // 跟随商品退款模式及
-            this.goods.refundMode = val.refundMode
-          }
-        }
-      })
+      // // 在这里给订单的商品补全库存信息 start
+      // carts.goods.forEach(val => {
+      //   if (this.goods.productId == val.id) {
+      //     if (shopInfo.refundMode == 1) {
+      //       // 跟随分类退款模式
+      //       categorys.forEach(v => {
+      //         if (val.categoryId == v.id) {
+      //           this.goods.refundMode = v.refundMode
+      //         }
+      //       })
+      //     } else {
+      //       // 跟随商品退款模式及
+      //       this.goods.refundMode = val.refundMode
+      //     }
+      //   }
+      // })
 
-      console.log('this.goods===', this.goods);
-      if (this.goods.refundMode == 3) {
-        this.refundList = [
-          {
-            name: this.goods.product_name,
-            num: this.number
-          }
-        ]
+      console.log('this.selectData===', this.selectData);
+
+      this.refundList = toRaw(this.selectData).filter(item => item.refundMode == 3).map(item => ({
+        name: item.product_name,
+        num: item.customReturnNum
+      }))
+
+      if (this.refundList.length > 0) {
         this.$refs.refundConsModalRef.show()
         return
       }
-      // 在这里给订单的商品补全库存信息 end
+
       this.refundNext()
     },
   },
@@ -202,6 +289,12 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.footer_wrap {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
 :deep(.el-dialog__body) {
   margin-bottom: 14px;
   margin-top: 14px;