wangxiaowei/chazhi_store
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化功能

Browse Source
This commit is contained in:
wangxiaowei
2026-02-03 18:23:44 +08:00
parent ff1c41d14e
commit 794d3a2ebf
1 changed files with 201 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

201
src/pages/order/group-detail.vue Normal file
View File

@ -0,0 +1,201 @@
<route lang="jsonc" type="page">
{
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="pb-254rpx">
<!-- 取消订单 -->
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
<view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<!-- 适用门店 -->
<view class="bg-white rounded-16rpx px-30rpx pb-32rpx mx-30rpx mt-20rpx">
<view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx">适用门店</view>
<view class="mt-26rpx flex items-center">
<view class="mr-24rpx">
<wd-img width="170rpx" height="170rpx" :src="order.teaStoreGroup.img"></wd-img>
</view>
<view class="flex-1 flex justify-between items-center relative">
<view class="">
<view class="text-[#303133] text-30rpx leading-40rpx line-2">{{ order.store_msg.name }}</view>
<view class="flex items-center mt-14rpx">
<view class="mr-8rpx">
<wd-img width="28rpx" height="28rpx" :src="`${OSS}icon/icon_location.png`"/>
</view>
<view class="ml-2rpx text-26rpx text-[#606266] line-1 w-300rpx">{{ order.store_msg.address }}</view>
</view>
</view>
</view>
</view>
</view>
<!-- 订单信息 -->
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx">
<view class="text-[#303133] text-32rpx leading-44rpx">订单信息</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>订单编号</view>
<view>
<text>{{ order.order_sn }}</text>
<wd-divider vertical />
<text class="text-[#4C9F44]" @click="copy(order.order_sn)">复制</text>
</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>交易方式</view>
<view>{{ order.pay_way_title }}</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>创建时间</view>
<view>{{ order.dtime }}</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="order.update_dtime">
<view>付款时间</view>
<view>{{ order.update_dtime }}</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { GroupComboOrderStatus, GroupComboOrderStatusTextValue } from '@/utils/order'
import { useMessage } from 'wot-design-uni'
import { copy } from '@/utils/tools'
import { getGroupComboOrderDetail } from '@/api/order'
import { handleReleaseTeaRoomOrderHookds, handleCancelOrderHooks } from '@/hooks/useOrder'
const title = ref<string>('')
const OSS = inject('OSS')
// 取消订单弹窗
const message = useMessage('wd-message-box-slot')
// 订单
const orderId = ref<number>(0)
const order = ref({
order_status: 0,
order_sn: '',
store_name: '',
store_msg: {
name: '',
address: '',
},
teaStoreGroup: {
img: '',
title: '',
},
pay_way_title: '',
dtime: '',
update_dtime: '',
})
onLoad(async (args) => {
orderId.value = args.id
// 获取订单详情
OrderDetail.handleInit()
})
onUnload(() => {
uni.$off('refreshOrderDetail')
})
const OrderDetail = {
/**
* 获取订单详情
*/
handleInit: async () => {
const res = await getGroupComboOrderDetail(orderId.value)
order.value = res.details
title.value = GroupComboOrderStatusTextValue[res.details.order_status].title || '订单详情'
},
/**
* 取消订单
*/
handleCancelOrder: () => {
message.confirm({
title: '确定取消订单？',
msg: '取消订单后无法恢复，是否确定取消订单？',
confirmButtonText: '确定',
cancelButtonText: '取消',
cancelButtonProps: {
customClass: '!bg-[#F6F7F8] !text-[#303133] !text-32rpx !leading-44rpx !rounded-8rpx',
},
confirmButtonProps: {
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
}
}).then((res) => {
if (res.action == 'confirm') {
uni.$on('refreshOrderList', () => {
uni.$off('refreshOrderList')
OrderDetail.handleInit()
})
handleCancelOrderHooks(orderId.value)
}
}).catch(() => {
// 点击取消按钮回调事件
})
},
/**
* 释放时间
*/
handleReleaseOrder: () => {
message.confirm({
title: '释放时间',
msg: '释放预约时间后，包间可重新被预定',
confirmButtonText: '确定',
cancelButtonText: '取消',
cancelButtonProps: {
customClass: '!bg-[#F6F7F8] !text-[#303133] !text-32rpx !leading-44rpx !rounded-8rpx',
},
confirmButtonProps: {
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
}
}).then((res) => {
if (res.action == 'confirm') {
uni.$on('refreshOrderList', () => {
uni.$off('refreshOrderList')
OrderDetail.handleInit()
})
handleReleaseTeaRoomOrderHookds(orderId.value)
}
}).catch(() => { })
},
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.coupon-bg {
background-image: url(#{$OSS}images/order/order_image2.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
.collapse {
:deep() {
.wd-collapse-item::after,
.wd-collapse-item__header.is-expanded::after {
background: none !important;
}
.wd-collapse-item__body {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
}
}
</style>