完善页面
This commit is contained in:
wangxiaowei
@ -1,5 +1,6 @@
|
||||
<route lang="jsonc" type="page">
|
||||
{
|
||||
"needLogin": true,
|
||||
"layout": "default",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
@ -10,7 +11,7 @@
|
||||
<template>
|
||||
<view class="pb-254rpx">
|
||||
<!-- 一键续订 -->
|
||||
<wd-popup v-model="showRenewPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
|
||||
<!-- <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>
|
||||
@ -68,6 +69,53 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup> -->
|
||||
<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 class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="showBookTimePopup = true;">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">预定时间</view>
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="text-[26rpx] text-[#606266] leading-36rpx">{{ sevenDay.minimum_time }}小时起订</view>
|
||||
<view class="flex items-center">
|
||||
<view class="text-[28rpx] text-[#909399] leading-40rpx w-430rpx line-1 text-right">
|
||||
<template v-if="reserveTime.length > 0">
|
||||
{{ reserveTime[0] }} {{ reserveTime[1].join(',') }}
|
||||
</template>
|
||||
<template v-else>
|
||||
请选择
|
||||
</template>
|
||||
</view>
|
||||
<view>
|
||||
<wd-icon name="chevron-right" size="32rpx" color="#909399"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-102rpx">
|
||||
<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="totalReserveMoney"></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' @click="OrderDetail.handleRenewReserve">立即预定</wd-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 续订成功 -->
|
||||
@ -80,7 +128,7 @@
|
||||
</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 class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mt-174rpx mx-auto" @click="showRenewSuccessPopup = false">好的</view>
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
@ -142,49 +190,53 @@
|
||||
</view>
|
||||
</wd-popup>
|
||||
|
||||
<!-- 选择预定时间 -->
|
||||
<booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="OrderDetail.handleChooseReserveTime"></booking-time>
|
||||
|
||||
<view>
|
||||
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<!-- 描述信息 -->
|
||||
<view class="text-[#909399] text-26rpx leading-36rpx mb-40rpx mt-20rpx">
|
||||
<view class="ml-80rpx" v-if="orderStatus === OrderStatus.Consuming || orderStatus === OrderStatus.Reserved">使用过程中有任何问题，请联系客服</view>
|
||||
<view class="flex items-center justify-center" v-if="orderStatus === OrderStatus.Pending">
|
||||
<view class="ml-80rpx" v-if="orderStatus === TeaRoomOrderStatus.Pay || orderStatus === TeaRoomOrderStatus.Consumption">使用过程中有任何问题，请联系客服</view>
|
||||
<view class="flex items-center justify-center" v-if="orderStatus === TeaRoomOrderStatus.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="time" custom-class="!text-[#FF5951]" />
|
||||
<wd-count-down :time="order.time1" custom-class="!text-[#FF5951]" />
|
||||
</view>
|
||||
<view>订单自动取消</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ml-80rpx" v-if="orderStatus === OrderStatus.Finished">品一口香茗，让生活慢下来，从一杯好茶开始</view>
|
||||
<view class="ml-80rpx" v-if="orderStatus === TeaRoomOrderStatus.Finished">品一口香茗，让生活慢下来，从一杯好茶开始</view>
|
||||
</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>
|
||||
<wd-img width="190rpx" height="190rpx" :src="order.room_msg.img" 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-300rpx">
|
||||
这个是包间的名称
|
||||
<view class="flex justify-between items-center" @click="OrderDetail.handleToStore">
|
||||
<view class="flex items-center font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx">
|
||||
<view class="line-1 w-300rpx">
|
||||
{{ order.room_msg.title }}
|
||||
</view>
|
||||
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
|
||||
</view>
|
||||
<view class="text-26rpx leading-36rpx text-[#909399]">￥324</view>
|
||||
<view class="text-26rpx leading-36rpx text-[#909399]">￥{{ order.room_all_price }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
|
||||
<view>3小时</view>
|
||||
<view>x1</view>
|
||||
￥{{ order.room_price }}/小时
|
||||
</view>
|
||||
<!-- 等待付款不显示实付金额 -->
|
||||
<view class="text-[#606266] text-right mt-26rpx" v-if="orderStatus !== OrderStatus.Pending">
|
||||
<view class="text-[#606266] text-right mt-26rpx" v-if="orderStatus !== TeaRoomOrderStatus.Pending">
|
||||
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
|
||||
<text class="tetx-32rpx leading-36rpx">￥29.32</text>
|
||||
<text class="tetx-32rpx leading-36rpx">￥{{ order.order_amount }}</text>
|
||||
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
@ -193,13 +245,13 @@
|
||||
<view class="mt-28rpx pb-36rpx">
|
||||
<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="mb-20rpx px-30rpx">预约时间：{{ order.day_time }} {{ order.renew_dtime.start_time || order.start_time }}-{{ order.renew_dtime.end_time || order.end_time }}</view>
|
||||
<view class="flex justify-between items-center pl-30rpx" >
|
||||
<view>预约时长：3小时</view>
|
||||
<view>预约时长：{{ order.hours }}小时</view>
|
||||
<!-- 已预约和消费中显示一键续订 -->
|
||||
<view v-if="orderStatus === OrderStatus.Reserved || orderStatus === OrderStatus.Consuming"
|
||||
<view v-if="orderStatus === TeaRoomOrderStatus.Pay || orderStatus === TeaRoomOrderStatus.Consumption"
|
||||
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"
|
||||
@click="showRenewPopup = true">
|
||||
@click="showRenewPopup = true; showBookTimePopup = true">
|
||||
一键续订
|
||||
</view>
|
||||
</view>
|
||||
@ -208,7 +260,7 @@
|
||||
</view>
|
||||
|
||||
<!-- 已预约和消费中显示开门锁 -->
|
||||
<view class="bg-white rounded-16rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderStatus.Reserved || orderStatus === OrderStatus.Consuming">
|
||||
<view class="bg-white rounded-16rpx mx-30rpx mt-20rpx" v-if="orderStatus === TeaRoomOrderStatus.Pay || orderStatus === TeaRoomOrderStatus.Consumption">
|
||||
<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>
|
||||
@ -241,24 +293,24 @@
|
||||
<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>
|
||||
<wd-img width="170rpx" height="170rpx" :src="order.store_msg.image"></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="text-[#303133] text-30rpx leading-40rpx line-2" @click="handleToTeaRoomStoreHooks(order.store_msg.id, order.store_msg.operation_type)">{{ order.store_msg.name }}</view>
|
||||
<view class="mt-26rpx text-[#909399] text-24rpx leading-34rpx">距您{{ order.distance }}km</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 class="ml-2rpx text-26rpx text-[#606266] line-1 w-300rpx">{{ order.store_msg.address }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex absolute top-1/2 right-0 -translate-y-1/2">
|
||||
<view class="text-center mr-20rpx" >
|
||||
<view class="text-center mr-20rpx" @click="OrderDetail.handleLocation">
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/>
|
||||
</view>
|
||||
<view class="text-center" >
|
||||
<view class="text-center" @click="OrderDetail.handleCallPhone">
|
||||
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`"/>
|
||||
</view>
|
||||
</view>
|
||||
@ -266,64 +318,46 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 支付方式 -->
|
||||
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderStatus.Pending">
|
||||
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
|
||||
<block v-for="(item, index) in PayList" :key="index">
|
||||
<view
|
||||
class="flex justify-between items-center"
|
||||
:class="index !== PayList.length - 1 ? 'mb-40rpx' : ''"
|
||||
>
|
||||
<view class="flex items-center">
|
||||
<wd-img width="50rpx" height="50rpx" :src="`${OSS}${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.type !== PayCategory.WeChatPay">可用202.22</view>
|
||||
</wd-radio>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</wd-radio-group>
|
||||
</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>
|
||||
<text>{{ order.order_sn }}</text>
|
||||
<wd-divider vertical />
|
||||
<text class="text-[#4C9F44]">复制</text>
|
||||
<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" v-if="orderStatus !== OrderStatus.Pending">
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaRoomOrderStatus.Pending && order.pay_way">
|
||||
<view>交易方式</view>
|
||||
<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>2019-05-16 12:20:26</view>
|
||||
<view>{{ order.dtime }}</view>
|
||||
</view>
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus !== OrderStatus.Pending">
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaRoomOrderStatus.Pending && orderStatus != TeaRoomOrderStatus.Cancelled && order.pay_way_title">
|
||||
<view>付款时间</view>
|
||||
<view>2019-05-16 13:20:26</view>
|
||||
<view>{{ order.update_dtime }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx">
|
||||
<!-- 已预约 -->
|
||||
<view
|
||||
class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx"
|
||||
v-if="orderStatus === OrderStatus.Reserved || orderStatus === OrderStatus.Consuming">
|
||||
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">分享房间给朋友</view>
|
||||
<view class="flex items-center justify-center text-32rpx leading-44rpx leading-90rpx text-center !mt-34rpx" v-if="orderStatus == TeaRoomOrderStatus.Pay || orderStatus == TeaRoomOrderStatus.Consumption">
|
||||
<wd-button custom-class="!text-32rpx !w-630rpx !h-90rpx !bg-[#4C9F44] !rounded-8rpx !text-[#fff]" open-type="share">分享房间给朋友</wd-button>
|
||||
</view>
|
||||
|
||||
<!-- 待付款 -->
|
||||
<view class="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus === OrderStatus.Pending">
|
||||
<view class="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus == TeaRoomOrderStatus.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="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus === TeaRoomOrderStatus.Pending">
|
||||
<view class="flex items-center">
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] mr-16rpx" @click="OrderDetail.handleCancelOrder">取消</view>
|
||||
<view class="flex items-center">
|
||||
@ -337,11 +371,11 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="w-178rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff]">立即预定</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<!-- 交易完成 -->
|
||||
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx"
|
||||
v-if="orderStatus === OrderStatus.Finished || orderStatus === OrderStatus.Cancelled">
|
||||
<view @click="OrderDetail.handleAgainReserve" class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx"
|
||||
v-if="orderStatus === TeaRoomOrderStatus.Finished || orderStatus === TeaRoomOrderStatus.Cancelled">
|
||||
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">再次预定</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -349,14 +383,21 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { OrderStatus, OrderSource, OrderStatusTitle } from '@/utils/order'
|
||||
import { TeaRoomOrderStatusTextValue, TeaRoomOrderStatus } from '@/utils/order'
|
||||
import { useMessage } from 'wot-design-uni'
|
||||
import {toast} from '@/utils/toast'
|
||||
import { PayList, PayCategory, PayValue } from '@/utils/pay'
|
||||
import { getTeaRoomOrderDetail } from '@/api/tea-room'
|
||||
import { handleTRCancelOrderHooks, handleTRToPayHooks } from '@/hooks/useOrder'
|
||||
import type { ITeaSpecialistOrderDetailsResult } from '@/api/types/tea'
|
||||
import { router } from '@/utils/tools'
|
||||
import { ReserveServiceCategory, OrderType } from '@/utils/order'
|
||||
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
|
||||
import { getNext7Days, renewTeaRoomOrder } from '@/api/tea-room'
|
||||
import { toTimes, copy } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const title = ref<string>('')
|
||||
const orderStatus = ref<string>('') // 订单状态：待使用、退款等
|
||||
const orderStatus = ref<number>(0) // 订单状态：待使用、退款等
|
||||
|
||||
// 续订包间
|
||||
const showRenewPopup = ref<boolean>(false)
|
||||
@ -389,6 +430,14 @@
|
||||
|
||||
const showRenewSuccessPopup = ref<boolean>(false)
|
||||
|
||||
// 选择预定时间
|
||||
const showBookTimePopup = ref<boolean>(false)
|
||||
const sevenDay = reactive<ITeaSpecialistFuture7DaysResult>({
|
||||
minimum_time: 0,
|
||||
time: []
|
||||
})
|
||||
const reserveTime = ref<Array<any>>([])
|
||||
|
||||
// 订单倒计时取消
|
||||
const time = ref<number>(30 * 60 * 60 * 1000)
|
||||
|
||||
@ -398,15 +447,106 @@
|
||||
// 费用明细
|
||||
const showCostPopup = ref<boolean>(false) // 是否显示退款详情弹出框
|
||||
|
||||
onLoad((args) => {
|
||||
title.value = OrderStatusTitle[OrderSource.TeaRoom][args.orderStatus] || '订单详情'
|
||||
console.log("🚀 ~ title.value :", title.value )
|
||||
// 订单
|
||||
const orderId = ref<number>(0)
|
||||
const order = ref<ITeaSpecialistOrderDetailsResult>({
|
||||
order_amount: '',
|
||||
order_sn: '',
|
||||
store_id: 0,
|
||||
room_msg: {
|
||||
id: 0,
|
||||
price: 0,
|
||||
img: '',
|
||||
title: '',
|
||||
},
|
||||
store_msg: {
|
||||
id: 0,
|
||||
address: '',
|
||||
name: '',
|
||||
operation_type: 1,
|
||||
image: '',
|
||||
latitude: '',
|
||||
longitude: '',
|
||||
contact_phone: ''
|
||||
},
|
||||
time1: 0,
|
||||
order_status: 0,
|
||||
room_all_price: 0,
|
||||
room_price: 0,
|
||||
day_time: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
hours: 0,
|
||||
distance: 0,
|
||||
pay_way: 0,
|
||||
pay_way_title: '',
|
||||
dtime: '',
|
||||
update_dtime: '',
|
||||
renew_price: 0,
|
||||
renew_dtime: {
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
renew_price: 0
|
||||
}
|
||||
})
|
||||
|
||||
orderStatus.value = args.orderStatus
|
||||
// 一键续订的金额
|
||||
const totalReserveMoney = ref<number>(0)
|
||||
|
||||
onLoad(async (args) => {
|
||||
orderId.value = args.orderId
|
||||
// 获取订单详情
|
||||
OrderDetail.handleInit()
|
||||
|
||||
// 预定时间
|
||||
const next7 = await getNext7Days()
|
||||
Object.assign(sevenDay, next7)
|
||||
})
|
||||
|
||||
onUnload(() => {
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
onShareAppMessage(async (e) => {
|
||||
if (e.from === 'button') {
|
||||
return {
|
||||
title: `我在${order.value.store_msg.name}预定了${order.value.room_msg.title}，一起来吧！`,
|
||||
path: `/pages/share/tea-room/share-order-detail?orderId=${orderId.value}`,
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const OrderDetail = {
|
||||
// 取消订单
|
||||
/**
|
||||
* 获取订单详情
|
||||
*/
|
||||
handleInit: async () => {
|
||||
const res = await getTeaRoomOrderDetail({
|
||||
id: orderId.value,
|
||||
latitude: uni.getStorageSync('latitude'),
|
||||
longitude: uni.getStorageSync('longitude')
|
||||
})
|
||||
order.value = res.details
|
||||
console.log("🚀 ~ order.value :", order.value )
|
||||
title.value = TeaRoomOrderStatusTextValue[order.value.order_status].title || '订单详情'
|
||||
orderStatus.value = order.value.order_status
|
||||
},
|
||||
|
||||
/**
|
||||
* 支付订单
|
||||
*/
|
||||
handleToPay: () => {
|
||||
uni.$on('refreshOrderDetail', () => {
|
||||
OrderDetail.handleInit()
|
||||
uni.$off('refreshOrderDetail')
|
||||
})
|
||||
|
||||
handleTRToPayHooks(orderId.value, order.value.store_msg.name, order.value.store_msg.id)
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取订单详情
|
||||
*/
|
||||
handleCancelOrder: () => {
|
||||
message.confirm({
|
||||
title: '确定取消订单？',
|
||||
@ -420,12 +560,113 @@
|
||||
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')
|
||||
})
|
||||
|
||||
handleTRCancelOrderHooks(orderId.value)
|
||||
}
|
||||
toast.info('订单取消成功')
|
||||
}).catch(() => {
|
||||
// 点击取消按钮回调事件
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 再次预定
|
||||
*/
|
||||
handleAgainReserve: () => {
|
||||
router.navigateTo(
|
||||
`/bundle/tea-room/detail?storeId=${order.value.store_msg.id}&roomId=${order.value.room_msg.id}&type=${ReserveServiceCategory.ReserveRoom}&price=${order.value.room_msg.price}`
|
||||
)
|
||||
},
|
||||
|
||||
/**
|
||||
* 选中预定时间
|
||||
*/
|
||||
handleChooseReserveTime: (params: any) => {
|
||||
reserveTime.value = params
|
||||
|
||||
// 一键续订的金额
|
||||
totalReserveMoney.value = Number(toTimes(params[3], order.value.room_price))
|
||||
},
|
||||
|
||||
/**
|
||||
* 确认一键续订
|
||||
*/
|
||||
handleRenewReserve: async () => {
|
||||
uni.showLoading({ title: '加载中...' })
|
||||
|
||||
try {
|
||||
await renewTeaRoomOrder({
|
||||
id: orderId.value,
|
||||
start_time: reserveTime.value[2][0],
|
||||
end_time: reserveTime.value[2][reserveTime.value[2].length - 1],
|
||||
renew_hour: reserveTime.value[3],
|
||||
})
|
||||
|
||||
uni.$on('payment', params => {
|
||||
uni.$off("payment")
|
||||
if (params.result) {
|
||||
OrderDetail.handleInit()
|
||||
showRenewSuccessPopup.value = true
|
||||
} else {
|
||||
message.alert({
|
||||
title: '提示',
|
||||
msg: '您已取消续订',
|
||||
confirmButtonText: '确定',
|
||||
confirmButtonProps: {
|
||||
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
uni.hideLoading()
|
||||
showRenewPopup.value = false
|
||||
|
||||
router.navigateTo(
|
||||
`/pages/cashier/cashier?from=${OrderType.TeaRoomOrder}&renew=renewTeaRoomOrder&orderId=${orderId.value}&teaRoomName=${order.value.store_msg.name}&storeId=${order.value.store_msg.id}`
|
||||
)
|
||||
} catch (err) {
|
||||
uni.hideLoading()
|
||||
toast.info('续订失败')
|
||||
return false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到对对应室的详情页
|
||||
*/
|
||||
handleToStore: () => {
|
||||
handleToTeaRoomStoreHooks(order.value.store_id, order.value.store_msg.operation_type)
|
||||
},
|
||||
|
||||
/**
|
||||
* 处理导航逻辑
|
||||
*/
|
||||
handleLocation: () => {
|
||||
uni.openLocation({
|
||||
latitude: Number(order.value.store_msg.latitude),
|
||||
longitude: Number(order.value.store_msg.longitude),
|
||||
name: order.value.store_msg.name,
|
||||
address: order.value.store_msg.address,
|
||||
scale: 18
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 处理拨打电话逻辑
|
||||
*/
|
||||
handleCallPhone: () => {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: order.value.store_msg.contact_phone
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user