优化台桌结算不结算购物车信息

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "vite-electron",
 	"private": true,
-	"version": "2.0.18",
+	"version": "2.0.19",
 	"main": "dist-electron/main.js",
 	"scripts": {
 		"dev": "chcp 65001 && vite",

src/components/payCard/payCard.vue

@@ -273,6 +273,7 @@ import { staffPermission } from "@/api/user.js";
 import { cashPay, buyerPage, creditPay, vipPay } from "@/api/order.js";
 import { calcUsablePoints } from '@/api/account.js'
 import { useGoods } from "@/store/goods.js";
+import { createOrder } from '@/api/order.js';
 
 const emit = defineEmits(["paySuccess", 'orderExpired', 'reset']);
 
@@ -490,8 +491,44 @@ function upadatePayData() {
 }
 
 // 结算支付
-async function confirmOrder() {
+async function confirmOrder(t = 1) {
     try {
+        // if (goodsStore.cartList.length >= 0) {
+        //     // 如果购物还存在商品，先下单后进行支付操作
+        //     const data = {
+        //         orderId: goodsStore.orderListInfo.id || '',  // 订单id
+        //         shopId: store.shopInfo.id, // 店铺id
+        //         seatNum: goodsStore.tableInfo.num || 0, // 用餐人数
+        //         packFee: goodsStore.cartInfo.packFee, // 打包费
+        //         originAmount: goodsStore.cartInfo.costSummary.goodsOriginalAmount,
+        //         tableCode: goodsStore.cartList[0].table_code, // 台桌号
+        //         dineMode: goodsStore.allSelected ? store.shopInfo.eatModel.split(',')[1] : store.shopInfo.eatModel.split(',')[0], // 用餐方式
+        //         remark: goodsStore.remark, // 备注
+        //         placeNum: (goodsStore.orderListInfo.placeNum || 0) + 1, // 下单次数
+        //         waitCall: 0, // 是否叫号
+        //         userId: goodsStore.vipUserInfo.userId || '', // 会员用户id
+        //         limitRate: goodsStore.limitDiscountRes
+        //     }
+
+        //     // goodsStore.calcCartInfo()
+        //     const res = await createOrder(data)
+        //     if (res.id) {
+        //         // 设置订单信息
+        //         // goodsStore.orderListInfo = res
+        //         // if (t == 1) {
+        //         //     // 向其他端发送清空购物车消息
+        //         //     goodsStore.operateCart({ table_code: goodsStore.orderListInfo.tableCode }, "cleanup");
+        //         //     console.log('生成订单===', res);
+        //         // } else {
+        //         //     goodsStore.clearCart()
+        //         // }
+        //         // 清除购物车，更新历史订单
+        //         // goodsStore.updateOrderList()
+        //     } else {
+        //         ElMessage.error('订单成功失败，请重新下单')
+        //     }
+        // }
+
         // 判断订单是否锁定
         await goodsStore.isOrderLock({
             table_code: goodsStore.orderListInfo.tableCode
@@ -501,7 +538,6 @@ async function confirmOrder() {
 
         upadatePayData()
 
-
         payType.value = payList.value[payActive.value].payType
         if (payList.value[payActive.value].payType == "arrears") {
             showBuyerHandle();

src/store/goods.js

@@ -46,6 +46,7 @@ export const useGoods = defineStore("goods", {
     }, // 台桌信息
     cartActiveIndex: 0, // 购物车激活索引,
     isCartInit: false,
+    payType: "cart", // 结算类型，cart 购物车结算 table 桌台结算 order 订单结算,
     cartList: [], // 购物车列表
     // 购物车信息,
     cartInfo: {
@@ -889,8 +890,12 @@ export const useGoods = defineStore("goods", {
           .map((item) => item.goods)
           .flat()
           .map(this.comleteOrderInfo);
+        if (this.payType == 'table') {
+          return [...giftGoods, ...oldOrderGoods];
+        } else {
           return [...currentGoods, ...giftGoods, ...oldOrderGoods];
         }
+      }
 
       // 合并所有商品列表
       const allGoods = ref(getAllGoodsList() || [])

src/views/home/components/settleAccount.vue

@@ -144,6 +144,10 @@ const props = defineProps({
   member: {
     type: Object,
     default: {}
+  },
+  type: {
+    type: String,
+    default: 'cart' // cart 代客下单 table 桌台结算 order 订单结算
   }
 });
 
@@ -244,7 +248,7 @@ async function printOrderLable(isBefore = false) {
 
 // 订单已支付
 function paySuccess() {
-  if (isPrint.value) printOrderLable()
+  // if (isPrint.value) printOrderLable()
   emits('success')
   dialogVisible.value = false;
   ElMessage.success('支付成功')
@@ -258,9 +262,14 @@ function paySuccess() {
 
 const payCardRef = ref(null)
 function show(t) {
+  goodsStore.payType = props.type
   dialogVisible.value = true;
   cartInfo.value = { ...goodsStore.cartInfo }
+  if (props.type === 'table') {
+    orderList.value = goodsStore.orderList.map(item => item.goods).flat()
+  } else {
     orderList.value = [...goodsStore.cartList, ...goodsStore.orderList.map(item => item.goods).flat()]
+  }
 
   console.log('orderListInfo===================', { ...goodsStore.orderListInfo });
 

src/views/table/components/tableInfo.vue

@@ -19,14 +19,24 @@
             <div class="cart_list">
                 <div class="item" v-for="item in cartList" :key="item.id">
                     <div class="top">
-                        <span class="name">{{ item.productName }}</span>
+                        <span class="name">
+                            <span v-if="item.isTemporary" style="color: #999;">[临时菜]</span>
+                            <span v-if="item.isGift" style="color: #999;">[赠]</span>
+                            {{ item.productName }}
+                        </span>
                         <span class="n">x{{ item.num - item.returnNum }}</span>
-                        <span class="p">￥{{ item.price }}</span>
+                        <span class="p">￥{{ item.unitPrice }}</span>
                     </div>
                     <div class="top" v-if="item.returnNum > 0" style="font-size: 12px;color: #999;">
                         <span class="name">[退菜]</span>
                         <span class="n">x{{ item.returnNum }}</span>
-                        <span class="p" color="color:var(--el-color-danger)">-￥{{ item.returnAmount }}</span>
+                        <span class="p">-￥{{ item.returnNum * item.price }}</span>
+                    </div>
+                    <div class="top" v-if="item.discountSaleAmount > 0 && item.isTemporary == 0"
+                        style="font-size: 12px;color: #999;">
+                        <span class="name">[改价优惠]</span>
+                        <span class="n"></span>
+                        <span class="p">-￥{{ item.price - item.unitPrice }}</span>
                     </div>
                     <div class="tag_wrap" v-if="item.skuName">
                         <div class="tag" v-for="item in item.skuName.split(',')">
@@ -85,7 +95,7 @@
             </transition>
         </div>
         <!-- 结算订单 -->
-        <SettleAccount ref="SettleAccountRef" @success="emits('success')" />
+        <SettleAccount ref="SettleAccountRef" type="table" @success="emits('success')" />
     </div>
 </template>
 
@@ -190,7 +200,7 @@ async function getOrderDetail() {
 
             let total = 0
             res.cartList.forEach(item => {
-                total += +item.payAmount - (item.returnAmount || 0)
+                total += +item.payAmount - (item.returnNum * item.price)
             })
             orderInfo.value.orderAmount = formatDecimal(total)
         }

src/views/table/index.vue

@@ -25,12 +25,12 @@
                 </div>
             </div>
             <div class="tab_container">
-                <div class="tab_head">
+                <div class="tab_head" ref="tabHeadRef">
-                    <el-radio-group v-model="area" @change="shopTableAjax">
+                    <div class="item" :class="{ active: tabItemActive == -1 }" @click="tabItemChange('', -1)">全部</div>
-                        <el-radio-button label="全部" value=""></el-radio-button>
+                    <div class="item" :class="{ active: index == tabItemActive }" v-for="(item, index) in areaList"
-                        <el-radio-button :label="item.name" :value="item.id" v-for="item in areaList"
+                        :key="item.id" @click="tabItemChange(item, index)">
-                            :key="item.id"></el-radio-button>
+                        {{ item.name }}
-                    </el-radio-group>
+                    </div>
                 </div>
                 <div class="overflow_y" v-loading="loading">
                     <div class="tab_list">
@@ -87,7 +87,7 @@
 import { shopArea, shopTable } from "@/api/account.js";
 import countCard from '@/views/table/components/countCard.vue'
 import tableInfo from '@/views/table/components/tableInfo.vue'
-import { ref, onMounted, onUnmounted } from 'vue'
+import { ref, onMounted, onUnmounted, nextTick } from 'vue'
 import { dayjs } from 'element-plus'
 import tableStatusList from './statusList.js'
 import { formatDecimal } from '@/utils/index.js'
@@ -149,6 +149,43 @@ function tabChange(item, index) {
     shopTableAjax()
 }
 
+const tabItemActive = ref(-1)
+function tabItemChange(item, index) {
+    tabItemActive.value = index
+    if (index == -1) {
+        area.value = ''
+    } else {
+        area.value = item.id
+    }
+    shopTableAjax()
+
+    nextTick(() => {
+        scrollTabToCenter()
+    })
+}
+
+// 自动居中滚动
+const tabHeadRef = ref(null)
+function scrollTabToCenter() {
+    const container = tabHeadRef.value
+    if (!container) return
+
+    // 获取当前激活的 item
+    const activeItem = container.querySelector('.item.active')
+    if (!activeItem) return
+
+    // 计算居中位置
+    const containerWidth = container.offsetWidth
+    const itemWidth = activeItem.offsetWidth
+    const itemLeft = activeItem.offsetLeft
+
+    // 滚动到中间（核心公式）
+    container.scrollTo({
+        left: itemLeft - containerWidth / 2 + itemWidth / 2,
+        behavior: 'smooth' // 丝滑滚动
+    })
+}
+
 // 计算当前的时间差
 function countTime(t) {
     if (!t) return '0小时1分'
@@ -374,12 +411,46 @@ onUnmounted(() => {
     padding: var(--el-font-size-base);
 
     .tab_head {
+        width: calc(100vw - 125px);
         padding-bottom: var(--el-font-size-base);
+        overflow-x: auto;
+        white-space: nowrap;
+
+        /* 隐藏滚动条（通用） */
+        scrollbar-width: none;
+        -ms-overflow-style: none;
+
+
+        .item {
+            height: 42px;
+            display: inline-flex;
+            align-items: center;
+            padding: 4px 12px;
+            border-radius: 4px;
+            background-color: #f5f5f5;
+            margin-right: 10px;
+
+            &.active {
+                background-color: var(--primary-color);
+                color: #fff;
+            }
+
+            &:hover {
+                cursor: pointer;
+                background-color: var(--primary-color);
+                color: #fff;
+            }
+        }
+    }
+
+    /* 隐藏滚动条（Chrome / Electron / Edge） */
+    .tab_head::-webkit-scrollbar {
+        display: none !important;
     }
 
     .overflow_y {
         // height: calc(100vh - 220px);
-        height: calc(100vh - 160px);
+        height: calc(100vh - 162px);
         overflow-y: auto;
     }
 
@@ -424,6 +495,21 @@ onUnmounted(() => {
                 justify-content: space-between;
                 padding: 0 10px;
                 color: #fff;
+                gap: 4px;
+
+                span:nth-child(1) {
+                    /* 核心：最多两行，超出... */
+                    display: -webkit-box;
+                    -webkit-line-clamp: 2;
+                    /* 最多2行 */
+                    -webkit-box-orient: vertical;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+
+                    /* 保证换行正常 */
+                    white-space: normal;
+                    word-break: break-all;
+                }
             }
 
             .tab_cont {