代客下单增加更新规格限制

src/views/table/components/table-diancan.vue

@@ -142,14 +142,14 @@
                   <div style="width: 15px"></div>
                   <div class="flex-1">
                     <el-button
-                  size="medium"
+                      size="medium"
-                    :disabled="!order.list.length"
+                      :disabled="!order.list.length"
-                    @click="createOrderShow"
+                      @click="createOrderShow"
-                  >
+                    >
-                  去结账
+                      去结账
-                  </el-button>
+                    </el-button>
                   </div>
-                  
+
                   <!-- <button
                     class="my-btn flex-1 success"
                     :class="{ disabled: !order.list.length }"
@@ -583,14 +583,22 @@
               v-for="(val, valIndex) in item.values"
               :key="valIndex"
             >
-              <el-tag
+              <el-button
+                plain
+                :disabled="val.disabled"
+                @click="changeTagSel(index, val)"
+                :type="val.name === item.sel ? 'success' : ''"
+              >
+                {{ val.name }}
+              </el-button>
+              <!-- <el-tag
                 v-if="val === item.sel"
-                size="medium "
+                size="medium"
+                :disabled="item.disabled"
                 @click="changeTagSel(index, val)"
                 effect="dark"
                 type="success"
               >
-                <!-- :effect="val === item.sel ? 'dark' : 'light '" -->
 
                 {{ val }}
               </el-tag>
@@ -598,11 +606,12 @@
                 v-else
                 size="medium"
                 type="success"
+                 :disabled="item.disabled"
                 @click="changeTagSel(index, val)"
                 effect="light"
               >
                 {{ val }}
-              </el-tag>
+              </el-tag> -->
             </span>
           </div>
         </div>
@@ -807,9 +816,44 @@ import {
   $cacheOrder,
   $getCacheOrder,
   $delOrder,
-  $setUser
+  $setUser,
 } from "@/api/table";
 import { tbShopCategoryGet } from "@/api/shop";
+//判断商品是否可以下单
+function isCanBuy(goods) {
+  return goods.isGrounding && goods.isPauseSale == 0 && goods.stockNumber > 0;
+}
+
+// 一个数组是否包含另外一个数组全部元素
+function arrayContainsAll(arr1, arr2) {
+  for (let i = 0; i < arr2.length; i++) {
+    if (!arr1.includes(arr2[i])) {
+      return false;
+    }
+  }
+  return true;
+}
+
+//n项 n-1项组合，生成全部结果
+function generateCombinations(arr, k) {
+  let result = [];
+
+  function helper(index, current) {
+    if (current.length === k) {
+      result.push(current.slice()); // 使用slice()来避免直接修改原始数组
+    } else {
+      for (let i = index; i < arr.length; i++) {
+        current.push(arr[i]); // 将当前元素添加到组合中
+        helper(i + 1, current); // 递归调用，索引增加以避免重复选择相同的元素
+        current.pop(); // 回溯，移除当前元素以便尝试其他组合
+      }
+    }
+  }
+
+  helper(0, []); // 从索引0开始，初始空数组作为起点
+  return result;
+}
+
 function returnReverseVal(val, isReturnString = true) {
   const isBol = typeof val === "boolean";
   const isString = typeof val === "string";
@@ -991,7 +1035,7 @@ export default {
     },
     skuText() {
       const result = this.selGoods.skuList.reduce((a, b) => {
-        return a + b.sel + "+";
+        return a + (b.sel ? b.sel + "+" : "");
       }, "");
       return result.substring(0, result.length - 1);
     },
@@ -1039,15 +1083,15 @@ export default {
     },
   },
   watch: {
-    "vipUser.id":async function(val){
+    "vipUser.id": async function (val) {
-        const {masterId}= await this.getMasterId()
+      const { masterId } = await this.getMasterId();
-        this.masterId=masterId
+      this.masterId = masterId;
-        $setUser({
+      $setUser({
-          tableId:this.table.tableId,
+        tableId: this.table.tableId,
-          masterId:this.masterId,
+        masterId: this.masterId,
-          vipUserId:val,
+        vipUserId: val,
-          type:val===''?1:0
+        type: val === "" ? 1 : 0,
-        })
+      });
     },
     "prveOrder.list.length": function (val) {
       if (val !== 0) {
@@ -1376,17 +1420,20 @@ export default {
       //   tableId:this.table.tableId,
       //   masterId:order.carList[0].masterId
       // })
-      const {masterId,tableId,userId}= await $cacheOrder({orderId:this.prveOrder.list[this.prveOrder.sel].orderId,isPending:false})
+      const { masterId, tableId, userId } = await $cacheOrder({
-      this.masterId=masterId
+        orderId: this.prveOrder.list[this.prveOrder.sel].orderId,
-      const {records}=await getCart({
+        isPending: false,
+      });
+      this.masterId = masterId;
+      const { records } = await getCart({
         masterId,
         tableId,
-        vipUserId:userId!='null'?userId:''
+        vipUserId: userId != "null" ? userId : "",
-      })
+      });
-      console.log(records)
+      console.log(records);
-      this.order.list = records
+      this.order.list = records;
       this.prveOrder.show = false;
-      return 
+      return;
       this.order.list = this.prveOrder.list[this.prveOrder.sel].carList;
       this.delPrveOrder();
       this.prveOrder.show = false;
@@ -1396,7 +1443,7 @@ export default {
       const { sel } = this.prveOrder;
       const order = this.prveOrder.list[sel];
       const res = await $delOrder({
-        orderId: order.orderId
+        orderId: order.orderId,
       });
       this.$notify({
         message: "删除成功",
@@ -1654,15 +1701,81 @@ export default {
       this.order.list.push({ ...item, isPack, isGift });
       this.order.selIndex = this.order.list.length - 1;
     },
+    //设置规格按钮的禁止状态
+    setTagDisabled() {
+      const selArr = this.selGoods.skuList.reduce((prve, cur) => {
+        if (cur.sel) {
+          prve.push(cur.sel);
+        } else {
+        }
+        return prve;
+      }, []);
+      console.log(selArr);
+      let selArrAllGroup = generateCombinations(selArr, selArr.length - 1);
+      console.log(selArrAllGroup);
+      const matchArr = [];
+      for (let key in this.selGoods.skuMap) {
+        const goods = this.selGoods.skuMap[key];
+        const keyArr = key.split(",");
+        for (let spe of selArrAllGroup) {
+          if (arrayContainsAll(keyArr, spe)) {
+            matchArr.push(goods);
+            break;
+          }
+        }
+      }
+      console.log(matchArr);
+      const skuList = this.selGoods.skuList;
+      console.log(skuList);
+      //全部规格都已下架
+      if (!matchArr.length) {
+        for (let k in skuList) {
+          for (let i in skuList[k].values) {
+            this.$set(skuList[k].values[i], "disabled", true);
+          }
+        }
+        return;
+      }
+      const includeSkuMap = matchArr.reduce((prve, cur) => {
+        const speArr = cur.specSnap.split(",");
+        for (let i of speArr) {
+          if (!prve.hasOwnProperty("i")) {
+            prve[i] = matchArr
+              .filter((v) => v.specSnap.match(i))
+              .every((v) => {
+                return (
+                  !v.isGrounding || v.isPauseSale == 1 || v.stockNumber <= 0
+                );
+              });
+          }
+        }
+        return prve;
+      }, {});
+      for (let i in includeSkuMap) {
+        for (let k in skuList) {
+          const index = skuList[k].valueArr.findIndex((val) => val === i);
+          if (index !== -1) {
+            this.$set(skuList[k].values[index], "disabled", includeSkuMap[i]);
+          }
+        }
+      }
+    },
     changeTagSel(index, val) {
-      this.$set(this.selGoods.skuList[index], "sel", val);
+      this.$set(this.selGoods.skuList[index], "sel", val.name);
       let specSnap = this.selGoods.skuList.reduce((a, b) => {
         return a + b.sel + ",";
       }, "");
       specSnap = specSnap.substring(0, specSnap.length - 1);
-      const skuGoods = this.selGoods.skuMap[specSnap];
+      for (let sku of this.selGoods.skuList) {
-      this.skuGoods.data = skuGoods;
+        console.log(sku);
-      this.skuGoods.number = skuGoods.suit || 1;
+      }
+      this.setTagDisabled();
+      const canChooseGoods = this.selGoods.skuList.every((v) => v.sel);
+      if (canChooseGoods) {
+        const skuGoods = this.selGoods.skuMap[specSnap];
+        this.skuGoods.data = skuGoods;
+        this.skuGoods.number = skuGoods.suit || 1;
+      }
     },
     reset() {
       // this.goods.list = [];
@@ -1719,8 +1832,8 @@ export default {
       this.selGoods.title = item.name;
       this.selGoods.show = true;
     },
-    //根据右侧商品单规格多规格做不同处理
+    // 备份版本，会过滤下架和售尽以为库存小于等于0的商品
-    async goodsClick(item) {
+    async goodsClickback(item) {
       if (item.typeEnum === "sku") {
         this.selGoods.data = item;
         this.selGoods.skuMap = {};
@@ -1729,36 +1842,38 @@ export default {
           this.selGoods.skuMap[specList[i].specSnap] = specList[i];
         }
         console.log(this.selGoods.skuMap);
-        
+
         let specSnap = "";
-        let tagSnap=JSON.parse(item.skuResult.tagSnap).map(v=>{
+        let tagSnap = JSON.parse(item.skuResult.tagSnap).map((v) => {
-          return {...v,newval:{}}
+          return { ...v, newval: {} };
-        })
+        });
-        const canUseSpecSnap={}
+        const canUseSpecSnap = {};
-        const canBudyGoods=specList.filter(v=>v.isGrounding&&v.isPauseSale!=1&&v.stockNumber>0)
+        const canBudyGoods = specList.filter(
-        canBudyGoods.map(v=>{
+          (v) => v.isGrounding && v.isPauseSale != 1 && v.stockNumber > 0
-          v.specSnap.split(',').map(spe=>{
+        );
-            canUseSpecSnap[spe]=spe
+        canBudyGoods.map((v) => {
-          })
+          v.specSnap.split(",").map((spe) => {
-        })
+            canUseSpecSnap[spe] = spe;
-        console.log(canUseSpecSnap)
+          });
-        for(let i in canUseSpecSnap){
+        });
-          const item=tagSnap.find(v=>v.value.match(i))
+        console.log(canUseSpecSnap);
-          item.newval[i]=i
+        for (let i in canUseSpecSnap) {
+          const item = tagSnap.find((v) => v.value.match(i));
+          item.newval[i] = i;
         }
-        tagSnap=tagSnap.map(v=>{
+        tagSnap = tagSnap.map((v) => {
-          const newvals=Object.keys(v.newval)
+          const newvals = Object.keys(v.newval);
           specSnap += newvals[0] + ",";
           return {
             ...v,
-            values:newvals,
+            values: newvals,
             sel: newvals[0],
-          }
+          };
-        })
+        });
-        console.log(tagSnap)
+        console.log(tagSnap);
-        console.log(canUseSpecSnap)
+        console.log(canUseSpecSnap);
-        console.log(canBudyGoods)
+        console.log(canBudyGoods);
-        this.selGoods.skuList = tagSnap
+        this.selGoods.skuList = tagSnap;
         // this.selGoods.skuList = tagSnap.map((v) => {
         //   const values = v.value.split(",");
         //   specSnap += values[0] + ",";
@@ -1815,6 +1930,139 @@ export default {
         this.orderListPush(res);
       }
     },
+    //多规格商品弹窗时，找到默认可以下单的规格商品
+    findGoods(skuList = [], goodsListMap = {}) {
+      const skuMapNumber = skuList.reduce((prve, cur) => {
+        for (let i in cur.valueArr) {
+          prve[cur.valueArr[i]] = i;
+        }
+        return prve;
+      }, {});
+      const canBudyGoods = this.selGoods.data.specList
+        .filter((v) => isCanBuy(v))
+        .sort((a, b) => {
+          const aNumber = a.specSnap.split(",").reduce((prve, cur) => {
+            return prve + skuMapNumber[cur];
+          }, 0);
+          const bNumber = b.specSnap.split(",").reduce((prve, cur) => {
+            return prve + skuMapNumber[cur];
+          }, 0);
+          return aNumber - bNumber;
+        });
+      return canBudyGoods[0];
+    },
+    //设置商品默认选中,规格禁止以及选中
+    setSkugoodsDefaultInit() {
+      const skuList = this.selGoods.skuList;
+      const goodsListMap = this.selGoods.skuMap;
+      const skuGoods = this.findGoods(skuList, goodsListMap);
+      console.log(skuGoods);
+      if (skuGoods) {
+        this.skuGoods.data = skuGoods;
+        this.skuGoods.number = skuGoods.suit || 1;
+        skuGoods.specSnap.split(",").map((v, index) => {
+          skuList[index].sel = v;
+        });
+      }
+      this.setTagDisabled();
+      // console.log(goods)
+      // const includeSkuMap = goodsList.reduce((prve, cur) => {
+      //   const speArr = cur.specSnap.split(",");
+      //   for (let i of speArr) {
+      //     if (!prve.hasOwnProperty("i")) {
+      //       prve[i] = goodsList
+      //         .filter((v) => v.specSnap.match(i))
+      //         .every((v) => {
+      //           return (
+      //             !v.isGrounding || v.isPauseSale == 1 || v.stockNumber <= 0
+      //           );
+      //         });
+      //     }
+      //   }
+      //   return prve;
+      // }, {});
+      // console.log(includeSkuMap);
+      // for (let i in includeSkuMap) {
+      //   for (let k in skuList) {
+      //     const index = skuList[k].valueArr.findIndex((val) => val === i);
+      //     if (index !== -1) {
+      //       this.$set(skuList[k].values[index], "disabled", includeSkuMap[i]);
+      //     }
+      //   }
+      // }
+    },
+    //根据右侧商品单规格多规格做不同处理
+    async goodsClick(item) {
+      if (item.typeEnum === "sku") {
+        this.selGoods.data = item;
+        this.selGoods.skuMap = {};
+        const specList = item.specList;
+        for (let i in specList) {
+          this.selGoods.skuMap[specList[i].specSnap] = specList[i];
+        }
+        console.log(this.selGoods.skuMap);
+        let specSnap = "";
+        // const canBudyGoods=specList.filter(v=>v)
+        this.selGoods.skuList = JSON.parse(item.skuResult.tagSnap).map((v) => {
+          const values = v.value.split(",");
+          // specSnap += values[0] + ",";
+          return {
+            ...v,
+            valueArr: values,
+            values: values.map((name) => {
+              return { name, disabled: false };
+            }),
+            // sel: values[0],
+            // sel: values[0],
+          };
+        });
+
+        // specSnap = specSnap.substring(0, specSnap.length - 1);
+        // const skuGoods = this.selGoods.skuMap[specSnap];
+        this.setSkugoodsDefaultInit();
+        // this.skuGoods.data = skuGoods;
+        // this.skuGoods.number = skuGoods.suit || 1;
+        this.selGoods.title = item.name;
+        this.selGoods.show = true;
+        return;
+      }
+      //单规格
+      const orderGoodsIndex = this.order.list.findIndex((V) => {
+        return V.skuId == item.specList[0].id && V.productId == item.id;
+      });
+      const orderGoods =
+        orderGoodsIndex != -1 ? this.order.list[orderGoodsIndex] : undefined;
+      // const orderGoods =  this.order.list.find((V) => {
+      //   return V.skuId == item.specList[0].id && V.productId == item.id;
+      // });
+      let res = "";
+      if (orderGoods) {
+        //更新
+        // res = await $updateCart({
+        //   cartId: orderGoods.id,
+        //   productId: item.id,
+        //   skuId: item.specList[0].id,
+        //   tableId: this.table.tableId,
+        //   num: orderGoods.number * 1 + item.specList[0].suit, // 0会删除此商品
+        // });
+        orderGoods.number += item.specList[0].suit;
+        this.order.number = orderGoods.number;
+        this.order.selIndex = orderGoodsIndex;
+      } else {
+        //增加
+        console.log(item);
+        res = await addCart({
+          masterId: this.masterId,
+          vipUserId: this.vipUser.id,
+          productId: item.id,
+          skuId: item.specList[0].id,
+          tableId: this.table.tableId,
+          num: item.specList[0].suit, // 0会删除此商品
+          isPack: false, // 是否打包
+        });
+        this.orderListPush(res);
+      }
+    },
     async getGoods() {
       const res = await getGoodsLists(this.goods.query);
       console.log(res);
@@ -1912,9 +2160,14 @@ input[type="number"]::-webkit-outer-spin-button {
   background: #22bf64;
   color: #fff;
 }
-::v-deep .flex-1 .el-button{
+::v-deep .flex-1 .el-button {
   width: 100%;
 }
+::v-deep .el-button--success.is-plain {
+  background: rgba(34, 191, 100, 0.1);
+  color: #22bf64;
+  border: 1px solid #22bf64;
+}
 ::v-deep .el-button--medium {
   padding-top: 12px;
   padding-bottom: 12px;