351 lines
8.5 KiB
Vue
351 lines
8.5 KiB
Vue
<template>
|
|
<view class="min-page bg-gray u-font-28 u-p-30">
|
|
<user-vue :orderInfo="orderDetail.info" :user="user"></user-vue>
|
|
|
|
<goods-list
|
|
@printOrder="onPrintOrder"
|
|
@tuikuan="onTuikuan"
|
|
:orderInfo="orderDetail.info"
|
|
:user="user"
|
|
:data="orderDetail.goodsList"
|
|
:seatFee="orderDetail.seatFee"
|
|
@tuicai="onTuiCai"
|
|
></goods-list>
|
|
|
|
<template v-if="true">
|
|
<extra-vue @tuicai="onSeatFeeTuicai" @tuikuan="onSeatFeeTuiKuan" :orderInfo="orderDetail.info" :data="orderDetail.seatFee"></extra-vue>
|
|
</template>
|
|
<order-vue :data="orderDetail.info" :table="options" :seatFee="orderDetail.seatFee"></order-vue>
|
|
<!-- <step-vue></step-vue> -->
|
|
<view style="height: 200rpx"></view>
|
|
<view class="u-fixed bottom bg-fff">
|
|
<view class="u-flex u-abso">
|
|
<template v-if="orderDetail.info.dineMode == 'take-out' || !orderDetail.info.tableCode || pageData.shopInfo.registerType == 'before'">
|
|
<view class="u-flex-1" v-if="orderDetail.info.status == 'unpaid'">
|
|
<my-button @tap="toPay" borderRadius="100rpx" shape="circle" type="primary">结账</my-button>
|
|
</view>
|
|
</template>
|
|
<template v-else>
|
|
<template v-if="orderDetail.info.status == 'unpaid'">
|
|
<view class="u-flex-1">
|
|
<my-button @tap="diancan" color="#fff" bgColor="rgb(57,53,52)" borderRadius="100rpx 0 0 100rpx" fontWeight="700" shape="circle" plain type="primary">
|
|
加菜
|
|
</my-button>
|
|
</view>
|
|
<view class="u-flex-1">
|
|
<my-button @tap="toPay" borderRadius="0 100rpx 100rpx 0" shape="circle" fontWeight="700" type="primary">结账</my-button>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
|
|
<tuicai-vue @confirm="tuicaiConfirm" v-model:show="tuicai.show" :data="tuicai.selGoods"></tuicai-vue>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
|
import { reactive, ref, inject } from 'vue';
|
|
import userVue from './components/user.vue';
|
|
import orderVue from './components/order.vue';
|
|
import goodsList from './components/list.vue';
|
|
import stepVue from './components/step.vue';
|
|
import extraVue from './components/extra.vue';
|
|
import tuicaiVue from './components/tuicai.vue';
|
|
|
|
import go from '@/commons/utils/go.js';
|
|
import infoBox from '@/commons/utils/infoBox.js';
|
|
import { hasPermission } from '@/commons/utils/hasPermission.js';
|
|
|
|
import OrderDetail from './page.js';
|
|
import { getHistoryOrder, refundOrder, getOrderById, printOrder } from '@/http/api/order.js';
|
|
import { shopStaffDetail } from '@/http/api/staff.js';
|
|
import { shopUserDetail } from '@/http/api/shopUser.js';
|
|
import { getShopInfo } from '@/http/api/shop.js';
|
|
|
|
const websocketUtil = inject('websocketUtil');
|
|
|
|
const tuicai = reactive({
|
|
show: false,
|
|
isSeatFee: false,
|
|
selGoods: {}
|
|
});
|
|
const orderDetail = reactive({
|
|
goodsList: [],
|
|
info: {},
|
|
seatFee: {
|
|
totalAmount: 0
|
|
}
|
|
});
|
|
const options = reactive({});
|
|
// 监听选择用户事件
|
|
let user = ref({
|
|
headImg: '',
|
|
phone: '',
|
|
amount: '0.00',
|
|
accountPoints: '0.00'
|
|
});
|
|
const pageData = reactive({
|
|
shopInfo: {}
|
|
});
|
|
|
|
onShow(() => {
|
|
watchEmit();
|
|
watchChooseuser();
|
|
getOrderDetail();
|
|
});
|
|
|
|
/**
|
|
* 获取店铺信息
|
|
*/
|
|
function getShopInfoData() {
|
|
getShopInfo({ id: uni.getStorageSync('shopInfo').id }).then((res) => {
|
|
pageData.shopInfo = res;
|
|
uni.setStorageSync('shopInfo', res);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 获取订单详情
|
|
*/
|
|
async function getOrderDetail() {
|
|
let res = await getHistoryOrder({ orderId: options.id });
|
|
console.log('订单详情===', res);
|
|
// 初始化socket
|
|
// if (res.tableName && res.tableCode) {
|
|
// let shopInfo = uni.getStorageSync('shopInfo');
|
|
// websocketUtil.send(
|
|
// JSON.stringify({
|
|
// type: 'onboc',
|
|
// account: shopInfo.account,
|
|
// operate_type: 'init',
|
|
// table_code: res.tableCode,
|
|
// shop_id: shopInfo.id
|
|
// })
|
|
// );
|
|
// }
|
|
|
|
if (res.userId) {
|
|
let resUser = await shopUserDetail({ userId: res.userId });
|
|
user.value = resUser;
|
|
}
|
|
orderDetail.seatFee = {
|
|
seatNum: res.seatNum,
|
|
seatAmount: res.seatAmount
|
|
};
|
|
|
|
orderDetail.goodsList = Object.entries(res.detailMap).map(([key, value]) => ({
|
|
info: value,
|
|
placeNum: key
|
|
}));
|
|
|
|
orderDetail.goodsList.map((item) => {
|
|
item.info.map((item) => {
|
|
item.unitPrice = uni.$utils.isGoodsPrice(item, user.value);
|
|
});
|
|
});
|
|
orderDetail.info = res;
|
|
}
|
|
|
|
function onSeatFeeTuicai(seatFee) {
|
|
seatFee = { ...seatFee, num: seatFee.num, productName: seatFee.productName };
|
|
tuicai.show = true;
|
|
tuicai.isSeatFee = seatFee;
|
|
tuicai.selGoods = seatFee;
|
|
}
|
|
//是否有允许退款权限
|
|
async function hasTuiKuan() {
|
|
const isHas = await hasPermission('允许退款');
|
|
return isHas;
|
|
}
|
|
|
|
async function onSeatFeeTuiKuan(seatFee) {
|
|
const canTuikuan = await hasTuiKuan();
|
|
if (!canTuikuan) {
|
|
return;
|
|
}
|
|
const { id, cartId, productId, productSkuId, productName, num, priceAmount, price } = seatFee;
|
|
go.to('PAGES_ORDER_TUIKUAN', {
|
|
orderId: orderDetail.info.id,
|
|
id,
|
|
cartId,
|
|
productId,
|
|
productSkuId,
|
|
productName,
|
|
num,
|
|
number: 0,
|
|
skuName: '',
|
|
priceAmount,
|
|
price
|
|
});
|
|
}
|
|
|
|
function onTuiCai(goods, index) {
|
|
tuicai.show = true;
|
|
tuicai.selGoods = goods;
|
|
}
|
|
async function tuicaiConfirm(e) {
|
|
const res = await refundOrder(e);
|
|
tuicai.show = false;
|
|
if (res) {
|
|
go.back();
|
|
} else {
|
|
getOrderDetail();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 打印订单
|
|
*/
|
|
function onPrintOrder() {
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '是否打印当前台桌菜品',
|
|
async success(res) {
|
|
if (res.confirm) {
|
|
try {
|
|
const res = await printOrder({
|
|
id: orderDetail.info.id,
|
|
type: orderDetail.info.status == 'unpaid' ? 1 : 0
|
|
});
|
|
infoBox.showToast('已发送打印请求');
|
|
} catch (e) {
|
|
infoBox.showToast('发送打印请求失败');
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
async function onTuikuan(goods, index) {
|
|
const canTuikuan = await hasTuiKuan();
|
|
if (!canTuikuan) {
|
|
return;
|
|
}
|
|
if (Array.isArray(goods)) {
|
|
go.to('PAGES_ORDER_TUIKUAN', {
|
|
orderInfo: JSON.stringify(orderDetail.info),
|
|
goodsList: JSON.stringify(goods)
|
|
});
|
|
} else {
|
|
goods.number = 0;
|
|
goods.skuName = goods.skuName || '';
|
|
goods.priceAmount = goods.priceAmount ? goods.priceAmount : (goods.num * uni.$utils.isGoodsPrice(goods, user.value)).toFixed(2);
|
|
console.log(goods);
|
|
goods.unitPrice = uni.$utils.isGoodsPrice(goods, user.value);
|
|
goods.userCouponId = goods.userCouponId ? goods.userCouponId : '';
|
|
go.to('PAGES_ORDER_TUIKUAN', {
|
|
orderInfo: JSON.stringify(orderDetail.info),
|
|
goodsList: JSON.stringify([goods])
|
|
});
|
|
}
|
|
}
|
|
|
|
const uiPage = new OrderDetail();
|
|
setTimeout(() => {
|
|
uiPage.setVal('user', {
|
|
name: 1
|
|
});
|
|
}, 1500);
|
|
|
|
async function diancan() {
|
|
const canXiadan = await hasPermission('允许下单');
|
|
if (!canXiadan) {
|
|
return;
|
|
}
|
|
clearEmit();
|
|
go.to('PAGES_CREATE_ORDER', {
|
|
tableId: options.tableId || orderDetail.info.tableId,
|
|
tableCode: options.tableCode || orderDetail.info.tableCode,
|
|
name: options.name || orderDetail.info.tableName,
|
|
type: 'add',
|
|
vipUserId: orderDetail.info.userId ? orderDetail.info.userId : ''
|
|
});
|
|
}
|
|
|
|
async function toPay() {
|
|
const canJieZhang = await hasPermission('允许收款');
|
|
if (!canJieZhang) {
|
|
return;
|
|
}
|
|
const userId = orderDetail.info.userId || '';
|
|
clearEmit();
|
|
go.to('PAGES_ORDER_PAY', {
|
|
tableId: options.tableId || orderDetail.info.tableId,
|
|
tableCode: options.tableCode || orderDetail.info.tableCode,
|
|
tableName: options.name || orderDetail.info.tableName,
|
|
orderId: orderDetail.info.id,
|
|
discount: 1,
|
|
userId
|
|
});
|
|
}
|
|
|
|
function watchEmit() {
|
|
uni.$off('orderDetail:update');
|
|
uni.$once('orderDetail:update', (newval) => {
|
|
getOrderDetail();
|
|
});
|
|
}
|
|
|
|
//更新选择用户
|
|
async function setUser(par) {
|
|
const submitPar = {
|
|
orderId: options.id || '',
|
|
masterId: options.masterId,
|
|
tableId: options.tableId || orderDetail.info.tableId,
|
|
vipUserId: user.value.id ? user.value.id : '',
|
|
type: user.value.id ? 0 : 1 //0 设置 1 取消
|
|
};
|
|
Object.assign(submitPar, par);
|
|
const res = await Api.$setUser(submitPar);
|
|
getOrderDetail();
|
|
return res;
|
|
}
|
|
|
|
function clearEmit() {
|
|
uni.$off('choose-user');
|
|
uni.$off('orderDetail:update');
|
|
}
|
|
|
|
function watchChooseuser() {
|
|
uni.$off('choose-user');
|
|
uni.$on('choose-user', (data) => {
|
|
console.log(data);
|
|
user.value = data;
|
|
setUser();
|
|
});
|
|
}
|
|
|
|
// 监听购物车
|
|
function onMessage() {
|
|
websocketUtil.onMessage(async (res) => {
|
|
let data = JSON.parse(res);
|
|
console.log(data);
|
|
if (data.operate_type == 'onboc_init' && data.data.length) {
|
|
}
|
|
});
|
|
}
|
|
|
|
onLoad((opt) => {
|
|
Object.assign(options, opt);
|
|
getShopInfoData();
|
|
// onMessage();
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.bottom {
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 68rpx;
|
|
|
|
.u-abso {
|
|
bottom: 84rpx;
|
|
left: 28rpx;
|
|
right: 28rpx;
|
|
}
|
|
}
|
|
</style>
|