添加立即预约页面
This commit is contained in:
566
src/bundle/package/detail.vue
Normal file
566
src/bundle/package/detail.vue
Normal file
@ -0,0 +1,566 @@
|
||||
<!-- 使用 type="home" 属性设置首页,其他页面不需要设置,默认为page -->
|
||||
<route lang="jsonc" type="page">{
|
||||
"needLogin": true,
|
||||
"layout": "tabbar",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}</route>
|
||||
|
||||
<template>
|
||||
<view class="pb-180rpx">
|
||||
<view>
|
||||
<navbar title="茶艺师套餐" custom-class='!bg-[#F6F7F8]'></navbar>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view class="mt-20rpx mx-30rpx swiper">
|
||||
<wd-swiper value-key="image" height="320rpx" :indicator="{ type: 'dots-bar' }" :list="swiperList"
|
||||
v-model:current="current" mode="aspectFit" @click="Detail.handlePreviewImage">
|
||||
</wd-swiper>
|
||||
</view>
|
||||
|
||||
<view class="bg-white rounded-16rpx p-30rpx mt-24rpx mx-30rpx">
|
||||
<!-- 价格行 -->
|
||||
<view class="flex items-center justify-between">
|
||||
<view class="flex items-center">
|
||||
<view>
|
||||
<price-format color="#FF5951" :first-size="44" :second-size="44" :subscript-size="28" :price="298"></price-format>
|
||||
</view>
|
||||
<view class="ml-20rpx">
|
||||
<price-format color="#909399" :first-size="24" :second-size="24" :subscript-size="24" :price="298" :line-through="true"></price-format>
|
||||
</view>
|
||||
<view
|
||||
class="bg-[#FFEDED] text-[#FF5951] text-24rpx px-20rpx py-6rpx rounded-8rpx ml-28rpx flex items-center">
|
||||
2.9折热销中</view>
|
||||
</view>
|
||||
<view class="text-[#909399] text-24rpx">已售500+</view>
|
||||
</view>
|
||||
|
||||
<!-- 标题 -->
|
||||
<view class="text-[#303133] text-36rpx font-bold mt-20rpx">清风套餐-标准品质</view>
|
||||
|
||||
<!-- 标签 -->
|
||||
<view class="flex items-center mt-20rpx">
|
||||
<view
|
||||
class="text-[#C08A45] text-22rpx border-2rpx border-solid border-[#C3801C] rounded-8rpx px-12rpx py-6rpx mr-16rpx font-500">
|
||||
回头客92</view>
|
||||
<view
|
||||
class="text-[#C08A45] text-22rpx border-2rpx border-solid border-[#C3801C] rounded-8rpx px-12rpx py-6rpx font-500">
|
||||
500+购买</view>
|
||||
</view>
|
||||
|
||||
<!-- 保障框 -->
|
||||
<view class="bg-[#F2FBF6] rounded-10rpx px-20rpx py-16rpx mt-26rpx flex items-center">
|
||||
<wd-img :src="`${OSS}icon/icon_safe.png`" width="32rpx" height="32rpx"></wd-img>
|
||||
<view class="text-[#15B569] text-24rpx font-bold ml-10rpx mr-16rpx">保障</view>
|
||||
<view class="text-[#606266] text-24rpx">预约后,爽约即可赔付</view>
|
||||
</view>
|
||||
|
||||
<!-- 心动理由框 -->
|
||||
<view class="bg-[#F8F8FF] rounded-10rpx px-20rpx py-22rpx mt-16rpx">
|
||||
<view class="text-[#2B17AB] text-24rpx leading-36rpx">
|
||||
<text class="inline-flex items-center align-middle mr-10rpx mb-4rpx">
|
||||
<wd-img :src="`${OSS}icon/icon_star.png`" width="32rpx" height="32rpx"></wd-img>
|
||||
<text class="text-[#3545DA] font-bold ml-6rpx">心动理由</text>
|
||||
</text>
|
||||
<text class="mt-8rpx">在谈判间隙或需要思考时,众人的注意力可自然地落于茶席,为您赢得宝贵的思考时间。</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 须知/保障模块 -->
|
||||
<view class="mt-32rpx">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<view class="text-[#303133] text-26rpx font-bold">须知</view>
|
||||
<view class="text-[#909399] text-26rpx ml-26rpx">需预约</view>
|
||||
</view>
|
||||
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<view class="text-[#303133] text-26rpx font-bold">保障</view>
|
||||
<view class="text-[#909399] text-26rpx ml-26rpx">随时退</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<!-- 套餐详情 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">套餐详情</view>
|
||||
<view class="mt-24rpx" v-if="teaRoomPackage.introduce">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_tcsm.png`"></wd-img>
|
||||
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">套餐介绍</view>
|
||||
</view>
|
||||
<rich-text :nodes="teaRoomPackage.introduce"></rich-text>
|
||||
</view>
|
||||
<view class="mt-30rpx">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_qtsm.png`"></wd-img>
|
||||
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx"> 其他说明</view>
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<view class="bg-[#6A6363] w-8rpx h-8rpx rounded-full mr-12rpx"></view>
|
||||
<view class="font-500 text-26rpx text-[#303133]">超过一小时100元</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 购买须知 -->
|
||||
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
|
||||
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">购买须知</view>
|
||||
|
||||
<view class="mt-30rpx">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_sycj.png`"></wd-img>
|
||||
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx"> 适用场景</view>
|
||||
</view>
|
||||
<view class="flex items-center">
|
||||
<view class="bg-[#6A6363] w-8rpx h-8rpx rounded-full mr-12rpx"></view>
|
||||
<view class="font-500 text-26rpx text-[#303133]">个人品鉴,小型聚会</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-30rpx" v-if="teaRoomPackage.hour">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_sysc.png`"></wd-img>
|
||||
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">适用时长</view>
|
||||
</view>
|
||||
<view class="">{{ teaRoomPackage.hour }}小时</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-30rpx" v-if="teaRoomPackage.pl_number">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_syrs.png`"></wd-img>
|
||||
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">使用人数</view>
|
||||
</view>
|
||||
<view class="">{{ teaRoomPackage.pl_number }}</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-20rpx mb-24rpx">
|
||||
<wd-gap height="2rpx" bgColor="#F6F7F9"></wd-gap>
|
||||
</view>
|
||||
|
||||
<view class="mt-30rpx" v-if="teaRoomPackage.returd_details">
|
||||
<view class="flex items-center mb-20rpx">
|
||||
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_tgsm.png`"></wd-img>
|
||||
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">退改说明</view>
|
||||
</view>
|
||||
<rich-text :nodes="teaRoomPackage.returd_details"></rich-text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fixed left-0 right-0 bottom-0 z-2 bg-[#fff] flex items-center justify-center" :style="{ height: '140rpx' }">
|
||||
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center">
|
||||
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">立即预约</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { toast } from '@/utils/toast'
|
||||
import { ReserveServiceCategory, OrderType } from '@/utils/order'
|
||||
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
|
||||
import { getNext7Days, getTeaRoomBalance, createTeaRoomOrder } from '@/api/tea-room'
|
||||
import { CouponType } from '@/utils/coupon'
|
||||
import { router, randomLabelColor, previewImage, replaceNewLine } from '@/utils/tools'
|
||||
import type { IUserInfoVo } from '@/api/types/login'
|
||||
import { useUserStore } from '@/store'
|
||||
import { getTeaRoomDetail, createTeaRoomPackageOrder, getTeaRoomPackageDetail, calculateTeaRoomPrice } from '@/api/tea-room'
|
||||
import PriceFormat from '@/components/PriceFormat.vue'
|
||||
import BookingTime from '@/components/BookingTime.vue'
|
||||
import { getUserInfo } from '@/api/user'
|
||||
import { getTeaRoomGroupCouponList } from '@/api/tea-room'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
// 获取当前年月日,格式:YYYY-MM-DD
|
||||
const now = new Date();
|
||||
const year = now.getFullYear();
|
||||
const month = String(now.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(now.getDate()).padStart(2, '0');
|
||||
const currentDate = `${year}-${month}-${day}`;
|
||||
|
||||
// 用户信息
|
||||
const userInfo = ref<IUserInfoVo>(null)
|
||||
|
||||
const swiperList = ref<string[]>([])
|
||||
const current = ref<number>(0)
|
||||
const html: string = '<p>这里是富文本内容,需要后台传递</p>'
|
||||
const isGroupBuying = ref<boolean>(false)// 是否是团购套餐
|
||||
|
||||
// 选择预定时间
|
||||
const showBookTimePopup = ref<boolean>(false)
|
||||
const sevenDay = reactive<ITeaSpecialistFuture7DaysResult>({
|
||||
minimum_time: 0,
|
||||
time: []
|
||||
})
|
||||
const reserveTime = ref<Array<any>>([])
|
||||
const timeSlots = ref<Array<string>>([]) // 连续选择的预约时间
|
||||
const dayTitle = ref<string>('') // 周三03/18
|
||||
const dayTime = ref<string>('') // 2024-03-18
|
||||
const dayHours = ref<string>('') // 预定时长00:00,00:30
|
||||
|
||||
// 计算费用明细 service(服务费) coupon(优惠券) discount(会员优惠) totalDiscount(总优惠) total(总费用) groupCoupon(团购券)
|
||||
const bill = ref<{ service: any, discount: number, totalDiscount: number, coupon: number, groupCoupon: number, total: number }>({
|
||||
service: {
|
||||
total: 0,
|
||||
unitPrice: 0,
|
||||
num: 0,
|
||||
startTime: 0,
|
||||
endTime: 0,
|
||||
dayTime: '',
|
||||
startHour: '',
|
||||
endHour: ''
|
||||
},
|
||||
discount: 0,
|
||||
totalDiscount: 0,
|
||||
coupon: 0,
|
||||
groupCoupon: 0,
|
||||
total: 0
|
||||
})
|
||||
|
||||
// 费用明细相关
|
||||
const showCostPopup = ref<boolean>(false) // 费用明细popup
|
||||
const showPayPopup = ref<boolean>(false) // 支付popup
|
||||
|
||||
// 包间内容
|
||||
const storeId = ref<number>(0) // 门店ID
|
||||
const id = ref<number>(0) // id
|
||||
const teaRoom = ref<any>({
|
||||
order: {
|
||||
hours: 0
|
||||
},
|
||||
room: {
|
||||
title: ''
|
||||
}
|
||||
})
|
||||
const teaRoomPrice = ref<number>(0)
|
||||
|
||||
// 门店余额
|
||||
const storeMoney = ref<number>(0)
|
||||
|
||||
// 选择的优惠券
|
||||
const selectedCoupon = ref<{ id: number, name: string }>({ id: 0, name: '' })
|
||||
const selectedGroupCoupon = ref<{ id: number, name: string }>({ id: 0, name: '' })
|
||||
const selectCouponId = ref<number>(0)
|
||||
const selectGroupCouponId = ref<number>(0)
|
||||
|
||||
// 用户信息
|
||||
const user = ref<any>(null)
|
||||
|
||||
// 套餐
|
||||
const teaRoomPackage = ref<any>({})
|
||||
|
||||
// 页面类型
|
||||
const pageType = ref<string>('')
|
||||
|
||||
// 防止重复提交
|
||||
const isSubmitting = ref(false)
|
||||
|
||||
// 团购套餐列表
|
||||
const groupCouponList = ref<Array<any>>([])
|
||||
|
||||
onLoad((args) => {
|
||||
storeId.value = Number(args.storeId)
|
||||
id.value = Number(args.id) // 在茶室下这个id是包间ID,在团购下是套餐ID
|
||||
teaRoomPrice.value = Number(args.price) || 0
|
||||
pageType.value = args.type || ''
|
||||
console.log("🚀 ~ pageType.value:", pageType.value)
|
||||
|
||||
if (args.type == ReserveServiceCategory.GroupBuying) {
|
||||
isGroupBuying.value = true
|
||||
Detail.handleInitGroupBuying()
|
||||
}
|
||||
Detail.handleInitReserveRoom()
|
||||
|
||||
// 获取用户需求详
|
||||
getUserInfo().then(res => {
|
||||
user.value = res
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
// 防止重复提交
|
||||
|
||||
const Detail = {
|
||||
/**
|
||||
* 初始包间详情
|
||||
*/
|
||||
handleInitReserveRoom: async () => {
|
||||
// 包间详情
|
||||
const userStore = useUserStore()
|
||||
userInfo.value = userStore.userInfo
|
||||
|
||||
const res = await getTeaRoomDetail({
|
||||
id: storeId.value,
|
||||
latitude: uni.getStorageSync('latitude') || import.meta.env.VITE_DEFAULT_LATITUDE,
|
||||
longitude: uni.getStorageSync('longitude') || import.meta.env.VITE_DEFAULT_LONGITUDE,
|
||||
user_id: userInfo.value.id || 0,
|
||||
room_id: id.value
|
||||
})
|
||||
teaRoom.value = res.details
|
||||
|
||||
// 处理使用说明的换行问题
|
||||
if (teaRoom.value.room.other_describe) {
|
||||
teaRoom.value.room.other_describe = replaceNewLine(teaRoom.value.room.other_describe)
|
||||
}
|
||||
|
||||
if (pageType.value == ReserveServiceCategory.ReserveRoom) {
|
||||
swiperList.value = teaRoom.value.room.room_arr
|
||||
|
||||
// 预定时间
|
||||
const next7 = await getNext7Days(id.value, currentDate)
|
||||
// disabled = 0 可预约 1不可逾越
|
||||
Object.assign(sevenDay, next7.data)
|
||||
Object.assign(sevenDay, { minimum_time: teaRoom.value.room.hours })
|
||||
}
|
||||
|
||||
// 获取门店余额
|
||||
const balance = await getTeaRoomBalance({ store_id: storeId.value })
|
||||
storeMoney.value = balance.data.money || 0
|
||||
|
||||
// 获取团购券
|
||||
const group = await getTeaRoomGroupCouponList({ store_id: storeId.value, room_id: id.value })
|
||||
groupCouponList.value = group.list
|
||||
},
|
||||
|
||||
/*
|
||||
* 初始化套餐详情
|
||||
*/
|
||||
handleInitGroupBuying: async () => {
|
||||
const res = await getTeaRoomPackageDetail({ id: id.value })
|
||||
teaRoomPackage.value = res.details
|
||||
|
||||
// 处理使用说明的换行问题
|
||||
if (teaRoomPackage.value.introduce) {
|
||||
teaRoom.value.introduce = replaceNewLine(teaRoom.value.introduce)
|
||||
}
|
||||
|
||||
if (teaRoomPackage.value.rests_introduce) {
|
||||
teaRoom.value.rests_introduce = replaceNewLine(teaRoom.value.rests_introduce)
|
||||
}
|
||||
|
||||
if (teaRoomPackage.value.room_name) {
|
||||
teaRoom.value.room_name = replaceNewLine(teaRoom.value.room_name)
|
||||
}
|
||||
|
||||
if (teaRoomPackage.value.returd_details) {
|
||||
teaRoom.value.returd_details = replaceNewLine(teaRoom.value.returd_details)
|
||||
}
|
||||
|
||||
if (pageType.value == ReserveServiceCategory.GroupBuying) {
|
||||
swiperList.value = teaRoomPackage.value.img
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 选中预定时间
|
||||
*/
|
||||
handleChooseReserveTime: (params: any) => {
|
||||
reserveTime.value = params
|
||||
console.log("🚀 ~ params:", params)
|
||||
|
||||
timeSlots.value = params.selectedTimestamps
|
||||
dayTitle.value = params.dayTitle
|
||||
dayTime.value = params.dayTime
|
||||
const times = params.selectedTime.map(item => {
|
||||
return item.time
|
||||
}).join(',')
|
||||
dayHours.value = times
|
||||
|
||||
bill.value.service = {
|
||||
total: 0,
|
||||
unitPrice: 0,
|
||||
num: params.countSelectedTime,
|
||||
startHour: params.selectedTime[0].time,
|
||||
endHour: params.selectedTime[params.selectedTime.length - 1].time
|
||||
}
|
||||
|
||||
Detail.handleCalculateTeaRoomPrice()
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转优惠券页面
|
||||
*/
|
||||
handleToCoupon(type) {
|
||||
if (reserveTime.value.length == 0) {
|
||||
toast.info('请选择预定时间')
|
||||
return
|
||||
}
|
||||
|
||||
// 在选择优惠券之前需要先选择团购券
|
||||
if (type === CouponType.Discount && groupCouponList.value.length > 0 && selectedGroupCoupon.value.id == 0) {
|
||||
toast.info('请先选择团购券')
|
||||
return
|
||||
}
|
||||
|
||||
// 如果选择优惠券之前订单金额已经是0的话则不用再选择优惠券
|
||||
if (type === CouponType.Discount && selectedGroupCoupon.value.id > 0 && bill.value.total <= 0) {
|
||||
toast.info('当前订单金额已为0,无需选择优惠券')
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
uni.$off('chooseCoupon');
|
||||
uni.$on('chooseCoupon', params => {
|
||||
console.log("🚀 ~ params:", params)
|
||||
uni.$off('chooseCoupon')
|
||||
if (params.coupon) {
|
||||
if (type === CouponType.Discount) {
|
||||
selectedCoupon.value = { id: params.coupon.id, name: `${params.coupon.name}减${params.coupon.coupon_price}` }
|
||||
bill.value.coupon = params.coupon.coupon_price
|
||||
selectCouponId.value = params.coupon.id // 这里的ID是在数据表自增的ID,保存下来是为了回显列表的,没有其他作用
|
||||
} else {
|
||||
selectedGroupCoupon.value = { id: params.coupon.id, name: `团购券-${params.coupon?.title}` }
|
||||
bill.value.groupCoupon = params.coupon.coupon_price
|
||||
selectGroupCouponId.value = params.coupon.id // 这里的ID是在数据表自增的ID,保存下来是为了回显列表的,没有其他作用
|
||||
}
|
||||
} else {
|
||||
// 清空选择
|
||||
if (type === CouponType.Discount) {
|
||||
selectedCoupon.value = { id: 0, name: '' }
|
||||
bill.value.coupon = 0
|
||||
selectCouponId.value = 0
|
||||
} else {
|
||||
selectedGroupCoupon.value = { id: 0, name: '' }
|
||||
bill.value.groupCoupon = 0
|
||||
selectGroupCouponId.value = 0
|
||||
}
|
||||
}
|
||||
Detail.handleCalculateTeaRoomPrice()
|
||||
})
|
||||
|
||||
// 获取预定了几个小时
|
||||
const count = bill.value.service.num
|
||||
|
||||
router.navigateTo(`/bundle/coupon/coupon?id=${id.value}&price=${bill.value.total}&numbers=${count}&type=${type}&storeId=${storeId.value}&couponId=${selectCouponId.value}&groupCouponId=${selectGroupCouponId.value}`)
|
||||
},
|
||||
|
||||
/**
|
||||
* 提交订单
|
||||
*/
|
||||
handleSubmitOrder: async () => {
|
||||
if (isSubmitting.value) return
|
||||
// 只有预定茶室才会选择时间
|
||||
if (!isGroupBuying.value && bill.value.service.num == 0) {
|
||||
toast.info('请选择预定时间')
|
||||
return
|
||||
}
|
||||
|
||||
isSubmitting.value = true
|
||||
try {
|
||||
let res: any = null
|
||||
if (isGroupBuying.value) {
|
||||
// 团购套餐ID
|
||||
res = await createTeaRoomPackageOrder({
|
||||
group_id: id.value,
|
||||
room_id: 0
|
||||
})
|
||||
} else {
|
||||
const params = {
|
||||
store_id: storeId.value,
|
||||
room_id: id.value,
|
||||
day_title: dayTitle.value,
|
||||
day_time: dayTime.value,
|
||||
start_time: bill.value.service.startHour,
|
||||
end_time: bill.value.service.endHour,
|
||||
user_coupon_id: selectedCoupon.value.id || 0,
|
||||
hours: bill.value.service.num,
|
||||
group_coupon_id: selectedGroupCoupon.value.id || 0,
|
||||
timeslot: timeSlots.value.join(',')
|
||||
}
|
||||
res = await createTeaRoomOrder(params)
|
||||
}
|
||||
// uni.hideLoading()
|
||||
|
||||
// 支付后的处理
|
||||
uni.$on('payment', params => {
|
||||
setTimeout(() => {
|
||||
uni.$off("payment")
|
||||
isSubmitting.value = false
|
||||
if (params.result) {
|
||||
//支付成功提示
|
||||
uni.redirectTo({
|
||||
url: `/pages/notice/reserve?type=${OrderType.TeaRoomOrder}&orderId=${params.orderId}&isGroupBuying=${isGroupBuying.value ? 1 : 0}&storeId=${storeId.value}&storeType=${teaRoom.value.operation_type}`
|
||||
})
|
||||
} else {
|
||||
// 支付失败跳转订单列表
|
||||
if (!isGroupBuying.value) {
|
||||
router.redirectTo(`/bundle/order/tea-room/order-list?isGroupBuying=${isGroupBuying.value ? 1 : 0}`)
|
||||
}
|
||||
}
|
||||
}, 1000)
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
const name = isGroupBuying.value ? teaRoomPackage.value.title : teaRoom.value.name
|
||||
const money = isGroupBuying.value ? res.order_amount : 0 // 团购套餐支付金额会在创建订单的时候返回
|
||||
|
||||
router.navigateTo(
|
||||
`/pages/cashier/cashier?from=${OrderType.TeaRoomOrder}&orderId=${res.id}&name=${name}&storeId=${storeId.value}&isGroupBuying=${isGroupBuying.value ? 1 : 0}&cmoboId=${id.value || 0}&money=${money}`
|
||||
)
|
||||
}, 500)
|
||||
} catch (error) {
|
||||
isSubmitting.value = false
|
||||
return
|
||||
}
|
||||
// 正常流程下,isSubmitting.value 会在支付回调中重置
|
||||
},
|
||||
|
||||
/**
|
||||
* 计算茶室价格
|
||||
*/
|
||||
handleCalculateTeaRoomPrice: async () => {
|
||||
const res = await calculateTeaRoomPrice({
|
||||
room_id: id.value,
|
||||
coupon_id: selectedCoupon.value.id || 0,
|
||||
group_coupon_id: selectedGroupCoupon.value.id || 0,
|
||||
nums: bill.value.service.num,
|
||||
})
|
||||
|
||||
bill.value.service.total = res.details.room_price // 茶室价格
|
||||
bill.value.discount = res.details.discount_room_price // 茶室总价
|
||||
bill.value.totalDiscount = res.details.discount_all_price // 总优惠
|
||||
bill.value.groupCoupon = res.details.group_price // 团购优惠
|
||||
bill.value.total = res.details.order_amount // 订单金额
|
||||
},
|
||||
|
||||
/**
|
||||
* 预览图片
|
||||
*/
|
||||
handlePreviewImage: (e: { index: number, item: any }) => {
|
||||
previewImage(swiperList.value[e.index], swiperList.value)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: $cz-page-background;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
:deep() {
|
||||
.wd-swiper-nav__item--dots-bar {
|
||||
width: 56rpx !important;
|
||||
height: 6rpx !important;
|
||||
border-radius: 3rpx !important;
|
||||
}
|
||||
|
||||
.is-active {
|
||||
background-color: #2B9F93 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pay {
|
||||
:deep() {
|
||||
.wd-radio {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user