更改地址

2.转桌/并桌只显示已下单商品

.env.development

@@ -26,10 +26,10 @@ VITE_API_KP_URL = 'https://invoice.sxczgkj.cn/api'
 # VITE_API_URL = 'http://192.168.1.106:10589/cashier-client'
 
 # 杰哥
-# VITE_API_URL = 'http://192.168.1.34:10589/cashier-client'
+VITE_API_URL = 'http://192.168.2.181:10587/cashier-client'
 
 # 测试
-VITE_API_URL = 'https://cashier-client.sxczgkj.cn/cashier-client'
+# VITE_API_URL = 'https://cashier-client.sxczgkj.cn/cashier-client'
 
 # 预发布
 # VITE_API_URL = 'https://pre-cashierclient.sxczgkj.cn/cashier-client'

.env.test

@@ -2,10 +2,10 @@
 ENV = test
 
 #测试ws
-VITE_API_WSS = 'wss://wxcashiertest.sxczgkj.cn/client'
+# VITE_API_WSS = 'wss://wxcashiertest.sxczgkj.cn/client'
 
 # 正式ws
-# VITE_API_WSS = 'wss://cashier.sxczgkj.cn/client'
+VITE_API_WSS = 'wss://cashier.sxczgkj.cn/client'
 
 # 正式 php
 VITE_API_PHP_URL = 'https://czgdoumei.sxczgkj.com/index.php/api'

package.json

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

src/api/pay.js

@@ -142,3 +142,29 @@ export function vipPay(data) {
     data,
   });
 }
+
+/**
+ * 挂账人-分页
+ * @param {*} params
+ * @returns
+ */
+export function buyerPage(params) {
+  return request({
+    method: "get",
+    url: "/credit/buyer/page",
+    params,
+  });
+}
+
+/**
+ * 挂账支付
+ * @param {*} data
+ * @returns
+ */
+export function payCreditPay(data) {
+  return request({
+    method: "post",
+    url: "/pay/creditPay",
+    data,
+  });
+}

src/api/product.js

@@ -246,3 +246,16 @@ export function orderPrint(data) {
     data,
   });
 }
+
+/**
+ * 转台/并台
+ * @param {*} data
+ * @returns
+ */
+export function orderSwitcht(data) {
+  return request({
+    method: "PUT",
+    url: "/order/switch",
+    data,
+  });
+}

src/components/leftMenu.vue

@@ -87,11 +87,11 @@ const menus = ref([
         path: '/member',
         icon: 'User'
     },
-    // {
+    {
-    //     label: '排队',
+        label: '排队',
-    //     path: '/queue',
+        path: '/queue',
-    //     icon: 'Timer'
+        icon: 'Timer'
-    // },
+    },
     // {
     //     label: '交班',
     //     path: '/work',

src/components/lodop/receiptPrint.js

@@ -25,6 +25,9 @@ export default (data) => {
     data.orderInfo.masterId ? data.orderInfo.masterId : ""
   }】
         </div>
+        <div style="font-size: 16px;display: flex; justify-content:center;margin-top:6px;">
+          桌号：${data.orderInfo && data.orderInfo.tableName || ''}
+        </div>
         <div style="font-size: 16px;display: flex; justify-content:center;margin-top:20px;">
           ${data.orderInfo.outNumber ? data.orderInfo.outNumber : ""}
         </div>

src/components/lodop/refundPrint.js

@@ -19,6 +19,9 @@ export default (data) => {
         <div style="font-size: 16px;display: flex; justify-content:center;margin-top:6px;">
           退款单【${data.orderInfo.masterId ? data.orderInfo.masterId : ""}】
         </div>
+        <div style="font-size: 16px;display: flex; justify-content:center;margin-top:6px;">
+          桌号：${data.orderInfo && data.orderInfo.tableName || ''}
+        </div>
         <div style="margin-top: 30px;font-size: 12px;">
           订单号：${data.orderInfo && data.orderInfo.orderNo}
         </div>

src/components/more.vue

@@ -3,10 +3,13 @@
     <el-drawer size="60%" :with-header="false" direction="rtl" v-model="dialogVisible" style="padding: 0">
       <div class="drawerbox_box">
         <div class="drawerbox_bo_top">
-          <div class="drawerbox_bo_top_left">
+          <div class="drawerbox_bo_top_left" @click="computeExpired">
             <div class="drawerbox_bo_top_left_one" style="font-size: 24px;">
               {{ store.userInfo.shopName }}
             </div>
+            <div class="tips" style="margin-top: 4px; color: var(--el-color-warning);"
+              v-if="!showTips && store.userInfo.expireDate">注意：您的账号将于{{
+                store.userInfo.expireDate }}后过期，请尽快续期！</div>
             <div class="drawerbox_bo_top_left_tow" style="margin-top: 10px">
               收银员：{{ store.userInfo.loginAccount }}
             </div>
@@ -109,8 +112,21 @@ const screenref = ref(null);
 
 const dialogVisible = ref(false);
 
+const showTips = ref(false)
+
 function show() {
   dialogVisible.value = true;
+  computeExpired()
+}
+
+// 计算是否小于过期时间30天
+function computeExpired() {
+  // 当前日期
+  let now = dayjs()
+  // 到期时间
+  let expired = dayjs(store.userInfo.expireDate).subtract(30, 'day')
+  // 判断当前时间是否大于到期时间30天
+  showTips.value = now.isBefore(expired)
 }
 
 // 打开叫号弹窗

src/components/payCard/payCard.vue

@@ -25,6 +25,16 @@
                     </div>
                     <span class="title">{{ item.payName }}</span>
                 </div>
+                <div class="item" :class="{ active: payActive == 'buyer' }"
+                    @click="payTypeChange('buyer', { payType: 'buyer' })">
+                    <div class="icon">
+                        <div class="img"
+                            style="display: flex;align-items: center;justify-content: center;background-color: var(--el-color-danger);color: #fff;font-size: 24px;border-radius: 11px;">
+                            挂
+                        </div>
+                    </div>
+                    <span class="title">挂账</span>
+                </div>
             </div>
             <div class="input_wrap">
                 <div class="input" style="flex: 1;">储值:￥{{ money }}</div>
@@ -83,11 +93,56 @@
         <el-pagination layout="prev, pager, next, total" background style="margin-top: 20px;"
             :total="Number(tableData.total)" v-model:current-page="tableData.page" @current-change="getMemberList" />
     </el-dialog>
+    <!-- 选择挂账人员 -->
+    <el-dialog title="挂账" top="3vh" v-model="showBuyer" width="90%" @closed="resetBuyerTable">
+        <el-form inline>
+            <el-form-item>
+                <el-input placeholder="请输入挂账人或手机号搜索" v-model="buyerTable.keywords" />
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="getBuyerList">搜索</el-button>
+                <el-button @click="resetBuyerTable">重置</el-button>
+            </el-form-item>
+        </el-form>
+        <el-table :data="buyerTable.list" height="440px" border stripe v-loading="buyerTable.loading">
+            <el-table-column prop="debtor" label="挂账人" />
+            <el-table-column prop="mobile" label="手机" width="150px" />
+            <el-table-column prop="position" label="职位" width="120px" />
+            <el-table-column prop="repaymentMethod" label="还款方式" width="160px">
+                <template v-slot="scope">
+                    <template v-if="scope.row.repaymentMethod == 'total'">按总金额还款</template>
+                    <template v-if="scope.row.repaymentMethod == 'order'">按订单还款</template>
+                </template>
+            </el-table-column>
+            <el-table-column prop="creditAmount" label="挂账额度" width="160px">
+                <template v-slot="scope">
+                    ￥{{ formatDecimal(scope.row.creditAmount) }}
+                </template>
+            </el-table-column>
+            <el-table-column prop="remainingAmount" label="剩余挂账额度" width="160px">
+                <template v-slot="scope">
+                    ￥{{ formatDecimal(scope.row.remainingAmount) }}
+                </template>
+            </el-table-column>
+            <el-table-column prop="accumulateAmount" label="累计挂账金额" width="160px">
+                <template v-slot="scope">
+                    ￥{{ formatDecimal(scope.row.accumulateAmount) }}
+                </template>
+            </el-table-column>
+            <el-table-column label="操作" width="120px" fixed="right">
+                <template v-slot="scope">
+                    <el-button type="primary" @click="payCreditPayHandle(scope.row)">选择</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <el-pagination layout="prev, pager, next, total" background style="margin-top: 20px;"
+            :total="Number(buyerTable.total)" v-model:current-page="buyerTable.page" @current-change="getBuyerList" />
+    </el-dialog>
 </template>
 
 <script setup>
 import { onMounted, ref, computed, watch, reactive } from 'vue'
-import { queryPayType, accountPay, cashPay, vipPay } from '@/api/pay'
+import { queryPayType, accountPay, cashPay, vipPay, buyerPage, payCreditPay } from '@/api/pay'
 import { queryMembermember, createMembermember, membermemberScanPay, accountPaymember } from '@/api/member/index.js'
 import { useUser } from "@/store/user.js"
 import { clearNoNum, formatDecimal } from '@/utils'
@@ -96,6 +151,7 @@ import scanModal from '@/components/payCard/scanModal.vue'
 import { ElMessage } from "element-plus";
 import { useGlobal } from '@/store/global.js'
 import { staffPermission } from '@/api/user.js'
+import { fa } from 'element-plus/es/locale/index.mjs'
 
 const global = useGlobal()
 
@@ -143,6 +199,76 @@ const payType = ref('')
 const payList = ref([])
 const payLoading = ref(false)
 
+// 挂账人 start
+const showBuyer = ref(false)
+const buyerTable = reactive({
+    keywords: '',
+    loading: false,
+    page: 1,
+    size: 10,
+    total: 0,
+    list: []
+})
+
+// 显示挂账人
+function showBuyerHandle() {
+    showBuyer.value = true
+    getBuyerList()
+}
+
+// 
+function resetBuyerTable() {
+    buyerTable.keywords = ''
+    buyerTable.page = 1
+    getBuyerList()
+}
+
+// 获取挂账人列表
+async function getBuyerList() {
+    try {
+        buyerTable.loading = true
+        const res = await buyerPage({
+            page: buyerTable.page,
+            size: buyerTable.size,
+            shopId: store.userInfo.shopId,
+            keywords: buyerTable.keywords,
+            status: 1,
+            responsiblePerson: '',
+            repaymentStatus: ''
+        })
+        buyerTable.loading = false
+        buyerTable.list = res.list
+        buyerTable.total = res.total
+    } catch (error) {
+        buyerTable.loading = false
+        console.log(error);
+    }
+}
+
+// 选择挂账人支付
+async function payCreditPayHandle(row) {
+    try {
+        payLoading.value = true
+        buyerTable.loading = true
+        const res = await payCreditPay({
+            creditBuyerId: row.id,
+            orderId: props.orderId,
+            payAmount: props.discount > 0 ? money.value : '',
+            discountAmount: props.discount > 0 ? formatDecimal(props.amount - money.value) : ''
+        })
+        showBuyer.value = false
+        payLoading.value = false
+        buyerTable.loading = false
+        ElMessage.success('支付成功')
+        emit('paySuccess')
+    } catch (error) {
+        buyerTable.loading = false
+        payLoading.value = false
+        console.log(error);
+    }
+}
+// 显示选择挂账人 end
+
 // 获得扫码值
 function scanCodeSuccess() {
     emit('paySuccess')
@@ -162,9 +288,14 @@ async function payTypeChange(index, item) {
             showDialog.value = true
             getMemberList()
         }
+        if (item.payType == 'buyer') {
+            showBuyerHandle()
+        }
+        if (payActive.value != 'buyer') {
             if (payList.value[payActive.value].payType == 'deposit' && !global.orderMemberInfo.id) {
                 scanModalRef.value.show()
             }
+        }
     } catch (error) {
         console.log(error);
     }
@@ -174,9 +305,10 @@ async function payTypeChange(index, item) {
 async function confirmOrder() {
     try {
         await staffPermission('yun_xu_shou_kuan')
-
         if (payLoading.value) return
-        if (payList.value[payActive.value].payType == 'scanCode') {
+        if (payActive.value == 'buyer') {
+            showBuyerHandle()
+        } else if (payList.value[payActive.value].payType == 'scanCode') {
             scanModalRef.value.show()
         } else {
             // if (money.value < props.amount) return

src/store/socket.js

@@ -16,6 +16,7 @@ export const useSocket = defineStore({
     uuid: "", // 长连接唯一id
     heartbeatTimer: null, // 心跳计时器
     orderList: [],
+    log: true,
   }),
   actions: {
     // 创建uuid
@@ -33,7 +34,7 @@ export const useSocket = defineStore({
     },
     // 关闭ws
     close() {
-      console.log("关闭ws");
+      if (this.log) console.log("关闭ws");
       this.online = false;
       this.ws.close(1000);
       this.ws = null;
@@ -57,7 +58,7 @@ export const useSocket = defineStore({
       printStore.init();
 
       if (this.ws == null) {
-        console.log("创建新的ws连接");
+        if (this.log) console.log("创建新的ws连接");
 
         const protocols = []; // 可选的子协议数组
         const options = {
@@ -67,17 +68,17 @@ export const useSocket = defineStore({
         };
         this.ws = new ReconnectingWebSocket(wsUrl, protocols, options);
       } else {
-        console.log("重新连接ws");
+        if (this.log) console.log("重新连接ws");
         this.wsReconnect();
       }
 
       this.ws.addEventListener("open", (event) => {
-        console.log("wss连接成功");
+        if (this.log) console.log("wss连接成功");
         this.online = true;
         // 清除心跳
         this.clearHeartBeat();
 
-        console.log(this);
+        if (this.log) console.log(this);
 
         this.ws.send(
           JSON.stringify({
@@ -92,7 +93,7 @@ export const useSocket = defineStore({
       this.ws.addEventListener("message", (e) => {
         let data = JSON.parse(e.data);
         if (data.type == "order") {
-          console.log("接收消息", data);
+          if (this.log) console.log("接收消息", data);
           this.ws.send(
             JSON.stringify({
               type: "send",
@@ -112,18 +113,18 @@ export const useSocket = defineStore({
             }
           }
         } else if (data.type == "heartbeat") {
-          console.log("接收心跳");
+          if (this.log) console.log("接收心跳");
         }
       });
 
       this.ws.addEventListener("error", () => {
-        console.log("WebSocket连接发生错误");
+        if (this.log) console.log("WebSocket连接发生错误");
         this.online = false;
         this.clearHeartBeat();
       });
 
       this.ws.addEventListener("error", (e) => {
-        console.log("ws关闭了", e);
+        if (this.log) console.log("ws关闭了", e);
         this.online = false;
         this.clearHeartBeat();
       });
@@ -131,7 +132,7 @@ export const useSocket = defineStore({
     // 启动心跳连接
     startheartbeat() {
       this.heartbeatTimer = setInterval(() => {
-        console.log("发送心跳");
+        if (this.log) console.log("发送心跳");
         this.ws.send(JSON.stringify({ type: "heartbeat" }));
       }, 10000);
     },

src/views/home/components/cartOperation.vue

@@ -56,6 +56,13 @@
             </el-icon>
             <el-text class="t">挂单</el-text>
         </div>
+        <div class="item" @click="tableMergingHandle"
+            v-if="shopStore.info.registerType == 'restaurant' && props.item.tableId && props.item.orderId">
+            <el-icon class="icon">
+                <EditPen />
+            </el-icon>
+            <el-text class="t">转桌</el-text>
+        </div>
         <div class="item" @click="props.item.id && emit('clearCart')">
             <el-icon class="icon">
                 <RefreshRight />
@@ -117,7 +124,7 @@ const props = defineProps({
         default: {}
     }
 })
-const emit = defineEmits(['confirm', 'delete', 'pending', 'clearCart'])
+const emit = defineEmits(['confirm', 'delete', 'pending', 'clearCart', 'merging'])
 
 const takeFoodCodeRef = ref(null)
 const skuModalRef = ref([])
@@ -280,6 +287,14 @@ async function kitchenPrint() {
     }
 }
 /**免厨打印 end */
+
+
+// 显示合并转桌
+function tableMergingHandle() {
+    if (props.item.id) {
+        emit('merging')
+    }
+}
 </script>
 
 <style scoped lang="scss">
@@ -287,7 +302,7 @@ async function kitchenPrint() {
     padding: 10px;
     display: flex;
     flex-direction: column;
-    gap: 15px;
+    gap: 10px;
 
     .item {
         width: 70px;

src/views/home/components/goods.vue

@@ -44,7 +44,7 @@
     </div>
     <div class="shop_list" :class="{ img: shopListType == 'img' }" v-loading="loading">
         <!-- <swiper class="swiper_box" direction="vertical" @slideChange="onSlideChange"> -->
-        <swiper class="swiper_box" direction="vertical" @slideChange="onSlideChange">
+        <swiper ref="swiperRef" :loop="false" class="swiper_box" direction="vertical" @slideChange="onSlideChange">
             <swiper-slide class="slide_item" v-for="(goods, index) in goodsList" :key="index">
                 <div class="item_wrap" v-for="item in goods" :key="item.id" @click="showSkuHandle(item)">
                     <div class="item">
@@ -225,7 +225,7 @@
 <script setup>
 import { ElMessage } from 'element-plus'
 import { Search } from '@element-plus/icons-vue'
-import { onMounted, ref } from 'vue'
+import { nextTick, onMounted, ref } from 'vue'
 import _ from 'lodash'
 import useStorage from "@/utils/useStorage";
 import skuModal from '@/components/skuModal.vue'
@@ -239,6 +239,8 @@ import { staffPermission } from '@/api/user.js'
 import { useGlobal } from '@/store/global.js'
 import { inputFilterFloat } from '@/utils/index.js'
 
+const swiperRef = ref(null)
+
 const global = useGlobal()
 
 const store = useUser()
@@ -594,14 +596,14 @@ async function queryCategoryAjax() {
 }
 
 // 查询商品信息
-async function productqueryCommodityInfoAjax() {
+async function productqueryCommodityInfoAjax(page = goodsPage.value) {
     try {
         // loading.value = true
         const res = await queryNewCommodityInfo({
             shopId: store.userInfo.shopId,
             categoryId: categorys.value[categorysActive.value].id,
             commdityName: commdityName.value,
-            page: goodsPage.value,
+            page: page,
             pageSize: goodsPageSize.value,
             masterId: props.masterId,
             tableId: global.tableInfo.qrcode || '',
@@ -657,9 +659,7 @@ async function updataGoods() {
         }
         searchLoading.value = false
     } else {
-        goodsPage.value = currentGoodsIndex.value + 1
+        const res = await productqueryCommodityInfoAjax(currentGoodsIndex.value + 1)
-        // console.log('更新第二页数据', goodsPage.value);
-        const res = await productqueryCommodityInfoAjax()
         goodsList.value[currentGoodsIndex.value] = res.list
         searchLoading.value = false
     }
@@ -669,7 +669,6 @@ async function updataGoods() {
 const onSlideChange = _.debounce(async function (e) {
     if (e.activeIndex == e.previousIndex) return
     if (e.activeIndex > e.previousIndex) {
-        // console.log('向下滑动');
         {
             goodsPage.value++
             const res = await productqueryCommodityInfoAjax()
@@ -681,24 +680,19 @@ const onSlideChange = _.debounce(async function (e) {
             const res = await productqueryCommodityInfoAjax()
             res.list.length && goodsList.value.push(res.list)
         }
-        // goodsList.value.shift()
-    } else {
-        // console.log('向上滑动');
-        // goodsPage.value--
-        // const res = await productqueryCommodityInfoAjax()
-        // goodsList.value.unshift(res)
-        // goodsList.value.pop()
     }
+
     currentGoodsIndex.value = e.activeIndex
 }, 500)
 
-// 订单已结算，清楚商品所有数字
+// 订单已结算，清除商品所有数字
 function clearDot() {
-    goodsList.value.map(item => {
+    // goodsList.value.map(item => {
-        item.map(val => {
+    //     item.map(val => {
-            val.orderCount = 0
+    //         val.orderCount = 0
-        })
+    //     })
-    })
+    // })
+    updateData()
 }
 
 const showEditor = ref(false)
@@ -770,6 +764,7 @@ async function showPutawayHandle(item) {
     }
 }
 
+// 确认上架操作
 async function putawayHandle(item) {
     try {
         showPutawayLoading.value = true
@@ -875,6 +870,7 @@ onMounted(async () => {
     getUnitListAjax()
     await updateCategoryActive()
     await queryCategoryAjax()
+    updataGoods()
 })
 </script>
 

src/views/home/components/tableMerging.vue

@@ -0,0 +1,203 @@
+<!-- 合并/转桌 -->
+<template>
+    <el-dialog title="转桌/并桌" width="700px" v-model="visible" @closed="onClose" top="10vh">
+        <div class="scroll_y">
+            <el-form :model="form" ref="formRef" :rules="rules" label-position="top">
+                <el-form-item label="转入台桌" prop="targetTableId">
+                    <el-select v-model="form.targetTableId" style="width: 200px;" placeholder="请选择目标台桌">
+                        <el-option :label="item.name" :value="item.qrcode" v-for="item in tableList"
+                            :key="item.qrcode"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="转入类型">
+                    <el-radio-group v-model="form.isFull">
+                        <el-radio :value="false" border>转桌（可将部分商品转入）</el-radio>
+                        <el-radio :value="true" border>并桌（并台会将全部购物车商品转入）</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="转入商品" prop="cartIds" v-if="!form.isFull">
+                    <div v-for="item in props.data" style="width: 100%;">
+                        <div>{{ `第${item.placeNum}次下单` }}</div>
+                        <el-table ref="tableRefs" :data="item.info" border>
+                            <el-table-column type="selection" align="center" width="50px"></el-table-column>
+                            <el-table-column label="名称" prop="name"></el-table-column>
+                            <el-table-column label="数量" prop="number"></el-table-column>
+                            <el-table-column label="规格" prop="skuName"></el-table-column>
+                            <el-table-column label="价格" prop="salePrice"></el-table-column>
+                        </el-table>
+                    </div>
+                </el-form-item>
+            </el-form>
+        </div>
+        <div class="footer" style="display: flex;">
+            <el-button style="width: 100%" @click="visible = false">
+                取消
+            </el-button>
+            <el-button type="primary" style="width: 100%" :loading="loading" @click="confirmHandle">
+                确认
+            </el-button>
+        </div>
+    </el-dialog>
+</template>
+
+<script setup>
+import { onMounted, reactive, ref } from 'vue'
+import { queryShopTable } from '@/api/table.js'
+import { orderSwitcht } from '@/api/product.js'
+import { useUser } from "@/store/user.js"
+import { useGlobal } from '@/store/global.js'
+import { ElMessage } from 'element-plus'
+
+const store = useUser()
+const global = useGlobal()
+
+const visible = ref(false)
+
+const props = reactive({
+    data: []
+})
+
+const emits = defineEmits(['success'])
+
+const tableRefs = ref([])
+
+const list = ref([])
+
+const loading = ref(false)
+const formRef = ref(null)
+const resetForm = ref({})
+const form = ref({
+    shopId: store.userInfo.shopId,
+    masterId: '',
+    orderId: '',
+    cartIds: [],
+    isFull: false,
+    currentTableId: '',
+    targetTableId: '',
+})
+
+const rules = ref({
+    targetTableId: [
+        {
+            required: true,
+            message: ' ',
+            trigger: 'change',
+        }
+    ],
+    cartIds: [
+        {
+            required: true,
+            validator: (rule, value, callback) => {
+                let arr = []
+                props.data.map((item, index) => {
+                    arr.push(...tableRefs.value[index].getSelectionRows())
+                })
+
+                if (!arr.length) {
+                    ElMessage.error('至少选择一个商品')
+                    callback(new Error('至少选择一个商品'))
+                } else {
+                    callback()
+                }
+            },
+            trigger: 'blur',
+        }
+    ]
+})
+
+const tableList = ref([])
+// 获取台桌列表
+async function queryShopTableAjax() {
+    try {
+        const res = await queryShopTable({
+            shopId: store.userInfo.shopId,
+            areaId: '',
+            status: '',
+            page: 1,
+            pageSize: 100
+        })
+        tableList.value = res.list.filter(item => item.qrcode != props.data[0].info[0].tableId && item.status == 'using')
+    } catch (error) {
+        console.log(error)
+    }
+}
+
+// 提交
+function confirmHandle() {
+    formRef.value.validate(async valid => {
+        try {
+            if (valid) {
+                loading.value = true
+                form.value.masterId = props.data[0].info[0].masterId
+                form.value.orderId = props.data[0].info[0].orderId
+                form.value.currentTableId = props.data[0].info[0].tableId
+
+                if (!form.value.isFull) {
+                    let arr = []
+                    props.data.map((item, index) => {
+                        arr.push(...tableRefs.value[index].getSelectionRows())
+                    })
+                    form.value.cartIds = arr.map(item => item.id)
+                }
+
+                await orderSwitcht(form.value)
+                loading.value = false
+
+                // 更新台桌信息
+                global.setOrderTable(tableList.value.find(item => item.qrcode == form.value.targetTableId))
+
+                visible.value = false
+
+                emits('success', { isTemporary: true })
+            }
+        } catch (error) {
+            loading.value = false
+            console.log(error);
+        }
+    })
+}
+
+function onClose() {
+    form.value = { ...resetForm.value }
+    formRef.value.resetFields()
+}
+
+function show(data) {
+    props.data = data
+    visible.value = true
+    queryShopTableAjax()
+}
+
+defineExpose({
+    show
+})
+
+onMounted(() => {
+    resetForm.value = { ...form.value }
+})
+</script>
+
+<style scoped lang="scss">
+$btmH: 50px;
+
+.scroll_y {
+    height: 50vh;
+    overflow-y: auto;
+    padding-bottom: $btmH;
+}
+
+.footer {
+    position: relative;
+
+    &::before {
+        content: "";
+        height: $btmH;
+        background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
+        width: 100%;
+        position: absolute;
+        top: $btmH*-1;
+        left: 0;
+        z-index: 10;
+    }
+}
+</style>

src/views/home/index.vue

@@ -97,7 +97,7 @@
         </div>
         <!-- 购物车操作栏 -->
         <cartOperation :item="cartListActiveItem" @confirm="(res) => addCart(res, 'edit')" @delete="delCartHandle"
-          @pending="pendingCart" @clearCart="clearCartHandle" />
+          @pending="pendingCart" @clearCart="clearCartHandle" @merging="showTableMerging" />
       </div>
       <div class="footer">
         <div class="top">
@@ -165,6 +165,8 @@
   <pendingCartModal ref="pendingCartModalRef" @select="pendingCartHandle" />
   <!-- 检查版本升级 -->
   <updateDialog />
+  <!-- 合并/转桌 -->
+  <tableMerging ref="tableMergingRef" @success="addCart" />
 </template>
 
 <script>
@@ -185,6 +187,7 @@ import cartOperation from "@/views/home/components/cartOperation.vue";
 import settleAccount from "@/views/home/components/settleAccount.vue";
 import fastCashier from "@/views/home/components/fastCashier.vue";
 import pendingCartModal from "@/views/home/components/pendingCartModal.vue";
+import tableMerging from '@/views/home/components/tableMerging.vue'
 import useStorage from '@/utils/useStorage'
 import { formatDecimal } from '@/utils/index.js'
 
@@ -209,6 +212,7 @@ import member from "@/views/member/index.vue";
 import { ElMessage } from "element-plus";
 
 import { useShop } from '@/store/shop.js'
+import TableMerging from "./components/tableMerging.vue";
 
 const shopStore = useShop()
 
@@ -224,6 +228,7 @@ const goodsRef = ref(null);
 const pendingCartModalRef = ref(null);
 const settleAccountRef = ref(null);
 const fastCashierRef = ref(null);
+const tableMergingRef = ref(null)
 
 const allSelected = ref(false);
 
@@ -493,7 +498,7 @@ async function queryCartAjax() {
 
     cartInfo.value = res.amount;
     pendingCartNum.value = res.num;
-    goodsRef.value.updateData();
+    // goodsRef.value.updateData();
 
     let i = 0;
     res.list.map((item) => {
@@ -568,6 +573,12 @@ function clearMember() {
   createCodeAjax()
 }
 
+// 显示转桌/并桌
+function showTableMerging() {
+  let data = cartList.value.filter(item => item.placeNum)
+  tableMergingRef.value.show(data)
+}
+
 onMounted(() => {
   createCodeAjax()
   shopStore.queryShopInfo()
@@ -721,6 +732,7 @@ onMounted(() => {
           display: -webkit-box;
           -webkit-box-orient: vertical;
           -webkit-line-clamp: 2;
+          line-clamp: 2;
         }
 
         .num {

src/views/table/index.vue

@@ -254,31 +254,51 @@ onMounted(() => {
         gap: var(--el-font-size-base);
 
         .item {
-            $usingColor: #D2441F;
-            $subColor: #3274D5;
             $closedColor: #aeb8c9;
-            background-color: #efefef;
             border-radius: 6px;
             overflow: hidden;
-            border: 2px solid #fff;
+            padding: 2px;
+            background-color: var(--primary-color);
 
             &.active {
-                border-color: $subColor;
+                background-color: var(--primary-color);
+
+                .tab_cont {
+                    .icon {
+                        color: var(--primary-color);
+                    }
+
+                    .t1 {
+                        color: var(--primary-color);
+                    }
+                }
             }
 
             &.using {
-                &.active {
+                background-color: var(--el-color-success);
-                    border-color: $usingColor;
+
+                .tab_cont {
+                    .icon {
+                        color: var(--el-color-success);
+                    }
+
+                    .t1 {
+                        color: var(--el-color-success);
+                    }
                 }
             }
 
             &.closed {
-                .tab_title {
+                background-color: $closedColor;
-                    color: #555;
+
+                .tab_cont {
+                    .icon {
+                        color: $closedColor;
                     }
 
-                &.active {
+                    .t1 {
-                    border-color: $closedColor;
+                        color: $closedColor;
+                    }
                 }
             }
 
@@ -293,31 +313,6 @@ onMounted(() => {
                 justify-content: space-between;
                 padding: 0 10px;
                 color: #fff;
-                background-color: #999;
-
-                &.subscribe {
-                    background-color: $subColor;
-                }
-
-                &.closed {
-                    background-color: $closedColor;
-                }
-
-                &.idle {
-                    background-color: $subColor;
-                }
-
-                &.using {
-                    background-color: $usingColor;
-                }
-
-                &.opening {
-                    background-color: var(--primary-color);
-                }
-
-                &.cleaning {
-                    background-color: #999;
-                }
             }
 
             .tab_cont {
@@ -325,9 +320,11 @@ onMounted(() => {
                 display: flex;
                 align-items: center;
                 justify-content: center;
+                background-color: #efefef;
+                border-radius: 4px;
 
                 .icon {
-                    color: #555;
+                    color: var(--primary-color);
                     font-size: 30px;
                     transform: rotate(45deg);
                 }
@@ -341,6 +338,10 @@ onMounted(() => {
                     align-items: center;
                     padding-bottom: 10px;
 
+                    .t1 {
+                        font-weight: bold;
+                    }
+
                     .t2 {
                         font-size: 12px;
                         display: flex;