This commit is contained in:
duan
parent
69d758ab68
commit
14395401db
|
|
@ -595,7 +595,86 @@ export function updateStatus(data) {
|
||||||
data
|
data
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
// 叫号记录
|
||||||
|
export function callRecord(params) {
|
||||||
|
return request({
|
||||||
|
url: `/callTable/callRecord`,
|
||||||
|
method: "get",
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 删除桌型
|
||||||
|
export function callTabledelete(data) {
|
||||||
|
return request({
|
||||||
|
url: `/callTable`,
|
||||||
|
method: "delete",
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
export function callTablepost(data) {
|
||||||
|
return request({
|
||||||
|
url: '/callTable',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 桌型列表
|
||||||
|
export function callTable(params) {
|
||||||
|
return request({
|
||||||
|
url: `/callTable`,
|
||||||
|
method: "get",
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 修改桌号
|
||||||
|
export function callTabledataput(data) {
|
||||||
|
return request({
|
||||||
|
url: `/callTable`,
|
||||||
|
method: "put",
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 叫号列表
|
||||||
|
export function callTablequeue(params) {
|
||||||
|
return request({
|
||||||
|
url: '/callTable/queue',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 取消叫号
|
||||||
|
export function callTableput(data) {
|
||||||
|
return request({
|
||||||
|
url: `/callTable/updateState`,
|
||||||
|
method: "put",
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
|
export function callTabletakeNumber(data) {
|
||||||
|
return request({
|
||||||
|
url: '/callTable/takeNumber',
|
||||||
|
method: 'post',
|
||||||
|
data: {
|
||||||
|
...data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 叫号配置获取
|
||||||
|
export function callTableconfig(params) {
|
||||||
|
return request({
|
||||||
|
url: '/callTable/config',
|
||||||
|
method: 'get',
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 叫号配置修改
|
||||||
|
export function callTableconfigput(data) {
|
||||||
|
return request({
|
||||||
|
url: `/callTable/config`,
|
||||||
|
method: "put",
|
||||||
|
data
|
||||||
|
});
|
||||||
|
}
|
||||||
/**
|
/**
|
||||||
* 员工删除
|
* 员工删除
|
||||||
* @returns
|
* @returns
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,383 @@
|
||||||
|
<template>
|
||||||
|
<div class="basicStyle">
|
||||||
|
<div>
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="140px" label-position="left">
|
||||||
|
<el-form-item label="排队页地址">
|
||||||
|
<span style="color: #999999;">{{ form.pageAddress }}</span>
|
||||||
|
<span @click="copydata">复制</span>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="线上取号">
|
||||||
|
<el-switch v-model="form.isOnline" :active-value="1" :inactive-value="0"></el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="背景图片">
|
||||||
|
<el-image :src="form.bgCover || require('@/assets/images/upload.png')" fit="contain"
|
||||||
|
style="width: 80px;height: 80px;" @click="
|
||||||
|
showUpload = true;
|
||||||
|
uploadIndex = 1;
|
||||||
|
"></el-image>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="桌型">
|
||||||
|
|
||||||
|
<el-button type="primary" @click="showLocation = true; title = '新增'">添加</el-button>
|
||||||
|
<el-table :data="formtable.records" border style="width:50%;margin-top: 20px;">
|
||||||
|
<el-table-column prop="name" label="名称">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="note" label="描述">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="waitTime" label="等待时间「桌」">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="prefix" label="号码前缀">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="start" label="开始号码">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="name" label="操作">
|
||||||
|
<template v-slot="scope">
|
||||||
|
<div style="display: flex;gap: 10px;">
|
||||||
|
<el-button type="text" @click="editPop(scope.row)">编辑</el-button>
|
||||||
|
<el-button type="text" style="color: #FF4D4F;"
|
||||||
|
@click="deleteevnt(scope.row)">删除</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<h2>通知模板</h2>
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="140px" label-position="left">
|
||||||
|
<el-form-item label="排队成功提醒">
|
||||||
|
<el-input v-model="form.successMsg" placeholder="请输入排队成功提醒" disabled
|
||||||
|
style="width: 500px;"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="排队即将排到通知">
|
||||||
|
<el-input v-model="form.nearMsg" placeholder="请输入排队成功提醒" disabled style="width: 500px;"></el-input>
|
||||||
|
<div class="duoshaozhuo">
|
||||||
|
<div>前面等待</div>
|
||||||
|
<el-input v-model="form.nearNum" placeholder="" disabled></el-input>
|
||||||
|
<div>桌时提醒</div>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="排队到号提醒">
|
||||||
|
<el-input v-model="form.callingMsg" placeholder="请输入排队到号提醒" disabled
|
||||||
|
style="width: 500px;"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="submitHandle" :loading="formLoading">
|
||||||
|
<span v-if="!formLoading">保存</span>
|
||||||
|
<span v-else>保存中...</span>
|
||||||
|
</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<el-dialog :title="title" :visible.sync="showLocation" width="500px">
|
||||||
|
<el-form :model="forms" label-width="140px" label-position="left">
|
||||||
|
<el-form-item label="名称">
|
||||||
|
<el-input v-model="forms.name" placeholder="请输入名称"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="描述">
|
||||||
|
<el-input v-model="forms.note" placeholder="如：1-2人"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="等待时间">
|
||||||
|
<el-input v-model="forms.waitTime" placeholder="0">
|
||||||
|
<template slot="append">分钟/1桌</template>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="号码前缀">
|
||||||
|
<el-input v-model="forms.prefix" placeholder="请输入英文字母「不支持中文」"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="开始号码">
|
||||||
|
<el-input v-model="forms.start" placeholder="请输入开始号码"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="过号保留">
|
||||||
|
<el-input v-model="forms.postponeNum" :disabled="!forms.isPostpone" placeholder="请输入名称">
|
||||||
|
<template slot="append">桌</template>
|
||||||
|
<div slot="prepend">
|
||||||
|
<span> <el-checkbox v-model="forms.isPostpone">开启顺延</el-checkbox></span>
|
||||||
|
</div>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="" width="120">
|
||||||
|
<template v-slot="scope">
|
||||||
|
<div style="display: flex;gap: 10px;">
|
||||||
|
<el-button plain @click="showLocation = false; forms = {}">取消</el-button>
|
||||||
|
<el-button type="primary" @click="submitE">确定</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</el-dialog>
|
||||||
|
<el-dialog :visible.sync="showUpload" :close-on-click-modal="false" append-to-body width="500px"
|
||||||
|
@close="showUpload = false">
|
||||||
|
<el-upload :before-remove="handleBeforeRemove" :on-success="handleSuccess" :on-error="handleError"
|
||||||
|
:file-list="fileList" :headers="headers" :action="qiNiuUploadApi" class="upload-demo" multiple>
|
||||||
|
<el-button size="small" type="primary">点击上传</el-button>
|
||||||
|
<div slot="tip" style="display: block;" class="el-upload__tip">
|
||||||
|
请勿上传违法文件，且文件不超过15M
|
||||||
|
</div>
|
||||||
|
</el-upload>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="doSubmit">确认</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getToken } from "@/utils/auth";
|
||||||
|
import crudQiNiu from "@/api/tools/qiniu";
|
||||||
|
import { callTableconfig, callTable, callTableconfigput, callTablepost,callTabledataput, callTabledelete } from "@/api/shop";
|
||||||
|
import { mapGetters } from "vuex";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
computed: {
|
||||||
|
...mapGetters(["qiNiuUploadApi"])
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showLocation: false,
|
||||||
|
showUpload: false,
|
||||||
|
uploadIndex: 1,
|
||||||
|
startTime: "",
|
||||||
|
endTime: "",
|
||||||
|
formLoading: false,
|
||||||
|
form: {},
|
||||||
|
forms: {},
|
||||||
|
formtable: "",
|
||||||
|
rules: {
|
||||||
|
shopName: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: " ",
|
||||||
|
trigger: "blur"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
phone: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: " ",
|
||||||
|
trigger: "blur"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
settleTime: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: " ",
|
||||||
|
trigger: "blur"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
fileList: [],
|
||||||
|
files: [],
|
||||||
|
headers: {
|
||||||
|
Authorization: getToken()
|
||||||
|
},
|
||||||
|
title: ""
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.tbShopInfo();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async editPop(item) {
|
||||||
|
this.forms = item
|
||||||
|
console.log(item, '调试131')
|
||||||
|
console.log(item.isPostpone, '调试131')
|
||||||
|
this.showLocation = true
|
||||||
|
this.title = '编辑'
|
||||||
|
},
|
||||||
|
async deleteevnt(item) {
|
||||||
|
const res = await callTabledelete({
|
||||||
|
shopId: localStorage.getItem("shopId"),
|
||||||
|
callTableId: item.id
|
||||||
|
});
|
||||||
|
this.tbShopInfo()
|
||||||
|
},
|
||||||
|
async submitE() {
|
||||||
|
if (this.title == '新增') {
|
||||||
|
const res = await callTablepost({
|
||||||
|
shopId: localStorage.getItem("shopId"),
|
||||||
|
...this.forms
|
||||||
|
});
|
||||||
|
if (res) {
|
||||||
|
this.showLocation = false
|
||||||
|
this.tbShopInfo()
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
|
||||||
|
console.log(this.forms.nearNum,'调试121')
|
||||||
|
const res = await callTabledataput({
|
||||||
|
shopId: localStorage.getItem("shopId"),
|
||||||
|
...this.forms,
|
||||||
|
callTableId:this.forms.id
|
||||||
|
});
|
||||||
|
if (res) {
|
||||||
|
this.showLocation = false
|
||||||
|
this.tbShopInfo()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取用户详情
|
||||||
|
async tbShopInfo() {
|
||||||
|
try {
|
||||||
|
const res = await callTableconfig({ shopId: localStorage.getItem("shopId") });
|
||||||
|
this.form = res;
|
||||||
|
const data = await callTable({
|
||||||
|
shopId: localStorage.getItem("shopId"),
|
||||||
|
page: 1,
|
||||||
|
size: 10,
|
||||||
|
});
|
||||||
|
this.formtable = data
|
||||||
|
} catch (error) { }
|
||||||
|
},
|
||||||
|
// 保存
|
||||||
|
submitHandle() {
|
||||||
|
this.$refs.form.validate(async valid => {
|
||||||
|
if (valid) {
|
||||||
|
this.formLoading = true;
|
||||||
|
try {
|
||||||
|
// if (this.startTime && this.endTime) {
|
||||||
|
// this.form.businessTime = `${this.startTime}-${this.endTime}`;
|
||||||
|
// }
|
||||||
|
const res = await callTableconfigput(this.form);
|
||||||
|
this.formLoading = false;
|
||||||
|
this.forms = {}
|
||||||
|
this.$notify({
|
||||||
|
title: "成功",
|
||||||
|
message: "提交成功",
|
||||||
|
type: "success"
|
||||||
|
});
|
||||||
|
} catch (error) { }
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleSuccess(response, file, fileList) {
|
||||||
|
// const uid = file.uid
|
||||||
|
// const id = response.id
|
||||||
|
// this.files.push({ uid, id })
|
||||||
|
console.log("上传成功", response);
|
||||||
|
this.files = response.data;
|
||||||
|
this.form.bgCover = response.data[0]
|
||||||
|
},
|
||||||
|
handleBeforeRemove(file, fileList) {
|
||||||
|
for (let i = 0; i < this.files.length; i++) {
|
||||||
|
if (this.files[i].uid === file.uid) {
|
||||||
|
crudQiNiu.del([this.files[i].id]).then(res => { });
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handlePictureCardPreview(file) {
|
||||||
|
this.dialogImageUrl = file.url;
|
||||||
|
this.dialogVisible = true;
|
||||||
|
},
|
||||||
|
// 监听上传失败
|
||||||
|
handleError(e, file, fileList) {
|
||||||
|
const msg = JSON.parse(e.message);
|
||||||
|
this.crud.notify(msg.message, CRUD.NOTIFICATION_TYPE.ERROR);
|
||||||
|
},
|
||||||
|
async copydata(content) {
|
||||||
|
let copyResult = true
|
||||||
|
// 设置想要复制的文本内容
|
||||||
|
const text = this.form.pageAddress || '复制内容为空哦~';
|
||||||
|
// 判断是否支持clipboard方式
|
||||||
|
if (!!window.navigator.clipboard) {
|
||||||
|
// 利用clipboard将文本写入剪贴板（这是一个异步promise）
|
||||||
|
await window.navigator.clipboard.writeText(text).then((res) => {
|
||||||
|
console.log('复制成功');
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log('复制失败--采取第二种复制方案', err);
|
||||||
|
// clipboard方式复制失败 则采用document.execCommand()方式进行尝试
|
||||||
|
copyResult = copyContent2(text)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
// 不支持clipboard方式 则采用document.execCommand()方式
|
||||||
|
copyResult = copyContent2(text)
|
||||||
|
}
|
||||||
|
// 返回复制操作的最终结果
|
||||||
|
// return copyResult;
|
||||||
|
},
|
||||||
|
// 刷新列表数据
|
||||||
|
doSubmit() {
|
||||||
|
this.fileList = [];
|
||||||
|
this.showUpload = false;
|
||||||
|
switch (this.uploadIndex) {
|
||||||
|
case 1:
|
||||||
|
this.form.bgCover = this.files[0];
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
this.form.coverImg = this.files[0];
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
this.form.shopQrcode = this.files[0];
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.basicStyle {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.map_box {
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.map {
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_box {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_wrap {
|
||||||
|
padding: 6px 0;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
padding: 12px 0;
|
||||||
|
|
||||||
|
.left {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding-right: 20px;
|
||||||
|
|
||||||
|
.location {
|
||||||
|
color: #999;
|
||||||
|
padding-top: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.duoshaozhuo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
>input {
|
||||||
|
width: 120px;
|
||||||
|
border: none !important;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
>div {
|
||||||
|
color: #999;
|
||||||
|
width: 118px;
|
||||||
|
height: 33px;
|
||||||
|
line-height: 33px;
|
||||||
|
text-align: center;
|
||||||
|
border: 1px solid #DDDFE6;
|
||||||
|
background-color: #f5f7fa;
|
||||||
|
margin-top: 9px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,447 @@
|
||||||
|
<template>
|
||||||
|
<div class="lineUpBox">
|
||||||
|
<div class="lineUpBoxTop">
|
||||||
|
<ul class="lineUpBoxUl">
|
||||||
|
<li :class="[[selecttopType == '' ? 'active' : '']]" @click="gettypeevent('')">
|
||||||
|
<div>全部</div>
|
||||||
|
<div>{{ tableData.totalCount }}桌</div>
|
||||||
|
<div class="postionStyle" v-if="selecttopType == ''">
|
||||||
|
<i class="el-icon-check postionStyleI"></i>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li v-for="item in tableData.records" :key="item.id" @click="gettypeevent(item.id)"
|
||||||
|
:class="[[selecttopType == item.id ? 'active' : '']]">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div>{{ item.totalCount }}桌</div>
|
||||||
|
<div class="postionStyle" v-if="selecttopType == item.id">
|
||||||
|
<i class="el-icon-check postionStyleI"></i>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div class="buttonstyle">
|
||||||
|
<el-button type="primary" @click="dialogVisibles = true">取号</el-button>
|
||||||
|
<el-button plain type="primary" @click="toUrl">叫号记录</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex;align-items: center;flex-wrap: wrap;justify-content: space-between; ">
|
||||||
|
<div class="lineUpBoxList" v-for="item in list.records" :key="item.id">
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<div>用户</div>
|
||||||
|
<div>{{ item.phone }}</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div>号码</div>
|
||||||
|
<div>{{ item.callNum }}</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div>桌型</div>
|
||||||
|
<div>{{ item.name }}{{ item.note }}</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div>等待</div>
|
||||||
|
<div>{{ item.waitingCount }}桌</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div>
|
||||||
|
<el-button type="primary" @click="dialogConfirm(1, item)">取消</el-button>
|
||||||
|
<el-button type="primary" @click="profilepicture(item)">播报</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 播报弹窗 -->
|
||||||
|
<el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
|
||||||
|
<span>通知消息已发送</span>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button style="" @click="dialogConfirm(2)">完成</el-button>
|
||||||
|
<el-button type="primary" @click="dialogConfirm(3)">过号</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
<!-- 取号 -->
|
||||||
|
<el-dialog title="取号" :visible.sync="dialogVisibles" width="30%">
|
||||||
|
<div>
|
||||||
|
<div style="color: #000;">选择桌型</div>
|
||||||
|
<ul class="lineUpBoxUl" style="margin-top: 10px;">
|
||||||
|
<li v-for="item in tableData.records" :key="item.id" @click="selectTabletype = item"
|
||||||
|
:class="[[selectTabletype.id == item.id ? 'active' : '']]">
|
||||||
|
<div>{{ item.name }}</div>
|
||||||
|
<div>{{ item.totalCount }}桌</div>
|
||||||
|
<div class="postionStyle" v-if="selectTabletype.id == item.id">
|
||||||
|
<i class="el-icon-check postionStyleI"></i>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div style="margin-top: 20px;color: #000;">手机号码</div>
|
||||||
|
<div style="margin-top: 10px;">
|
||||||
|
<input v-model="phone" style="height: 30px;" type="text" placeholder="填写号码" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="callTabletakeNumberEvent">确认取号</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { callTable, callTablequeue, callTableput, callTabletakeNumber } from '@/api/shop'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
query: {
|
||||||
|
productId: '',
|
||||||
|
name: '',
|
||||||
|
categoryId: '',
|
||||||
|
typeEnum: ''
|
||||||
|
},
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
page: 0,
|
||||||
|
size: 30,
|
||||||
|
loading: false,
|
||||||
|
total: 0
|
||||||
|
},
|
||||||
|
selecttopType: "",
|
||||||
|
list: "",
|
||||||
|
dialogVisible: false,
|
||||||
|
dialogVisibles: false,
|
||||||
|
profilepictureInfo: "",
|
||||||
|
phone: "",
|
||||||
|
selectTabletype: ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async mounted() {
|
||||||
|
await this.getlist()
|
||||||
|
await this.getTableData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async callTabletakeNumberEvent() {
|
||||||
|
const res = await callTabletakeNumber({
|
||||||
|
callTableId: this.selectTabletype.id,
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
|
||||||
|
phone: this.phone,
|
||||||
|
note: this.selectTabletype.note,
|
||||||
|
name: this.selectTabletype.name,
|
||||||
|
})
|
||||||
|
if (res.callNum) {
|
||||||
|
this.getTableData()
|
||||||
|
this.getlist()
|
||||||
|
this.dialogVisibles = false
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
profilepicture(d) {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.profilepictureInfo = d
|
||||||
|
},
|
||||||
|
gettypeevent(d) {
|
||||||
|
this.selecttopType = d
|
||||||
|
this.getTableData()
|
||||||
|
this.getlist()
|
||||||
|
|
||||||
|
},
|
||||||
|
async dialogConfirm(value, item) {
|
||||||
|
if (value == 1) {
|
||||||
|
const res = await callTableput({
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
state: -1,
|
||||||
|
callQueueId: item.id
|
||||||
|
})
|
||||||
|
if (res) {
|
||||||
|
this.getTableData()
|
||||||
|
this.getlist()
|
||||||
|
}
|
||||||
|
} else if (value == 2) {
|
||||||
|
const res = await callTableput({
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
state: 1,
|
||||||
|
callQueueId: this.profilepictureInfo.id
|
||||||
|
})
|
||||||
|
if (res) {
|
||||||
|
this.getTableData()
|
||||||
|
this.getlist()
|
||||||
|
this.dialogVisible = false
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
} else if (value == 3) {
|
||||||
|
const res = await callTableput({
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
|
||||||
|
state: 3,
|
||||||
|
callQueueId: this.profilepictureInfo.id
|
||||||
|
})
|
||||||
|
if (res) {
|
||||||
|
this.getTableData()
|
||||||
|
this.getlist()
|
||||||
|
this.dialogVisible = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,
|
||||||
|
toUrl() {
|
||||||
|
this.$router.push({ path: '/lineUp/record' })
|
||||||
|
},
|
||||||
|
// 获取商品列表
|
||||||
|
async getTableData() {
|
||||||
|
try {
|
||||||
|
|
||||||
|
const res = await callTable({
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
page: 1,
|
||||||
|
size: 10,
|
||||||
|
})
|
||||||
|
// this.tableData.loading = false
|
||||||
|
this.tableData = res
|
||||||
|
this.selectTabletype = res.records[0]
|
||||||
|
// this.tableData.total = res.totalElements
|
||||||
|
} catch (error) {
|
||||||
|
console.log(error)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getlist() {
|
||||||
|
const res = await callTablequeue({
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
|
||||||
|
page: 1,
|
||||||
|
size: 9999,
|
||||||
|
callTableId: this.selecttopType,
|
||||||
|
state: 0
|
||||||
|
})
|
||||||
|
this.list = res
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
text-decoration: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul,
|
||||||
|
li {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.show {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hidden {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lineUpBox {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.lineUpBoxTop {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.lineUpBoxUl {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
>li {
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
border: 1px solid #DDDFE6;
|
||||||
|
width: 112px;
|
||||||
|
height: 55px;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 52px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
>div {
|
||||||
|
margin-top: 8px;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
>div:first-child {
|
||||||
|
color: #333333;
|
||||||
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.postionStyle {
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
top: -9px;
|
||||||
|
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border: 14px solid;
|
||||||
|
border-color: #318AFE #318AFE #fff #fff;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.postionStyleI {
|
||||||
|
position: absolute;
|
||||||
|
right: -13px;
|
||||||
|
top: -13px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
border: 2px solid #318AFE;
|
||||||
|
|
||||||
|
>view:first-child {
|
||||||
|
color: #318AFE;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.buttonstyle {
|
||||||
|
>button {
|
||||||
|
height: 31px;
|
||||||
|
|
||||||
|
padding: 5px 16px;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.lineUpBoxList {
|
||||||
|
width: 507px;
|
||||||
|
// flex: 0 0 50%;
|
||||||
|
height: 148px;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 6px 6px 6px 6px;
|
||||||
|
border: 1px solid #DDDFE6;
|
||||||
|
margin-top: 30px;
|
||||||
|
|
||||||
|
|
||||||
|
>ul {
|
||||||
|
padding: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
>li {
|
||||||
|
>div:nth-child(2) {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
>div {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
|
||||||
|
>button {
|
||||||
|
width: 169px;
|
||||||
|
height: 32px;
|
||||||
|
box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.02);
|
||||||
|
border-radius: 1px 1px 1px 1px;
|
||||||
|
border: 1px solid #D9D9D9;
|
||||||
|
}
|
||||||
|
|
||||||
|
>button:first-child {
|
||||||
|
background: #FFFFFF;
|
||||||
|
|
||||||
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #666666;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.lineUpBoxUl {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
>li {
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
border: 1px solid #DDDFE6;
|
||||||
|
width: 112px;
|
||||||
|
height: 55px;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 52px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
>div {
|
||||||
|
margin-top: 8px;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
>div:first-child {
|
||||||
|
color: #333333;
|
||||||
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.postionStyle {
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
top: -9px;
|
||||||
|
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border: 14px solid;
|
||||||
|
border-color: #318AFE #318AFE #fff #fff;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.postionStyleI {
|
||||||
|
position: absolute;
|
||||||
|
right: -13px;
|
||||||
|
top: -13px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
border: 2px solid #318AFE;
|
||||||
|
|
||||||
|
>view:first-child {
|
||||||
|
color: #318AFE;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.handle {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #999;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
cursor: grab;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop_info {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.info {
|
||||||
|
flex: 1;
|
||||||
|
padding-left: 8px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.tag_wrap {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,124 @@
|
||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
|
||||||
|
<div class="head-container">
|
||||||
|
叫号记录
|
||||||
|
</div>
|
||||||
|
<div class="head-container" id="table_drag">
|
||||||
|
<el-table ref="table" :data="tableData.data" v-loading="tableData.loading" row-key="id">
|
||||||
|
<el-table-column label="桌号" prop="callNum"> </el-table-column>
|
||||||
|
<el-table-column label="桌型" prop="typeEnum">
|
||||||
|
<template v-slot="scope">
|
||||||
|
{{ scope.row.name }}({{ scope.row.note }})
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="手机号" prop="phone"> </el-table-column>
|
||||||
|
<el-table-column label="状态">
|
||||||
|
<template v-slot="scope">
|
||||||
|
<span>{{ scope.row.state | stateFilter }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="时间" prop="callTime"> </el-table-column>
|
||||||
|
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="head-container">
|
||||||
|
<el-pagination :total="tableData.total" @size-change="handleSizeChange" :current-page="tableData.page + 1"
|
||||||
|
:page-size="tableData.size" @current-change="paginationChange"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { callRecord, } from '@/api/shop'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
query: {
|
||||||
|
productId: '',
|
||||||
|
name: '',
|
||||||
|
categoryId: '',
|
||||||
|
typeEnum: ''
|
||||||
|
},
|
||||||
|
tableData: {
|
||||||
|
data: [],
|
||||||
|
page: 0,
|
||||||
|
size: 30,
|
||||||
|
loading: false,
|
||||||
|
total: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async mounted() {
|
||||||
|
await this.getTableData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 分页回调
|
||||||
|
// paginationChange(e) {
|
||||||
|
// this.tableData.page = e - 1
|
||||||
|
// this.getTableData()
|
||||||
|
// },
|
||||||
|
// 获取商品列表
|
||||||
|
async getTableData() {
|
||||||
|
try {
|
||||||
|
|
||||||
|
const res = await callRecord({
|
||||||
|
shopId: localStorage.getItem('shopId'),
|
||||||
|
|
||||||
|
page: 1,
|
||||||
|
size: 9999
|
||||||
|
})
|
||||||
|
this.tableData.data = res.records
|
||||||
|
} catch (error) {
|
||||||
|
console.log(error)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// handleSizeChange(val) {
|
||||||
|
// this.tableData.size = val
|
||||||
|
// this.getTableData()
|
||||||
|
// },
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
stateFilter(i) {
|
||||||
|
if (i == -1) {
|
||||||
|
return '已取消'
|
||||||
|
} else if (i == 0) {
|
||||||
|
return '排队中'
|
||||||
|
} else if (i == 1) {
|
||||||
|
return '叫号中'
|
||||||
|
} else if (i == 2) {
|
||||||
|
return '已入座'
|
||||||
|
} else if (i == 3) {
|
||||||
|
return '已过号 '
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.handle {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #999;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
cursor: grab;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shop_info {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.info {
|
||||||
|
flex: 1;
|
||||||
|
padding-left: 8px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.tag_wrap {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue