264 lines
7.1 KiB
Vue
264 lines
7.1 KiB
Vue
<template>
|
||
<view>
|
||
<view v-if="list.length">
|
||
<view class="table" v-for="(item, index) in list" :key="index" @click="changeTable(index)">
|
||
<view class="hm-font-28 hm-col-main hm-p-b-20 hm-border-b hm-line-1">{{item.table_name}}</view>
|
||
<view :class="'hm-p-t-20 hm-font-32 hm-font-b status-'+item.status.value">
|
||
{{item.status.text}}
|
||
</view>
|
||
<!--
|
||
<view v-if="item.status.value == 20">
|
||
占用时间：<text class="col-9">{{item.status.time}}分钟</text>
|
||
</view>
|
||
<view v-if="item.status.value == 30">
|
||
约定时间：<text class="col-9">{{item.status.patc.pact_time.text}}</text>
|
||
</view>
|
||
-->
|
||
</view>
|
||
</view>
|
||
<view v-else class="hm">
|
||
<img :src="applet.domain + '/addons/food/img/empty/data.png'" />
|
||
<view class="text">暂无餐桌列表</view>
|
||
</view>
|
||
<!-- 技术支持 -->
|
||
<view class="hm">
|
||
{{applet.copyright}} <text class="v">V{{applet.version}}</text>
|
||
</view>
|
||
<view v-if="phoneShow">
|
||
<u-popup :show="phoneShow" mode="center" closeable @close="noPhonShow()" round="10">
|
||
<view class="hm-popup">
|
||
<view class="popup-title">会员下单</view>
|
||
<view class="hm-p-20 hm-border-b">
|
||
<u--input v-model="phone" type="number" border="none" inputAlign="center"
|
||
placeholder="请输入会员账号、手机号" :clearable="true" :focus="true"></u--input>
|
||
</view>
|
||
<view class="hm-text-center">
|
||
<view class="but2 hm-border-r status-20" @click="goFood(0)">无会员</view>
|
||
<view class="but2 status-10" @click="goFood(1)">确认会员</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
<view v-if="orderShow">
|
||
<u-popup :show="orderShow" mode="center" closeable @close="orderShow = false" round="10">
|
||
<view class="hm-popup">
|
||
<view class="popup-title">该桌正在使用，你要做什么？</view>
|
||
<view class="hm-p-20 hm-border-b hm-font-24">
|
||
<view>订单数量：<text class="hm-font-b hm-col-tips">{{list[index].status.order_id.length}}</text></view>
|
||
<view>占用时间：<text class="hm-font-b hm-col-tips">{{list[index].status.time}}分钟</text></view>
|
||
<view>待收餐费：<text class="hm-font-b hm-col-error">{{list[index].status.pay_price}}</text></view>
|
||
</view>
|
||
<view class="hm-text-center">
|
||
<view class="but2 hm-border-r status-20" @click="clearOrder()">清台</view>
|
||
<view class="but2 status-10" @click="addOrder()">加单</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
<view v-if="pactShow">
|
||
<u-popup :show="pactShow" mode="center" closeable @close="pactShow = false" round="10">
|
||
<view class="hm-popup">
|
||
<view class="popup-title">该桌已被预定，你要做什么？</view>
|
||
<view class="hm-p-20 hm-border-b hm-font-24">
|
||
<view>用户姓名：<text class="hm-font-b hm-col-tips">{{list[index].status.pact.linkman}}</text></view>
|
||
<view>联系电话：<text class="hm-font-b hm-col-tips">{{list[index].status.pact.phone}}</text></view>
|
||
<view>约定时间：<text class="hm-font-b hm-col-tips">{{list[index].status.pact.pact_time.text}}</text></view>
|
||
</view>
|
||
<view class="hm-text-center">
|
||
<view class="but2 hm-border-r status-20" @click="rescind()">解约</view>
|
||
<view class="but2 status-10" @click="addOrder()">下单</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
const App = getApp();
|
||
export default {
|
||
data() {
|
||
return {
|
||
applet: {},
|
||
list: {},
|
||
index: '',
|
||
phoneShow: false,
|
||
phone: '', //会员手机号
|
||
pactShow: false, //订桌提示框
|
||
orderShow: false, //加单提示框
|
||
};
|
||
},
|
||
|
||
components: {},
|
||
props: {},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面加载
|
||
*/
|
||
onLoad(options) {
|
||
let _this = this;
|
||
_this.applet = App.getApplet();
|
||
},
|
||
|
||
onShow() {
|
||
let _this = this;
|
||
_this.getList();
|
||
},
|
||
|
||
methods: {
|
||
/**
|
||
* 解约订桌
|
||
*/
|
||
rescind: function() {
|
||
let _this = this,
|
||
table = _this.list[_this.index];
|
||
uni.showModal({
|
||
title: "提示",
|
||
content: "确定要解除客户预定？",
|
||
success: function(o) {
|
||
if (o.confirm) {
|
||
App._post_form('table/rescind', {
|
||
pact_id: table.status.pact.pact_id
|
||
}, function(result) {
|
||
App.showSuccess(result.msg, function() {
|
||
_this.pactShow = false;
|
||
_this.getList();
|
||
});
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 清台接单
|
||
*/
|
||
clearOrder: function() {
|
||
let _this = this,
|
||
table = _this.list[_this.index];
|
||
if (table.status.pay_price > 0) {
|
||
App.showError('该桌有￥' + table.status.pay_price + '待收餐费，请完成收款后在清台！');
|
||
return false;
|
||
}
|
||
uni.showModal({
|
||
title: "提示",
|
||
content: "确定要完成订单并清台？",
|
||
success: function(o) {
|
||
if (o.confirm) {
|
||
for (let n = 0; n < table.status.order_id.length; n++) {
|
||
App._post_form('order/receipt', {
|
||
order_id: table.status.order_id[n]
|
||
}, function(result) {
|
||
_this.orderShow = false;
|
||
_this.getList();
|
||
});
|
||
}
|
||
}
|
||
}
|
||
});
|
||
},
|
||
changeTable: function(index) {
|
||
let _this = this;
|
||
_this.index = index;
|
||
|
||
if (_this.list[index].status.value == 10) {
|
||
_this.phoneShow = true;
|
||
return true;
|
||
}
|
||
if (_this.list[index].status.value == 20) {
|
||
//忙 - 加单 清台 取消
|
||
_this.orderShow = true;
|
||
return true;
|
||
}
|
||
if (_this.list[index].status.value == 30) {
|
||
//订桌 - 取消 下单 解约
|
||
_this.pactShow = true;
|
||
return true;
|
||
}
|
||
},
|
||
/**
|
||
* 下单/加单
|
||
*/
|
||
addOrder: function(mode) {
|
||
_this = this;
|
||
if (mode == 'order') {
|
||
_this.orderShow = false;
|
||
}
|
||
if (mode == 'pact') {
|
||
_this.pactShow = false;
|
||
}
|
||
_this.phoneShow = true;
|
||
return true;
|
||
},
|
||
goFood: function(e) {
|
||
let _this = this,
|
||
table_id = _this.list[_this.index].table_id,
|
||
phone = _this.phone;
|
||
if (e == 1) {
|
||
if (phone == '') {
|
||
App.showError('会员账号不可为空');
|
||
return false;
|
||
}
|
||
App._get('user/phone', {
|
||
phone: phone
|
||
}, function(result) {
|
||
_this.phone = '';
|
||
_this.phoneShow = false;
|
||
App.goTo('table/food?table_id=' + table_id + '&user_id=' + result.data
|
||
.detail.user_id);
|
||
});
|
||
} else {
|
||
_this.phone = '';
|
||
_this.phoneShow = false;
|
||
App.goTo('table/food?table_id=' + table_id + '&user_id=');
|
||
}
|
||
},
|
||
/**
|
||
* 关闭会员输入框
|
||
*/
|
||
noPhonShow: function() {
|
||
let _this = this;
|
||
_this.phone = '';
|
||
_this.phoneShow = false;
|
||
},
|
||
/**
|
||
* 获取餐桌/包间列表
|
||
*/
|
||
getList: function() {
|
||
let _this = this;
|
||
App._get('table/lists', {}, result => {
|
||
_this.setData(result.data);
|
||
});
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
<style>
|
||
.table {
|
||
padding: 20rpx;
|
||
border-radius: 10rpx;
|
||
box-shadow: 6rpx 6rpx 8rpx rgba(26, 26, 26, 0.2);
|
||
width: 40.5%;
|
||
display: inline-block;
|
||
margin: 20rpx 0rpx 0rpx 20rpx;
|
||
font-size: 24rpx;
|
||
background-color: #FFF;
|
||
text-align: center;
|
||
}
|
||
.but2 {
|
||
padding: 20rpx 0;
|
||
width: 49%;
|
||
display: inline-block;
|
||
}
|
||
.status-10 {
|
||
color: #19be6b;
|
||
}
|
||
|
||
.status-20 {
|
||
color: #fa3534;
|
||
}
|
||
|
||
.status-30 {
|
||
color: #ff9900;
|
||
}
|
||
</style>
|