add: 优化
This commit is contained in:
parent
5cd5265ffb
commit
e69e0e7aa0
|
|
@ -7,14 +7,14 @@ VITE_APP_BASE_API=/dev-api
|
|||
# 接口地址
|
||||
|
||||
# VITE_APP_API_URL=https://tapi.cashier.sxczgkj.cn/ # 测试
|
||||
# VITE_APP_API_URL=https://cashier.sxczgkj.com/ # 正式
|
||||
VITE_APP_API_URL=http://192.168.1.42/ # 本地
|
||||
VITE_APP_API_URL=https://cashier.sxczgkj.com/ # 正式
|
||||
# VITE_APP_API_URL=http://192.168.1.42/ # 本地
|
||||
|
||||
|
||||
# WebSocket 端点(不配置则关闭),线上 ws://api.youlai.tech/ws ,本地 ws://localhost:8989/ws
|
||||
# VITE_APP_WS_ENDPOINT=wss://sockets.sxczgkj.com/wss
|
||||
# VITE_APP_WS_ENDPOINT=wss://czgeatws.sxczgkj.com/wss # 正式
|
||||
VITE_APP_WS_ENDPOINT=ws://192.168.1.42:2348 # 本地
|
||||
VITE_APP_WS_ENDPOINT=wss://czgeatws.sxczgkj.com/wss # 正式
|
||||
# VITE_APP_WS_ENDPOINT=ws://192.168.1.42:2348 # 本地
|
||||
|
||||
|
||||
# 启用 Mock 服务
|
||||
|
|
|
|||
|
|
@ -2,7 +2,12 @@
|
|||
<div class="app-container">
|
||||
<el-tabs v-model="tableArea.tabsSel" type="card" @tab-click="tabClick">
|
||||
<el-tab-pane label="全部" name="" />
|
||||
<el-tab-pane v-for="item in tableArea.tabs" :key="item.id" :label="item.name" :name="`${item.id}`">
|
||||
<el-tab-pane
|
||||
v-for="item in tableArea.tabs"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:name="`${item.id}`"
|
||||
>
|
||||
<template #label>
|
||||
<div class="">
|
||||
<span>
|
||||
|
|
@ -29,14 +34,19 @@
|
|||
<el-button type="primary" icon="download" @click="showDownloadTableCode">
|
||||
下载桌台码
|
||||
</el-button>
|
||||
<el-button type="primary" icon="download" @click="downloadShopCpde">下载店铺码</el-button>
|
||||
<el-button type="primary" icon="download" @click="downloadShopCpde">
|
||||
下载店铺码
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div class="u-flex u-p-b-15 u-font-14 u-m-t-16">
|
||||
<div v-for="(item, key) in status" :key="key" class="state u-m-r-24">
|
||||
<span class="dot" :style="{
|
||||
<span
|
||||
class="dot"
|
||||
:style="{
|
||||
backgroundColor: status[key] ? status[key].type : '',
|
||||
}" />
|
||||
}"
|
||||
/>
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -44,8 +54,14 @@
|
|||
<!-- 列表 -->
|
||||
<div class="head-container">
|
||||
<div v-loading="loading" class="table_list">
|
||||
<div v-for="item in tableList" :key="item.id" class="item"
|
||||
:style="{ 'background-color': status[item.status] ? status[item.status].type : '' }">
|
||||
<div
|
||||
v-for="item in tableList"
|
||||
:key="item.id"
|
||||
class="item"
|
||||
:style="{
|
||||
'background-color': status[item.status] ? status[item.status].type : '',
|
||||
}"
|
||||
>
|
||||
<div class="new-top flex u-row-between">
|
||||
<div class="u-flex u-flex-1 u-p-r-10">
|
||||
<span class="name u-line-1" style="max-width: 50px">
|
||||
|
|
@ -64,7 +80,10 @@
|
|||
<el-dropdown-item command="edit">
|
||||
<span>编辑</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="bindTableCode" v-if="envName !== 'production'">
|
||||
<el-dropdown-item
|
||||
command="bindTableCode"
|
||||
v-if="envName !== 'production'"
|
||||
>
|
||||
<span>绑定桌码</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="del">
|
||||
|
|
@ -76,16 +95,27 @@
|
|||
</div>
|
||||
<div class="box">
|
||||
<div class="top">
|
||||
<div v-if="item.status == 'subscribe'">
|
||||
<div v-if="item.status == 'subscribe' && item.bookingInfo">
|
||||
<div class="row row1" style="align-items: flex-start">
|
||||
<span style="font-size: 14px; color: #333">
|
||||
{{ item.bookingInfo.createUserName }}订{{ item.bookingInfo.bookingPerson }}「{{
|
||||
item.bookingInfo.gender == 1 ? "先生" : "女士"
|
||||
}}」
|
||||
{{ item.bookingInfo.createUserName }}订{{
|
||||
item.bookingInfo.bookingPerson
|
||||
}}「{{ item.bookingInfo.gender == 1 ? "先生" : "女士" }}」
|
||||
</span>
|
||||
<div class="state" style="font-size: 12px; color: #666; display: flex; align-items: center">
|
||||
<img style="width: 16px; height: 16px; filter: contrast(0.5)" src="@/assets/images/perpole.png"
|
||||
alt="" />
|
||||
<div
|
||||
class="state"
|
||||
style="
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<img
|
||||
style="width: 16px; height: 16px; filter: contrast(0.5)"
|
||||
src="@/assets/images/perpole.png"
|
||||
alt=""
|
||||
/>
|
||||
|
||||
{{ item.bookingInfo.bookingTime.substring(11, 19) }}
|
||||
</div>
|
||||
|
|
@ -98,41 +128,71 @@
|
|||
</div>
|
||||
|
||||
<div v-else class="u-font-18 font-600 total-price">
|
||||
<span v-if="item.status == 'using'" class="cur-pointer" @click="diancanShow(item, 'isAddGoods')">
|
||||
<span
|
||||
v-if="item.status == 'using'"
|
||||
class="cur-pointer"
|
||||
@click="diancanShow(item, 'isAddGoods')"
|
||||
>
|
||||
¥{{ item.totalAmount || 0 }}「{{ item.productNum }}件」
|
||||
</span>
|
||||
<!-- <span v-else class="color-fff">|</span> -->
|
||||
</div>
|
||||
<div class="row btn-group" style="margin-top: 10px">
|
||||
<template v-if="item.status == 'subscribe'">
|
||||
<el-button type="success" :disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="markStatus(item, -1)">
|
||||
<el-button
|
||||
type="success"
|
||||
:disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="markStatus(item, -1)"
|
||||
>
|
||||
取消预约
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-if="item.status == 'subscribe' && item.bookingInfo.status == 20">
|
||||
<el-button type="success" :disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="markStatus(item, 10)">
|
||||
<template
|
||||
v-if="
|
||||
item.status == 'subscribe' &&
|
||||
item.bookingInfo &&
|
||||
item.bookingInfo.status == 20
|
||||
"
|
||||
>
|
||||
<el-button
|
||||
type="success"
|
||||
:disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="markStatus(item, 10)"
|
||||
>
|
||||
到店
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-if="
|
||||
<template
|
||||
v-if="
|
||||
item.status == 'idle' ||
|
||||
(item.status == 'subscribe' && item.bookingInfo.status == 10)
|
||||
">
|
||||
<el-button type="primary" :disabled="!item.tableCode || item.status === 'closed'"
|
||||
@click="diancanShow(item)">
|
||||
(item.status == 'subscribe' &&
|
||||
item.bookingInfo &&
|
||||
item.bookingInfo.status == 10)
|
||||
"
|
||||
>
|
||||
<el-button
|
||||
type="primary"
|
||||
:disabled="!item.tableCode || item.status === 'closed'"
|
||||
@click="diancanShow(item)"
|
||||
>
|
||||
点餐
|
||||
</el-button>
|
||||
</template>
|
||||
<template v-else-if="item.status != 'idle' && item.status != 'subscribe'">
|
||||
<template
|
||||
v-else-if="item.status != 'idle' && item.status != 'subscribe'"
|
||||
>
|
||||
<template v-if="item.status == 'using'">
|
||||
<el-button :disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="diancanShow(item, 'isAddGoods')">
|
||||
<el-button
|
||||
:disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="diancanShow(item, 'isAddGoods')"
|
||||
>
|
||||
加菜
|
||||
</el-button>
|
||||
<el-button type="danger" :disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="diancanShow(item, 'isPayOrder')">
|
||||
<el-button
|
||||
type="danger"
|
||||
:disabled="!item.tableId || item.status === 'closed'"
|
||||
@click="diancanShow(item, 'isPayOrder')"
|
||||
>
|
||||
结账
|
||||
</el-button>
|
||||
</template>
|
||||
|
|
@ -140,10 +200,13 @@
|
|||
<el-button type="info" disabled>已关台</el-button>
|
||||
</template>
|
||||
<template v-else-if="item.status == 'cleaning'">
|
||||
<el-button type="info" :style="{
|
||||
<el-button
|
||||
type="info"
|
||||
:style="{
|
||||
backgroundColor: status[item.status].type,
|
||||
borderColor: status[item.status].type,
|
||||
}">
|
||||
}"
|
||||
>
|
||||
清理中
|
||||
</el-button>
|
||||
</template>
|
||||
|
|
@ -153,18 +216,29 @@
|
|||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="u-flex u-col-bottom bottom u-row-between color-666"
|
||||
:class="{ 'opacity-0': item.status == 'closed' }">
|
||||
<div
|
||||
class="u-flex u-col-bottom bottom u-row-between color-666"
|
||||
:class="{ 'opacity-0': item.status == 'closed' }"
|
||||
>
|
||||
<div class="u-flex u-col-center">
|
||||
<img style="width: 16px; height: 16px; filter: contrast(0.5)" src="@/assets/images/perpole.png"
|
||||
alt="" />
|
||||
<img
|
||||
style="width: 16px; height: 16px; filter: contrast(0.5)"
|
||||
src="@/assets/images/perpole.png"
|
||||
alt=""
|
||||
/>
|
||||
<span class="u-m-t-4 u-font-12 u-m-l-2">
|
||||
{{ item.useNum || 0 }}/{{ item.maxCapacity }}
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="item.status == 'using'" class="u-flex">
|
||||
<img style="width: 16px; height: 16px; filter: contrast(0.5)" src="@/assets/images/shalou.png" alt="" />
|
||||
<span class="u-m-t-4 u-font-12">{{ formatTime(item.durationTime) }}</span>
|
||||
<img
|
||||
style="width: 16px; height: 16px; filter: contrast(0.5)"
|
||||
src="@/assets/images/shalou.png"
|
||||
alt=""
|
||||
/>
|
||||
<span class="u-m-t-4 u-font-12">
|
||||
{{ formatTime(item.durationTime) }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -224,7 +298,7 @@ function formatTime(milliseconds) {
|
|||
return `${days ? days + "天" : ""} ${hours ? hours + "时" : ""} ${minutes + "分"}`;
|
||||
}
|
||||
|
||||
function downloadTableCpde() { }
|
||||
function downloadTableCpde() {}
|
||||
function downloadShopCpde() {
|
||||
try {
|
||||
const link = document.createElement("a");
|
||||
|
|
@ -267,7 +341,7 @@ function tableComman(command, item) {
|
|||
ElMessage.success("删除成功");
|
||||
tableInit();
|
||||
})
|
||||
.catch(() => { });
|
||||
.catch(() => {});
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
|
@ -343,7 +417,7 @@ function init() {
|
|||
areainit();
|
||||
tableInit();
|
||||
}
|
||||
onMounted(() => { });
|
||||
onMounted(() => {});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
Loading…
Reference in New Issue