Skip to content

J
jz_Travel
Commit a0689155 authored by 罗超's avatar 罗超
Browse files
Options

优化线路下单

parent 9ff6a26b
Show whitespace changes
Inline Side-by-side
Showing with 156 additions and 198 deletions
pages/jiuzhai/components/sign/index.vue
View file @ a0689155
......@@ -31,7 +31,7 @@
</view>
</view> -->
<view style="font-size: 32rpx;color:#111;text-align: center;padding:30rpx 0;">
<text>选择日期</text>
<text>{{title}}</text>
</view>
<view class="week">
<view>日</view>
......@@ -71,10 +71,10 @@
</view>
</view>
</view>
<view class="submit">
<view class="submit" v-if="!immediately">
<button class="sub-btn" :disabled="!isSub" @click="submit">
<text v-if="isSub">确定</text>
<text v-if="!isSub">请选择入住日期</text>
<text v-if="!isSub">选择出行时间</text>
</button>
</view>
</scroll-view>
......@@ -91,32 +91,44 @@
type: Array,
default: []
},
defaultDate:{
type:String,
default:''
},
title:{
type:String,
default:'选择日期'
},
immediately:{
type:Boolean,
default:false
}
},
computed: {
//房间是否能预订
isSub() {
if (this.priceStauts.length > 0) {
for (var i = this.start[0]; i <= this.end[0]; i++) {
if (i == this.start[0]) {
for (var j = this.start[1]; j < this.date[i].length; j++) {
if (this.priceStauts[i][j] == -1) return false
}
} else if (this.end[0] == this.start[0]) {
for (var j = this.start[1]; j < this.end[1]; j++) {
if (this.priceStauts[i][j] == -1) return false
}
} else if (i == this.end[0]) {
for (var j = 0; j < this.end[1]; j++) {
if (this.priceStauts[i][j] == -1) return false
}
} else {
for (var j = 0; j < this.priceStauts[i].length; j++) {
if (this.priceStauts[i][j] == -1) return false
}
}
}
}
return this.start.length == 2 && this.end.length == 2 ? true : false
// if (this.priceStauts.length > 0) {
// for (var i = this.start[0]; i <= this.end[0]; i++) {
// if (i == this.start[0]) {
// for (var j = this.start[1]; j < this.date[i].length; j++) {
// if (this.priceStauts[i][j] == -1) return false
// }
// } else if (this.end[0] == this.start[0]) {
// for (var j = this.start[1]; j < this.end[1]; j++) {
// if (this.priceStauts[i][j] == -1) return false
// }
// } else if (i == this.end[0]) {
// for (var j = 0; j < this.end[1]; j++) {
// if (this.priceStauts[i][j] == -1) return false
// }
// } else {
// for (var j = 0; j < this.priceStauts[i].length; j++) {
// if (this.priceStauts[i][j] == -1) return false
// }
// }
// }
// }
return this.start.length == 2
},
//计算日历里的节假日
resDate() {
......@@ -156,11 +168,12 @@
endWeek: '', //离开时间的周几
day: 0, //多少晚
priceStauts: [], //价格状态
lastNot: [0, 10] //前置的无房操作
lastNot: [0, 10], //前置的无房操作
userDefaultDate:""
};
},
mounted () {
console.log("进入了....")
this.userDefaultDate=this.defaultDate
uni.getSystemInfo({
success: res => {
this.dayWidth = res.windowWidth;
......@@ -171,79 +184,20 @@
var dateTime=new Date();
dateTime=dateTime.setDate(dateTime.getDate()+1);
this.nowDay = new Date(dateTime).getDate();
/*默认入住离店日期，今日入住明日离店，此处应在setDefaultDate函数内传入vuex里保存的日期进行默认操作
*不推荐使用本地缓存，下边只是使用缓存的示例
*/
uni.getStorage({
key: 'Time',
success: (res) => {
console.log(res)
if (res && res.data) {
var obj = JSON.parse(res.data)
this.start = this.setDefaultDate(obj.start);
this.end = this.setDefaultDate(obj.end);
}
},
fail: () => {
this.start = this.setDefaultDate(this.getDefaultDate(0));
this.end = this.setDefaultDate(this.getDefaultDate(1));
if(this.userDefaultDate!=''){
this.start = this.setDefaultDate(this.userDefaultDate);
}
})
this.priceStauts=this.initPrice()
console.log(this.priceStauts,this.priceList)
//如果需要日期的价格，-1为无房，其他价格代表正常
// if (option && option.request) {
// uni.request({
// url: 'http://api.tcdbp.com', //当需要日历价格的时候请求的后台接口地址
// method: 'GET',
// data: {
// count: this.count //获取几个月分的数据
// },
// success: res => {
// if (res.data.status != 1) {
// return uni.showToast({
// title: res.data.message,
// icon: 'none',
// mask: true
// });
// }
// this.priceStauts = res.data.data;
// },
// fail: () => {
// uni.showToast({
// title: '网络错误请稍后再试',
// icon: 'none',
// mask: true
// });
// }
// });
// }
},
watch: {
//离店日期
end(newVal) {
if (this.end.length != 0) {
//计算选择离店日期
this.endDay = this.setMonth(newVal[0]) + this.isFestival(newVal[0], newVal[1]) + '日';
this.endWeek = this.getWeek(this.date[newVal[0]].year + '/' + this.date[newVal[0]].month + '/' + this
.isFestival(newVal[0], newVal[1]));
//计算天数
var startDay = this.date[this.start[0]].year + '/' + this.date[this.start[0]].month + '/' + this
.isFestival(this.start[0], this.start[1]);
var endDay = this.date[newVal[0]].year + '/' + this.date[newVal[0]].month + '/' + this.isFestival(this
.end[0], this.end[1]);
this.day = this.getDay(startDay, endDay);
} else {
this.day = 0;
defaultDate(newVal){
this.userDefaultDate=newVal
if(this.userDefaultDate!=''){
this.start = this.setDefaultDate(this.userDefaultDate);
}
this.priceStauts=this.initPrice()
},
//入住日期
start(newVal) {
......@@ -304,7 +258,7 @@
let d=(j+1)>9?(j+1):"0"+(j+1)
if(x.startDate==`${year}-${m}-${d}`){
isexsit=true
days.push(x.b2BPrice)
days.push(this.$utils.getretailer()? x.b2BPrice:x.b2CPrice)
}
})
if(!isexsit){
......@@ -405,6 +359,20 @@
//选择入住离开
selectDay(line, index) {
if(this.priceStauts[line][index]==0){
uni.showToast({
title: '抱歉，此日期没有行程哦',
icon: 'none'
});
}else{
this.start=[line,index]
}
if(this.immediately){
this.submit()
}
return;
if (line == 0 && index + 1 < this.nowDay) return;
//如果有入住情况和价格则需要进行一些列的判断
if (this.priceStauts.length > 0) {
......@@ -543,7 +511,10 @@
},
//确定入住离店事件提交
submit() {
let m=this.date[this.start[0]].month
m=m>9?m:"0"+m;
let d=this.isFestival(this.start[0], this.start[1], true)
d=d>9?d:"0"+d;
var obj = {
/* startYMD: this.date[this.start[0]].year + this.type + this.date[this.start[0]].month + this.type + this.isFestival(
this.start[0], this.start[1]),
......@@ -557,93 +528,18 @@
endWeek: this.endWeek,
day: this.day */
startWeek: this.startWeek,
endWeek: this.endWeek,
start: this.date[this.start[0]].year + this.type + this.date[this.start[0]].month + this.type +
this.isFestival(this.start[0], this.start[1], true),
end: this.date[this.end[0]].year + this.type + this.date[this.end[0]].month + this.type + this
.isFestival(this.end[0], this.end[1], true),
startDay: this.date[this.start[0]].month + '-' + this.isFestival(this.start[0], this.start[1],
true),
endDay: this.date[this.end[0]].month + '-' + this.isFestival(this.end[0], this.end[1], true),
day: this.day
start: this.date[this.start[0]].year + this.type + m + this.type + d,
startDay: m + '-' + d
};
/*此处应把需要的数据进行保存,如入住离开日期...添加到vuex然后再进行跳转到上一页
*不推荐使用本地缓存,下面是缓存的示例
*/
uni.setStorage({
key: 'Time',
data: JSON.stringify(obj)
let tempPrice={}
this.priceList.forEach((x,i)=>{
console.log(x.startDate,obj.start)
if(obj.start==x.startDate){
obj.priceObj=i
}
})
this.$emit("finish",obj)
//价格清单,应该存入vuex获取缓存中
// if (this.priceStauts.length > 0) {
// var price = []
// if (this.end[0] - this.start[0] == 0) {
// for (var i = this.start[1]; i < this.end[1]; i++) {
// var day = this.date[this.start[0]].year + this.type + this.setPull(this.date[this.start[0]]
// .month) + this.type + this.isFestival(
// this.start[0], i)
// price.push({
// day_str: day,
// price: this.priceStauts[this.start[0]][i]
// })
// }
// } else {
// for (var i = this.start[0]; i <= this.end[0]; i++) {
// console.log(i)
// if (i == this.start[0]) {
// for (var j = this.start[1]; j < this.date[i].day.length; j++) {
// var day = this.date[i].year + this.type + this.setPull(this.date[i].month) + this
// .type + this.isFestival(
// i, j)
// price.push({
// day_str: day,
// price: this.priceStauts[i][j]
// })
// }
// } else if (i == this.end[0]) {
// for (var j = 0; j < this.end[1]; j++) {
// var day = this.date[i].year + this.type + this.setPull(this.date[i].month) + this
// .type + this.isFestival(
// i, j)
// price.push({
// day_str: day,
// price: this.priceStauts[i][j]
// })
// }
// } else {
// for (var j = 0; j < this.date[i].day.length; j++) {
// var day = this.date[i].year + this.type + this.setPull(this.date[i].month) + this
// .type + this.isFestival(
// i, j)
// price.push({
// day_str: day,
// price: this.priceStauts[i][j]
// })
// }
// }
// }
// }
// //加入缓存
// uni.setStorage({
// key: 'Price',
// data: JSON.stringify(price)
// })
// }
//跳转到上一页
// uni.navigateBack({
// delta: 1
// })
},
}
};
......
pages/jiuzhai/jz_LineDetail.vue
View file @ a0689155
......@@ -16,8 +16,8 @@
</view>
</view>
<view class="mi-right">
<view style="color:#FFF;margin-bottom: 6rpx;font-size: 22rpx;">团队编号：CTU04210603A</view>
<view style="color:#FFF;font-size: 22rpx;">{{dataList.startCityName}}出发 · 精品线路</view>
<view style="color:#FFF;margin-bottom: 6rpx;font-size: 22rpx;">团队编号：{{delMsg.tcnum}}</view>
<view style="color:#FFF;font-size: 22rpx;">{{dataList.startCityName}}集合出发 · 精品线路</view>
</view>
</view>
</view>
......@@ -35,7 +35,7 @@
</view>
<view class="jz_TopPrice">
<view class="jz_LineTitle">
<text class="jz_renmin">¥</text><text class="jz_B2bPrice">{{$utils.getretailer()==true? dataList.currentPriceInfo.b2BPrice:dataList.currentPriceInfo.b2CPrice}}</text>
<text class="jz_renmin">¥</text><text class="jz_B2bPrice">{{$utils.getretailer()==true? currentPrice.b2BPrice:currentPrice.b2CPrice}}</text>
<text style="color:#999999;font-size:24rpx;font-weight: 400;"> /人起</text>
<text style="color:#999999;font-size:24rpx;font-weight: 400;margin-left: 30rpx;">2728人出游</text>
</view>
......@@ -84,7 +84,7 @@
<view style="color:#FF3166;font-size:26rpx;">￥{{$utils.getretailer()==true? item.b2BPrice:item.b2CPrice}}</view>
</view>
</template>
<view class="jz_StartList" :class="{'active':delMsg.tcid==customerDate.tcid}" @click="openDate">
<view class="jz_StartList" v-if="dataList.priceList.length>3" :class="{'active':delMsg.tcid==customerDate.tcid}" @click="openDate">
<view class="jz_StartTop" v-if="customerDate.startDate">{{customerDate.startDate?getMonth(customerDate.startDate):""}} </view>
<view class="jz_StartHoubu" v-if="customerDate.remainNum">
<text>余</text>
......@@ -266,7 +266,7 @@
<view class="jz_OrderDiv">
<view style="color:#FF3166;font-weight:bold;">
<text style="font-size:22rpx;">¥</text>
<text style="font-size:40rpx;">{{$utils.getretailer()==true? dataList.currentPriceInfo.b2BPrice:dataList.currentPriceInfo.b2CPrice}}</text>
<text style="font-size:40rpx;">{{$utils.getretailer()==true? currentPrice.b2BPrice:currentPrice.b2CPrice}}</text>
<text style="font-size:22rpx;">/起</text>
</view>
<view style="display:flex;align-items: center;">
......@@ -274,12 +274,43 @@
<img style="width:36rpx;height:38rpx;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/kefu.png" alt="" />
<view style="color:#111111;font-size: 22rpx;">客服</view>
</button>
<view class="jz_OrderNow" @click="goReserce()">立即预定</view>
<view class="jz_OrderNow" @click="showOrderPreviwe=true">立即预定</view>
</view>
</view>
</view>
<u-popup v-model="showDateChosen" mode="bottom" border-radius="20" length="90%" :safe-area-inset-bottom="true">
<canlendar @finish="chosenDateResult" :priceList="dataList.priceList"></canlendar>
<canlendar @finish="chosenDateResult" :defaultDate="currentPrice.startDate" :priceList="dataList.priceList"></canlendar>
</u-popup>
<u-popup v-model="showOrderPreviwe" mode="bottom" border-radius="20" length="80%" :safe-area-inset-bottom="true">
<view style="width: 100%;height: 100%;display: flex;flex-direction: column;">
<view style="flex: 1;width: 100%;height: 1rpx;">
<canlendar @finish="chosenDateResult" :immediately="true" :defaultDate="currentPrice.startDate" :priceList="dataList.priceList" title="确定日期和人数"></canlendar>
</view>
<view style="background: #ECF1F4;padding:20rpx 0;">
<view class="line-flex" style="padding:30rpx;background: #FFF;">
<text style="font-size: 28rpx;color:#111;font-weight: 500;">成人</text>
<text style="font-size:22rpx;color:#999;margin-left: 30rpx;flex:1;">18周岁以上</text>
<u-number-box size="28" :min="1" :max="currentPrice.totalSeat-etCount" v-model="crCount"></u-number-box>
</view>
<view class="line-flex" style="padding:30rpx;background: #FFF;">
<text style="font-size: 28rpx;color:#111;font-weight: 500;">儿童</text>
<text style="font-size:22rpx;color:#999;margin-left: 30rpx;flex:1;">2-18周岁(不含)</text>
<u-number-box size="28" :min="0" :max="currentPrice.totalSeat-crCount" v-model="etCount"></u-number-box>
</view>
</view>
<view class="jz_OrderDiv" style="box-shadow: none;width: 100%;padding:20rpx;">
<view>
<text style="font-size:24rpx;color:#111;font-weight: 400;">{{currentPrice.startDate}} 出发</text>
</view>
<view style="display:flex;align-items: center;">
<button open-type="contact" class="jz_ConButton">
<img style="width:36rpx;height:38rpx;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/CustomizedCar/kefu.png" alt="" />
<view style="color:#111111;font-size: 22rpx;">客服</view>
</button>
<view class="jz_OrderNow" @click="goReserce()">立即预定</view>
</view>
</view>
</view>
</u-popup>
</scroll-view>
</template>
......@@ -294,6 +325,9 @@
return {
pageTitle: '线路详情',
showDateChosen:false,
showOrderPreviwe:false,
crCount:1,
etCount:0,
msg: {
pageIndex: 1,
pageSize: 15
......@@ -301,7 +335,8 @@
dataList: {}, //数据
delMsg: {
tcid: 0,
configId: 0
configId: 0,
tcnum:''
},
scenicNum: 0, // 景点数量
breakfastNum: 0, //早餐数
......@@ -311,7 +346,8 @@
titleStyle: {},
mainColor: "",
detailContent: "",
customerDate:{}
customerDate:{},
currentPrice:{}
};
},
created() {
......@@ -338,6 +374,18 @@
},
methods: {
chosenDateResult(result){
let price=this.dataList.priceList[result.priceObj]
this.currentPrice=price
if(this.crCount+this.etCount>this.currentPrice.totalSeat){
this.crCount=1,
this.etCount=0
}
this.delMsg.tcid=price.tcid
this.delMsg.configId = price.configID;
this.getDetails();
if(result.priceObj>2){
this.customerDate=price
}
this.showDateChosen=false
},
openPicture() {
......@@ -384,6 +432,12 @@
}
})
})
this.currentPrice=this.dataList.currentPriceInfo
this.dataList.priceList.forEach(x=>{
if(x.tcid==this.delMsg.tcid){
this.delMsg.tcnum=x.tcnum
}
})
} else {
}
......@@ -414,8 +468,13 @@
},
//点击切换
getDayInfo(item){
if(this.crCount+this.etCount>this.currentPrice.totalSeat){
this.crCount=1,
this.etCount=0
}
this.delMsg.tcid = item.tcid;
this.delMsg.configId = item.configID;
this.currentPrice=item
this.getDetails();
},
openDate(){
......@@ -423,8 +482,8 @@
if(this.customerDate.tcid==this.delMsg.tcid){
this.showDateChosen=true
}else{
this.delMsg.tcid = customerDate.tcid;
this.delMsg.configId = customerDate.configID;
this.delMsg.tcid = this.customerDate.tcid;
this.delMsg.configId = this.customerDate.configID;
this.getDetails();
}
}else{
......@@ -433,7 +492,7 @@
},
//立即预定
goReserce(){
let myCurrentInfo = this.dataList.currentPriceInfo;
let myCurrentInfo = this.currentPrice;
myCurrentInfo.startCityName = this.dataList.startCityName;
let imgCover = JSON.parse(this.dataList.imgCover);
if(imgCover.length>0){
......@@ -455,7 +514,10 @@
height: 100vh;
box-sizing: border-box;
}
.line-flex{
display: flex;
align-items: center;
}
.jz_TopImg {
width: 100%;
......@@ -881,7 +943,7 @@
text-align: center;
line-height: 80rpx;
color:#fff;
font-weight: bold;
font-weight: 600;
font-size:28rpx;
border-radius: 16rpx;
}
......
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