删除不需要的页面

This commit is contained in:
wangxiaowei
2026-01-02 03:10:44 +08:00
parent 872f483e42
commit e06be5531d
6 changed files with 0 additions and 1736 deletions

View File

@ -1,164 +0,0 @@
<route lang="jsonc" type="page">{
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="">
<view class="order-list sticky top-0 left-0 z-50 bg-[#F6F7F8] pb-10rpx">
<wd-navbar safeAreaInsetTop custom-class='!bg-[#F6F7F8]' :bordered="false" placeholder>
<template #left>
<view class="h-48rpx flex items-center">
<view class="mt-4rpx" @click="router.navigateBack()">
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon>
</view>
<view class="search-box">
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索茶室订单" @search="OrderList.handleSearch()"></wd-search>
</view>
</view>
</template>
</wd-navbar>
<view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="OrderList.handleChangeTabs">
<wd-tab title="全部" :name="TeaRoomOrderStatusText.All"></wd-tab>
<wd-tab title="待付款" :name="TeaRoomOrderStatusText.Pending"></wd-tab>
<wd-tab title="预约单" :name="TeaRoomOrderStatusText.Pay"></wd-tab>
<wd-tab title="已完结" :name="TeaRoomOrderStatusText.Finished"></wd-tab>
</wd-tabs>
</view>
</view>
<view class="tabs mt-18rpx mx-30rpx">
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaRoom" :order="item"></combo-card>
</view>
</mescroll-body>
</view>
</view>
</template>
<script lang="ts" setup>
import { OrderSource, OrderStatus, TeaRoomOrderStatusText, TeaRoomOrderStatusValue } from '@/utils/order'
import ComboCard from '@/components/order/ComboCard.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { getTeaRoomOrderList } from '@/api/tea-room'
import { router } from '@/utils/tools'
// mescroll
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const downOption = {
auto: true
}
const upOption = {
auto: true,
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const orderStatus = ref<string>('')
const list = ref<Array<any>>([]) // 茶室列表
const keywords = ref<string>('') // 搜索关键词
// tab
const tab = ref<string>('all')
onLoad((args) => {
uni.$on('refreshOrderList', () => {
list.value = []
getMescroll().resetUpScroll()
})
// 根据传过来的参数决定显示哪个tab
if (args.orderStatus) {
tab.value = args.orderStatus
}
})
onUnload(() => {
uni.$off('refreshOrderList')
})
const OrderList = {
/**
* 分页加载
* @param mescroll
*/
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
const filter = {
page: mescroll.num,
size: mescroll.size,
order_status: orderStatus.value,
search: keywords.value
}
getTeaRoomOrderList(filter).then((res) => {
const curPageData = res.list || [] // 当前页数据
if(mescroll.num == 1) list.value = [] // 第一页需手动制空列表
list.value = list.value.concat(curPageData) //追加新数据
mescroll.endSuccess(curPageData.length, Boolean(res.more))
}).catch(() => {
mescroll.endErr() // 请求失败, 结束加载
})
},
/**
* 切换订单状态
* @param e
*/
handleChangeTabs: (e: {index: number, name: string}) => {
tab.value = e.name
if (e.name === TeaRoomOrderStatusText.Pending) {
orderStatus.value = '0'
} else {
orderStatus.value = TeaRoomOrderStatusValue[e.name] || ''
}
// 切换tab时,重置当前的mescroll
list.value = []
getMescroll().resetUpScroll();
},
/**
* 内容搜索
*/
handleSearch: () => {
list.value = []
getMescroll().resetUpScroll();
}
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.tabs {
:deep() {
.wd-tabs,
.wd-tabs__nav {
background-color: transparent !important;
}
.wd-tabs__nav-item {
font-weight: 400 !important;
font-size: 28rpx !important;
color: #606266 !important;
line-height: 40rpx !important;
padding: 0 30rpx !important;
}
.wd-tabs__nav-item.is-active {
font-weight: 500 !important;
color: #303133 !important;
font-size: 32rpx !important;
line-height: 44rpx !important;
}
}
}
</style>

View File

@ -1,604 +0,0 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="pb-254rpx">
<!-- 一键续订 -->
<wd-popup v-model="showRenewPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative pb-26rpx">
<view class="absolute top-18rpx right-30rpx" @click="showRenewPopup = false">
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
</view>
<view class="text-36rpx text-[#121212] leading-50rpx text-center pt-50rpx pb-40rpx">续订包间</view>
<view>
<scroll-view scroll-y class="h-[660rpx] pb-20rpx">
<view class="mx-60rpx">
<view class="text-[#01000D] text-32rpx leading-44rpx">续订时间</view>
<view class="grid grid-cols-4 gap-x-20rpx gap-y-20rpx mt-28rpx">
<view v-for="item in timeList" :key="item.id"
class="h-72rpx rounded-16rpx flex items-center justify-center text-28rpx leading-40rpx"
:class="[item.id == selectedRenewTime ? 'bg-[#4C9F44] text-[#fff]' : 'bg-[#F7F7F7] text-[#606266]']"
@click="selectedRenewTime = item.id">
{{ item.time }}
</view>
</view>
</view>
<view class="mx-60rpx mt-50rpx">
<view class="text-[#01000D] text-32rpx leading-44rpx">续订茶叶
<text class="text-26rpx leading-36rpx text-[#909399] ml-20rpx">支持多选</text>
</view>
<view class="grid grid-cols-3 gap-x-20rpx gap-y-20rpx mt-28rpx">
<view v-for="item in teaList" :key="item.id"
class="h-110rpx rounded-16rpx flex flex-col items-center justify-center text-28rpx leading-40rpx"
:class="selectedRenewTea.includes(item.id) ? 'bg-[#4C9F44] text-[#fff]' : 'bg-[#F7F7F7] text-[#606266]'"
@click="OrderDetail.handleToggleRenewTea(item.id)">
<view>{{item.title}}</view>
<view>{{item.price}}</view>
</view>
</view>
</view>
<view class="mx-60rpx mt-60rpx">
<view class="text-[#01000D] text-32rpx leading-44rpx">支付方式</view>
<view class="mt-28rpx">
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
<view class="flex justify-between items-center mb-40rpx" v-for="(item, index) in payList" :key="index" @click="pay = item.id">
<view class="flex items-center">
<wd-img width="50rpx" height="50rpx" :src="item.icon"></wd-img>
<view class="ml-20rpx text-30rpx text-[#303133] leading-42rpx">{{ item.name }}</view>
</view>
<view class="flex items-center">
<wd-radio :value="item.value">
<view class="text-[#303133] text-26rpx leading-36rpx mr-20rpx" v-if="item.id == 1">可用202.22</view>
</wd-radio>
</view>
</view>
</wd-radio-group>
</view>
</view>
</scroll-view>
<view>
<wd-gap height="2rpx" bg-color="#EFF0F2"></wd-gap>
</view>
<view class="flex justify-between items-center mt-50rpx mx-60rpx">
<view class="flex items-center">
<view class="text-24rpx text-[#303133] leading-34rpx">合计:</view>
<view class="flex items-center h-56rpx mr-16rpx">
<price-format color="#FF5951" :first-size="40" :second-size="40" :subscript-size="28" :price="23.02"></price-format>
<view class="ml-20rpx">
<price-format color="#909399" :first-size="26" :second-size="26" :subscript-size="26" :price="23.02" lineThrough></price-format>
</view>
</view>
</view>
<view>
<wd-button custom-class='!bg-[#4C9F44] !rounded-8rpx !h-70rpx'>立即预定</wd-button>
</view>
</view>
</view>
</view>
</wd-popup>
<!-- 续订成功 -->
<wd-popup v-model="showRenewSuccessPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative pt-64rpx pb-74rpx">
<view class="flex justify-center items-center">
<view class="bg-[#4C9F44] w-280rpx rounded-280rpx">
<wd-img width="280rpx" height="280rpx" :src="`${OSS}images/reserve_room/reserve_room_image7.png`"/>
</view>
</view>
<view class="text-[#303133] text-36rpx leading-46rpx text-center mt-48rpx">茶艺师续订成功</view>
<view class="text-[#9CA3AF] text-28rpx leading-44rpx mt-16rpx text-center">可以刷新页面查看预约时间</view>
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mt-174rpx mx-auto">好的</view>
</view>
</wd-popup>
<!-- 退款规则 -->
<wd-popup v-model="showRefundRule" custom-class="rounded-16rpx" lock-scroll>
<view class="w-592rpx py-52rpx">
<view class="text-36rpx text-[#303133] leading-50rpx text-center">确定申请退款吗?</view>
<view class="font-400 text-32rpx text-[#303133] leading-44rpx text-center mt-40rpx">退款按照如下规则,请谨慎操作。</view>
<view class="font-400 text-32rpx text-[#303133] leading-44rpx px-54rpx mt-18rpx">
<view>1茶艺师未出发100%退款;</view>
<view>2茶艺师已出发未到达目的地不退车马费</view>
<view>3茶艺师出发并到达目的地不退车马费并且支付茶艺师50%服务费。</view>
</view>
<view class="mt-54rpx text-32rpx leading-44rpx flex items-center justify-center leading-80rpx text-center">
<view class="w-240rpx h-80rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="showRefundRule = false">取消</view>
<view class="w-240rpx h-80rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="OrderDetail.handleConfirmRefund">确定退款</view>
</view>
</view>
</wd-popup>
<!-- 取消订单 -->
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
<!-- 费用详情 -->
<wd-popup v-model="showCostPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative pb-30rpx">
<view class="absolute top-18rpx right-30rpx" @click="showCostPopup = false">
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
</view>
<view class="text-36rpx text-[#121212] leading-50rpx text-center pt-50rpx pb-40rpx">费用明细</view>
<view>
<view class="px-30rpx">
<view class="flex justify-between items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">服务费</view>
<view class="font-bold text-30rpx leading-42rpx text-[#303133] flex items-center">
¥640.00
</view>
</view>
<view class="rounded-16rpx py-20rpx">
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
<view>服务费¥160元/小时)</view>
<view>x4</view>
</view>
</view>
</view>
<view class="px-30rpx">
<view class="flex justify-between items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">车马费</view>
<view class="font-bold text-30rpx leading-42rpx text-[#303133] flex items-center">
¥640.00
</view>
</view>
<view class="rounded-16rpx py-20rpx">
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
<view>车马费¥3.00元/公里)</view>
<view>x4</view>
</view>
</view>
</view>
<view class="px-30rpx mb-20rpx">
<view class="flex justify-between items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">茶艺服务</view>
<view class="font-bold text-30rpx leading-42rpx text-[#303133] flex items-center">
¥640.00
</view>
</view>
<view class="rounded-16rpx py-20rpx">
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
<view>红茶/绿茶/福鼎白茶/铁观音</view>
<view>¥158</view>
</view>
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
<view>茶具使用</view>
<view>¥158</view>
</view>
</view>
</view>
<view class="px-30rpx">
<view class="flex justify-between items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">优惠</view>
<view class="font-bold text-30rpx leading-42rpx text-[#303133] flex items-center text-[#4C9F44]">
-¥148.00
</view>
</view>
<view class="rounded-16rpx pt-20rpx">
<view class="font-400 text-28rpx leading-40rpx text-[#303133] flex items-center justify-between mb-16rpx">
<view>优惠券</view>
<view>-¥20</view>
</view>
</view>
</view>
</view>
<view class="mx-60rpx mt-30rpx">
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="mx-60rpx text-30rpx text-[#303133] leading-42rpx flex items-center justify-between mt-30rpx">
<view>实付金额</view>
<view>¥698.90</view>
</view>
</view>
</wd-popup>
<view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]' :leftArrow="false"></navbar>
</view>
<view class="text-[#909399] text-26rpx leading-36rpx mb-40rpx">
<view class="text-center" v-if="orderStatus == TeaSpecialistOrderStatus.Serving || orderStatus == TeaSpecialistOrderStatus.Pay">使用过程中有任何问题请联系客服</view>
<view class="flex items-center justify-center" v-if="orderStatus == TeaSpecialistOrderStatus.Pending">
<view class="flex items-center mr-6rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_time.png`"/>
</view>
<view class="flex items-center text-26rpx leading-36rpx text-[#909399]">
<view>还剩</view>
<view class="mx-6rpx">
<wd-count-down :time="order.time1" custom-class="!text-[#FF5951]" />
</view>
<view>订单自动取消</view>
</view>
</view>
<view class="ml-80rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Finished">感谢您的选择期待再续茶香</view>
<view class="ml-80rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Confirm">您的服务已经结束请及时确认订单</view>
</view>
<!-- 信息模块 -->
<view class="mx-30rpx coupon-bg" >
<view class="flex items-center px-30rpx pt-30rpx">
<view class="mr-30rpx">
<wd-img width="190rpx" height="190rpx" :src="order.teamaster.image" mode="scaleToFill"></wd-img>
</view>
<view class="flex-1">
<view class="flex justify-between items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1 w-280rpx">
{{ order.teamaster.name }}
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
<view class="text-26rpx leading-36rpx text-[#909399]">{{ order.order_amount }}</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>{{ order.teamaster.price }}/小时</view>
<view>x{{ order.hours }}</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view class="w-300rpx line-1">车马费{{ order.fare_price }}/公里</view>
<view>{{ order.fare_distance_price }}/小时</view>
</view>
<view class="text-[#606266] text-right mt-26rpx" v-if="orderStatus !== TeaSpecialistOrderStatus.Pending">
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
<text class="tetx-32rpx leading-36rpx">{{ order.order_amount }}</text>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
</view>
</view>
<view class="mt-70rpx">
<view class="text-30rpx leading-42rpx text-[#303133] px-30rpx">预约信息</view>
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx pb-28rpx"
v-if="orderStatus == TeaSpecialistOrderStatus.Pending || orderStatus == TeaSpecialistOrderStatus.Pay || orderStatus == TeaSpecialistOrderStatus.Serving || orderStatus == TeaSpecialistOrderStatus.Confirm">
<view class="mb-20rpx px-30rpx">预约时间{{ order.start_time }} - {{ order.end_time }}</view>
<view class="flex justify-between items-center pl-30rpx">
<view>预约时长{{ order.hours }}小时</view>
</view>
</view>
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx pb-28rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Cancelled || orderStatus == TeaSpecialistOrderStatus.Finished">
<view class="mb-20rpx px-30rpx">服务时间{{ order.start_time }} - {{ order.end_time }}</view>
<view class="flex justify-between items-center pl-30rpx">
<view>服务时长{{ order.hours }}小时</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>
<view class="flex justify-between items-center relative">
<view>
<view class="text-28rpx leading-40rpx flex items-center mt-22rpx">
<view class="text-[#606266] mr-54rpx">服务方式</view>
<view class="text-[#303133]">{{ Number(order.service_type) == 1 ? '到店服务' : '上门服务'}}</view>
</view>
<view class="text-28rpx leading-40rpx flex items-center mt-22rpx">
<view class="text-[#606266] mr-54rpx">{{ Number(order.service_type) == 1 ? '服务门店' : '服务地址'}}</view>
<view class="text-[#303133] line-1 w-300rpx" v-if="Number(order.service_type) == 1">{{ order.store_address.name }}</view>
<view class="text-[#303133] line-1 w-300rpx" v-if="Number(order.service_type) != 1">
{{ order.address.province }} {{ order.address.city }} {{ order.address.district }} {{ order.address.address }}
</view>
</view>
<view class="text-28rpx leading-40rpx flex items-center mt-22rpx">
<view class="text-[#606266] mr-54rpx">到达时长</view>
<view class="text-[#303133]">{{ order.reach_time }}分钟左右到达</view>
</view>
</view>
<view class="flex absolute top-1/2 right-0 -translate-y-1/2">
<view class="text-center mr-20rpx" @click="OrderDetail.handleOpenMap">
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/>
</view>
<view class="text-center" v-if="orderStatus != TeaSpecialistOrderStatus.Pending" @click="OrderDetail.handleCallService">
<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>{{ order.order_sn }}</text>
<wd-divider vertical />
<text class="text-[#4C9F44]" @click="OrderDetail.handleCopy(order.order_sn)">复制</text>
</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaSpecialistOrderStatus.Pending && order.pay_way">
<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="orderStatus != TeaSpecialistOrderStatus.Pending && orderStatus != TeaSpecialistOrderStatus.Cancelled">
<view>付款时间</view>
<view>{{ order.update_dtime }}</view>
</view>
</view>
<!-- 操作按钮 -->
<view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx" v-if="orderStatus != TeaSpecialistOrderStatus.Cancelled && orderStatus != TeaSpecialistOrderStatus.Finished">
<view class="mt-34rpx">
<!-- 预约单服务中 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx" v-if="orderStatus === TeaSpecialistOrderStatus.Serving || orderStatus == TeaSpecialistOrderStatus.Confirm">
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="OrderDetail.handleConfirmOrder">确认订单</view>
</view>
<!-- 待付款 -->
<view class="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Pending">
<view class="flex items-center">
<view class="text-28rpx leading-40rpx text-[#606266] mr-16rpx" @click="OrderDetail.handleCancelOrder">取消订单</view>
</view>
<view class="w-360rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="OrderDetail.handleToPay">立即支付{{ order.order_amount }}</view>
</view>
<!-- 已预约 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderStatus == TeaSpecialistOrderStatus.Pay">
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="showRefundRule = true">申请退款</view>
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133]" @click="OrderDetail.handleCallService">联系客服</view>
</view>
<!-- 交易完成 -->
<!-- <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx"
v-if="orderStatus == TeaSpecialistOrderStatus.Finished || orderStatus == TeaSpecialistOrderStatus.Cancelled">
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">再次预定</view>
</view> -->
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { TeaSpecialistOrderStatusTextValue, TeaSpecialistOrderStatus } from '@/utils/order'
import { getTeaSpecialistOrderDetails } from '@/api/teaSpecialist-order'
import { toast } from '@/utils/toast'
import { useMessage } from 'wot-design-uni'
const OSS = inject('OSS')
const title = ref<string>('')
const orderStatus = ref<number>(0) // 订单状态:待使用、退款等
const showRefundRule = ref<boolean>(false) // 退款规则弹窗
// 订单倒计时取消
const time = ref<number>(30 * 60 * 60 * 1000)
// 取消订单弹窗
const message = useMessage('wd-message-box-slot')
// 费用明细
const showCostPopup = ref<boolean>(false) // 是否显示退款详情弹出框
/** 续订 **/
const showRenewPopup = ref<boolean>(false)
const timeList = [
{id: 1, time: '1小时'},
{id: 2, time: '2小时'},
{id: 3, time: '3小时'},
{id: 4, time: '4小时'},
{id: 5, time: '5小时'},
{id: 6, time: '6小时'},
]
const selectedRenewTime = ref<number>(0) // 选择的续订时间
const pay = ref<number>(1) // 支付方式
const payList = ref<Array<any>>([
{
id: 1,
name: '平台余额',
icon: `${OSS}icon/icon_platform_balance.png`,
balance: 0,
value: 1
},
{
id: 3,
name: '微信支付',
icon: `${OSS}icon/icon_weichat.png`,
balance: 0,
value: 3
}
])
const teaList = [
{id: 1, title: '红茶(3泡)', price: '¥128.00'},
{id: 2, title: '铁观音(3泡)', price: '¥128.00'},
{id: 3, title: '红茶(3泡)', price: '¥128.00'},
{id: 4, title: '红茶(3泡)', price: '¥128.00'},
{id: 5, title: '红茶(3泡)', price: '¥128.00'},
]
const selectedRenewTea = ref<Array<any>>([]) // 选择的续订时间
const showRenewSuccessPopup = ref<boolean>(false)
// 订单
const orderId = ref<number>(0)
const order = ref<any>({})
onLoad(async (args) => {
orderId.value = args.orderId
// 获取订单详情
OrderDetail.handleInit()
})
onUnload(() => {
uni.$off('refreshOrderDetail')
})
const OrderDetail = {
// 获取订单详情
handleInit: async () => {
const res = await getTeaSpecialistOrderDetails({id: orderId.value})
const data = res.details
order.value = data
title.value = TeaSpecialistOrderStatusTextValue[data.order_status].title || '订单详情'
console.log("🚀 ~ title.value:", title.value)
orderStatus.value = data.order_status
},
// 确认订单
handleConfirmOrder: () => {
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('refreshOrderDetail', () => {
OrderDetail.handleInit()
uni.$off('refreshOrderDetail')
})
handleConfirmOrderHooks(orderId.value)
}
}).catch(() => {
// 点击取消按钮回调事件
})
},
// 续订茶艺师
handleToggleRenewTea: (id: number) => {
const idx = selectedRenewTea.value.indexOf(id)
if (idx > -1) {
selectedRenewTea.value.splice(idx, 1) // 已选中则移除
} else {
selectedRenewTea.value.push(id) // 未选中则添加
}
},
// 再次预定
handleAgainReeserve: () => {
showRenewSuccessPopup.value = true
showRenewPopup.value = false
},
// 申请退款
handleConfirmRefund: () => {
uni.$on('refreshOrderDetail', () => {
showRefundRule.value = false
OrderDetail.handleInit()
uni.$off('refreshOrderDetail')
})
handleRefundOrderHooks(orderId.value, 'order')
},
// 取消订单
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('refreshOrderDetail', () => {
OrderDetail.handleInit()
uni.$off('refreshOrderDetail')
})
handleCancelOrderHooks(orderId.value)
}
toast.info('订单取消成功')
}).catch(() => {
// 点击取消按钮回调事件
})
},
// 支付
handleToPay: () => {
uni.$on('refreshOrderDetail', () => {
OrderDetail.handleInit()
uni.$off('refreshOrderDetail')
})
handleToPayHooks(orderId.value, order.value.teamaster.id)
},
// 打开地图
handleOpenMap: () => {
if (Number(order.value.service_type) == 1) {
uni.openLocation({
latitude: Number(order.value.store_address.latitude),
longitude: Number(order.value.store_address.longitude),
name: order.value.store_address.name,
address: order.value.store_address.address,
})
} else {
uni.openLocation({
latitude: Number(order.value.address.latitude),
longitude: Number(order.value.address.longitude),
name: order.value.address.address,
address: order.value.address.province + ' ' + order.value.address.city + ' ' + order.value.address.district + ' ' + order.value.address.address,
})
}
},
// 联系客服
handleCallService: () => {
uni.makePhoneCall({
phoneNumber: order.value.customer_service_phone, // 替换为需要拨打的电话号码
});
},
// 复制订单号
handleCopy: (text: string) => {
uni.setClipboardData({
data: text,
success: () => {
toast.info('复制成功')
}
})
}
}
</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>

View File

@ -1,196 +0,0 @@
<route lang="jsonc" type="page">{
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="">
<view class="order-list sticky top-0 left-0 z-50 bg-[#F6F7F8] pb-10rpx">
<wd-navbar safeAreaInsetTop custom-class='!bg-[#F6F7F8]' :bordered="false" placeholder>
<template #left>
<view class="h-48rpx flex items-center">
<view class="mt-4rpx" @click="router.navigateBack()">
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon>
</view>
<view class="search-box">
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索茶室订单"></wd-search>
</view>
</view>
</template>
</wd-navbar>
<view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="OrderList.handleChangeTabs">
<wd-tab title="全部" :name="TeaSpecialistOrderStatusText.All"></wd-tab>
<wd-tab title="待付款" :name="TeaSpecialistOrderStatusText.Pending"></wd-tab>
<wd-tab title="预约单" :name="TeaSpecialistOrderStatusText.Pay"></wd-tab>
<wd-tab title="待确认" :name="TeaSpecialistOrderStatusText.Confirm"></wd-tab>
<wd-tab title="已完结" :name="TeaSpecialistOrderStatusText.Finished"></wd-tab>
</wd-tabs>
</view>
</view>
<view class="tabs mt-18rpx mx-30rpx">
<!-- 这里可以尝试下不重新刷新获取列表 -->
<!-- 全部 -->
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaRoom" :order="item"></combo-card>
</view>
</mescroll-body>
<!-- 待付款 -->
<!-- <mescroll-body ref="mescrollItem1" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption" v-if="tab === OrderStatus.Pending">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view>
</mescroll-body> -->
<!-- 预约单 -->
<!-- <mescroll-body ref="mescrollItem2" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption" v-if="tab === OrderStatus.Reserved">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view>
</mescroll-body> -->
<!-- 待确认 -->
<!-- <mescroll-body ref="mescrollItem2" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption" v-if="tab === OrderStatus.Confirm">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view>
</mescroll-body> -->
<!-- 已完结 -->
<!-- <mescroll-body ref="mescrollItem3" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" v-if="tab === OrderStatus.Finished">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view>
</mescroll-body> -->
</view>
</view>
</template>
<script lang="ts" setup>
import { getTeaSpecialistOrderList } from '@/api/teaSpecialist-order'
import ComboCard from '@/components/order/ComboCard.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { OrderSource, OrderStatus, TeaSpecialistOrderStatusText, TeaSpecialistOrderStatusValue } from '@/utils/order'
import { router } from '@/utils/tools'
/* mescroll */
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const downOption = {
auto: true
}
const upOption = {
auto: true,
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const list = ref<Array<any>>([]) // 茶艺师列表
const keywords = ref<string>('')
const orderStatus = ref<string>('')
// tab
const tab = ref<string>('all')
onLoad((args) => {
uni.$on('refreshOrderList', () => {
list.value = []
getMescroll().resetUpScroll()
})
// 根据传过来的参数决定显示哪个tab
if (args.orderStatus) {
tab.value = args.orderStatus
}
})
onUnload(() => {
uni.$off('refreshOrderList')
})
const OrderList = {
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
upCallback: (mescroll) => {
const filter = {
page: mescroll.num,
size: mescroll.size,
order_status: orderStatus.value,
search: keywords.value
}
getTeaSpecialistOrderList(filter).then((res) => {
const curPageData = res.list || [] // 当前页数据
if(mescroll.num == 1) list.value = [] // 第一页需手动制空列表
list.value = list.value.concat(curPageData) //追加新数据
mescroll.endSuccess(curPageData.length, Boolean(res.more))
}).catch(() => {
mescroll.endErr() // 请求失败, 结束加载
})
},
// 切换tab
handleChangeTabs: (e: {index: number, name: string}) => {
tab.value = e.name
if (e.name === TeaSpecialistOrderStatusText.Pending) {
orderStatus.value = '0'
} else {
orderStatus.value = TeaSpecialistOrderStatusValue[e.name] || ''
}
// 切换tab时,重置当前的mescroll
list.value = []
getMescroll().resetUpScroll();
},
// 返回上一页
handleBack: () => {
uni.navigateBack({
delta: 1
})
},
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.order-list {
:deep() {
.wd-navbar__left {
width: 100%;
}
}
}
.tabs {
:deep() {
.wd-tabs,
.wd-tabs__nav {
background-color: transparent !important;
}
.wd-tabs__nav-item {
font-weight: 400 !important;
font-size: 28rpx !important;
color: #606266 !important;
line-height: 40rpx !important;
padding: 0 30rpx !important;
}
.wd-tabs__nav-item.is-active {
font-weight: 500 !important;
color: #303133 !important;
font-size: 32rpx !important;
line-height: 44rpx !important;
}
}
}
</style>

View File

@ -1,439 +0,0 @@
<template>
<view>
<!-- 改价弹窗 -->
<wd-popup v-model="showChangePricePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;background-color: #F8F9FA;" position="bottom">
<view class="relative pb-56rpx">
<view class="absolute top-18rpx right-30rpx" @click="showChangePricePopup = false">
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
</view>
<view class="text-36rpx text-[#121212] leading-50rpx text-center pt-50rpx pb-40rpx">改价</view>
<view class="bg-white mx-30rpx rounded-10rpx px-30rpx py-32rpx">
<view class="flex items-center">
<view class="mr-28rpx">
<wd-img width="152rpx" height="152rpx" :src="order.main_image"></wd-img>
</view>
<view class="flex-1" @click="ComboCard.handleToOrderDetail">
<view class="flex items-center relative">
<view class="w-400rpx line-1 font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">
{{ order.title }}
</view>
</view>
<view class="flex items-center mt-16rpx">
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mr-8rpx">ID:{{order.code}}</view>
<wd-icon name="file-copy" size="32rpx" color='#707070' @click="copy(order.code)"></wd-icon>
</view>
<view class="flex items-center">
<price-format color="#FF5951" :first-size="36" :second-size="36" :subscript-size="24" :price="order.discount_price"></price-format>
<view class="rounded-4rpx w-60rpx text-center text-[#FF5951] border-2rpx border-solid border-[#FF5951] text-22rpx pb-4rpx mx-14rpx">{{ order.discount }}</view>
<price-format color="#BFC2CC" :first-size="22" :second-size="22" :subscript-size="22" :price="order.price" lineThrough></price-format>
</view>
</view>
</view>
</view>
<view class="bg-white mx-30rpx mt-20rpx rounded-10rpx px-30rpx py-32rpx">
<view class="flex items-center">
<view class="font-400 text-28rpx leading-40rpx text-[#303133] mr-26rpx w-100rpx whitespace-nowrap">
团购价
</view>
<wd-input
clearable
type="text"
placeholder="请输入"
v-model="changePrice"
no-border
custom-class="!rounded-16rpx !text-30rpx !leading-48rpx !border-2rpx !border-solid !border-[#F0F0F0] !w-[100%]"
custom-input-class="!h-96rpx !px-20rpx">
<template #prefix>
<text class="p-28rpx"></text>
</template>
</wd-input>
</view>
<view class="flex items-center mt-24rpx">
<view class="font-400 text-28rpx leading-40rpx text-[#303133] mr-26rpx w-100rpx whitespace-nowrap">门市价</view>
<view class="">
<price-format color="#303133" :first-size="30" :second-size="30" :subscript-size="30" :price="order.price"></price-format>
</view>
</view>
</view>
<view class="font-400 mx-48rpx h-90rpx leading-90rpx rounded-8rpx text-center mt-80rpx text-[#fff] bg-[#4C9F44] text-30rpx font-400" @click="ComboCard.handleConfirmChangePrice">确定</view>
</view>
</wd-popup>
<!-- 茶室管理端-套餐管理 -->
<view v-if="type === OrderSource.SetMeal" class="bg-white rounded-10rpx p-28rpx">
<view class="">
<view class="flex items-center">
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="order.main_image" radius="10rpx"></wd-img>
</view>
<view class="flex-1" @click="router.navigateTo(`/bundle/setmeal/detail?id=${order.id}`)">
<view class="flex items-center relative">
<view class="w-400rpx flex items-center">
<view class="font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">{{ order.title }}</view>
</view>
</view>
<view class="flex items-center mt-16rpx">
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mr-8rpx">ID:{{ order.code }}</view>
<wd-icon name="file-copy" size="32rpx" color='#707070' @click="copy(order.code)"></wd-icon>
</view>
<view class="flex items-center">
<price-format color="#FF5951" :first-size="36" :second-size="36" :subscript-size="24" :price="order.discount_price"></price-format>
<view class="rounded-4rpx w-60rpx text-center text-[#FF5951] border-2rpx border-solid border-[#FF5951] text-22rpx pb-4rpx mx-14rpx">{{ order.discount }}</view>
<price-format color="#BFC2CC" :first-size="22" :second-size="22" :subscript-size="22" :price="order.price" lineThrough></price-format>
</view>
</view>
</view>
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mt-42rpx flex items-center justify-between">
<view class="">
<text class="font-400 text-26rpx text-[#606266] leading-36rpx mr-10rpx">年售</text>
<text class="font-bold text-26rpx text-[#606266] leading-36rpx ">{{ order.sold }}</text>
</view>
<template v-if="order.status == 1">
<view class="flex items-center">
<!-- 上架 -->
<!-- <view class="font-500 text-28rpx text-[#303133] leading-40rpx mr-18rpx" @click='ComboCard.handleMore'>更多</view> -->
<!-- <view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx mr-12rpx"
@click="ComboCard.handleOpenChangePricePopup()">改价</view> -->
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx mr-12rpx"
@click="ComboCard.handleDelisted()"> 下架</view>
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx"
@click="router.navigateTo(`/bundle/setmeal/add?type=edit&id=${order.id}`)">编辑</view>
</view>
</template>
<template v-if="order.status == 0">
<view class="flex items-center">
<!-- 下架 -->
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx mr-12rpx"
@click="ComboCard.handleDelteSetmealOrder()">删除</view>
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx mr-12rpx"
@click="ComboCard.handleAdd()"> 上架</view>
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx"
@click="router.navigateTo(`/bundle/setmeal/add?type=edit&id=${order.id}`)">编辑</view>
</view>
</template>
</view>
</view>
</view>
<!-- 茶室管理端-订单管理 -->
<view v-if="type === OrderSource.Admin" class="bg-white rounded-10rpx p-30rpx">
<view class="flex justify-between items-center">
<view class="flex items-center">
<view class="mr-10rpx flex items-center">
<wd-img width="40rpx" height="40rpx" :src="`${OSS}icon/icon_tea_room.png`"></wd-img>
</view>
<view class="flex items-center w-400rpx">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1">{{ order.store_name }}</view>
</view>
</view>
<view class="font-400 text-28rpx leading-40rpx mt-12rpx text-[#4C9F44]">
<text v-if="order.order_status === AdminOrderStatus.ToUse" class="text-[#FF5951]" >待使用</text>
<text v-if="order.order_status === AdminOrderStatus.Consuming">使用中</text>
<text v-if="order.order_status === AdminOrderStatus.Finished" class="text-[#606266]">完成</text>
<text v-if="order.order_status === AdminOrderStatus.Cancelled" class="text-[#C9C9C9]">取消订单</text>
</view>
</view>
<view class="mt-22rpx">
<view class="flex items-center">
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="order.img" radius="10rpx"></wd-img>
</view>
<view class="flex-1">
<view @click="ComboCard.handleToOrderDetail(order.id)">
<view class="font-500 text-30rpx text-[#303133] leading-42rpx line-1 w-400rpx">{{ order.room_name }}</view>
<view class="font-400 leading-36rpx text-26rpx text-[#606266] mt-34rpx">
<view>预约时间{{ order.day_title }} {{ order.start_time }}-{{ order.end_time }}</view>
<view class="mt-18rpx">预约时长{{ order.hours }}小时</view>
<view class="mt-18rpx">用户手机号{{ order.user_mobile }}</view>
</view>
</view>
</view>
</view>
<!-- 操作按钮 -->
<template v-if="order.order_status === AdminOrderStatus.ToUse || order.order_status === AdminOrderStatus.Consuming">
<view class="text-center flex items-center text-28rpx mt-28rpx justify-end">
<view v-if="order.order_status === AdminOrderStatus.Consuming" class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx flex items-center justify-center"
@click="ComboCard.handleReleaseOrder(order.id)">释放时间</view>
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44] flex items-center justify-center"
@click="ComboCard.handleCancelOrder(order.id)">取消订单</view>
</view>
</template>
<!-- <template v-if="order.order_status === AdminOrderStatus.Finished || order.order_status === AdminOrderStatus.Cancelled">
<view class="text-center flex items-center text-28rpx mt-28rpx justify-end">
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] flex items-center justify-center"
@click="ComboCard.handleDeleteOrder(order.id)">删除</view>
</view>
</template> -->
</view>
</view>
<!-- 取消订单, 删除订单 -->
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
</view>
</template>
<script lang="ts" setup name="ComboCard">
import { OrderSource, AdminOrderStatus } from '@/utils/order'
import { useMessage } from 'wot-design-uni'
import { toast } from '@/utils/toast'
import { handleReleaseTeaRoomOrderHookds, handleCancelOrderHooks, handleDeleteOrderHooks } from '@/hooks/useOrder'
import { router, copy } from '@/utils/tools'
import { toggleTeaSpecialistOrderPackageStatus, deleteTeaSpecialistOrderPackage } from '@/api/order'
// 改价弹窗
const showChangePricePopup = ref<boolean>(false)
const changePrice = ref<string>('')
// 取消订单弹窗
const message = useMessage('wd-message-box-slot')
/**
* ComboCard 套餐卡片组件
* @description 展示订单列表套餐卡片信息
*/
const OSS = inject('OSS')
const props = defineProps({
/**
* 类型:
*/
type: {
type: String,
default: OrderSource.Combo
},
order: {
type: Object,
default: {}
}
})
const emit = defineEmits(['refresh'])
const ComboCard = {
/**
* 详情页
*/
handleToOrderDetail: (id: number) => {
if (props.type == OrderSource.Admin) {
router.navigateTo(`/pages/order/order-detail?id=${id}`)
}
},
/**
* 设置不可用日期
*/
handleMore: () => {
toast.info('功能开发中')
},
/**
* 改价弹窗
*/
handleOpenChangePricePopup: () => {
showChangePricePopup.value = true
},
/**
* 确认改价
*/
handleConfirmChangePrice: () => {
ComboCard.handleOpenChangePricePopup()
},
/**
* 下架商品
*/
handleDelisted: () => {
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(async (res) => {
if (res.action == 'confirm') {
await toggleTeaSpecialistOrderPackageStatus(props.order.id, 0)
emit('refresh')
toast.info('下架成功')
}
// 点击确认按钮回调事件
}).catch(() => {
// 点击取消按钮回调事件
})
},
/**
* 上架商品
*/
handleAdd: () => {
message.confirm({
title: '您确认要上架该商品吗?',
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(async (res) => {
if (res.action == 'confirm') {
await toggleTeaSpecialistOrderPackageStatus(props.order.id, 1)
emit('refresh')
toast.info('上架成功')
}
// 点击确认按钮回调事件
}).catch(() => {
// 点击取消按钮回调事件
})
},
/**
* 删除套餐
*/
// handleDelteSetmealOrder: () => {
// 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(async (res) => {
// if (res.action == 'confirm') {
// await deleteTeaSpecialistOrderPackage(props.order.id)
// emit('refresh')
// toast.info('删除成功')
// }
// // 点击确认按钮回调事件
// }).catch(() => {
// // 点击取消按钮回调事件
// })
// },
/**
* 编辑商品
*/
handleEdit: () => {
},
/**
* 跳转到对对应室的详情页
*/
handleToStore: () => {
handleToTRStoreHooks(props.order.store_id, props.order.operation_type)
},
/**
* 删除订单
*/
handleDeleteOrder: (orderId: number) => {
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', () => {
emit('refresh')
uni.$off('refreshOrderList')
})
handleDeleteOrderHooks(orderId)
}
}).catch(() => {
// 点击取消按钮回调事件
})
},
/**
* 取消订单
*/
handleCancelOrder: (orderId: number) => {
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', () => {
emit('refresh')
uni.$off('refreshOrderList')
})
handleCancelOrderHooks(orderId)
}
}).catch(() => {
// 点击取消按钮回调事件
})
},
/**
* 释放时间
*/
handleReleaseOrder: (orderId: number) => {
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', () => {
emit('refresh')
uni.$off('refreshOrderList')
})
handleReleaseTeaRoomOrderHookds(orderId)
}
}).catch(() => { })
},
}
</script>
<script lang="ts">
export default {}
</script>

View File

@ -1,187 +0,0 @@
<template>
<view>
<!-- 平台团购直营店待使用平台团购加盟已使用抖音待使用 -->
<view class="bg-white rounded-16rpx p-30rpx" v-if="type === 'Direct' || type === 'Franchise' || type === 'DouYin'">
<view class="flex items-center" @click="comboCoupon.handleToStore">
<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="comboCoupon.handleToStore">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-362rpx line-1">团购套餐的可以点击跳转团购套餐的可以点击跳转团购套餐的可以点击跳转 </view>
<wd-icon name="chevron-right" size="32rpx" v-if="type === 'Direct'"></wd-icon>
<view class="text-26rpx leading-36rpx text-[#909399]" v-if="type === 'DouYin' || type === 'Franchise'">324</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>3小时</view>
<view v-if="type === 'Direct' || type === 'Franchise'">x1</view>
</view>
<view class="text-[#606266] text-right mt-26rpx" v-if="type === 'Direct'">
<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 class="font-400 text-26rpx text-[#606266] leading-40rpx mt-40rpx" v-if="type === 'DouYin'">
适用包间青茶红茶绿茶
</view>
</view>
</view>
<!-- 平台团购直营店待使用 -->
<view class="mt-30rpx font-500 leading-48rpx" v-if="type === 'Direct' && orderStatus === OrderStatus.ToUse">
<view class="text-26rpx text-[#606266]">有效期2025.04.04-2025.12.31</view>
<view class="text-28rpx text-[#303133] mt-18rpx">
<text class="mr-20rpx">券码 1052 4258 5654 125</text>
<text class="text-[#4C9F44]">复制</text>
</view>
</view>
</view>
<!-- 平台团购直营店已使用 -->
<view class="coupon-bg" v-if="type === 'Direct' && orderStatus === OrderStatus.Used">
<view class="flex items-center px-30rpx pt-30rpx pb-40rpx" @click="comboCoupon.handleToStore">
<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="comboCoupon.handleToStore">
<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="px-30rpx mt-28rpx pb-48rpx">
<view class="text-30rpx leading-42rpx text-[#303133]">预约信息</view>
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx">
<view class="mb-20rpx">预约时间2025-03-18 09:00-12:00</view>
<view>预约时长3小时</view>
</view>
</view>
</view>
<!-- 平台团购加盟-待使用 -->
<view class="coupon-bg2 p-30rpx" v-if="type === 'Franchise' && orderStatus === OrderStatus.ToUse">
<view class="flex items-center">
<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="comboCoupon.handleToStore">
<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>
<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-30rpx font-500 leading-48rpx text-[#606266] text-26rpx pb-44rpx">
有效期2025.04.04-2025.12.31
</view>
<view class="px-30rpx mt-60rpx">
<view class="text-center">
<wd-img width="230rpx" height="230rpx" :src="`${OSS}images/reserve_room/reserve_room_image3.png`"></wd-img>
</view>
<view class="text-28rpx text-[#303133] mt-32rpx text-center">
<text class="mr-20rpx">券码 1052 4258 5654 125</text>
<text class="text-[#4C9F44]">复制</text>
</view>
</view>
</view>
<!-- 抖音团购已使用 -->
<view class="bg-white rounded-16rpx p-30rpx" v-if="orderStatus === OrderStatus.Used && type === 'DouYin'">
<view class="flex items-center" @click="comboCoupon.handleToStore">
<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="comboCoupon.handleToStore">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-300rpx line-1">这是团购套餐的名字</view>
<view class="text-26rpx leading-36rpx text-[#909399] mt-8rpx">324</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
3小时
</view>
<view class="font-400 text-26rpx text-[#606266] leading-40rpx mt-40rpx">
适用包间青茶红茶绿茶
</view>
</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup name="ComboCoupon">
import { OrderStatus } from '@/utils/order'
/**
* Combo 套餐券组件
* @description 订单详情页下的套餐卡片详情,带有券码、二维码内容
*/
const OSS = inject('OSS')
defineProps({
/**
* 类型: 直营(Direct)、抖音(DouYin)、加盟(Franchise) 等
*/
type: {
type: String,
default: ''
},
/**
* 订单类型: 待使用、退款等
* TODO 这里的orderStatus在接入接口的时候需要改为类似于data.orderStatus这种形式
*/
orderStatus: {
type: String,
default: ''
}
})
const comboCoupon = {
handleToStore: () => {
uni.navigateTo({
url: '/src/bundle/order/platform/store-detail'
})
}
}
</script>
<script lang="ts">
export default {}
</script>
<style lang="scss" scoped>
.coupon-bg {
background-image: url(#{$OSS}images/order/order_image2.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
.coupon-bg2 {
background-image: url(#{$OSS}images/order/order_image1.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
</style>

View File

@ -1,146 +0,0 @@
<route lang="jsonc" type="page">{
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="pb-40rpx">
<view>
<navbar title="订单续订" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view class="mt-38rpx">
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="Renew.upCallback" :down="downOption" :up="upOption">
<view class="bg-white rounded-16rpx p-30rpx mx-32rpx relative mb-20rpx" v-for="item in list" :key="item.id">
<view class="absolute top-0 right-0 bg-[#4C9F44] text-[#fff] w-160rpx h-64rpx leading-64rpx text-center xd" @click="selectRenewOrderId = item.id; showRenewTimePopup = true">
续单
</view>
<view class="flex items-center">
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="item.img" radius="10rpx"></wd-img>
</view>
<view class="flex-1">
<view @click="ComboCard.handleToOrderDetail">
<view class="font-bold text-28rpx text-[#303133] leading-40rpx line-2 w-260rpx">{{ item.room_name }}</view>
<view class="font-400 leading-36rpx text-26rpx text-[#606266] mt-10rpx">
<view>预约时间{{ item.day_time }} {{ item.start_time }}-{{ item.end_time }}</view>
<view class="mt-18rpx">预约时长{{ item.hours }}小时</view>
</view>
</view>
</view>
</view>
</view>
</mescroll-body>
</view>
<!-- <view class="bg-[#4C9F44] w-630rpx h-90rpx text-[#fff] text-center leading-90rpx rounded-8rpx mx-auto mt-50rpx">确定</view> -->
<!-- 选择续订时间 -->
<renew-time v-model="showRenewTimePopup" @selectedTime="Renew.handleChooseRenewTime"></renew-time>
</view>
</template>
<script lang="ts" setup>
import ComboCard from '@/components/order/ComboCard.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { router } from '@/utils/tools'
import { getStoreOrderList, renewOrder, getRenewList} from '@/api/order'
import { useStoreStore } from '@/store'
import { toast } from '@/utils/toast'
const OSS = inject('OSS')
const useStore = useStoreStore()
// mescroll
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const downOption = {
auto: true
}
const upOption = {
auto: true,
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const list = ref<Array<any>>([]) // 茶室列表
// 续单
const reserveTime = ref<Array<any>>([])
const showRenewTimePopup = ref<boolean>(false)
const selectRenewOrderId = ref<number>(0)
onLoad(async (args) => {
// 预定时间
// const next7 = await getNext7Days()
// Object.assign(sevenDay, next7)
})
onUnload(() => {
})
const Renew = {
/**
* 分页加载
* @param mescroll
*/
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
const filter = {
page: mescroll.num,
size: mescroll.size,
store_id: useStore.defaultStore.id,
}
getRenewList(filter).then((res) => {
const curPageData = res.list || [] // 当前页数据
if(mescroll.num == 1) list.value = [] // 第一页需手动制空列表
list.value = list.value.concat(curPageData) //追加新数据
mescroll.endSuccess(curPageData.length, Boolean(res.more))
}).catch(() => {
mescroll.endErr() // 请求失败, 结束加载
})
},
/**
* 一键续订时间
*/
handleChooseRenewTime: async (item) => {
uni.showLoading({
title: '操作中...',
mask: true
})
try {
uni.hideLoading()
await renewOrder({
id: selectRenewOrderId.value,
renew_hour: item.value
})
list.value = []
getMescroll().resetUpScroll()
toast.success('续订成功')
} catch (error) {
uni.hideLoading()
toast.info('续订失败,请稍后重试')
return
}
console.log("🚀 ~ item:", item)
}
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.xd {
border-radius: 0rpx 10rpx 0rpx 10rpx;
}
</style>