Commit 8bc4e6ca by zhangzhen

细节优化

parent 14b31562
...@@ -32,7 +32,8 @@ ...@@ -32,7 +32,8 @@
"path": "pages/order/order", "path": "pages/order/order",
"style": { "style": {
"navigationBarTitleText": "房间预约", "navigationBarTitleText": "房间预约",
"navigationStyle": "default" "navigationStyle": "default",
"backgroundColorTop": "white"
} }
}, },
{ {
......
<template> <template>
<view class="order-page"> <view class="order-page">
<view class="flex-row header"> <view class="flex-row header">
<view class="part-2"> <view class="part-left">
<text class="tips"><text class="text-bold">预定须知:</text> 预定成功后,请按预约时间及时到店消费,若无法及时到店消费,可提前取消订单</text> <image :src="roomInfo.images.length?roomInfo.images[0]: assetsPath+'/banner.jpg'" mode="aspectFill">
</image>
</view> </view>
<view class="part-right"> <view class="part-right">
<text <text
class="text-title text-xl text-bold">{{roomInfo.name||'凑角'}}{{roomInfo.roomType?'【'+roomTypeEnum[roomInfo.roomType]+'】':''}}</text> class="text-title text-xl text-bold">{{roomInfo.name||'凑角'}}{{roomInfo.roomType?'【'+roomTypeEnum[roomInfo.roomType]+'】':''}}</text>
<view v-if="roomInfo.roomStat >= 3" class="status-icon-box"> <view v-if="roomInfo.roomStat >= 3" class="status-icon-box">
<view class="status-box" :class="'status-box-1'"> <view class="status-box" :class="'status-box-1'">
<text>维护中</text> <text>维护中</text>
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<image class="img" :src="assetsPath+'/fa_icon_1.png'" mode="widthFix"></image> <image class="img" :src="assetsPath+'/fa_icon_1.png'" mode="widthFix"></image>
</view> </view>
<view v-else-if="roomInfo.recordsStatus>=0" class="status-icon-box"> <view v-else-if="roomInfo.recordsStatus>=0" class="status-icon-box">
<view class="status-box" :class="'status-box-1'"> <view class="status-box" :class="'status-box-1'">
<text>{{recordsStatusEnum[roomInfo.recordsStatus]}}</text> <text>{{recordsStatusEnum[roomInfo.recordsStatus]}}</text>
</view> </view>
...@@ -37,31 +37,27 @@ ...@@ -37,31 +37,27 @@
</view> </view>
</view> </view>
<view class="part-left">
<image :src="roomInfo.images.length?roomInfo.images[0]: assetsPath+'/banner.jpg'" mode="widthFix">
</image>
</view>
</view> </view>
<view class="tab-box">
<view v-for="(item,i) in orderTypeList" :key="i" class="tab-item" :class="{active:i ===index}" <view class="order-type-box">
@tap="onTypeChange(i)"> <view class="tab-box">
<text class="text-gray text-xl text-bold">{{item.label}}</text> <view v-for="(item,i) in orderTypeList" :key="i" class="tab-item">
<view v-if="item.type == 2" class="hot-icon"> <text class="text-gray text-xl">{{item.label}}</text>
<view class="img-icon"> <view class="hot-icon">
<image src="../../static/hot_icon.png" mode="widthFix"></image> <view class="img-icon">
<image src="../../static/hot_icon.png" mode="widthFix"></image>
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
<view class="order-type-box">
<view class="flex-col date-content-box"> <view class="flex-col date-content-box">
<view class="flex-row date-tips"> <view class="flex-row date-tips">
<text class="text-xl margin-right">选择日期</text> <text class="text-lg margin-right">选择日期</text>
<text class="text-2">请先选择使用日期, 再勾选其他选项哦</text> <text class="text-2">请先选择使用日期, 再勾选其他选项哦</text>
</view> </view>
<view class="flex-row date-box"> <view class="flex-row date-box">
<view class="bg-box" :style="{left:20*dateIndex+'%'}"> <view class="bg-box" :style="{left:20*dateIndex+'%'}">
<image class="img" :src="assetsPath+'/calendar.png'" mode="scaleToFill"></image> <image class="img" :src="assetsPath+'/calendar_2.png'" mode="scaleToFill"></image>
</view> </view>
<view v-for="(item,k) in dateList" :key="k" class="flex-1 flex-col date-item" <view v-for="(item,k) in dateList" :key="k" class="flex-1 flex-col date-item"
:class="{active:dateIndex === k}" @tap="onDateChange(k)"> :class="{active:dateIndex === k}" @tap="onDateChange(k)">
...@@ -73,46 +69,51 @@ ...@@ -73,46 +69,51 @@
</view> </view>
<view class="flex-col data-content-box"> <view class="flex-col data-content-box">
<view v-show="index==1" class="flex-col package-mode"> <view v-show="orderType==1" class="flex-col package-mode">
<view class="part-1"> <view class="part-1">
<text class="text-title text-lg text-bold">套餐选择:</text> <text class="text-title text-lg text-bold">套餐选择:</text>
</view> </view>
<scroll-view scroll-x="true" class="scroll-view"> <view class="flex-row package-box">
<view class="flex-row package-box"> <view v-if="roomLabelList.length" class="room-label-list">
<view v-for="(item,index) in packageMode" :key="index" class="flex-col item" <view v-for="(item,index) in roomLabelList" :key="index" class="room-label-box"
:class="{active: modeIndex===index}" @tap="onChangeMode(index)"> @tap="onChangePackage(index)">
<text class="text-title">{{item.name}}</text> <view class="item" :class="{active: modeIndex===index}">
<view class="flex-row" style="margin-top: 8upx;"> <text>{{item.labelDuration}}小时</text>
<!-- <text>{{item.duration}}小时/</text>-->
<text style="margin-bottom: 2upx;"></text>
<text class="text-bold text-xl">{{item.price}}</text>
</view> </view>
</view> </view>
</view> </view>
</scroll-view> <view class="flex-col package-list">
<view v-if="packageMode[modeIndex].remark" class="flex-col tip-box"> <view v-for="(item,index) in packageMode" :key="index" class="package-list-box"
<text class="" style="margin-bottom: 12upx;">套餐说明:</text> @tap="onChangePackage2(index)">
<text class="text-sm">{{packageMode[modeIndex].remark}}</text>
</view> <view class="item" :class="{active: modeIndex2===index}">
</view> <text>{{item.name}}</text>
</view>
</view>
</view>
<view v-show="orderType ===1 && index == 0" class="flex-col distance-mode">
<view class="distance-title">
<text class="text-title text-lg text-bold">时长选择:</text>
</view> </view>
<view class="flex-1 distance-box">
<view v-for="(item,index) in distanceMode" :key="index" class="flex-col"
style="margin: 0 12upx;" @tap="onDurationChange(index)"> <view v-if="orderType ===1 && !roomLabelList.length && !packageMode.length"
<view class="cu-tag radius" :class="index===distanceIndex? 'line-pink':'line-gray'"> class="flex-col distance-mode">
<text>{{ index >= distanceMode.length-1 && !editDuration.length ? item.duration: item.duration+'小时'}}</text> <view class="distance-title">
<text v-if="index >= distanceMode.length-1" class="cuIcon-edit text-lg"></text> <text class="text-title text-lg text-bold">时长选择:</text>
</view>
<view class="flex-1 distance-box">
<view v-for="(item,index) in distanceMode" :key="index" class="flex-col"
style="margin: 0 12upx;" @tap="onDurationChange(index)">
<view class="cu-tag radius" :class="index===distanceIndex? 'line-pink':'line-gray'">
<text>{{ index >= distanceMode.length-1 && !editDuration.length ? item.duration: item.duration+'小时'}}</text>
<text v-if="index >= distanceMode.length-1" class="cuIcon-edit text-lg"></text>
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
<view v-if="orderType ===2 && index == 0" class="flex-col distance-mode" </view>
style="margin: 40upx 20upx 40upx;"> <view v-if="orderType ===2" class="flex-col distance-mode" style="margin: 40upx 20upx 40upx;">
<view class="distance-title"> <view class="distance-title">
<text class="text-title text-lg text-bold">时长选择:</text> <text class="text-title text-lg text-bold">时长选择:</text>
</view> </view>
...@@ -143,7 +144,7 @@ ...@@ -143,7 +144,7 @@
<view class="part-1"> <view class="part-1">
<button class="cu-btn round" :class="orderType===1?'line-black':'line-gray'" <button class="cu-btn round" :class="orderType===1?'line-black':'line-gray'"
@tap="onSelectDate"> @tap="onSelectDate">
<text>{{startTime | resetStartTime}}</text> <text>{{formatAllData.startTime}}</text>
<text class="cuIcon-edit"></text> <text class="cuIcon-edit"></text>
</button> </button>
</view> </view>
...@@ -153,7 +154,7 @@ ...@@ -153,7 +154,7 @@
<view class="part-1 part-3"> <view class="part-1 part-3">
<button class="cu-btn round line-gray"> <button class="cu-btn round line-gray">
<text>{{endTime}}</text> <text>{{formatAllData.endTime}}</text>
</button> </button>
</view> </view>
</view> </view>
...@@ -177,10 +178,10 @@ ...@@ -177,10 +178,10 @@
</view> </view>
</view> </view>
<view class="date-point-box"> <view class="date-point-box">
<view v-for="(item,k) in intervalList" :key="k" class="date-point-item" <view v-for="(item,k) in formatAllData.list" :key="k" class="date-point-item"
v-if="k>=startHours && k<=endHours" @tap="onSelectDatePoint(item,k)"> v-if="k>=startHours && k<=endHours" @tap="onSelectDatePoint(item,k)">
<view class="date-point" <view class="date-point"
:class="item.status === 0 || (item.status==1 && item.m <59) ?'free':item.status==1 && item.m >=59?'used': item.status==2?'checked':'error'"> :class="item.status === 0 ?'free':item.status===1?'used': item.status==2?'checked':'error'">
</view> </view>
<text class="text-gray">{{item.hour}}</text> <text class="text-gray">{{item.hour}}</text>
</view> </view>
...@@ -298,10 +299,10 @@ ...@@ -298,10 +299,10 @@
<text class="text-black text-lg">{{orderType==1? '预约':'续单'}}包间:{{roomInfo.name}}</text> <text class="text-black text-lg">{{orderType==1? '预约':'续单'}}包间:{{roomInfo.name}}</text>
</view> </view>
<view class="info"> <view class="info">
<text class="text-black text-lg">开始时间:{{dateObj.startDate}}</text> <text class="text-black text-lg">开始时间:{{formatAllData.startDateTime}}</text>
</view> </view>
<view class="info"> <view class="info">
<text class="text-black text-lg">结束时间:{{dateObj.endDate}}</text> <text class="text-black text-lg">结束时间:{{formatAllData.endDateTime}}</text>
</view> </view>
</view> </view>
<view class="flex-1"> <view class="flex-1">
...@@ -393,25 +394,14 @@ ...@@ -393,25 +394,14 @@
images: [] images: []
}, },
startTime: moment().format("HH:mm"), startTime: moment().format("HH:mm"),
endTime: '12:00', endTime: '',
dateIndex: 0, dateIndex: 0,
dateList: [ dateList: [],
// {
// date:"02-28",
// readDate:'2024-02-28',
// weekday:''
// }
],
index: 0, //订单模式标记 index: 0, //订单模式标记
orderTypeList: [{ orderTypeList: [{
label: "小时模式", label: "房间预定",
type: 1 type: 1
}, }],
{
label: "套餐模式",
type: 2
}
],
// 时长选择 // 时长选择
distanceIndex: 0, distanceIndex: 0,
distanceMode: [{ distanceMode: [{
...@@ -445,7 +435,10 @@ ...@@ -445,7 +435,10 @@
], ],
// 套餐 // 套餐
modeIndex: 0, modeIndex: 0,
modeIndex2: -1,
packageMode: [], packageMode: [],
roomLabelIndex: 0,
roomLabelList: [],
// 原数据 // 原数据
dateIntervalList: [], dateIntervalList: [],
intervalList: [], intervalList: [],
...@@ -493,9 +486,12 @@ ...@@ -493,9 +486,12 @@
endHours: 48, endHours: 48,
content: '', content: '',
toDayDate: '', // 今天日期 toDayDate: '', // 今天日期
recordsStatusEnum:{ recordsStatusEnum: {
0:"待保洁", 0: "待保洁",
1:"保洁中" 1: "保洁中"
},
formatAllData:{
list:[]
} }
}; };
}, },
...@@ -515,7 +511,6 @@ ...@@ -515,7 +511,6 @@
}, },
watch: { watch: {
dateIndex() { dateIndex() {
this.onSetSelectTime()
this.onSetStartHours() this.onSetStartHours()
} }
}, },
...@@ -541,6 +536,58 @@ ...@@ -541,6 +536,58 @@
} }
}, },
methods: { methods: {
// 日期切换
onDateChange(k) {
if (this.dateIndex === k) return;
this.dateIndex = k;
if(this.modeIndex<0){
this.modeIndex = 0;
this.modeIndex2 = -1;
}
this.onGetSortDistance()
},
// 小时标签切换
onChangePackage(index){
if(this.modeIndex == index) return;
let startDateTime = this.modeIndex >=0 ? this.formatAllData.startDateTime: null
this.modeIndex = index
this.modeIndex2 = -1
this.formatAllData = this.onTransiteForDate({
list: JSON.parse(JSON.stringify(this.dateIntervalList)),
startDateTime,
duration: this.roomLabelList[this.modeIndex].labelDuration,
});
},
// 套餐切换
onChangePackage2(index){
if(this.modeIndex2 == index) return;
this.modeIndex = -1
this.modeIndex2 = index
console.log(this.packageMode[this.modeIndex2])
let startStr = `${this.dateList[this.dateIndex].readDate} ${this.packageMode[this.modeIndex2].packaStartPeriod}:00:00`
let startDate = moment(moment().format(startStr)).format("YYYY-MM-DD HH:00:00");
let endStr = `${this.dateList[this.dateIndex].readDate} ${this.packageMode[this.modeIndex2].packaEndPeriod}:00:00`
let endDate = moment(moment().format(endStr)).format("YYYY-MM-DD HH:00:00");
if(this.dateIndex === 0 && (moment().valueOf() > moment(endDate).valueOf())){
startDate = moment(startDate).add(1,'d').format("YYYY-MM-DD HH:00:00")
endDate = moment(endDate).add(1,'d').format("YYYY-MM-DD HH:00:00")
}
let duration = (moment(endDate).valueOf()-moment(startDate).valueOf())/1000/60;
this.formatAllData = this.onTransiteForDate({
list: JSON.parse(JSON.stringify(this.dateIntervalList)),
startDateTime: startDate,
duration,
durationType:2
});
console.log(this.formatAllData,9999992222)
},
onInitDateList() { onInitDateList() {
this.toDayDate = moment().format("YYYY-MM-DD") this.toDayDate = moment().format("YYYY-MM-DD")
let dateList = []; let dateList = [];
...@@ -580,7 +627,6 @@ ...@@ -580,7 +627,6 @@
} }
this.endHours = this.startHours + 23; this.endHours = this.startHours + 23;
this.onSetSelectTime();
}, },
onGetDicts() { onGetDicts() {
let dicts = [] let dicts = []
...@@ -600,7 +646,8 @@ ...@@ -600,7 +646,8 @@
// 获取房间信息相关 // 获取房间信息相关
onLoading() { onLoading() {
roomInfo({ roomInfo({
id: this.id id: this.id,
type: this.orderType == 1 ? 0 : 1
}).then(res => { }).then(res => {
uni.hideLoading() uni.hideLoading()
if (res.data.code == 200) { if (res.data.code == 200) {
...@@ -610,37 +657,30 @@ ...@@ -610,37 +657,30 @@
.split(",").map(val => this.hostUrl + val) : [] .split(",").map(val => this.hostUrl + val) : []
} }
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: `${this.roomInfo.storeName}-房间${this.orderType ==1? '预约':'续单' }` title: `${this.roomInfo.storeName}-${this.orderType ==1? '预约':'续单' }`
}) })
// 判断房间有没有绑定套餐 // 判断房间有没有绑定套餐
if (this.roomInfo.packList && this.roomInfo.packList.length) { if (this.roomInfo.packList && this.roomInfo.packList.length) {
this.packageMode = this.roomInfo.packList this.packageMode = this.roomInfo.packList
if (this.orderType === 1) {
this.index = 1;
}
this.modeIndex = 0; this.modeIndex = 0;
} else { } else {
this.index = 0;
this.orderTypeList = this.orderTypeList.filter(item => item.type == 1) this.orderTypeList = this.orderTypeList.filter(item => item.type == 1)
} }
if (this.roomInfo.roomLabelList && this.roomInfo.roomLabelList.length) {
// if(this.roomInfo.isDirtyRoom >=1){ let typeNum = this.orderType == 1 ? 0 : 1;
// uni.showToast({ this.roomLabelList = this.roomInfo.roomLabelList.filter(item => item.labelType ==
// icon:"none", typeNum);
// title:'当前房间未保洁,无法预定,请选择其他房间' }
// })
// }
this.onGetSortDistance() this.onGetSortDistance()
} }
}) })
}, },
onGetOrderInfo() { onGetOrderInfo() {
getOrderInfoByNo(this.preOrderNo).then(res => { getOrderInfoByNo(this.preOrderNo).then(res => {
console.log(res,"订单信息") console.log(res, "订单信息")
if (res.data.code == 200) { if (res.data.code == 200) {
let endDate = res.data.data.endDate || res.data.data.preEndDate; let endDate = res.data.data.endDate || res.data.data.preEndDate;
if(res.data.data.status ==2){ if (res.data.data.status == 2) {
endDate = moment().format('YYYY-MM-DD HH:mm') endDate = moment().format('YYYY-MM-DD HH:mm')
} }
this.startTime = moment(endDate).format("HH:mm"); this.startTime = moment(endDate).format("HH:mm");
...@@ -659,14 +699,6 @@ ...@@ -659,14 +699,6 @@
orderType: this.orderType orderType: this.orderType
}).then(res => { }).then(res => {
uni.hideLoading() uni.hideLoading()
if (this.orderTypeList[this.index].type == 2) {
this.duration = Number(this.packageMode[this.modeIndex].duration);
} else {
this.duration = Number(this.distanceMode[this.distanceIndex].duration);
}
let startDateTime = moment().format("YYYY-MM-DD HH:mm:ss")
this.onTransiteForDate(res.data.data,startDateTime,this.duration)
this.dateIntervalList = res.data.data.map((item, index) => { this.dateIntervalList = res.data.data.map((item, index) => {
return { return {
...item, ...item,
...@@ -674,143 +706,25 @@ ...@@ -674,143 +706,25 @@
hour: index > 0 && index - 24 == 0 ? '次日' : index > 24 ? index - 24 : index hour: index > 0 && index - 24 == 0 ? '次日' : index > 24 ? index - 24 : index
} }
}) })
this.formatAllData = this.onTransiteForDate({
if (this.orderType === 2) { list: JSON.parse(JSON.stringify(this.dateIntervalList)),
this.onSetEndTime() duration: this.orderType ==1 ? this.roomLabelList[this.modeIndex].labelDuration : null,
} else { });
this.onCheckDate(); console.log(this.formatAllData, "transiteForDate")
}
}) })
}, },
//设置预定结束时间
onSetEndTime() {
if (this.index == 1) {
// 套餐模式
this.duration = Number(this.packageMode[this.modeIndex].duration);
this.endTime = this.startTime.split(":").map((item, k) => {
let num = ''
if (k == 0) {
if ((Number(item) + this.duration) >= 24) {
num = Number(item) + this.duration - 24
} else {
num = Number(item) + this.duration
}
} else {
num = Number(item)
}
return num >= 10 ? num : `0${num}`
}).join(":")
} else {
// 小时模式
if (this.orderType === 1) {
this.duration = Number(this.distanceMode[this.distanceIndex].duration);
} else if (this.orderType === 2) {
this.duration = Number(this.distanceMode2[this.distanceIndex].duration);
}
if (this.orderType === 2 && this.duration < 1) {
let startDateArr = this.startTime.split(":").map(item => Number(item))
// 分钟
let m = startDateArr[1] + 60 * this.duration
if (m >= 60) {
startDateArr[0] += 1
if (startDateArr[0] >= 24) {
startDateArr[0] = startDateArr[0] - 24
this.setStartTime.days = 2;
this.days = 2
}
startDateArr[1] = m - 60
} else {
startDateArr[1] = m
}
this.endTime = startDateArr.map(num => num >= 10 ? num : `0${num}`).join(':');
} else {
this.endTime = this.startTime.split(":").map((item, k) => {
let num = ''
if (k == 0) {
if ((Number(item) + this.duration) >= 24) {
num = Number(item) + this.duration - 24
} else {
num = Number(item) + this.duration
}
} else {
num = Number(item)
}
return num >= 10 ? num : `0${num}`
}).join(":")
}
}
this.onUpdateIntervalList()
},
// 更新时间的选取状态
async onUpdateIntervalList() {
this.useDateStatus = true
let start = Number(this.startTime.split(":")[0])
let startM = Number(this.startTime.split(":")[1])
let end = Number(this.endTime.split(":")[0])
let endM = Number(this.endTime.split(":")[1])
// 如果开始时间是第二天
// if(this.setStartTime.days >=2 || this.days == 2){
// start +=24
// }
if (this.orderType == 2 && end < start) {
end += 24
} else if (this.orderType == 1 && end <= start) {
end += 24
}
this.dateObj = await this.onSetDateTime(this.startTime, this.endTime);
this.onGetUseCoupon()
// 重新将数据还原到元数据
this.intervalList = [
...this.dateIntervalList
]
for (let index = start; index <= end; index++) {
let endTimeM = 0
if (this.dateIntervalList[index].status == 1) {
endTimeM = moment(this.dateIntervalList[index].startHoldTime).format('mm')
}
// 在时间小时段内,在被占用的情况下,新增订单的开始分钟时间需要占用结束时间后,结束分钟时间需在时间占用开始前
if ((this.dateIntervalList[index].status == 1 && index > start && index < start + this.duration) ||
(this.dateIntervalList[index].status == 1 && this.orderType == 1 && index == end && Number(startM) >= Number(endTimeM))||
(this.dateIntervalList[index].status == 1 && this.orderType == 2 && index > start && Number(endM) >= Number(endTimeM))
) {
// 表示时间点被占用,无法选择
this.useDateStatus = false
this.intervalList[index] = {
...this.dateIntervalList[index],
status: 2
}
} else {
this.intervalList[index] = {
...this.dateIntervalList[index],
status: 2
}
}
}
this.$forceUpdate();
setTimeout(() => {
if (!this.useDateStatus) {
uni.showToast({
icon: "none",
title: "所选时段已被其他订单占用"
})
}
}, 1000)
},
// 获取可用优惠券 // 获取可用优惠券
onGetUseCoupon() { onGetUseCoupon(p = null) {
getUseCoupon({ getUseCoupon({
storeId: this.roomInfo.storeId, storeId: this.roomInfo.storeId,
roomId: this.roomInfo.id, roomId: this.roomInfo.id,
orderMode: this.orderTypeList[this.index].type, orderMode: this.orderTypeList[this.index].type,
preStartDate: this.dateObj.startDate, preStartDate: p != null ? p.startDateTime : this.formatAllData.startDateTime,
preEndDate: this.dateObj.endDate, preEndDate: p != null ? p.endDateTime : this.formatAllData.endDateTime,
orderType: this.orderType, orderType: this.orderType,
packageId: this.index > 0 ? this.packageMode[this.modeIndex].id : '' packageId: this.modeIndex2 >= 0 ? this.packageMode[this.modeIndex2].id : '',
roomLabelId: this.modeIndex >= 0 ? this.roomLabelList[this.modeIndex].id : ''
}).then(res => { }).then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
if (res.data && res.data.data.length) { if (res.data && res.data.data.length) {
...@@ -829,15 +743,16 @@ ...@@ -829,15 +743,16 @@
this.useCouponList = list; this.useCouponList = list;
let i = this.useCouponList.findIndex(item => item.duration == this.duration) let i = this.useCouponList.findIndex(item => item.duration == this.duration)
this.selectCouponIndex = i >= 0 ? i : 0 this.selectCouponIndex = i >= 0 ? i : 0
}else{ } else {
this.useCouponList = list; this.useCouponList = list;
this.selectCouponIndex = -1 this.selectCouponIndex = -1
} }
} }
this.onComputePrice();
} else if (res.data.code == 401) { } else if (res.data.code == 401) {
this.$refs.loginPop.open(); this.$refs.loginPop.open();
} }
this.onComputePrice();
}) })
}, },
onNavToSelectCoupon() { onNavToSelectCoupon() {
...@@ -863,17 +778,19 @@ ...@@ -863,17 +778,19 @@
orderMode: that.orderTypeList[that.index].type, orderMode: that.orderTypeList[that.index].type,
preStartDate: that.dateObj.startDate, preStartDate: that.dateObj.startDate,
orderType: that.orderType, orderType: that.orderType,
packageId: that.packageMode.length? that.packageMode[that.modeIndex].id : '', packageId: that.packageMode.length ? that.packageMode[that.modeIndex].id :
'',
preEndDate: that.dateObj.endDate, preEndDate: that.dateObj.endDate,
selectId: that.selectCouponIndex >= 0 && that.useCouponList.length ? that.useCouponList[that selectId: that.selectCouponIndex >= 0 && that.useCouponList.length ? that
.selectCouponIndex].id : '' .useCouponList[that
.selectCouponIndex].id : ''
}) })
} }
}) })
} }
}, },
//计算支付金额 //计算支付金额
onComputePrice() { onComputePrice(p = null) {
// uni.showLoading({ // uni.showLoading({
// title: "加载中..." // title: "加载中..."
// }) // })
...@@ -881,16 +798,15 @@ ...@@ -881,16 +798,15 @@
storeId: this.roomInfo.storeId, storeId: this.roomInfo.storeId,
roomId: this.roomInfo.id, roomId: this.roomInfo.id,
buyType: this.orderTypeList[this.index].type, buyType: this.orderTypeList[this.index].type,
couponId: this.useCouponList.length && this.selectCouponIndex >= 0 ? this.useCouponList[this couponId: this.useCouponList.length && this.selectCouponIndex >= 0 ? this.useCouponList[this.selectCouponIndex].id : '',
.selectCouponIndex].id : '',
orderType: this.orderType, orderType: this.orderType,
preStartDate: this.dateObj.startDate, preStartDate: p != null ? p.startDateTime : this.formatAllData.startDateTime,
preEndDate: this.dateObj.endDate, preEndDate: p != null ? p.endDateTime : this.formatAllData.endDateTime,
orderMode: this.orderTypeList[this.index].type, orderMode: this.orderTypeList[this.index].type,
} packId : this.modeIndex2 >= 0 ? this.packageMode[this.modeIndex2].id : '',
if (this.index === 1) { roomLabelId : this.modeIndex >= 0 ? this.roomLabelList[this.modeIndex].id : '',
params.packId = this.packageMode[this.modeIndex].id; }
}
computePrice(params).then(res => { computePrice(params).then(res => {
// uni.hideLoading() // uni.hideLoading()
if (res.data.code == 200) { if (res.data.code == 200) {
...@@ -904,217 +820,19 @@ ...@@ -904,217 +820,19 @@
}) })
}, },
// 下单模式切换
onTypeChange(i) {
// if (this.orderType == 2) {
// uni.showToast({
// icon: 'none',
// title: '房间续单无法选择套餐模式'
// })
// return
// }
if (this.index === i || !this.packageMode.length) return;
this.index = i
this.modeIndex = 0;
this.addM = false;
this.distanceIndex = this.orderType == 2 ? 1 : 0;
this.setStartTime = {
status: false,
startTime: '',
startDate: '',
duration: 0,
days: 1
}
// if(Number(this.startTime.split(":")[0])< new Date().getHours()){
// this.days = 2
// }else{
// this.days =1
// }
this.days = 1
// this.checkedDateList= [0,0]
// this.onSetEndTime();
this.onGetSortDistance();
},
onChangeMode(i) {
if (this.modeIndex === i) return;
this.modeIndex = i;
this.selectCouponIndex = -1;
this.useDateStatus = true;
this.duration = Number(this.packageMode[this.modeIndex].duration);
let val = this.intervalList.findIndex(item => item.status === 2)
let len = this.intervalList.filter(item => item.status === 2).length;
let duration = Number(this.packageMode[this.modeIndex].duration);
let start = Number(this.startTime.split(":")[0])
let startM = Number(this.startTime.split(":")[1])
let h = val;
if (val >= 24) {
this.setStartTime.days = 2;
this.days = 2;
}
if (val + duration >= 24) {
h = val + duration - 24
} else {
h = val + duration
}
this.endTime = `${h>=10?h:'0'+h}:${startM>=10?startM:'0'+startM}`;
this.intervalList = this.intervalList.map((item, index) => { onChangeMode(i) {
let status = item.status;
if (index >= val && index <= val + duration) {
status = 2
let endTimeM = 0
if (this.dateIntervalList[index].status == 1) {
endTimeM = moment(this.dateIntervalList[index].startHoldTime).format('mm')
}
if ((this.dateIntervalList[index].status === 1 && index > val && index < val + duration) ||
(this.dateIntervalList[index].status === 1 && index == val + duration && Number(
startM) >= Number(endTimeM))) {
this.useDateStatus = false
}
} else {
status = this.dateIntervalList[index].status
}
return {
...item,
status
}
})
if (!this.useDateStatus) {
uni.showToast({
icon: "none",
title: "所选时段已被其他订单占用",
success: () => {
setTimeout(async () => {
this.dateObj = await this.onSetDateTime(this.startTime, this
.endTime);
this.onGetUseCoupon()
}, 1000)
}
})
} else {
this.dateObj = this.onSetDateTime(this.startTime, this.endTime);
this.onGetUseCoupon();
}
}, },
onDurationChange(i) { onDurationChange(i) {
if (i >= this.distanceMode.length - 1) {
this.onEditDuration();
return
}
if (this.distanceIndex === i) return;
this.distanceIndex = i
this.selectCouponIndex = -1
this.onSetEndTime()
}, },
onDurationChange2(i) { onDurationChange2(i) {
if (this.distanceIndex === i) return;
this.distanceIndex = i
this.selectCouponIndex = -1
this.onSetEndTime()
},
onDateChange(k) {
if (this.orderType == 2) return;
if (this.dateIndex === k) return;
listSortDistance({
storeId: this.roomInfo.storeId,
roomId: this.roomInfo.id,
day: this.dateList[k].readDate,
orderType: this.orderType
}).then(res => {
// 今天可连续选择的时段
let selectNum = 0;
//预定节点
let t = -1;
//预定开始时间
let startDate = '';
let ms = 0;
let endDate = ""
// 查询有无可预定的时段
let todaySelectStatus = false;
res.data.data.forEach((val, i) => {
if (val.status == 1 && moment(val.endHoldTime).format('mm') < 59 && selectNum ==
0) {
startDate = moment(val.endHoldTime).format("YYYY-MM-DD HH:mm:ss")
selectNum += 1
t = i
} else if (val.status == 1 && selectNum > 0) {
let start = moment(startDate).valueOf()
let end = moment(val.startHoldTime).valueOf()
if (end - start > this.duration * 60 * 60 * 1000) {
todaySelectStatus = true;
} else {
startDate = ''
selectNum = 0
endDate = ""
t = -1
}
} else if (selectNum == 0 && !val.status) {
startDate = val.timeHour + ":00:00";
selectNum += 1
t = i
} else if (selectNum > 0 && !val.status) {
// 计算时长
let start = moment(startDate).valueOf()
endDate = endDate ? moment(endDate).add(1, 'h').format("YYYY-MM-DD HH:mm:ss") :
moment(startDate).add(1, 'h').format("YYYY-MM-DD HH:mm:ss")
let end = moment(endDate).valueOf()
if (end - start > this.duration * 60 * 60 * 1000) {
todaySelectStatus = true;
} else {
selectNum += 1
}
}
})
if ((todaySelectStatus && t >= 24) || !todaySelectStatus) {
uni.showToast({
icon: "none",
title: "当前日期无可预约时段"
})
return;
}
this.dateIndex = k
this.selectCouponIndex = -1
this.addM = false;
this.onGetSortDistance()
})
}, },
// 开始选择时间 // 开始选择时间
onSelectDate() { onSelectDate() {
if (this.orderType === 2) return;
if (!this.checkedIndex.length) {
let arr = this.startTime.split(":").map((item, k) => {
let n = Number(item)
if (k === 0 && this.dateIndex === 0) {
n = this.hourList.findIndex(val => Number(val) === n)
}
return n
})
if (arr.length) {
if (Number(arr[1]) <= 10) {
this.checkedDateList = [arr[0], 0]
} else if (Number(arr[1]) > 10 && Number(arr[1]) <= 40) {
this.checkedDateList = [arr[0], 1]
} else if (Number(arr[1]) > 40) {
if (arr[0] >= 23) {
this.checkedDateList = [0, 0]
} else {
this.checkedDateList = [Number(arr[0]) + 1, 0]
}
}
}
}
this.checkedIndex = this.checkedDateList
this.$refs.popup.open()
}, },
// 切换时间 // 切换时间
...@@ -1126,8 +844,6 @@ ...@@ -1126,8 +844,6 @@
this.checkedDateList = this.checkedIndex.length ? this.checkedIndex.map(item => Number(item)) : [0, 0]; this.checkedDateList = this.checkedIndex.length ? this.checkedIndex.map(item => Number(item)) : [0, 0];
this.startTime = `${this.hourList[this.checkedDateList[0]]}:${this.minuteList[this.checkedDateList[1]]}`; this.startTime = `${this.hourList[this.checkedDateList[0]]}:${this.minuteList[this.checkedDateList[1]]}`;
this.$forceUpdate(); this.$forceUpdate();
//重新设置结束时间
this.onSetEndTime()
this.onHideModal(); this.onHideModal();
}, },
...@@ -1149,7 +865,6 @@ ...@@ -1149,7 +865,6 @@
} }
this.onHideModal() this.onHideModal()
this.$forceUpdate(); this.$forceUpdate();
this.onSetEndTime()
}, },
onHideModal() { onHideModal() {
this.$refs.popup.close() this.$refs.popup.close()
...@@ -1266,13 +981,13 @@ ...@@ -1266,13 +981,13 @@
orderType: this.orderType, orderType: this.orderType,
buyType: this.orderTypeList[this.index].type, buyType: this.orderTypeList[this.index].type,
payType: 1, payType: 1,
couponId: this.useCouponList.length && this.selectCouponIndex >= 0 ? this.useCouponList[this couponId: this.useCouponList.length && this.selectCouponIndex >= 0 ? this.useCouponList[this.selectCouponIndex].id : '',
.selectCouponIndex].id : '', preStartDate: this.formatAllData.startDateTime,
preStartDate: this.dateObj.startDate, preEndDate: this.formatAllData.endDateTime,
preEndDate: this.dateObj.endDate, totalFee: this.computePriceInfo.totalFee || 0,
totalFee: Number(this.roomInfo.price) * this.duration,
payFee: this.computePriceInfo.payFee || 0, payFee: this.computePriceInfo.payFee || 0,
packId: this.index > 0 ? this.packageMode[this.modeIndex].id : '' packId: this.modeIndex2 >= 0 ? this.packageMode[this.modeIndex2].id : '',
roomLabelId: this.modeIndex >= 0 ? this.roomLabelList[this.modeIndex].id : ''
} }
if (this.orderType === 2 && this.preOrderNo) { if (this.orderType === 2 && this.preOrderNo) {
params.preOrderNo = this.preOrderNo params.preOrderNo = this.preOrderNo
...@@ -1349,37 +1064,16 @@ ...@@ -1349,37 +1064,16 @@
} }
}) })
}, },
onSelectTime(val, k) {
if (val.status == 1) {
uni.showToast({
icon: "none",
title: "时间为不可选择时间"
})
} else {
if (k >= 24) {
this.dateIndex += 1
this.startTime = `${k-24}:00`
} else {
this.startTime = `${k}:00`
}
this.onSetEndTime()
}
},
onNavRecharge() {
uni.showToast({
icon: "none",
title: "功能暂未开发"
})
},
onNavToCheckedCoupon() { onNavToCheckedCoupon() {
let that = this; let that = this;
uni.navigateTo({ uni.navigateTo({
url: "/pages/couponCheck/couponCheck?storeId=" + this.roomInfo.storeId, url: "/pages/couponCheck/couponCheck?storeId=" + this.roomInfo.storeId,
success: (res) => { success: (res) => {
res.eventChannel.emit('acceptDataFromOpenerPage', { res.eventChannel.emit('acceptDataFromOpenerPage', {
orderPage:true , orderPage: true,
storeId: that.roomInfo.storeId storeId: that.roomInfo.storeId
}) })
}, },
events: { events: {
// 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据 // 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据
...@@ -1400,99 +1094,12 @@ ...@@ -1400,99 +1094,12 @@
}) })
return return
} }
let time = i;
if (i >= 24) {
time = i - 24;
if (this.dateIndex === 0) {
this.dateIndex += 1;
}
}
if (val.endHoldTime) {
let mTime = Number(moment(val.endHoldTime).format("mm"))
if (mTime >= 59) {
uni.showToast({
icon: 'none',
title: '当前时段不可预定'
})
return;
} else {
this.startTime = `${time>=10?time:'0'+time}:${mTime>=10?mTime:'0'+mTime}`;
if (time >= 0) {
// 开始时间加一分钟
let arr = this.startTime.split(":");
let m = Number(arr[1]) + 1
let h = Number(arr[0])
this.startTime = `${h>=10?h:'0'+h}:${m>=10?m:'0'+m}`
}
this.endTime = this.startTime.split(":").map((item, k) => {
let n = Number(item);
if (k == 0) {
n = n + this.duration >= 24 ? n + this.duration - 24 : n + this.duration
}
return n >= 10 ? n : `0${n}`
}).join(":")
}
} else {
this.startTime = `${time>=10?time:'0'+time}:00`;
this.endTime = this.startTime.split(":").map((item, k) => {
let n = Number(item);
if (k == 0) {
n = n + this.duration >= 24 ? n + this.duration - 24 : n + this.duration
}
return n >= 10 ? n : `0${n}`
}).join(":")
}
this.dateObj = this.onSetDateTime(this.startTime, this.endTime);
this.onGetUseCoupon();
this.useDateStatus = true;
this.intervalList = this.intervalList.map((item, index) => {
let status = item.status;
if (index >= i && index <= i + this.duration) {
status = 2
if (this.dateIntervalList[index].status === 1 && index !== i) {
this.useDateStatus = false;
}
} else {
status = this.dateIntervalList[index].status
}
return {
...item,
status
}
})
if (!this.useDateStatus) {
uni.showToast({
icon: "none",
title: "所选时段已被其他订单占用"
})
}
}, },
// 将时间转换成完整日期
onSetDateTime(startTime, endTime) {
let obj = {
startDate: "",
endDate: ''
}
let startArr = startTime.split(":")
let endArr = endTime.split(":")
obj.startDate = `${this.dateList[this.dateIndex].readDate} ${startTime}:00`
if ((this.orderType == 1 && Number(endArr[0]) <= Number(startArr[0]))) {
obj.endDate =
`${moment(obj.startDate).add(1,"days").format("YYYY-MM-DD")} ${endTime}:00`
} else if (this.orderType == 2 && Number(endArr[0]) < Number(startArr[0])) {
obj.endDate =
`${moment(obj.startDate).add(1,"days").format("YYYY-MM-DD")} ${endTime}:00`
} else {
obj.endDate = `${moment(obj.startDate).format("YYYY-MM-DD")} ${endTime}:00`
}
return obj;
},
//list(Array):当前日期的时间占用情况 //list(Array):当前日期的时间占用情况
//startDateTime(YYYY-MM-DD HH:mm:ss): 开始时间 //startDateTime(YYYY-MM-DD HH:mm:ss): 开始时间
//endDateTime(YYYY-MM-DD HH:mm:ss): 开始时间
//duration(Number||String): 时长,小时或分钟 //duration(Number||String): 时长,小时或分钟
//durationType(Number) : 时长类型,1:小时,2:分钟 //durationType(Number) : 时长类型,1:小时,2:分钟
// 返回值 // 返回值
...@@ -1502,127 +1109,56 @@ ...@@ -1502,127 +1109,56 @@
//startTime(HH:mm): 开始时间,显示使用 //startTime(HH:mm): 开始时间,显示使用
//endTime(HH:mm): 结束时间,显示使用 //endTime(HH:mm): 结束时间,显示使用
//duration(Number): 时长,仅分钟 //duration(Number): 时长,仅分钟
onTransiteForDate(list=[],startDateTime,duration,durationType=1){ onTransiteForDate(params) {
console.log(list,"数据列表") console.log(params, "所有参数")
// 计算出时长,使用分钟计算 // 计算出时长,使用分钟计算
let m = duration if(!params.duration){
if(durationType==1){ return {
m = duration*60 errMsg:"选择时长错误"
}
}
let m = Number(params.duration)*60;
if (params.durationType === 2) {
m = Number(params.duration)
} }
// 开始时间的毫秒数 // 开始时间的毫秒数
let startStamp = moment(startDateTime).valueOf(); let startStamp = this.dateIndex > 0? moment(params.list[0].timeHour).valueOf() : !params.startDateTime || params.startDateTime == null ? moment().valueOf() : moment(params.startDateTime).valueOf();
let endStamp = startStamp+ m*60*1000; let endStamp = startStamp + m * 60 * 1000;
console.log(startStamp,endStamp) console.log(startStamp, endStamp)
console.log(endStamp-startStamp) console.log(endStamp - startStamp)
// 记录可开始的时间点 // 记录可开始的时间点
let startPoint = ''; let startPoint = startStamp;
let endPoint = '' let endPoint = endStamp
list.forEach((item,index)=>{
console.log(item) // 获取开始时间的当前小时
// 如果开始时间有,则需要计算可预定的时长 let startPointDate = moment(moment(startStamp).format("YYYY-MM-DD HH:00:00")).valueOf();
if(startPoint){ // 截取可预定时间段状态,true表示也筛选到
if(item.status ===0){ let interceptDateStatus = false;
endPoint = moment(item.timeHour).format("YYYY-MM-DD HH:59:59") let list = params.list.map((item, index) => {
}else{ if (interceptDateStatus) {
endPoint = moment(item.startHoldTime).format("YYYY-MM-DD HH:mm:ss") return item
} }
}else{ let point = moment(moment(item.timeHour).format("YYYY-MM-DD HH:00:00")).valueOf();
// 如果开始时间没有,则需要赋值开始时间 if (point >= startPointDate && point < endStamp) {
if(item.status ===0){ item.status = 2;
startPoint = moment(item.timeHour).format("YYYY-MM-DD HH:mm:ss") }
}else{ return item
// 当前小时时间是被占用状态且低于59分钟
let mm = moment(item.endHoldTime).format("mm")
if(mm<59){
startPoint = moment(item.endHoldTime).format("YYYY-MM-DD HH:mm:ss")
}
}
}
}) })
let paramsData = {
list,
startDateTime: moment(startPoint).format("YYYY-MM-DD HH:mm:ss"),
startTime: moment(startPoint).format("HH:mm"),
endDateTime: moment(endPoint).format("YYYY-MM-DD HH:mm:ss"),
endTime: moment(endPoint).format("HH:mm"),
duration: m,
interceptDateStatus
}
// 获取用户可用优化券
this.onGetUseCoupon(paramsData)
return paramsData
}, },
onCheckDate() { onCheckDate() {}
// 今天可连续选择的时段
let selectNum = 0;
//预定节点
let t = -1;
//预定开始时间
let startDate = '';
let ms = 0;
let endDate = ""
// 查询有无可预定的时段
let todaySelectStatus = false;
this.dateIntervalList.forEach((val, i) => {
if (val.status == 1 && moment(val.endHoldTime).format('mm') < 59 && selectNum == 0) {
startDate = moment(val.endHoldTime).format("YYYY-MM-DD HH:mm:ss")
selectNum += 1
t = i
} else if (val.status == 1 && selectNum > 0) {
let start = moment(startDate).valueOf()
let end = moment(val.startHoldTime).valueOf()
if (end - start > this.duration * 60 * 60 * 1000) {
todaySelectStatus = true;
} else {
startDate = ''
selectNum = 0
endDate = ""
t = -1
}
} else if (selectNum == 0 && !val.status) {
startDate = val.timeHour + ":00:00";
selectNum += 1
t = i
} else if (selectNum > 0 && !val.status) {
// 计算时长
let start = moment(startDate).valueOf()
endDate = endDate ? moment(endDate).add(1, 'h').format("YYYY-MM-DD HH:mm:ss") : moment(
startDate).add(1, 'h').format("YYYY-MM-DD HH:mm:ss")
let end = moment(endDate).valueOf()
if (end - start > this.duration * 60 * 60 * 1000) {
todaySelectStatus = true;
} else {
selectNum += 1
}
}
})
if ((todaySelectStatus && t >= 24) || !todaySelectStatus) {
if (this.dateIndex >= this.dateList.length - 1) {
this.onInitDateList()
} else {
this.dateIndex += 1;
}
//房间维护就不循环
if (this.roomInfo.roomStat !== 3) {
this.onGetSortDistance();
}
return;
} else {
let startDateTime = "";
if (!this.addM && (t != 0 || (t == 0 && this.dateIntervalList[0].status == 1))) {
this.addM = true
startDateTime = moment(startDate).add(1, "m").format("YYYY-MM-DD");
this.startTime = moment(startDate).add(1, "m").format("HH:mm");
} else {
startDateTime = moment(startDate).format("YYYY-MM-DD");
this.startTime = moment(startDate).format("HH:mm");
}
let i = this.dateList.findIndex(item => item.readDate === startDateTime)
if (this.dateIndex !== i && this.dateIndex >= 0) {
this.dateIndex = i;
//房间维护就不循环
if (this.roomInfo.roomStat !== 3) {
this.onGetSortDistance();
}
return;
}
this.onSetEndTime()
}
}
} }
} }
</script> </script>
...@@ -1644,8 +1180,6 @@ ...@@ -1644,8 +1180,6 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
padding: 30upx;
background-color: #ffffff;
align-items: center; align-items: center;
.part-2 { .part-2 {
...@@ -1675,7 +1209,7 @@ ...@@ -1675,7 +1209,7 @@
image { image {
display: block; display: block;
width: 100%; width: 100%;
max-height: 400upx; height: 360upx;
} }
} }
...@@ -1684,7 +1218,7 @@ ...@@ -1684,7 +1218,7 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
width: 100%; width: 100%;
padding: 20upx 6upx; padding: 20upx 24upx;
.status-icon-box { .status-icon-box {
display: flex; display: flex;
...@@ -1733,10 +1267,8 @@ ...@@ -1733,10 +1267,8 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
width: 92%;
margin: 20upx 0 30upx;
background: #ffffff; background: #ffffff;
border-radius: 10upx; // border-radius: 10upx;
overflow: hidden; overflow: hidden;
.tab-item { .tab-item {
...@@ -1745,12 +1277,11 @@ ...@@ -1745,12 +1277,11 @@
flex: 1; flex: 1;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 80upx; height: 90upx;
text { text {
color: #000000; color: #000000;
font-size: 34upx; font-size: 32upx;
font-weight: 700;
} }
.hot-icon { .hot-icon {
...@@ -1770,27 +1301,18 @@ ...@@ -1770,27 +1301,18 @@
} }
} }
} }
.active {
background-color: #dc4397;
text {
color: #ffffff;
font-weight: 800;
}
}
} }
.order-type-box { .order-type-box {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
min-height: 600upx;
overflow: hidden; overflow: hidden;
border: 4upx solid #DC4397; background: linear-gradient(to bottom, #E03997, #FF375D);
box-shadow: 0 0 8upx #DC4397; padding: 4px;
border-radius: 12upx 12upx 0 0; // border: 5upx solid #DC4397;
// box-shadow: 0 0 8upx #DC4397;
// border-radius: 12upx;
.date-content-box { .date-content-box {
width: 100%; width: 100%;
...@@ -1817,8 +1339,8 @@ ...@@ -1817,8 +1339,8 @@
position: relative; position: relative;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 40upx 0 12upx 0;
z-index: 10; z-index: 10;
height: 140upx;
text { text {
color: #6B0000; color: #6B0000;
...@@ -1831,7 +1353,7 @@ ...@@ -1831,7 +1353,7 @@
.active { .active {
.text-title { .text-title {
color: #E40583; color: #ffffff;
} }
} }
...@@ -1841,7 +1363,7 @@ ...@@ -1841,7 +1363,7 @@
left: 0; left: 0;
width: 20%; width: 20%;
height: 100%; height: 100%;
transition: left 0.3s ease-in-out; // transition: left 0.3s ease-in-out;
.img { .img {
width: 100%; width: 100%;
...@@ -1864,37 +1386,53 @@ ...@@ -1864,37 +1386,53 @@
margin: 30upx; margin: 30upx;
} }
.package-box { .package-box {
.item { .room-label-list{
margin: 0 10upx; display: flex;
justify-content: center; flex-wrap: wrap;
align-items: center; width: 60%;
border: 1px solid transparent; border: 1px solid #ff007f;
margin-left: 20upx;
border-radius: 12upx; border-radius: 12upx;
padding: 12upx 0; padding: 10upx 6upx;
color: #333333; .room-label-box{
background-color: #F7F8FA; display: flex;
justify-content: center;
.flex-row { align-items: center;
align-items: flex-end; width: 33.33%;
padding: 10upx 6upx;
.item {
padding: 8upx 20upx;
}
} }
} }
.package-list{
.item-3 { display: flex;
width: 30%; flex-direction: column;
height: 100%;
border: 1px solid #ff007f;
border-radius: 12upx;
margin-left: 20upx;
padding: 10upx 6upx;
.package-list-box{
padding: 10upx 6upx;
}
} }
.item {
.item-n { display: flex;
flex: 1; justify-content: center;
align-items: center;
height: 54upx;
background: #F7F8FA;
border-radius: 12upx;
border: 1px solid #CCD1DB;
} }
.active{
.active { border: 1px solid #e1419b;
background: #FBF6EE; color: #FFFFFF;
border: 1px solid #DBA556; background: linear-gradient(to right,#e03997,#ff375d);
box-shadow: 0 0 8upx #ffffff inset;
text {
color: #B67D32;
}
} }
} }
} }
...@@ -1954,17 +1492,20 @@ ...@@ -1954,17 +1492,20 @@
font-size: 32upx; font-size: 32upx;
} }
.line-black{ .line-black {
border: 1px solid #e03997; border: 1px solid #e03997;
color: #e03997; color: #e03997;
} }
.line-black::after{
.line-black::after {
border-color: transparent; border-color: transparent;
} }
.line-pink { .line-pink {
display: flex; display: flex;
align-items: center; align-items: center;
// border-color: #e03997;
// border-color: #e03997;
.cuIcon-edit { .cuIcon-edit {
margin-bottom: 7upx; margin-bottom: 7upx;
margin-left: 12upx; margin-left: 12upx;
...@@ -2020,6 +1561,7 @@ ...@@ -2020,6 +1561,7 @@
flex: 1; flex: 1;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
.date-point { .date-point {
display: flex; display: flex;
width: 90%; width: 90%;
...@@ -2259,35 +1801,8 @@ ...@@ -2259,35 +1801,8 @@
// font-size: 24upx; // font-size: 24upx;
} }
.scroll-view {
height: 136upx;
width: 100vw;
.package-box {
position: absolute;
top: 0;
left: 2vw;
height: 136upx;
width: 96vw;
display: flex;
flex-direction: row;
.item {
display: flex;
flex-direction: column;
flex: 1;
height: 100%;
.text-title {
font-size: 28upx;
}
.flex-row {
// font-size: 23upx;
}
}
}
}
.message-box { .message-box {
display: flex; display: flex;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment