增加代客下单功能
This commit is contained in:
parent
3b12a2ba06
commit
4977dcb76b
177
src/api/table.js
177
src/api/table.js
|
|
@ -118,3 +118,180 @@ export function summaryTableDownload(data) {
|
|||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取当前台桌订单信息
|
||||
* @returns
|
||||
*/
|
||||
export function getCart(params) {
|
||||
return request({
|
||||
url: `/api/place/cart`,
|
||||
method: "get",
|
||||
params:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...params
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 已上架商品列表
|
||||
* @returns
|
||||
*/
|
||||
export function getGoodsLists(params) {
|
||||
return request({
|
||||
url: `/api/place/activate`,
|
||||
method: "get",
|
||||
params:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...params
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 点单
|
||||
* @returns
|
||||
*/
|
||||
export function addCart(data) {
|
||||
return request({
|
||||
url: `/api/place/addCart`,
|
||||
method: "post",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 清空购物车/支付订单
|
||||
* @returns
|
||||
*/
|
||||
export function $clearCart(data) {
|
||||
return request({
|
||||
url: `/api/place/clearCart`,
|
||||
method: "delete",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除购物车某个商品
|
||||
* @returns
|
||||
*/
|
||||
export function $removeCart(data) {
|
||||
return request({
|
||||
url: `/api/place/removeCart`,
|
||||
method: "delete",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 更新规格
|
||||
* @returns
|
||||
*/
|
||||
export function $updateCart(data) {
|
||||
return request({
|
||||
url: `/api/place/updateCart`,
|
||||
method: "put",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 批量打包
|
||||
* @returns
|
||||
*/
|
||||
export function $allPack(data) {
|
||||
return request({
|
||||
url: `/api/place/pack`,
|
||||
method: "put",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 获取取餐号
|
||||
* @returns
|
||||
*/
|
||||
export function $getMasterId(data) {
|
||||
return request({
|
||||
url: `/api/place/masterId`,
|
||||
method: "get",
|
||||
params:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 支付方式获取
|
||||
* @returns
|
||||
*/
|
||||
export function $getPayType(data) {
|
||||
return request({
|
||||
url: `/api/place/payType`,
|
||||
method: "get",
|
||||
params:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 创建订单
|
||||
* @returns
|
||||
*/
|
||||
export function $createOrder(data) {
|
||||
return request({
|
||||
url: `/api/place/order`,
|
||||
method: "post",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 挂起订单
|
||||
* @returns
|
||||
*/
|
||||
export function $cacheOrder(data) {
|
||||
return request({
|
||||
url: `/api/place/pending`,
|
||||
method: "post",
|
||||
data:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取已挂起订单
|
||||
* @returns
|
||||
*/
|
||||
export function $getCacheOrder(data) {
|
||||
return request({
|
||||
url: `/api/place/car`,
|
||||
method: "get",
|
||||
params:{
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
...data
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,285 @@
|
|||
<template>
|
||||
<el-dialog title="选择用户" width="850px" :visible.sync="show">
|
||||
<div class="app-container">
|
||||
<div class="head-container">
|
||||
<el-form :model="query" inline>
|
||||
<el-form-item label="">
|
||||
<el-input
|
||||
v-model="query.name"
|
||||
placeholder="请输入昵称或手机号"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="是否为会员">
|
||||
<el-select v-model="query.isVip" placeholder="是否是会员">
|
||||
<el-option value="" label="全部"></el-option>
|
||||
<el-option :value="1" label="是"></el-option>
|
||||
<el-option :value="0" label="否"></el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<div class="flex gap-20">
|
||||
<el-button type="success" @click="getTableData" size="medium"
|
||||
>搜索</el-button
|
||||
>
|
||||
<!-- <el-button @click="resetHandle" size="medium">重置</el-button> -->
|
||||
<el-button @click="noChooseUser" size="medium"
|
||||
>不选择用户</el-button
|
||||
>
|
||||
<!-- <el-button @click="resetHandle" size="medium">新建用户</el-button> -->
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<!-- <div class="head-container">
|
||||
<el-button type="primary" icon="el-icon-plus" @click="$refs.addActive.show()">
|
||||
添加活动
|
||||
</el-button>
|
||||
</div> -->
|
||||
|
||||
<div class="head-container">
|
||||
<el-table :data="tableData.data" v-loading="tableData.loading">
|
||||
<el-table-column label="ID" prop="id"></el-table-column>
|
||||
<el-table-column label="用户" prop="headImg" width="200px">
|
||||
<template v-slot="scope">
|
||||
<div class="user_info">
|
||||
<el-image
|
||||
:src="scope.row.headImg"
|
||||
style="width: 40px; height: 40px; flex-shrink: 0"
|
||||
>
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-user"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
<span class="name">{{ scope.row.nickName }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="手机号"
|
||||
prop="telephone"
|
||||
width="160"
|
||||
></el-table-column>
|
||||
<!-- <el-table-column label="性别" prop="sex">
|
||||
<template v-slot="scope">
|
||||
<el-tag type="priamry">{{ scope.row.sex || "未知" }}</el-tag>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column label="会员" prop="isVip">
|
||||
<template v-slot="scope">
|
||||
<el-tag type="warning" v-if="scope.row.isVip"
|
||||
>会员等级{{ scope.row.isVip }}</el-tag
|
||||
>
|
||||
<span v-else>否</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="余额" prop="amount"></el-table-column>
|
||||
<el-table-column label="积分" prop="totalScore"></el-table-column>
|
||||
|
||||
<el-table-column label="操作" width="90" fixed="right">
|
||||
<template v-slot="scope">
|
||||
<el-button type="text" @click="choose(scope.row)">选择</el-button>
|
||||
<el-button type="text" @click="charge(scope.row)">充值</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-pagination
|
||||
:total="tableData.total"
|
||||
:current-page="tableData.page + 1"
|
||||
:page-size="tableData.size"
|
||||
@size-change="sizeChange"
|
||||
@current-change="paginationChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { queryAllShopUser, queryAllShopInfo } from "@/api/shop";
|
||||
import dayjs from "dayjs";
|
||||
let cacheData = {};
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
query: {
|
||||
name: "",
|
||||
},
|
||||
shopInfo: {
|
||||
balanceTotal: 0,
|
||||
userTotal: 0,
|
||||
chageTotal: 0,
|
||||
},
|
||||
tableData: {
|
||||
data: [],
|
||||
page: 0,
|
||||
size: 10,
|
||||
loading: false,
|
||||
total: 0,
|
||||
},
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
timeFilter(s) {
|
||||
return dayjs(s).format("YYYY-MM-DD HH:mm:ss");
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
cacheData = { ...this.query };
|
||||
this.getTableData();
|
||||
this.getShopInfo();
|
||||
},
|
||||
methods: {
|
||||
noChooseUser(){
|
||||
this.$emit("chooseUser",null)
|
||||
this.close()
|
||||
|
||||
},
|
||||
choose(user) {
|
||||
this.$emit("chooseUser",user)
|
||||
this.close()
|
||||
|
||||
},
|
||||
charge(user) {
|
||||
console.log(user);
|
||||
},
|
||||
close(){
|
||||
this.show = false;
|
||||
},
|
||||
open() {
|
||||
this.show = true;
|
||||
},
|
||||
toPage(type) {
|
||||
const pages = {
|
||||
charge: "charge_list",
|
||||
cost: "cost_list",
|
||||
};
|
||||
this.$router.push({
|
||||
name: pages[type],
|
||||
});
|
||||
console.log(pages[type]);
|
||||
},
|
||||
// 获取商家用户概述信息
|
||||
async getShopInfo() {
|
||||
try {
|
||||
const res = await queryAllShopInfo(this.query);
|
||||
this.shopInfo = res;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
sizeChange() {
|
||||
this.tableData.page = 0;
|
||||
this.getTableData();
|
||||
},
|
||||
// 切换状态
|
||||
async statusChange(e, row) {
|
||||
try {
|
||||
this.tableData.loading = true;
|
||||
const data = { ...row };
|
||||
data.status = e;
|
||||
await modityActivate(data);
|
||||
this.getTableData();
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
this.tableData.loading = false;
|
||||
}
|
||||
},
|
||||
// 重置查询
|
||||
resetHandle() {
|
||||
this.query.name = "";
|
||||
this.getTableData();
|
||||
},
|
||||
// 分页回调
|
||||
paginationChange(e) {
|
||||
this.tableData.page = e - 1;
|
||||
this.getTableData();
|
||||
},
|
||||
// 获取商品列表
|
||||
async getTableData() {
|
||||
this.tableData.loading = true;
|
||||
try {
|
||||
const res = await queryAllShopUser({
|
||||
...this.query,
|
||||
size: this.tableData.size,
|
||||
page: this.tableData.page + 1,
|
||||
});
|
||||
this.tableData.loading = false;
|
||||
this.tableData.data = res.content;
|
||||
this.tableData.total = res.totalElements;
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.user_info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.name {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
::v-deep .el-input--small .el-input__inner{
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
::v-deep .image-slot {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #efefef;
|
||||
font-size: 20px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: #f5f5f5;
|
||||
padding: 0 14px;
|
||||
|
||||
.title {
|
||||
font-size: 22px;
|
||||
padding-top: 14px;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
padding: 20px 0;
|
||||
|
||||
.item {
|
||||
flex: 1;
|
||||
|
||||
.t {
|
||||
text-align: center;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.n {
|
||||
color: #000;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
padding-top: 6px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.flex{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.gap-20{
|
||||
gap: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -0,0 +1,295 @@
|
|||
<template>
|
||||
<div class="simple-Keyboard-number">
|
||||
<div class="carts">
|
||||
<div class="box_status">{{ number }}</div>
|
||||
<div class="number_list_box">
|
||||
<div class="yd-keyboard">
|
||||
<div class="mini-number-box1">
|
||||
<div class="mini-number">
|
||||
<div class="key-line">
|
||||
<div class="key" @click="keyboradAdd('1')">1</div>
|
||||
<div class="key" @click="keyboradAdd('2')">2</div>
|
||||
<div class="key" @click="keyboradAdd('3')">3</div>
|
||||
</div>
|
||||
<div class="key-line">
|
||||
<div class="key" @click="keyboradAdd('4')">4</div>
|
||||
<div class="key" @click="keyboradAdd('5')">5</div>
|
||||
<div class="key" @click="keyboradAdd('6')">6</div>
|
||||
</div>
|
||||
<div class="key-line">
|
||||
<div class="key" @click="keyboradAdd('7')">7</div>
|
||||
<div class="key" @click="keyboradAdd('8')">8</div>
|
||||
<div class="key" @click="keyboradAdd('9')">9</div>
|
||||
</div>
|
||||
<div class="key-line">
|
||||
<div class="key"></div>
|
||||
<div class="key" @click="keyboradAdd('0')">0</div>
|
||||
<div
|
||||
class="key"
|
||||
style="font-size: 31px"
|
||||
@click="keyboradReduce"
|
||||
>
|
||||
<svg
|
||||
t="1723453480343"
|
||||
class="icon"
|
||||
viewBox="0 0 1664 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="1467"
|
||||
width="32"
|
||||
height="32"
|
||||
>
|
||||
<path
|
||||
d="M1526.08 1.6H459.84L41.28 416c-53.76 53.248-53.76 139.52 0 192.64l418.624 414.592v-0.064h1066.176a136.96 136.96 0 0 0 137.6-136.256V137.792a136.96 136.96 0 0 0-137.6-136.192z m-331.392 631.168c26.816 26.624 26.816 69.76 0 96.384-26.88 26.56-70.4 26.56-97.28 0l-121.28-120.128-123.328 122.112a69.76 69.76 0 0 1-97.92 0 68.096 68.096 0 0 1 0-96.96L878.208 512l-121.28-120.064a67.648 67.648 0 0 1 0-96.32c26.88-26.624 70.4-26.624 97.28 0l121.216 120.064 122.24-120.96a69.696 69.696 0 0 1 97.92 0 68.032 68.032 0 0 1 0 96.96l-122.24 120.96 121.344 120.064z"
|
||||
fill="#333333"
|
||||
p-id="1468"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="showConfirm">
|
||||
<div class="submit" @click="keyboradConfirm">确认</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
isCanEmpty: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
showConfirm: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
number: 0,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
number(newval) {
|
||||
this.$emit("input", newval);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
keyboradAdd(n) {
|
||||
if (Number(this.number) == 0) {
|
||||
return (this.number = n);
|
||||
}
|
||||
this.number += n;
|
||||
},
|
||||
keyboradReduce() {
|
||||
if (this.number.length <= 1) {
|
||||
return (this.number =this.isCanEmpty?'': "0");
|
||||
}
|
||||
this.number = this.number.substring(0, this.number.length - 1);
|
||||
},
|
||||
keyboradConfirm() {
|
||||
this.$emit("confirm", this.number);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.number = `${this.value}`;
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.yd-keyboard {
|
||||
justify-content: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.mini-number-box1 .mini-number,
|
||||
.yd-keyboard {
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.mini-number-box1 .mini-number {
|
||||
border: 1px solid #dcdfe6;
|
||||
}
|
||||
|
||||
.mini-number-box1 .mini-number .key-line {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.mini-number-box1 .mini-number .key {
|
||||
width: 122px;
|
||||
height: 60px;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
border-radius: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
.mini-number-box1 .mini-number .key:hover {
|
||||
background-color: #dcdfe6;
|
||||
}
|
||||
.mini-number-box1 .mini-number .key:not(:last-child) {
|
||||
border-right: 1px solid #dcdfe6;
|
||||
}
|
||||
|
||||
.mini-number-box1 .mini-number .key-line:not(:last-child) {
|
||||
border-bottom: 1px solid #dcdfe6;
|
||||
}
|
||||
|
||||
.mini-number-box2 {
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.mini-number-box2 .key {
|
||||
width: 80px;
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.mini-number-box2 .function-button {
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.mini-number-box2 .function-button .key {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.key-line {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.key,
|
||||
.key-line {
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.key {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
background: #fff;
|
||||
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.10196078431372549);
|
||||
border-radius: 4px;
|
||||
|
||||
align-items: center;
|
||||
margin-left: 8px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
text-align: center;
|
||||
line-height: 34px;
|
||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.10196078431372549);
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.simple-Keyboard-number,
|
||||
.simple-Keyboard-weight {
|
||||
min-width: 410px;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.submit {
|
||||
width: 366px;
|
||||
height: 44px;
|
||||
background: #22bf64;
|
||||
border-radius: 2px;
|
||||
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-weight: 400;
|
||||
margin-bottom: 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.disabled-box {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.carts {
|
||||
flex-direction: column;
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.carts .title,
|
||||
.carts {
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.carts .title {
|
||||
justify-content: space-between;
|
||||
height: 64px;
|
||||
border-bottom: 1px solid #ebebeb;
|
||||
padding: 20px;
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.carts .title .left {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-weight: 500;
|
||||
font-size: 18px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.carts .title .right {
|
||||
font-size: 14.4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.carts .box_status {
|
||||
margin-bottom: 20px;
|
||||
width: 370px;
|
||||
height: 58px;
|
||||
background: #fff;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 4px;
|
||||
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
font-family: MicrosoftYaHei;
|
||||
font-size: 20px;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
letter-spacing: 1.25px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.carts .box_status span {
|
||||
padding: 0 5px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
export const orderBtns=[
|
||||
{
|
||||
text: "删除",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "规格",
|
||||
disabled: true,
|
||||
},
|
||||
{
|
||||
text: "菜品打折",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "赠菜",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "赠菜",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "打包",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "等叫",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "整单等叫",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "单品备注",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "退菜",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "附加费",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "存单",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "取单",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "修改价格",
|
||||
disabled: false,
|
||||
},
|
||||
{
|
||||
text: "撤单",
|
||||
disabled: false,
|
||||
}
|
||||
]
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="title">选择支付方式</div>
|
||||
<div class="btn_group">
|
||||
<div class="price_select">
|
||||
<div class="pay_btns">
|
||||
<el-button
|
||||
size="medium"
|
||||
@click="changeSel(item)"
|
||||
v-for="(item, index) in list"
|
||||
:key="index"
|
||||
:type="sel === item.payType ? 'success' : ''"
|
||||
>
|
||||
{{ item.payName }}
|
||||
</el-button>
|
||||
<!-- <el-button size="medium"> 余额支付 </el-button>
|
||||
<el-button size="medium"> 现金支付 </el-button>
|
||||
<el-button size="medium"> 挂账 </el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { $getPayType } from "@/api/table";
|
||||
export default {
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number],
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
sel: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
sel(newval) {
|
||||
console.log(newval);
|
||||
this.$emit("input", newval);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
changeSel(item) {
|
||||
this.sel = item.payType;
|
||||
},
|
||||
async init() {
|
||||
const res = await $getPayType();
|
||||
this.list = res;
|
||||
console.log(res[0]);
|
||||
this.sel = this.sel ? this.sel : res[0].payType;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
font-size: 18px;
|
||||
color: #000;
|
||||
font-weight: 600;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.pay_btns .el-button {
|
||||
margin-left: 0;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,258 @@
|
|||
<template>
|
||||
<div class="select_desk">
|
||||
<el-dialog width="410px" title="桌台号/取餐号" :visible.sync="show">
|
||||
<div class="select_desk_dialog">
|
||||
<div class="nav">
|
||||
<div
|
||||
class="li"
|
||||
:class="type === 0 ? 'lion' : ''"
|
||||
@click="changeType(0)"
|
||||
>
|
||||
桌台号
|
||||
</div>
|
||||
<div
|
||||
class="li"
|
||||
:class="type === 1 ? 'lion' : ''"
|
||||
@click="changeType(1)"
|
||||
>
|
||||
自定义取餐号
|
||||
</div>
|
||||
</div>
|
||||
<template v-if="type === 0">
|
||||
<el-select
|
||||
class="inputs"
|
||||
v-model="selTableId"
|
||||
placeholder="请选择桌位"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in tableList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
<template v-else>
|
||||
<key-board isCanEmpty v-model="masterId"></key-board>
|
||||
</template>
|
||||
|
||||
<div class="confirm_btns">
|
||||
<el-button size="medium" @click="close">取消</el-button>
|
||||
<el-button type="success" size="medium" @click="confirm">确定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tbShopTableGet } from "@/api/table";
|
||||
import keyBoard from '../keyboard.vue';
|
||||
|
||||
export default {
|
||||
components:{keyBoard},
|
||||
data() {
|
||||
return {
|
||||
masterId:'',
|
||||
//0 台桌 ,1 取餐号
|
||||
type: 0,
|
||||
show: false,
|
||||
hasOpen: false,
|
||||
total: 0,
|
||||
loading: false,
|
||||
tableList: [],
|
||||
selTableId: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
||||
confirm(){
|
||||
const item=this.tableList.find(v=>v.id==this.selTableId)
|
||||
this.$emit('confirm',item)
|
||||
this.close()
|
||||
},
|
||||
// 台桌列表
|
||||
async tbShopTableGet() {
|
||||
this.loading = true;
|
||||
try {
|
||||
const { content, total } = await tbShopTableGet({
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
areaId: this.tabVlaue,
|
||||
});
|
||||
this.tableList = content.filter((v) => v.tableId);
|
||||
this.total = total;
|
||||
this.hasOpen = true;
|
||||
setTimeout(() => {
|
||||
this.loading = false;
|
||||
}, 300);
|
||||
} catch (error) {
|
||||
this.loading = false;
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
changeType(type) {
|
||||
this.type = type;
|
||||
},
|
||||
open() {
|
||||
this.show = true;
|
||||
if (!this.hasOpen) {
|
||||
this.tbShopTableGet();
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
},
|
||||
mounted() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep.el-button {
|
||||
padding: 12px 20px;
|
||||
}
|
||||
::v-deep .el-button--success {
|
||||
border-color: #22bf64;
|
||||
background-color: #22bf64;
|
||||
}
|
||||
.select_desk .btn {
|
||||
height: 34px;
|
||||
}
|
||||
::v-deep .inputs .el-input__inner {
|
||||
border-color: transparent !important;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
letter-spacing: 1.25px;
|
||||
font-size: 20px;
|
||||
}
|
||||
.select_desk .select_desk_dialog {
|
||||
display: flex;
|
||||
|
||||
flex-direction: column;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .nav {
|
||||
width: 286px;
|
||||
height: 38px;
|
||||
background: #dcf0e8;
|
||||
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .nav .li,
|
||||
.select_desk .select_desk_dialog .nav {
|
||||
border-radius: 4px;
|
||||
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .nav .li {
|
||||
width: 140px;
|
||||
height: 34px;
|
||||
color: #0fc161;
|
||||
|
||||
justify-content: center;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .nav .lion {
|
||||
background: #0fc161;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .inputs {
|
||||
width: 370px;
|
||||
line-height: 54px;
|
||||
margin-top: 24px;
|
||||
height: 54px;
|
||||
margin-bottom: 20px;
|
||||
background: #fff;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 4px;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
letter-spacing: 1.25px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .inputs .close {
|
||||
color: #aaa;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
line-height: 30px;
|
||||
top: 50%;
|
||||
margin-top: -15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .keyboard {
|
||||
display: flex;
|
||||
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
border-right: 1px solid #dcdfe6;
|
||||
border-bottom: 1px solid #dcdfe6;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .keyboard .li {
|
||||
height: 60px;
|
||||
width: 33.333%;
|
||||
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
|
||||
align-items: center;
|
||||
font-size: 24px;
|
||||
color: #212121;
|
||||
cursor: pointer;
|
||||
|
||||
user-select: none;
|
||||
border-left: 1px solid #dcdfe6;
|
||||
border-top: 1px solid #dcdfe6;
|
||||
|
||||
transition: all 0.1s;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .keyboard .li:hover {
|
||||
background: #dcdfe6;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .keyboard .li .icon {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .keyboard .confirm {
|
||||
height: 140px;
|
||||
background: #ff9f2e;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.select_desk .select_desk_dialog .keyboard .confirm:hover {
|
||||
background: #f88502;
|
||||
}
|
||||
|
||||
.confirm_btns {
|
||||
display: flex;
|
||||
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.confirm_btns .el-button {
|
||||
width: 175px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,105 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
title="整单备注(提交订单时生效)"
|
||||
width="410px"
|
||||
:visible.sync="show"
|
||||
@close="reset"
|
||||
>
|
||||
<el-input
|
||||
:rows="6"
|
||||
type="textarea"
|
||||
v-model="note"
|
||||
placeholder="请输入备注"
|
||||
></el-input>
|
||||
<div>
|
||||
<el-tag
|
||||
v-for="(tag, index) in tags"
|
||||
@click="addNote(tag)"
|
||||
size="medium"
|
||||
:key="index"
|
||||
closable
|
||||
@close="delTag(index)"
|
||||
type="success"
|
||||
>
|
||||
{{ tag }}
|
||||
</el-tag>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<el-button
|
||||
size="medium"
|
||||
@click="close"
|
||||
>
|
||||
取消
|
||||
</el-button>
|
||||
<el-button size="medium"
|
||||
type="success"
|
||||
@click="confirm">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
tags: [],
|
||||
note: "",
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
'tags.length'(){
|
||||
localStorage.setItem("tags", JSON.stringify(this.tags))
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reset(){
|
||||
this.note=''
|
||||
},
|
||||
delTag(index){
|
||||
this.tags.splice(index,1)
|
||||
},
|
||||
addNote(tag) {
|
||||
if(this.note.length<=0){
|
||||
return this.note = tag
|
||||
}
|
||||
this.note = tag + "," + this.note;
|
||||
},
|
||||
open(note) {
|
||||
this.show = true;
|
||||
this.note=note
|
||||
const tags = localStorage.getItem("tags");
|
||||
console.log(tags)
|
||||
this.tags = tags ? JSON.parse(tags) : ["免香菜", "不要辣", "不要葱"];
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
confirm(){
|
||||
const originTags = [...this.tags]
|
||||
if(this.note.length>=1){
|
||||
if(originTags>=10){
|
||||
originTags.shift()
|
||||
}
|
||||
const newTags=new Set([this.note,...originTags])
|
||||
console.log(newTags)
|
||||
localStorage.setItem("tags", JSON.stringify([...newTags]));
|
||||
this.$emit('confirm',this.note)
|
||||
}
|
||||
this.close()
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep.el-tag {
|
||||
margin-top: 10px;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
line-height: 35px;
|
||||
height: 35px;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -41,6 +41,9 @@
|
|||
<div class="row">
|
||||
<span class="tips">客座次数:{{ item.maxCapacity }}人</span>
|
||||
</div>
|
||||
<div class="row">
|
||||
<el-button type="primary" :disabled="!item.tableId" @click="diancanShow(item)">点餐</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btm">
|
||||
<!-- <div class="btm_item">
|
||||
|
|
@ -64,6 +67,9 @@
|
|||
<addEara ref="addEara" @success="tbShopAreaGet" />
|
||||
<addTable ref="addTable" @success="tbShopTableGet" />
|
||||
<downloadTableCode :total="total" ref="downloadTableCode" />
|
||||
|
||||
<!-- 点餐 -->
|
||||
<table-diancan ref="dianan"></table-diancan>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -71,12 +77,14 @@
|
|||
import addEara from './components/addEara'
|
||||
import addTable from './components/addTable'
|
||||
import downloadTableCode from './components/downloadTableCode'
|
||||
import tableDiancan from './components/table-diancan.vue'
|
||||
import { tbShopTableGet, tbShopAreaGet, tbShopAreaDelete, tbShopTableDelete } from '@/api/table'
|
||||
export default {
|
||||
components: {
|
||||
addEara,
|
||||
addTable,
|
||||
downloadTableCode
|
||||
downloadTableCode,
|
||||
tableDiancan
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -109,6 +117,9 @@ export default {
|
|||
this.tbShopAreaGet()
|
||||
},
|
||||
methods: {
|
||||
diancanShow(item){
|
||||
this.$refs.dianan.open(item)
|
||||
},
|
||||
tabClick() {
|
||||
this.tbShopTableGet()
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue