修复清空历史订单时消失又出现问题

2026-03-20 10:45:47 +08:00
parent b3d153ab86
commit 2a47effa45
4 changed files with 153 additions and 46 deletions
--- a/package.json
+++ b/package.json
@@ -115,6 +115,7 @@
    "vite-plugin-mock-dev-server": "^1.8.3",
    "vite-plugin-strip-code": "^1.1.0",
    "vite-plugin-svg-icons": "^2.0.1",
+    "vite-plugin-vue-devtools": "^8.1.0",
    "vue-eslint-parser": "^9.4.3",
    "vue-tsc": "^2.2.0"
  },
--- a/src/store/modules/carts.ts
+++ b/src/store/modules/carts.ts
@@ -850,6 +850,11 @@ export const useCartsStore = defineStore("carts", () => {

  let $initParams = {} as ApifoxModel;

+
+  // 标志位，表示是否正在清空历史订单
+  const isClearingOldOrder = ref(false);
+
+
  async function init(initParams: ApifoxModel | undefined, $oldOrder: any | undefined) {
    console.log('cart.init.initParams', initParams);
    console.log('cart.init.$oldOrder', $oldOrder);
@@ -990,8 +995,15 @@ export const useCartsStore = defineStore("carts", () => {
        concocatSocket({ ...$initParams, table_code: table_code.value });
      }

+      // WebSocket 监听 product_update 消息
      if (msg.operate_type === "product_update") {
-        init($initParams, oldOrder.value,);
+        if (isClearingOldOrder.value) {
+          console.log("忽略 product_update 消息，因为正在清空历史订单");
+          isClearingOldOrder.value = false; // 重置标志位
+          return;
+        }
+        console.log("处理 product_update 消息");
+        init($initParams, oldOrder.value); // 重新初始化
      }

      if (msg.type === "bc") {
@@ -1036,6 +1048,8 @@ export const useCartsStore = defineStore("carts", () => {
    newUserDiscount.value = {}
  }

+
+
  return {
    disconnect,
    dinnerType,
@@ -1097,7 +1111,7 @@ export const useCartsStore = defineStore("carts", () => {
    getAllGoodsList,
    vipUser,
    changeTableInfo,
-    tableInfo,
+    tableInfo, isClearingOldOrder,
    clearHistory
  };
 });
--- a/src/views/tool/Instead/index.vue
+++ b/src/views/tool/Instead/index.vue
@@ -1,5 +1,9 @@
 <template>
-  <div class="box" v-loading="!carts.isLinkFinshed" element-loading-text="购物车连接初始化中，请稍等……">
+  <div
+    class="box"
+    v-loading="!carts.isLinkFinshed"
+    element-loading-text="购物车连接初始化中，请稍等……"
+  >
    <div class="content">
      <div class="top">
        <div class="left u-flex u-col-center">
@@ -9,15 +13,21 @@
              <el-button type="primary" v-if="!carts.vipUser.id">选择用户</el-button>

              <div v-else class="flex cur-pointer">
-                <img v-if="carts.vipUser.headImg && carts.vipUser.headImg != 'null'" class="headimg"
-                  :src="carts.vipUser.headImg" alt="" />
+                <img
+                  v-if="carts.vipUser.headImg && carts.vipUser.headImg != 'null'"
+                  class="headimg"
+                  :src="carts.vipUser.headImg"
+                  alt=""
+                />
                <div v-else class="headimg flex flex-x-y-center">
                  <i class="el-icon-user"></i>
                </div>
                <div>
                  <div class="u-flex">
                    <div class="ft-13 color-000 no-wrap">{{ carts.vipUser.nickName }}</div>
-                    <div class="vip" v-if="carts.vipUser.isVip">{{ carts.vipUser.memberLevelName }}</div>
+                    <div class="vip" v-if="carts.vipUser.isVip">
+                      {{ carts.vipUser.memberLevelName }}
+                    </div>
                  </div>
                  <div style="margin-top: 2px" class="no-wrap color-666 ft-12">
                    余额：{{ carts.vipUser.amount }}
@@ -26,11 +36,19 @@
              </div>
            </div>
            <el-popover placement="right" width="333" trigger="click" ref="refTable">
-              <el-input placeholder="请输入内容" prefix-icon="search" v-model="tableSearchText"
-                @input="tablesearchInput"></el-input>
+              <el-input
+                placeholder="请输入内容"
+                prefix-icon="search"
+                v-model="tableSearchText"
+                @input="tablesearchInput"
+              ></el-input>
              <div style="max-height: 398px; overflow-y: scroll" class="u-m-t-12">
-                <div class="u-flex u-row-between u-p-t-8 table-item u-p-b-8 u-p-r-30" v-for="(item, index) in tableList"
-                  :key="index" @click="tableClick(item, index)">
+                <div
+                  class="u-flex u-row-between u-p-t-8 table-item u-p-b-8 u-p-r-30"
+                  v-for="(item, index) in tableList"
+                  :key="index"
+                  @click="tableClick(item, index)"
+                >
                  <span>{{ item.name }}</span>
                  <span :style="{ color: returnTableColor(item.status) }">
                    {{ returnTableLabel(item.status) }}
@@ -41,14 +59,21 @@
                </div>
              </div>
              <template #reference>
-                <el-button>{{ carts.tableInfo.name ? "桌台号：" + carts.tableInfo.name : "选择桌号" }}</el-button>
+                <el-button>
+                  {{ carts.tableInfo.name ? "桌台号：" + carts.tableInfo.name : "选择桌号" }}
+                </el-button>
              </template>
            </el-popover>
            <el-button type="warning" @click="refQuanHexiaoOpen">扫码验券</el-button>
          </div>
        </div>
        <div class="right">
-          <el-input placeholder="请输入商品名称" v-model="goods.query.name" clearable @change="getGoods">
+          <el-input
+            placeholder="请输入商品名称"
+            v-model="goods.query.name"
+            clearable
+            @change="getGoods"
+          >
            <template #suffix>
              <el-icon class="el-input__icon">
                <search />
@@ -62,16 +87,24 @@
          <div class="diners">
            <!-- 就餐类型 -->
            <el-button-group v-model="diners.sel" style="width: 100%; display: flex">
-              <el-button :class="{ active: index == diners.sel }" v-for="(item, index) in diners.list"
-                :disabled="dinerDisabled(item, index)" @click="changeDinersSel(index)" :key="index">
+              <el-button
+                :class="{ active: index == diners.sel }"
+                v-for="(item, index) in diners.list"
+                :disabled="dinerDisabled(item, index)"
+                @click="changeDinersSel(index)"
+                :key="index"
+              >
                {{ item.label }}
              </el-button>
            </el-button-group>
          </div>

          <div class="u-flex u-font-14 clear u-m-t-10 perpoles">
-            <div @click="showDinerNumber" class="u-flex u-p-r-14 u-m-r-14"
-              style="border-right: 1px solid #ebebeb; line-height: 1">
+            <div
+              @click="showDinerNumber"
+              class="u-flex u-p-r-14 u-m-r-14"
+              style="border-right: 1px solid #ebebeb; line-height: 1"
+            >
              <span>就餐人数：{{ perpole || "-" }} 位</span>
              <el-icon>
                <ArrowRight />
@@ -82,19 +115,39 @@
            </el-button>
          </div>
          <!-- 购物车 -->
-          <cartsList @editNote="showNote(true)" @createOrder="createOrder" @hideOrder="hideOrder"
-            @clearOldOrder="clearOldOrder" :showOrder="showOrder" :goodsList="carts.goods" :dinerType="diners.sel"
-            :perpole="perpole" :remark="remark" :table="carts.tableInfo" ref="refCart"></cartsList>
+          <cartsList
+            @editNote="showNote(true)"
+            @createOrder="createOrder"
+            @hideOrder="hideOrder"
+            @clearOldOrder="clearOldOrder"
+            :showOrder="showOrder"
+            :goodsList="carts.goods"
+            :dinerType="diners.sel"
+            :perpole="perpole"
+            :remark="remark"
+            :table="carts.tableInfo"
+            ref="refCart"
+          ></cartsList>
        </div>
        <div class="center">
          <!-- 购物车控制操作按钮 -->
-          <Controls @noteClick="showNote" @packClick="showPack" @changePriceClick="showChangePrice"
-            @return="refReturnCartShow" @rottable="rottableShow" @changeCartNumberShow="refChangeNumberShow" />
+          <Controls
+            @noteClick="showNote"
+            @packClick="showPack"
+            @changePriceClick="showChangePrice"
+            @return="refReturnCartShow"
+            @rottable="rottableShow"
+            @changeCartNumberShow="refChangeNumberShow"
+          />
        </div>
        <div class="right">
          <template v-if="!showOrder">
            <div class="flex categoty u-col-center">
-              <div class="show_more_btn" :class="{ showAll: category.showAll }" @click="toggleShowAll">
+              <div
+                class="show_more_btn"
+                :class="{ showAll: category.showAll }"
+                @click="toggleShowAll"
+              >
                <div class="flex">
                  <div class="flex showmore">
                    <el-icon color="#fff">
@@ -105,8 +158,16 @@
                </div>
              </div>
              <div class="flex categorys" :class="{ 'flex-wrap': category.showAll }">
-                <div v-for="(item, index) in category.list" :key="index" @click="changeCategoryId(item)">
-                  <el-tag size="large" :type="goods.query.categoryId === item.id ? 'primary' : 'info'" effect="dark">
+                <div
+                  v-for="(item, index) in category.list"
+                  :key="index"
+                  @click="changeCategoryId(item)"
+                >
+                  <el-tag
+                    size="large"
+                    :type="goods.query.categoryId === item.id ? 'primary' : 'info'"
+                    effect="dark"
+                  >
                    {{ item.name }}
                  </el-tag>
                </div>
@@ -120,13 +181,25 @@
                </el-icon>
                <div class="u-m-t-10">临时菜</div>
              </div>
-              <GoodsItem :item="item" @itemClick="goodsClick(item)" v-for="item in carts.goods" :key="item.id">
-              </GoodsItem>
+              <GoodsItem
+                :item="item"
+                @itemClick="goodsClick(item)"
+                v-for="item in carts.goods"
+                :key="item.id"
+              ></GoodsItem>
            </div>
          </template>
          <!-- 订单信息展示 -->
-          <Order ref="refOrder" :orderInfo="carts.oldOrder" @chooseUser="showChooseUser" @paysuccess="refresh"
-            :table="carts.tableInfo" :perpole="perpole" v-else :user="user"></Order>
+          <Order
+            ref="refOrder"
+            :orderInfo="carts.oldOrder"
+            @chooseUser="showChooseUser"
+            @paysuccess="refresh"
+            :table="carts.tableInfo"
+            :perpole="perpole"
+            v-else
+            :user="user"
+          ></Order>
        </div>
      </div>
    </div>
@@ -141,7 +214,11 @@
    <!-- 临时菜 -->
    <addLingShiCai ref="refAddLingShiCai" @confirm="addLingShiCaiConfirm"></addLingShiCai>
    <!-- 改价 -->
-    <changePrice ref="refChangePrice" :useVipPrice="carts.useVipPrice" @confirm="changePriceConfirm"></changePrice>
+    <changePrice
+      ref="refChangePrice"
+      :useVipPrice="carts.useVipPrice"
+      @confirm="changePriceConfirm"
+    ></changePrice>
    <!-- 称重商品 -->
    <change-weight ref="refChangeWeight" @confirm="changeWeightConfirm"></change-weight>
    <!-- 可选套餐 -->
@@ -355,7 +432,7 @@ async function createOrder(key) {
      placeNum: carts.oldOrder.placeNum * 1 + 1,
      waitCall: false,
      vipPrice: user.value.id && user.value.isVip,
-      limitRate: carts.limitDiscountRes
+      limitRate: carts.limitDiscountRes,
    });
    clearTimeout(loadingTimer);
    loading.close();
@@ -418,13 +495,13 @@ async function clearOldOrderCallback() {
      showOrder.value = false;
      return;
    }
-    console.log('清空历史订单回调', res);
+    console.log("清空历史订单回调", res);

    if (res.data !== null) {
-      console.log('还有历史订单数据');
+      console.log("还有历史订单数据");
      carts.setOldOrder(res);
    } else {
-      console.log('历史订单没数据了');
+      console.log("历史订单没数据了");
      carts.oldOrder = {
        detailMap: [],
        originAmount: 0,
@@ -432,17 +509,20 @@ async function clearOldOrderCallback() {
      carts.setOldOrder({
        detailMap: [],
        originAmount: 0,
-      }, 9);
+      });
      // carts.clearHistory();
      // resetOldOrder();
    }
+    carts.clearOldOrderCallback = false;
  } catch (error) {
    console.log(error);
+    carts.clearOldOrderCallback = false;
  }
 }
 // 取消历史订单
 async function clearOldOrder(params) {
  try {
+    carts.isClearingOldOrder = true;
    const res1 = params.placeNum
      ? await orderApi.rmPlaceOrder(params)
      : await orderApi.cancelOrder(params);
@@ -528,7 +608,7 @@ async function tableClick(item) {
    carts.setOldOrder(res);
  }
  table.value = item;
-  carts.changeTableInfo(item)
+  carts.changeTableInfo(item);
  carts.changeTable(item.tableCode);
  refTable.value.hide();
 }
@@ -748,12 +828,20 @@ function clearCarts() {
  });
 }
 function addCarts(item, isWeight = false) {
-  console.log('index.addCarts===', item);
+  console.log("index.addCarts===", item);
  if (isWeight) {
-    carts.add({ pack_number: diners.sel ? 1 : 0, ...item, is_time_discount: item.isLimitDiscount ? 1 : 0 });
+    carts.add({
+      pack_number: diners.sel ? 1 : 0,
+      ...item,
+      is_time_discount: item.isLimitDiscount ? 1 : 0,
+    });
    return;
  }
-  carts.add({ pack_number: diners.sel ? item.number : 0, ...item, is_time_discount: item.isLimitDiscount ? 1 : 0 });
+  carts.add({
+    pack_number: diners.sel ? item.number : 0,
+    ...item,
+    is_time_discount: item.isLimitDiscount ? 1 : 0,
+  });
 }

 watch(
@@ -806,7 +894,7 @@ onMounted(async () => {
    }
    if (res.tableCode) {
      table.value = { tableCode: res.tableCode };
-      carts.changeTableInfo(res)
+      carts.changeTableInfo(res);
    }
    if (res.userId) {
      const userRes = await shopUserApi.get({ userId: res.userId });
@@ -818,11 +906,11 @@ onMounted(async () => {
      const tableRes = await tableApi.get({ tableCode: res.tableCode });
      if (tableRes.tableCode) {
        table.value = tableRes || {};
-        carts.changeTableInfo(tableRes)
+        carts.changeTableInfo(tableRes);
      }
    }
    if (res) {
-      console.log('res31231231331-=====--', res);
+      console.log("res31231231331-=====--", res);

      carts.setOldOrder(res);
      showOrder.value = key == "isPayOrder" ? true : false;
@@ -833,7 +921,7 @@ onMounted(async () => {
    const tableRes = await tableApi.get({ tableCode: tableCode });
    if (tableRes.tableCode) {
      table.value = tableRes || {};
-      carts.changeTableInfo(tableRes)
+      carts.changeTableInfo(tableRes);
    }
  }
  console.log(table.value);
@@ -882,7 +970,7 @@ function refresh() {
  showOrder.value = false;
  user.value = {};
  table.value = {};
-  carts.changeTableInfo({})
+  carts.changeTableInfo({});
  router.replace(route.path);
  carts.dataReset();
  carts.init();
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -15,6 +15,9 @@ import { name, version, engines, dependencies, devDependencies } from "./package

 import stripCode from 'vite-plugin-strip-code'; // 导入插件

+
+import vueDevTools from 'vite-plugin-vue-devtools'
+
 // 平台的名称、版本、运行所需的 node 版本、依赖、构建时间的类型提示
 const __APP_INFO__ = {
  pkg: { name, version, engines, dependencies, devDependencies },
@@ -114,7 +117,8 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
        // 注意：标记可以自定义，只要前后一致即可
        start_comment: 'DEV-START', // 开始标记（自定义）
        end_comment: 'DEV-END'     // 结束标记（自定义）
-      })
+      }),
+      // vueDevTools()
    ],
    // 预加载项目必需的组件
    optimizeDeps: {