优化台桌状态

This commit is contained in:
gyq 2025-05-10 15:15:43 +08:00
parent 4d939b2889
commit 2ba61eab19
7 changed files with 113 additions and 105 deletions

View File

@ -404,3 +404,14 @@ export function shopPagePermissionMine(params) {
params,
});
}
/**
* 台桌清台
*/
export function shopTableClear(data) {
return request({
method: "put",
url: "/account/admin/shopTable/clear",
data,
});
}

View File

@ -473,10 +473,10 @@ async function confirmOrder() {
} catch (error) {
console.log(error);
payLoading.value = false;
if (error.code == 1003) {
ElMessage.error(error.msg)
return
}
// if (error.code == 1003) {
// ElMessage.error(error.msg)
// return
// }
if (error.code == 701) {
//
emit('orderExpired')

View File

@ -383,9 +383,9 @@ function reset() {
closeStateTime.value = 5
//
goodsStore.isOrderLock({
table_code: table_code.value
}, 'pay_unlock')
// goodsStore.isOrderLock({
// table_code: table_code.value
// }, 'pay_unlock')
}
defineExpose({

View File

@ -8,6 +8,7 @@ import { useSocket } from "@/store/socket.js";
import useStorage from "@/utils/useStorage.js";
import { formatDecimal } from "@/utils/index.js";
import { shopUserDetail } from "@/api/account.js";
import { ElMessage } from "element-plus";
// 商品store + 购物车store
export const useGoods = defineStore("goods", {
@ -851,14 +852,13 @@ export const useGoods = defineStore("goods", {
this.operateCart(data, operate_type);
socket.ws.addEventListener("message", (e) => {
let data = JSON.parse(e.data);
console.log("isOrderLock===", data);
if (data.operate_type == "search_pay_lock") {
if (data.status == 0) {
reject({
code: 1003,
msg: "其他用户正在支付该订单,请稍后再试!",
ElMessage({
message: "其他用户正在支付该订单,请稍后再试!",
type: "warning",
});
reject();
} else {
resolve();
}

View File

@ -13,9 +13,9 @@
<el-icon class="icon">
<Clock />
</el-icon>
<span class="t">{{ status[props.tableInfo.status] }}</span>
<span class="t">{{tableStatusList.find(val => val.type == props.tableInfo.status).label}}</span>
</div>
<div class="cart" v-loading="payLoading" v-if="props.tableInfo.status == 'using'">
<div class="cart" v-loading="payLoading" v-if="props.tableInfo.status == 'unsettled'">
<div class="cart_list">
<div class="item" v-for="item in cartList" :key="item.id">
<div class="top">
@ -42,7 +42,8 @@
</div>
<div class="place_order" v-else>
<div class="btn">
<div class="top">
<div class="top"
:style="{ '--color': tableStatusList.find(val => val.type == props.tableInfo.status).color }">
<el-icon class="icon">
<TakeawayBox />
</el-icon>
@ -52,7 +53,7 @@
<div class="btn_wrap" v-if="props.tableInfo.status == 'idle'">
<el-button type="primary" style="width: 100%;" @click="showPeopleNumHandle">开始新订单</el-button>
</div>
<div class="btn_wrap" v-if="props.tableInfo.status == 'cleaning'">
<div class="btn_wrap" v-if="props.tableInfo.status == 'settled'">
<el-button type="primary" style="width: 100%;" @click="clearTableStatus">清理完成</el-button>
</div>
</div>
@ -87,9 +88,10 @@ import { useUser } from "@/store/user.js"
import { formatDecimal } from '@/utils/index.js'
import SettleAccount from '@/views/home/components/settleAccount.vue'
import { ElMessage } from 'element-plus'
import { clearTable } from '@/api/table.js'
import { shopTableClear } from '@/api/account.js'
import { useGoods } from "@/store/goods.js";
import { getOrderByIdAjax } from '@/utils/index.js'
import tableStatusList from '../statusList.js'
const goodsStore = useGoods()
const router = useRouter()
@ -121,16 +123,6 @@ function inputFocus() {
const orderInfo = ref({})
const cartList = ref([])
const status = ref({
'subscribe': '预定',
'closed': '关台',
'idle': '空闲',
'using': '开台中',
'pending': '挂单中',
'paying': '结算中',
'cleaning': '台桌清理中'
})
const payLoading = ref(false)
//
@ -164,15 +156,14 @@ const clearLoading = ref(false)
async function clearTableStatus() {
try {
clearLoading.value = true
const res = await clearTable({
shopId: store.userInfo.shopId,
tableId: props.tableInfo.qrcode
await shopTableClear({
tableId: props.tableInfo.id
})
clearLoading.value = false
emits('success')
} catch (error) {
console.log(error);
}
clearLoading.value = false
}
//
@ -188,6 +179,13 @@ async function getOrderDetail() {
orderInfo.value = res
cartList.value = res.cartList
let total = 0
res.cartList.forEach(item => {
total += item.payAmount * item.num
})
orderInfo.value.orderAmount = formatDecimal(total)
}
} catch (error) {
payLoading.value = false
@ -387,7 +385,7 @@ onMounted(() => {
$size: 150px;
.top {
background-color: var(--el-color-danger);
background-color: #fff;
width: $size;
height: $size;
display: flex;
@ -397,7 +395,7 @@ onMounted(() => {
border-radius: 6px;
.icon {
color: #fff;
color: var(--color);
font-size: 40px;
}

View File

@ -22,8 +22,8 @@
</div>
<div class="overflow_y" v-loading="loading">
<div class="tab_list">
<div class="item"
:class="{ active: tableItemActive == index, using: item.status == 'using', closed: item.status == 'closed' }"
<div class="item" :class="{ active: tableItemActive == index }"
:style="{ '--color': tableStatusList.find(val => val.type == item.status).color }"
v-for="(item, index) in tableList" :key="item.id" @click="slectTableHandle(index, item)">
<div class="tab_title" :class="`${item.status}`">
<span>{{ item.name }}</span>
@ -71,6 +71,7 @@ import countCard from '@/views/table/components/countCard.vue'
import tableInfo from '@/views/table/components/tableInfo.vue'
import { ref, onMounted } from 'vue'
import { dayjs } from 'element-plus'
import tableStatusList from './statusList.js'
const tabActive = ref(0)
const tabAreas = ref([
@ -84,12 +85,16 @@ const tabAreas = ref([
},
{
label: '使用中',
type: 'using'
type: 'unsettled'
},
// {
// label: '',
// type: 3,
// }
{
label: '待清理',
type: 'settled',
},
{
label: '已预订',
type: 'subscribe',
}
])
const query = ref({
@ -268,50 +273,24 @@ onMounted(() => {
gap: 10px;
.item {
$closedColor: #aeb8c9;
border-radius: 6px;
overflow: hidden;
padding: 2px;
background-color: var(--primary-color);
background-color: var(--color);
&.active {
background-color: var(--primary-color);
.tab_cont {
.icon {
color: var(--primary-color);
}
.t1 {
color: var(--primary-color);
}
}
}
&.using {
background-color: var(--el-color-success);
.tab_cont {
.icon {
color: var(--el-color-success);
}
.t1 {
color: var(--el-color-success);
}
}
}
&.closed {
background-color: $closedColor;
.tab_cont {
.icon {
color: $closedColor;
}
.t1 {
color: $closedColor;
position: relative;
&::before {
content: "";
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-color: var(--color);
opacity: .2;
z-index: 1;
}
}
}
@ -334,38 +313,16 @@ onMounted(() => {
display: flex;
align-items: center;
justify-content: center;
background-color: #efefef;
background-color: #fff;
border-radius: 4px;
position: relative;
.icon {
color: var(--primary-color);
color: var(--color);
font-size: 30px;
transform: rotate(45deg);
}
.using {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-bottom: 10px;
.t1 {
font-weight: bold;
}
.t2 {
font-size: 12px;
display: flex;
align-items: center;
margin-top: 2px;
span {
margin-left: 4px;
}
}
position: relative;
z-index: 2
}
}
}

View File

@ -0,0 +1,42 @@
export default [
{
label: "未绑定",
type: "unbound",
color: "#909090",
},
{
label: "空闲",
type: "idle",
color: "#187CAA",
},
{
label: "点餐中",
type: "ordering",
color: "#46AEA4",
},
{
label: "未结账",
type: "unsettled",
color: "#DD3F41",
},
{
label: "支付中",
type: "paying",
color: "#909090",
},
{
label: "待清台",
type: "settled ",
color: "#FF9500",
},
{
label: "关台",
type: "closed",
color: "#DDDDDD",
},
{
label: "预定",
type: "subscribe",
color: "#58B22C",
},
];