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

修i该页面

Browse Source
This commit is contained in:
wangxiaowei
2025-09-10 08:06:35 +08:00
parent 2f6bfca622
commit 314b1accdd
13 changed files with 323 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
src/bundle/group-buying/after-sales/after-sales.vue → src/bundle/order/after-sales/after-sales.vue
View File

0
src/bundle/group-buying/douyin/douyin-order-detail.vue → src/bundle/order/douyin/douyin-order-detail.vue
View File

0
src/bundle/group-buying/douyin/excharge.vue → src/bundle/order/douyin/excharge.vue
View File

2
src/bundle/group-buying/douyin/order-list.vue → src/bundle/order/douyin/order-list.vue
View File

@ -122,7 +122,7 @@
// 去兑换
handleToExcharge: () => {
uni.navigateTo({
url: '/bundle/group-buying/douyin/excharge'
url: '/bundle/order/douyin/excharge'
})
},

2
src/bundle/group-buying/platform/direct-order-detail.vue → src/bundle/order/platform/direct-order-detail.vue
View File

@ -206,7 +206,7 @@
// 跳转到申请退款页面
handleToRefund: () => {
uni.navigateTo({
url: `/bundle/group-buying/after-sales/after-sales?type=direct&orderType=${GroupBuyingCategoryOrderStatus.AfterSaleApply}`
url: `/bundle/order/after-sales/after-sales?type=direct&orderType=${GroupBuyingCategoryOrderStatus.AfterSaleApply}`
})
},

0
src/bundle/group-buying/platform/franchise-order-detail.vue → src/bundle/order/platform/franchise-order-detail.vue
View File

0
src/bundle/group-buying/platform/order-list.vue → src/bundle/order/platform/order-list.vue
View File

231
src/bundle/order/reserve-room/order-detail.vue Normal file
View File

@ -0,0 +1,231 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="pb-254rpx">
<!-- 平台团购直营店 -->
<view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view class="text-[#909399] text-26rpx leading-36rpx mx-102rpx mb-40rpx">
<text v-if="orderType === ReserveCategoryOrderStatus.Consuming">使用过程中有任何问题，请联系客服</text>
</view>
<!-- 消费中下显示 -->
<view class="mx-30rpx coupon-bg" >
<view class="flex items-center px-30rpx pt-30rpx pb-40rpx">
<view class="mr-30rpx">
<wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
</view>
<view class="flex-1">
<view class="flex justify-between items-center" @click="directOrderDetail.handleToRoom">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1 w-300rpx">这个是包间的名称</view>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
<view class="text-26rpx leading-36rpx text-[#909399]">￥324</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>3小时</view>
<view>x1</view>
</view>
<view class="text-[#606266] text-right mt-26rpx">
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
<text class="tetx-32rpx leading-36rpx">￥29.32</text>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
</view>
</view>
<view class="mt-28rpx pb-48rpx">
<view class="text-30rpx leading-42rpx text-[#303133] px-30rpx">预约信息</view>
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx">
<view class="mb-20rpx px-30rpx">预约时间：2025-03-18 09:00-12:00</view>
<view class="flex justify-between items-center pl-30rpx">
<view>预约时长：3小时</view>
<view class="bg-[#4C9F44] rounded-[100rpx_0rpx_0rpx_100rpx] font-bold text-28rpx leading-40rpx text-[#fff] w-170rpx h-56rpx flex justify-center items-center">一键续订</view>
</view>
</view>
</view>
</view>
<!-- 开门锁 -->
<view class="bg-white rounded-16rpx mx-30rpx mt-20rpx">
<view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx px-30rpx">开门锁</view>
<view class="mt-20rpx">
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="">
<view class="flex justify-between items-center mt-18rpx pb-18rpx px-62rpx">
<view class="w-224rpx">
<view class="relative h-64rpx">
<wd-img width="224rpx" height="64rpx" :src="`${OSS}images/reserve_room/reserve_room_image5.png`"/>
<view class="text-[#4C9F44] font-bold text-32rpx leading-44rpx absolute top-[50%] transform translate-y-[-50%] right-22rpx">点击开锁</view>
</view>
<view class="text-[#303133] text-30rpx leading-42rpx mt-16rpx text-center">大门锁</view>
<view class="text-[#606266] text-26rpx leading-48rpx mt-4rpx text-center font-500">手动输入 1052 32#</view>
</view>
<view class="border-r-2rpx border-r-solid border-r-[#F6F7F9] h-224rpx"></view>
<view class="w-224rpx">
<view class="relative h-64rpx">
<wd-img width="224rpx" height="64rpx" :src="`${OSS}images/reserve_room/reserve_room_image6.png`"/>
<view class="text-[#4C9F44] font-bold text-32rpx leading-44rpx absolute top-[50%] transform translate-y-[-50%] right-22rpx">点击开锁</view>
</view>
<view class="text-[#303133] text-30rpx leading-42rpx mt-16rpx text-center">房间锁</view>
<view class="text-[#606266] text-26rpx leading-48rpx mt-4rpx text-center font-500">手动输入 1052 32#</view>
</view>
</view>
</view>
</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="`${OSS}images/home/home_image5.png`"></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">这是商家的名称这是</view>
<view class="mt-26rpx text-[#909399] text-24rpx leading-34rpx">距您9km</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">青浦区仓路478号青浦区仓路478号青浦区仓路478号青浦区仓路478号青浦区仓路478号青浦区仓路478号</view>
</view>
</view>
<view class="flex absolute top-1/2 right-0 -translate-y-1/2">
<view class="text-center mr-20rpx" @click="directOrderDetail.handleLocation">
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/>
</view>
<view class="text-center" @click="directOrderDetail.handleCallPhone">
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`"/>
</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>7327328627526903</text>
<wd-divider vertical />
<text class="text-[#4C9F44]">复制</text>
</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>交易方式</view>
<view>微信支付</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>创建时间</view>
<view>2019-05-16 12:20:26</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>付款时间</view>
<view>2019-05-16 13:20:26</view>
</view>
</view>
<!-- 操作按钮 -->
<view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx">
<view class="mt-34rpx">
<!-- 待使用 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === GroupBuyingCategoryOrderStatus.ToUse">
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="directOrderDetail.handleToRefund">申请退款</view>
<view class="w-330rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="directOrderDetail.handleToChooseTeaRoom">立即预定</view>
</view>
<!-- 已使用 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderType === GroupBuyingCategoryOrderStatus.Used">
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">再次预定</view>
</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { GroupBuyingCategory, GroupBuyingCategoryOrderStatus, GroupBuyingStatusTitle } from '@/utils/groupBuying'
import { ReserveCategoryOrderStatus, ReserveCategoryOrderStatusText } from '@/utils/platformService'
import {toast} from '@/utils/toast'
const OSS = inject('OSS')
const title = ref<string>('')
const type = ref<string>('') // 订单类型：团购、抖音等
const orderType = ref<string>('') // 订单状态：待使用、退款等
onLoad((args) => {
title.value = ReserveCategoryOrderStatusText[args.orderType] || '订单详情'
console.log("🚀 ~ title.value :", title.value )
type.value = args.type
orderType.value = args.orderType
})
const directOrderDetail = {
// 跳转到套餐详情
handleToCombo: () => {
},
// 跳转到包间详情
handleToRoom: () => {
},
// 处理导航逻辑
handleLocation: () => {
toast.info('正在导航...')
// 可以使用uni.navigateTo或其他方式打开地图应用
uni.navigateTo({
url: '/pages/map/map' // 假设有一个地图页面
})
},
// 处理拨打电话逻辑
handleCallPhone: () => {
},
// 跳转到申请退款页面
handleToRefund: () => {
uni.navigateTo({
url: `/bundle/order/after-sales/after-sales?type=direct&orderType=${GroupBuyingCategoryOrderStatus.AfterSaleApply}`
})
},
// 跳转到立即预定页面(选择茶室)
handleToChooseTeaRoom: () => {
uni.navigateTo({
url: `/bundle/reserve-room/choose-room`
})
},
}
</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%;
}
</style>

64
src/components/order/ComboCard.vue
View File

@ -20,8 +20,8 @@
</view>
<view class="mt-22rpx">
<view class="flex">
<view class="w-200rpx h-200rpx mr-28rpx">
<wd-img width="100%" height="100%" :src="`${OSS}images/home/home_image5.png`"></wd-img>
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
</view>
<view class="flex-1">
<view @click="comboCard.handleToOrderDetail">
@ -64,8 +64,8 @@
</view>
<view class="mt-22rpx">
<view class="flex">
<view class="w-200rpx h-200rpx mr-28rpx">
<wd-img width="100%" height="100%" :src="`${OSS}images/home/home_image5.png`"></wd-img>
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
</view>
<view class="flex-1">
<view @click="comboCard.handleToOrderDetail">
@ -96,16 +96,16 @@
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
</view>
<view class="font-400 text-28rpx leading-40rpx mt-12rpx">
<text class="text-[#4C9F44]" v-if="orderType === ReserveCategoryOrderStatus.Consuming">消费中</text>
<text class="text-[#606266]" v-if="orderType === ReserveCategoryOrderStatus.Reserved">已预约</text>
<text class="text-[#C9C9C9]" v-if="orderType === ReserveCategoryOrderStatus.Serving">服务中</text>
<view class="font-400 text-28rpx leading-40rpx mt-12rpx text-[#4C9F44]">
<text v-if="orderType === ReserveCategoryOrderStatus.Consuming">消费中</text>
<text v-if="orderType === ReserveCategoryOrderStatus.Reserved">已预约</text>
<text v-if="orderType === ReserveCategoryOrderStatus.Serving">服务中</text>
</view>
</view>
<view class="mt-22rpx">
<view class="flex items-center">
<view class="w-200rpx h-200rpx mr-28rpx">
<wd-img width="100%" height="100%" :src="`${OSS}images/home/home_image5.png`"></wd-img>
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
</view>
<view class="flex-1">
<view @click="comboCard.handleToOrderDetail">
@ -119,6 +119,44 @@
</view>
</view>
</view>
<!-- 茶艺师预约 -->
<view v-if="type === ReserveCategory.TeaSpecialist" class="bg-white rounded-10rpx p-28rpx">
<view class="flex items-center">
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
</view>
<view class="flex-1">
<view class="flex items-center">
<view class="font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">茶艺师</view>
<view class="w-168rpx h-40rpx relative mr-44rpx">
<view class="absolute left-0 top-0 h-36rpx flex items-start">
<wd-img :src="`${OSS}icon/icon_gold_medal.png`" width="36rpx" height="36rpx"></wd-img>
</view>
<view class="bg-[#F0F6EF] text-[#006C2D] font-400 text-22rpx leading-32rpx rounded-4rpx text-center w-150rpx ml-18rpx pb-4rpx">金牌茶艺师</view>
</view>
<view class="font-400 text-28rpx leading-20rpx text-[#4C9F44] flex items-center">
<text v-if="orderType === ReserveCategoryOrderStatus.Consuming">消费中</text>
<text v-if="orderType === ReserveCategoryOrderStatus.Reserved">已预约</text>
<text v-if="orderType === ReserveCategoryOrderStatus.Serving">服务中</text>
</view>
</view>
<view class="flex items-center">
<view class="mr-12rpx">
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">上门服务</wd-tag>
</view>
<view>
<wd-tag color="#F55726" bg-color="#F55726" plain>到点服务</wd-tag>
</view>
</view>
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mt-42rpx">
预约时间：03/18 08:00-12:00
</view>
</view>
</view>
</view>
</view>
</template>
@ -165,17 +203,17 @@
switch (props.type) {
case 'Direct':
uni.navigateTo({
url: `/bundle/group-buying/platform/direct-order-detail?orderType=${props.orderType}`
url: `/bundle/order/platform/direct-order-detail?orderType=${props.orderType}`
})
break;
case 'Franchise':
uni.navigateTo({
url: `/bundle/group-buying/platform/franchise-order-detail?orderType=${props.orderType}`
url: `/bundle/order/platform/franchise-order-detail?orderType=${props.orderType}`
})
break;
case 'DouYin':
uni.navigateTo({
url: `/bundle/group-buying/douyin/douyin-order-detail?orderType=${props.orderType}`
url: `/bundle/order/douyin/douyin-order-detail?orderType=${props.orderType}`
})
break;
default:

2
src/components/order/ComboCoupon.vue
View File

@ -161,7 +161,7 @@
const comboCoupon = {
handleToStore: () => {
uni.navigateTo({
url: '/src/bundle/group-buying/platform/store-detail'
url: '/src/bundle/order/platform/store-detail'
})
}
}

24
src/pages.json
View File

@ -220,7 +220,7 @@
}
},
{
"path": "group-buying/after-sales/after-sales",
"path": "order/after-sales/after-sales",
"type": "page",
"layout": "default",
"style": {
@ -228,7 +228,7 @@
}
},
{
"path": "group-buying/douyin/douyin-order-detail",
"path": "order/douyin/douyin-order-detail",
"type": "page",
"layout": "default",
"style": {
@ -236,7 +236,7 @@
}
},
{
"path": "group-buying/douyin/excharge",
"path": "order/douyin/excharge",
"type": "page",
"layout": "default",
"style": {
@ -244,7 +244,7 @@
}
},
{
"path": "group-buying/douyin/order-list",
"path": "order/douyin/order-list",
"type": "page",
"layout": "default",
"style": {
@ -252,7 +252,7 @@
}
},
{
"path": "group-buying/platform/direct-order-detail",
"path": "order/platform/direct-order-detail",
"type": "page",
"layout": "default",
"style": {
@ -260,7 +260,7 @@
}
},
{
"path": "group-buying/platform/franchise-order-detail",
"path": "order/platform/franchise-order-detail",
"type": "page",
"layout": "default",
"style": {
@ -268,7 +268,15 @@
}
},
{
"path": "group-buying/platform/order-list",
"path": "order/platform/order-list",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "order/reserve-room/order-detail",
"type": "page",
"layout": "default",
"style": {
@ -278,4 +286,4 @@
]
}
]
}
}

4
src/pages/my/my.vue
View File

@ -248,14 +248,14 @@
// 跳转抖音团购
handleToDouYinGroupBuying() {
uni.navigateTo({
url: '/bundle/group-buying/douyin/order-list'
url: '/bundle/order/douyin/order-list'
})
},
// 跳转平台团购
handleToPlatformGroupBuying() {
uni.navigateTo({
url: '/bundle/group-buying/platform/order-list'
url: '/bundle/order/platform/order-list'
})
},

27
src/pages/reserve/reserve.vue
View File

@ -30,15 +30,28 @@
</view>
<view class="mx-30rpx" :style="{ paddingTop: navbarHeight + 'px' }">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="reserve.upCallback" :up="upOption">
<view v-for="(item, index) in 5" :key="index" >
<view class="mb-20rpx" v-if="tab === 0">
<combo-card :type="ReserveCategory.TeaRoom" :order-type="ReserveCategoryOrderStatus.Consuming"></combo-card>
<!-- 茶室预约 -->
<view v-if="tab === 0">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="reserve.upCallback" :up="upOption">
<view v-for="(item, index) in 5" :key="index" >
<view class="mb-20rpx">
<combo-card :type="ReserveCategory.TeaRoom" :order-type="ReserveCategoryOrderStatus.Consuming"></combo-card>
</view>
</view>
</view>
</mescroll-body>
</mescroll-body>
</view>
<!-- 茶艺师预约 -->
<view v-if="tab === 1">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="reserve.upCallback" :up="upOption">
<view v-for="(item, index) in 5" :key="index" >
<view class="mb-20rpx">
<combo-card :type="ReserveCategory.TeaSpecialist" :order-type="ReserveCategoryOrderStatus.Consuming"></combo-card>
</view>
</view>
</mescroll-body>
</view>
</view>
</view>
</template>