开启篮球预定
This commit is contained in:
wangxiaowei
@ -37,7 +37,7 @@
|
||||
<view class="title1 d-b-c">
|
||||
<view>使用费</view>
|
||||
<view>
|
||||
<price-format color="#303133" :subscript-size="30" :first-size="30" :second-size="30" :price="bill.cdf.total"></price-format>
|
||||
<price-format color="#303133" :subscript-size="30" :first-size="30" :second-size="30" :price="bill.cdf.price"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
<view class="title2 d-b-c">
|
||||
@ -136,7 +136,7 @@
|
||||
<view class="tag">
|
||||
<view class="tag1">可预约</view>
|
||||
<view class="tag2">已选中</view>
|
||||
<view class="tag3">不可约</view>
|
||||
<view class="tag3">已约</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -158,23 +158,28 @@
|
||||
{{ item.t }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="d-f cg-info" style="width: 800rpx; overflow-x: auto;" v-if="timeList.length > 0">
|
||||
<view style="width: 120rpx;margin-right: 10rpx;" v-for="(item2, index2) in cdList" :key="index2">
|
||||
<view class="" style="margin-bottom: 6rpx; text-align: center;">{{ item2.title }}</view>
|
||||
<view
|
||||
v-for="(item3, index3) in item2.time" :key="index3"
|
||||
@click="handleSelectTime(item2.title, item3.t, item3.status, item2.room_id, item3.price, item3.light_price)"
|
||||
class="cg-info-time" :class="[
|
||||
item3.status == 1
|
||||
? 'cg-info-time-none'
|
||||
: selectedTime[item2.title] && selectedTime[item2.title].includes(item3.t)
|
||||
? 'cg-info-time-select'
|
||||
: 'cg-info-time-normal'
|
||||
]" >
|
||||
<!-- <template v-if="item3.t != '22:00'"> -->
|
||||
<template v-if="item3.price > 0">￥{{ item3.price }}</template>
|
||||
<template v-else>免费</template>
|
||||
<!-- </template> -->
|
||||
<view class="d-f cg-info pr" style="" v-if="timeList.length > 0">
|
||||
<!-- <view class="cg-border"></view> -->
|
||||
<view class="" style="width: 120rpx;margin-right: 20rpx;" v-for="(item2, index2) in cdList" :key="index2">
|
||||
<view class="" style="margin-bottom: 20rpx; text-align: center;">{{ item2.title }}</view>
|
||||
|
||||
<view class="pr" style="padding-bottom: 30rpx;">
|
||||
<!-- <view class="cg-right-border" :class="{ 'no-border': index2 === cdList.length - 1 }"></view> -->
|
||||
<view
|
||||
ref="cgInfoTime"
|
||||
v-for="(item3, index3) in item2.time" :key="index3"
|
||||
@click="handleSelectTime(item2.title, item3.t, item3.status, item2.room_id, item3.price, item3.light_price)"
|
||||
class="cg-info-time" :class="[
|
||||
item3.status == 1
|
||||
? 'cg-info-time-none'
|
||||
: selectedTime[item2.title] && selectedTime[item2.title].includes(item3.t)
|
||||
? 'cg-info-time-select'
|
||||
: 'cg-info-time-normal'
|
||||
]" >
|
||||
<template v-if="item3.price > 0">￥{{ item3.price }}</template>
|
||||
<template v-if="item3.status == 1">已约</template>
|
||||
<template v-else>免费</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -198,7 +203,7 @@
|
||||
<view class="mx-30rpx">
|
||||
<view class="reserve-time">预定时间</view>
|
||||
<view class="reserve-desc" @click="timePopup = true">
|
||||
<view class="reserve-desc-title">默认4小时，注意闭馆时间</view>
|
||||
<view class="reserve-desc-title">场地时间营业至22:00，注意闭馆时间</view>
|
||||
<view class="reserve-desc-info">
|
||||
<view class="">{{ date || '请选择' }}</view>
|
||||
<view class="">
|
||||
@ -262,7 +267,11 @@ export default {
|
||||
venueRoomLists: [],
|
||||
loadding: true,
|
||||
timePopup: false,
|
||||
date: '',
|
||||
date: '', // 选择的篮球场管预约时间
|
||||
dayTitle: '', // 选择的篮球场管预约日期标题
|
||||
dayTime: '', // 选择的篮球场管预约日期
|
||||
datetimestamp: '', // 选择的篮球场管预约时间戳
|
||||
dateEndTimestamp: '', // 选择的篮球场管预约结束时间戳
|
||||
showPrice: true,
|
||||
bill: {
|
||||
cdf: {
|
||||
@ -353,6 +362,10 @@ export default {
|
||||
// 篮球场场馆-切换tab
|
||||
handleTabClick(idx) {
|
||||
this.selectedRoomIndex = idx
|
||||
this.date = ''
|
||||
this.datetimestamp = ''
|
||||
this.bill.cdf.price = 0
|
||||
this.bill.total = 0
|
||||
},
|
||||
|
||||
// 切换tab
|
||||
@ -386,14 +399,17 @@ export default {
|
||||
});
|
||||
},
|
||||
|
||||
// 确认选择时间
|
||||
// 篮球场-确认选择时间
|
||||
confirmSelectTime(e) {
|
||||
console.log("🚀 ~ e:", e)
|
||||
let self = this
|
||||
this.date = e.value
|
||||
|
||||
// 计算费用明细
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
});
|
||||
this.datetimestamp = e.timestamp
|
||||
this.dateEndTimestamp = e.endtimestamp
|
||||
const price = self.venueRoomLists[self.selectedRoomIndex].price
|
||||
console.log("🚀 ~ price:", price)
|
||||
this.bill.cdf.price = price
|
||||
this.bill.total = price
|
||||
},
|
||||
|
||||
// 计算费用明细
|
||||
@ -445,94 +461,6 @@ export default {
|
||||
this.showPrice = true;
|
||||
},
|
||||
|
||||
// 立即预约
|
||||
toReserve() {
|
||||
let self = this
|
||||
// 一进来就锁定，彻底防止高频点击
|
||||
if (self.typeId == 1) {
|
||||
if (self.selectedReserveTime.length === 0) {
|
||||
uni.showToast({
|
||||
title: '请选择预约时间',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '提交中',
|
||||
mask: true,
|
||||
});
|
||||
try {
|
||||
const start = self.selectedReserveTime[0].day_time + ' ' + self.selectedReserveTime[0].end_time;
|
||||
const end = self.selectedReserveTime[self.selectedReserveTime.length -1].day_time + ' ' + self.selectedReserveTime[self.selectedReserveTime.length -1].end_time;
|
||||
// 转换为时间戳
|
||||
const startTimestamp = Math.floor(Date.parse(start.replace(/-/g, '/')) / 1000);;
|
||||
const endTimestamp = Math.floor(Date.parse(end.replace(/-/g, '/')) / 1000);;
|
||||
|
||||
// 订单提交
|
||||
self._post(
|
||||
'order.groundOrder/submitStoreOrder',
|
||||
{
|
||||
app_id: self.getAppId(),
|
||||
ground_id: self.id,
|
||||
room_list: JSON.stringify(self.selectedReserveTime),
|
||||
type: self.typeId,
|
||||
start_end: startTimestamp + '-' + endTimestamp,
|
||||
amount_price: self.bill.total
|
||||
},
|
||||
function(res) {
|
||||
self.loadding = false;
|
||||
if(res.code) {
|
||||
// 记录费用明细到缓存中
|
||||
// uni.setStorageSync('billDetail', JSON.stringify(self.bill));
|
||||
|
||||
uni.$on('payment', params => {
|
||||
console.log("🚀 ~ params:", params)
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true,
|
||||
});
|
||||
setTimeout(() => {
|
||||
self.loadding = false
|
||||
uni.$off("payment")
|
||||
if (params.result) {
|
||||
uni.redirectTo({
|
||||
url: `/bundle/reserve/notice?order_id=${params.order_id}`
|
||||
})
|
||||
} else {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/cg-my-order'
|
||||
})
|
||||
}
|
||||
}, 500)
|
||||
})
|
||||
|
||||
uni.navigateTo({
|
||||
url: `/bundle/reserve/confirm?venueId=${self.venue.id}&roomId=${self.id}&typeId=${self.typeId}&orderId=${res.data.lists.id}`
|
||||
});
|
||||
}
|
||||
}
|
||||
)
|
||||
} catch (error) {
|
||||
console.error('订单提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '订单提交失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
self.loadding = false;
|
||||
}
|
||||
} else {
|
||||
if (!self.date) {
|
||||
uni.showToast({
|
||||
title: '请选择预约时间',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: `/bundle/reserve/confirm?venueId=${self.venue.id}&roomId=${self.id}&typeId=${self.typeId}`
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
*
|
||||
@ -705,7 +633,161 @@ export default {
|
||||
}
|
||||
}
|
||||
)
|
||||
}
|
||||
},
|
||||
|
||||
// 立即预约-提交订单
|
||||
toReserve() {
|
||||
|
||||
let self = this
|
||||
// 一进来就锁定，彻底防止高频点击
|
||||
if (self.typeId == 1) {
|
||||
if (self.selectedReserveTime.length === 0) {
|
||||
uni.showToast({
|
||||
title: '请选择预约时间',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '提交中',
|
||||
mask: true,
|
||||
});
|
||||
try {
|
||||
const start = self.selectedReserveTime[0].day_time + ' ' + self.selectedReserveTime[0].end_time;
|
||||
const end = self.selectedReserveTime[self.selectedReserveTime.length -1].day_time + ' ' + self.selectedReserveTime[self.selectedReserveTime.length -1].end_time;
|
||||
// 转换为时间戳
|
||||
const startTimestamp = Math.floor(Date.parse(start.replace(/-/g, '/')) / 1000);;
|
||||
const endTimestamp = Math.floor(Date.parse(end.replace(/-/g, '/')) / 1000);;
|
||||
|
||||
// 订单提交
|
||||
self._post(
|
||||
'order.groundOrder/submitStoreOrder',
|
||||
{
|
||||
app_id: self.getAppId(),
|
||||
ground_id: self.id,
|
||||
room_list: JSON.stringify(self.selectedReserveTime),
|
||||
type: self.typeId,
|
||||
start_end: startTimestamp + '-' + endTimestamp,
|
||||
amount_price: self.bill.total
|
||||
},
|
||||
function(res) {
|
||||
self.loadding = false;
|
||||
if(res.code) {
|
||||
// 记录费用明细到缓存中
|
||||
// uni.setStorageSync('billDetail', JSON.stringify(self.bill));
|
||||
|
||||
uni.$on('payment', params => {
|
||||
console.log("🚀 ~ params:", params)
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true,
|
||||
});
|
||||
setTimeout(() => {
|
||||
self.loadding = false
|
||||
uni.$off("payment")
|
||||
if (params.result) {
|
||||
uni.redirectTo({
|
||||
url: `/bundle/reserve/notice?order_id=${params.order_id}`
|
||||
})
|
||||
} else {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/cg-my-order'
|
||||
})
|
||||
}
|
||||
}, 500)
|
||||
})
|
||||
|
||||
uni.navigateTo({
|
||||
url: `/bundle/reserve/confirm?venueId=${self.venue.id}&roomId=${self.id}&typeId=${self.typeId}&orderId=${res.data.lists.id}`
|
||||
});
|
||||
}
|
||||
}
|
||||
)
|
||||
} catch (error) {
|
||||
console.error('订单提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '订单提交失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
self.loadding = false;
|
||||
}
|
||||
} else {
|
||||
const room = self.venueRoomLists[self.selectedRoomIndex]
|
||||
if (!self.date) {
|
||||
uni.showToast({
|
||||
title: '请选择预约时间',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
self.loadding = true;
|
||||
const roomList = [
|
||||
{
|
||||
room_id: room.id,
|
||||
day_time: self.datetimestamp,
|
||||
day_title: self.datetimestamp,
|
||||
start_time: self.datetimestamp,
|
||||
end_time: self.datetimestamp,
|
||||
room_price: self.bill.cdf.price,
|
||||
}
|
||||
]
|
||||
self._post(
|
||||
'order.GroundOrder/addBskStoreOrder',
|
||||
{
|
||||
app_id: self.getAppId(),
|
||||
room_id: room.id,
|
||||
ground_id: self.id,
|
||||
room_list: JSON.stringify(roomList),
|
||||
type: self.typeId,
|
||||
start_end: self.datetimestamp + '-' + self.dateEndTimestamp,
|
||||
},
|
||||
function(res) {
|
||||
self.loadding = false;
|
||||
if(res.code) {
|
||||
// 记录费用明细到缓存中
|
||||
// uni.setStorageSync('billDetail', JSON.stringify(self.bill));
|
||||
|
||||
uni.$on('payment', params => {
|
||||
console.log("🚀 ~ params:", params)
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true,
|
||||
});
|
||||
setTimeout(() => {
|
||||
self.loadding = false
|
||||
uni.$off("payment")
|
||||
if (params.result) {
|
||||
uni.redirectTo({
|
||||
url: `/bundle/reserve/notice?order_id=${params.order_id}`
|
||||
})
|
||||
} else {
|
||||
uni.redirectTo({
|
||||
url: '/pages/order/cg-my-order'
|
||||
})
|
||||
}
|
||||
}, 500)
|
||||
})
|
||||
console.log("🚀 ~ res.data.lists.id:", res.data)
|
||||
console.log("🚀 ~ res.data.lists.id:", res.data.lists.id)
|
||||
uni.navigateTo({
|
||||
url: `/bundle/reserve/confirm?venueId=${self.venue.id}&roomId=${self.id}&typeId=${self.typeId}&orderId=${res.data.lists.id}`
|
||||
});
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
} catch (error) {
|
||||
console.error('订单提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '订单提交失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
self.loadding = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -844,8 +926,8 @@ page {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-radius: 100%;
|
||||
background: #F7F7F7;
|
||||
border: 2rpx solid #E9ECF4;
|
||||
background: #41C95D;
|
||||
border: 2rpx solid #41C95D;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
@ -1111,24 +1193,50 @@ page {
|
||||
}
|
||||
|
||||
.cg-time-block {
|
||||
margin-top: 76rpx;
|
||||
margin-top: 85rpx;
|
||||
|
||||
.cg-time {
|
||||
font-size: 26rpx;
|
||||
color: #303133;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
// line-height: 60rpx;
|
||||
border: 2rpx solid transparent;
|
||||
margin: 4rpx;
|
||||
margin: 4rpx 4rpx 14rpx;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.cg-info {
|
||||
margin-left: 54rpx;
|
||||
margin-top: 38rpx;
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
position: relative;
|
||||
|
||||
.cg-border {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
border-bottom: 2rpx solid #FFC880;
|
||||
top: 38rpx;
|
||||
}
|
||||
|
||||
.cg-right-border {
|
||||
position: absolute;
|
||||
right: -8px;
|
||||
top: -12rpx;
|
||||
height: 100%;
|
||||
border-right: 4rpx solid #FFC880;
|
||||
}
|
||||
|
||||
.cg-right-border:last-of-type {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.cg-info-time {
|
||||
margin: 4rpx;
|
||||
margin-bottom: 14rpx;
|
||||
width: 120rpx;
|
||||
height: 60rpx;
|
||||
text-align: center;
|
||||
@ -1137,15 +1245,20 @@ page {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.cg-right-border.no-border {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.cg-info-time-none {
|
||||
background: #D4DAE6;
|
||||
border: 2rpx solid #D4DAE6;
|
||||
background: #BBBFC7;
|
||||
border: 2rpx solid #BBBFC7;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cg-info-time-normal {
|
||||
background: #F7F7F7;
|
||||
border: 2rpx solid #E9ECF4;
|
||||
color: #303133;
|
||||
background: #41C95D;
|
||||
border: 2rpx solid #41C95D;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cg-info-time-select {
|
||||
|
||||
Reference in New Issue
Block a user