Skip to content

U
uni-pdtravel
Commit 83b83478 authored by 潘永坪's avatar 潘永坪
Browse files
Options

组合下单页面开发

parent 24e3e559
Hide whitespace changes
Inline Side-by-side
Showing with 289 additions and 295 deletions
main.js
View file @ 83b83478
...@@ -8,7 +8,7 @@ import commonjs from 'common/common.js' ...@@ -8,7 +8,7 @@ import commonjs from 'common/common.js'
Vue.prototype.$commonjs = commonjs Vue.prototype.$commonjs = commonjs
Vue.prototype.$request = request Vue.prototype.$request = request
Vue.prototype.$wxurl = 'https://lx.pangdly.com/#/' Vue.prototype.$wxurl = 'https://wx.pangdly.com/#/'
Vue.prototype.imageError ='@/static/img/common/pangdingLogo.png' Vue.prototype.imageError ='@/static/img/common/pangdingLogo.png'
Vue.use(uView) Vue.use(uView)
uni.$u.config.unit = 'rpx' uni.$u.config.unit = 'rpx'
......
pages/scenic/scenicCombiOrder/scenicCombiOrder.vue
View file @ 83b83478
<template> <template>
<view class="orderBox"> <view class="orderBox">
<view class="head"> </view> <view class="head"> </view>
<view class="middle" v-for="(item,index) in productList" :key='item.id'> <view class="middle">
<view class="middle-top"> <view class="list" v-for="(item,index) in productList" :key='item.id'>
<!-- --------------------------------------------产品信息部分------------------------------------- --> <view class="list-top">
<view class="middle-Product"> <!-- --------------------------------------------产品信息部分------------------------------------- -->
<view class="merchantName"> <view class="list-Product">
<text class="title-text"> <view class="merchantName">
{{ item.merchantName || '' }} <text class="title-text">
</text> {{ item.merchantName || '' }}
<text> </text>
{{ item.name || '' }} <text>
</text> {{ item.name || '' }}
</text>
</view>
<view @click="showBuyKnow(index)" class="buyKnow">
<view>
<text v-if="item.backChangeRule == 0">不可退换</text>
<text v-if="item.backChangeRule == 1">可退</text>
<text v-if="item.backChangeRule == 2">随时可退</text>
<text v-if="item.isFetch == 1">无需取号</text>
</view>
<view>
购买须知
<u-icon name="arrow-right" color='#FC6703'></u-icon>
</view>
</view>
</view> </view>
<!--需要排队并且站点数大于1-->
<view @click="showBuyKnow(index)" class="buyKnow"> <view class="list-place" @click="openArea(index)" v-if="item.isFetch ==1&& item.productAreaList.length >1&&item.areaUp">
<view> 出发站点 </view>
<view> <view>
<text v-if="item.backChangeRule == 0">不可退换</text> {{ item.areaObj.areaName || '请选择站点' }}
<text v-if="item.backChangeRule == 1">可退</text>
<text v-if="item.backChangeRule == 2">随时可退</text>
<text v-if="item.isFetch == 1">无需取号</text>
</view> </view>
<view> <view>
购买须知 <u-icon name="arrow-right" color="#3688FF"></u-icon>
<u-icon name="arrow-right" color='#FC6703'></u-icon>
</view> </view>
</view> </view>
</view> <!--需要排队并且为一个站点-->
<!--需要排队并且站点数大于1--> <!-- <view class="list-place" v-if="item.isFetch == 1 && item.productAreaList.length == 1 &&item.areaUp" @click="getSortInfor()">
<view class="middle-place" @click="openArea(index)" v-if="item.isFetch ==1&& item.productAreaList.length >1&&item.areaUp"> <view> 获取排队信息 </view>
<view> 出发站点 </view>
<view>
<view> {{ areaObj.areaName }}
{{ item.areaObj.areaName || '请选择站点' }} </view>
</view>
<view>
<view> <u-icon name="arrow-right" color="#3688FF"></u-icon>
<u-icon name="arrow-right" color="#3688FF"></u-icon> </view>
</view> </view> -->
</view>
<!--需要排队并且为一个站点--> <view class="list-Date">
<!-- <view class="middle-place" v-if="item.isFetch == 1 && item.productAreaList.length == 1 &&item.areaUp" @click="getSortInfor()"> <view class="title-text">游玩日期</view>
<view> 获取排队信息 </view> <view class="list-Datelist">
<scroll-view class="date-content" scroll-x="true" :scroll-left="item.dateScroll" v-if="item.priceStockList&&item.priceStockList.length > 0">
<view> <view class="date-list" v-for="(item2,index2) of item.priceStockList" :class="{ on:item.dateActive == index2 }" @click="dateChoose(item,item2,index2)" :key="index2">
{{ areaObj.areaName }} <view v-if="item2.week">
</view> <text v-if="item2.week != '今天' && item2.week != '明天' && item2.week != '后天'">周</text>
{{ item2.week }}
<view> </view>
<u-icon name="arrow-right" color="#3688FF"></u-icon> <view>
</view> {{ item2.startTime ? item2.startTime.substr(5, 5) : '' }}
</view> --> </view>
<view class="date-price">
<view class="middle-Date"> ¥<text style="font-weight: bold;">{{ item2.sellingPrice }}</text>
<view class="title-text">游玩日期</view> </view>
<view class="middle-Datelist">
<scroll-view class="date-content" scroll-x="true" :scroll-left="dateScroll" v-if="item.priceStockList&&item.priceStockList.length > 0"> <view v-if="item.dateActive == index2" class="date-icon">
<view class="date-list" v-for="(item2,index2) of item.priceStockList" :class="{ on:item.dateActive == index2 }" @click="dateChoose(item,item2,index2)" :key="index2"> <u-icon name="checkmark" color="#ffffff"></u-icon>
<view v-if="item2.week"> </view>
<text v-if="item2.week != '今天' && item2.week != '明天' && item2.week != '后天'">周</text>
{{ item2.week }}
</view>
<view>
{{ item2.startTime ? item2.startTime.substr(5, 5) : '' }}
</view>
<view class="date-price">
¥<text style="font-weight: bold;">{{ item2.sellingPrice }}</text>
</view> </view>
</scroll-view>
<view v-if="item.dateActive == index2" class="date-icon"> <text v-else class="no-date"> 不可购买 </text>
<u-icon name="checkmark" color="#ffffff"></u-icon> <view class="dateMore" @click="showCalendar(index)">
<view class="date-more-content">
<view>更多</view>
<view>日期</view>
</view> </view>
<u-icon name="arrow-right"></u-icon>
</view> </view>
</scroll-view>
<text v-else class="no-date"> 不可购买 </text>
<view class="dateMore" @click="showCalendar(index)">
<view class="date-more-content">
<view>更多</view>
<view>日期</view>
</view>
<u-icon name="arrow-right"></u-icon>
</view> </view>
</view> </view>
</view>
<view class="list-time" v-if="item.productType == 3">
<view class="middle-time" v-if="item.productType == 3"> <view class="title-text"> 场次 </view>
<view class="title-text"> 场次 </view> <view class="list-timelist">
<view class="middle-timelist"> <scroll-view class="time-content" scroll-x="true" :scroll-left="item.timeScroll" v-if="item.timeList&&item.timeList.length> 0">
<scroll-view class="time-content" scroll-x="true" :scroll-left="timeScroll" v-if="item.timeList&&item.timeList.length> 0"> <view class="time-list" v-for="(item2,index2) of item.timeList" @click="chooseTime(item,item2,index2)" :class="{ on:item.timeActive == index2 }" :key="index2">
<view class="time-list" v-for="(item2,index2) of item.timeList" @click="chooseTime(item,item2,index2)" :class="{ on:item.timeActive == index2 }" :key="index2"> <view>
<view> {{ item2.startPlanTime ? item2.startPlanTime.substr(0, 5) : '' }}
{{ item2.startPlanTime ? item2.startPlanTime.substr(0, 5) : '' }} <text v-if="!item2.saleOnlyShowFromDate">
<text v-if="item2.endPlanTime">-</text> -{{ item2.endPlanTime ? item2.endPlanTime.substr(0, 5) : '' }}
{{ item2.endPlanTime ? item2.endPlanTime.substr(0, 5) : '' }} </text>
</view>
<view>
<text v-if="item2.copyLast!='余票充足'&&item2.copyLast!='售罄'">剩余：</text>
{{ item2.copyLast }}
</view>
<view v-if="item.timeActive == index2" class="date-icon">
<u-icon name="checkmark" color="#ffffff"></u-icon>
</view>
</view> </view>
<view> 剩余：{{ item2.last }} </view> </scroll-view>
<view v-if="item.timeActive == index" class="date-icon"> <text class="no-time" v-if="item.timeList&&item.timeList.length==0"> 该日票种已售罄，请选择其他日期 </text>
<u-icon name="checkmark" color="#ffffff"></u-icon> <text class="no-time" v-if="!item.startDate || !item.endDate"> 请先选游玩日期 </text>
<view class="timeMore" @click="showTime(item,index)">
<view class="time-more-content">
<view>更多</view>
<view>场次</view>
</view> </view>
<u-icon name="arrow-right"></u-icon>
</view> </view>
</scroll-view>
<text class="no-time" v-if="item.timeList&&item.timeList.length==0"> 该日票种已售罄，请选择其他日期 </text>
<text class="no-time" v-if="!item.startDate || !item.endDate"> 请先选游玩日期 </text>
<view class="timeMore" @click="showTime(item,index)">
<view class="time-more-content">
<view>更多</view>
<view>场次</view>
</view>
<u-icon name="arrow-right"></u-icon>
</view> </view>
</view> </view>
<view class="list-divider">
</view>
<view class="middle-divider">
</view>
<view class="middle-Number">
<view class="title-text"> 购买数量 </view>
<view>
<u-number-box v-model="item.buyNum" @change='buyNumChange'>
<view slot="minus" class="number-minus" >
<u-icon name="minus" color="#FFFFFF" size="32"></u-icon>
</view>
<text slot="input" class="number-input">{{item.buyNum}}</text>
<view slot="plus" class="number-plus">
<u-icon name="plus" color="#FFFFFF" size="32"></u-icon>
</view>
</u-number-box>
</view> </view>
</view> <view class="list-Number">
<view class=" middle-coupon" v-if="couponData.length>0" @click="showCoupon()"> <view class="title-text"> 购买数量 </view>
<view> <view>
券 <u-number-box v-model="item.buyNum" @change='buyNumChange'>
<view slot="minus" class="number-minus" >
<u-icon name="minus" color="#FFFFFF" size="32"></u-icon>
</view>
<text slot="input" class="number-input">{{item.buyNum}}</text>
<view slot="plus" class="number-plus">
<u-icon name="plus" color="#FFFFFF" size="32"></u-icon>
</view>
</u-number-box>
</view> </view>
<!-- 有可用优惠券,并且未选中 -->
<template v-if="item.couponData.masterSlaveCouponList&&item.couponData.masterSlaveCouponList.length>0&&!item.chooseCouponObj">
<view>
{{item.couponData.masterSlaveCouponList[0].couponName}}
</view>
<view >
未使用优惠券
</view>
</template>
<!-- 有可用优惠券 -->
<template v-if="item.chooseCouponObj&&item.savedMoney>0">
<view>
{{item.chooseCouponObj.couponName}}
</view>
<view style="font-size: 32rpx;">
<text style="font-size: 24rpx;position: relative;top: 6rpx;">¥</text>
{{parseFloat(item.savedMoney.toFixed(2))}}
</view>
</template>
<!-- 可用优惠券条件-->
<template v-if="item.ableConpon">
<view>
{{item.ableConpon.couponName}}
</view>
<view>
{{item.ableConpon.couponRule}}
</view>
</template>
<u-icon name="arrow-right" color="#3688FF"></u-icon>
</view>
</view>
<view class="middle-divider">
</view>
<!-- ---------------------------------------------游客信息-------------------------------------------- -->
<view class="middle-bottom" v-if="item.tripTemplateFlag != 2">
<view class="middle-visitor">
<view class="visitorTitle">
<text class="title-text"> 用户信息 </text>
<text>
需填<text class="title-bold">{{item.contactNum }}</text>位出行人
<!-- <text class="title-bold" v-if="contactNum - chooseContact.length > 0">，还需{{ contactNum - chooseContact.length }}位</text> -->
</text>
</view> </view>
<view class="visitorPlus" v-if="contactTotal.length>0"> <view class="list-coupon" v-if="couponData.length>0" @click="showCoupon()">
<!-- 这里key必须是index,如果是id会出现数据改变和样式不改变的bug --> <view>
<view 券
class="plus-list"
:class="{on:item.ifChoose}"
v-for="(item2, index2) of contactTotal.slice(0, 3)"
@click="visitorChoose(index2)"
:key="index2"
>
{{ item2.name }}
<view v-if="item.ifChoose" class="date-icon">
<u-icon name="checkmark" color="#ffffff"></u-icon>
</view> </view>
</view> <!-- 有可用优惠券,并且未选中 -->
<template v-if="item.couponData.masterSlaveCouponList&&item.couponData.masterSlaveCouponList.length>0&&!item.chooseCouponObj">
<view @click="showContacts()" class="plus-list plus-list-last"> <view>
选择/新增 {{item.couponData.masterSlaveCouponList[0].couponName}}
</view>
<view >
未使用优惠券
</view>
</template>
<!-- 有可用优惠券 -->
<template v-if="item.chooseCouponObj&&item.savedMoney>0">
<view>
{{item.chooseCouponObj.couponName}}
</view>
<view style="font-size: 32rpx;">
<text style="font-size: 24rpx;position: relative;top: 6rpx;">¥</text>
{{parseFloat(item.savedMoney.toFixed(2))}}
</view>
</template>
<!-- 可用优惠券条件-->
<template v-if="item.ableConpon">
<view>
{{item.ableConpon.couponName}}
</view>
<view>
{{item.ableConpon.couponRule}}
</view>
</template>
<u-icon name="arrow-right" color="#3688FF"></u-icon> <u-icon name="arrow-right" color="#3688FF"></u-icon>
</view>
</view> </view>
<view class="visitorBtn" v-else @click="$refs.editContacts.showEdit = true"> </view>
<u-icon name="plus-circle" color="#3688FF" size="52"></u-icon> <view class="list-divider">
<text style="margin-left:16rpx;">新增</text>
</view> </view>
<!-- ---------------------------------------------游客信息-------------------------------------------- -->
<view class="visitorEdit" v-show="item.chooseContact&&item.chooseContact.length > 0"> <view class="list-bottom" v-if="item.tripTemplateFlag != 2">
<view class="edit-list" v-for="(item2, index2) of item.chooseContact" :key="item2.id"> <view class="list-visitor">
<view @click="delChooseContact(item2, index2)"> <view class="visitorTitle">
<u-icon name="close-circle" color="#3688ff" size="40"></u-icon> <text class="title-text"> 用户信息 </text>
</view> <text>
需填<text class="title-bold">{{item.contactNum }}</text>位出行人
<view> <!-- <text class="title-bold" v-if="contactNum - chooseContact.length > 0">，还需{{ contactNum - chooseContact.length }}位</text> -->
</text>
</view>
<view class="visitorPlus" v-if="contactTotal.length>0">
<!-- 这里key必须是index,如果是id会出现数据改变和样式不改变的bug -->
<view
class="plus-list"
:class="{on:item.ifChoose}"
v-for="(item2, index2) of contactTotal.slice(0, 3)"
@click="visitorChoose(index2)"
:key="index2"
>
{{ item2.name }} {{ item2.name }}
<view v-if="item.ifChoose" class="date-icon">
<u-icon name="checkmark" color="#ffffff"></u-icon>
</view>
</view> </view>
<view> <view @click="showContacts()" class="plus-list plus-list-last">
{{ item2.credentialNumber ? item2.credentialNumber.substr(0, 3) + '****' + item2.credentialNumber.substr(14, 4) : '' }} 选择/新增
<u-icon name="arrow-right" color="#3688FF"></u-icon>
</view> </view>
</view>
<view @click="showEdit(item2)"> <view class="visitorBtn" v-else @click="$refs.editContacts.showEdit = true">
<u-icon name="edit-pen-fill" color="#3688ff" size="48"></u-icon> <u-icon name="plus-circle" color="#3688FF" size="52"></u-icon>
<text style="margin-left:16rpx;">新增</text>
</view>
<view class="visitorEdit" v-show="item.chooseContact&&item.chooseContact.length > 0">
<view class="edit-list" v-for="(item2, index2) of item.chooseContact" :key="item2.id">
<view @click="delChooseContact(item2, index2)">
<u-icon name="close-circle" color="#3688ff" size="40"></u-icon>
</view>
<view>
{{ item2.name }}
</view>
<view>
{{ item2.credentialNumber ? item2.credentialNumber.substr(0, 3) + '****' + item2.credentialNumber.substr(14, 4) : '' }}
</view>
<view @click="showEdit(item2)">
<u-icon name="edit-pen-fill" color="#3688ff" size="48"></u-icon>
</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- ---------------------------------------------产品押金部分---------------------------------------- -->
<view class="middle-phone" v-if="showTelephone"> <view class="productDeposit" v-if="item.deposit">
<text> 联系电话： </text> <view>
<input type="number" maxlength="11" placeholder="请输入联系电话" v-model.trim="ticketPhone" /> {{ item.name }}
<text style="color: #FC6703;margin-left: 10rpx;">押金</text>
</view>
<view style="color: #FC6703"> {{ item.deposit }}元 </view>
</view> </view>
</view> </view>
<!-- ---------------------------------------------产品押金部分---------------------------------------- --> <view class="telephone" v-if="showTelephone">
<view class="productDeposit" v-if="item.deposit"> <text> 联系电话： </text>
<view> <input type="number" maxlength="11" placeholder="请输入联系电话" v-model.trim="ticketPhone" />
{{ item.name }}
<text style="color: #FC6703;margin-left: 10rpx;">押金</text>
</view>
<view style="color: #FC6703"> {{ item.deposit }}元 </view>
</view> </view>
</view> </view>
<view class="bottom"> <view class="bottom">
<view class="bottom-left"> <view class="bottom-left">
<text> ¥{{ originalTotal || 0 }} </text> <text> ¥{{ originalTotal || 0 }} </text>
...@@ -261,7 +266,7 @@ ...@@ -261,7 +266,7 @@
</view> </view>
</view> </view>
</view> </view>
<calendar ref="calendar" @dateConfig="dateConfig" :dateList="dateList" v-show="dateList.length > 0"></calendar> <calendar ref="calendar" @dateConfig="dateConfig" :dateList="chooseDateList" v-show="chooseDateList.length > 0"></calendar>
<buyKnow ref="buyKnow" :buyKnowData="buyKnowData"></buyKnow> <buyKnow ref="buyKnow" :buyKnowData="buyKnowData"></buyKnow>
<detail <detail
ref="detail" ref="detail"
...@@ -281,7 +286,7 @@ ...@@ -281,7 +286,7 @@
:sortArr="sortArr" :sortArr="sortArr"
:defaultAreaCode="defaultAreaCode" :defaultAreaCode="defaultAreaCode"
></chooseArea> ></chooseArea>
<times ref="times" :chooseTimeList="chooseTimeList" @timeConfig="timeConfig" :chooseTimeData="chooseTimeData" :timeActive="timeActive"></times> <times ref="times" :chooseTimeList="chooseTimeList" @timeConfig="timeConfig" :timeActive="timeActive"></times>
<editContacts ref="editContacts" :editContact="editContact" :contactTotal="contactTotal"></editContacts> <editContacts ref="editContacts" :editContact="editContact" :contactTotal="contactTotal"></editContacts>
<contactList <contactList
ref="contactList" ref="contactList"
...@@ -313,7 +318,7 @@ ...@@ -313,7 +318,7 @@
<text class="sortPoptext">{{ sortIfo.sortTotalCapacity }}</text> <text class="sortPoptext">{{ sortIfo.sortTotalCapacity }}</text>
</view> </view>
<view style="margin-top: 40rpx; text-align: center" @click="sortInforPop = false"> <view style="margin-top: 40rpx; text-align: center" @click="sortInforPop = false">
<text class="middle-btn">确定</text> <text class="list-btn">确定</text>
</view> </view>
</view> </view>
</u-popup> --> </u-popup> -->
...@@ -365,7 +370,6 @@ export default { ...@@ -365,7 +370,6 @@ export default {
productDepositTotal: 0, //产品总押金 productDepositTotal: 0, //产品总押金
docQuery: '', //元素变量 docQuery: '', //元素变量
payBackground: '', //支付按钮背景颜色 payBackground: '', //支付按钮背景颜色
dateScroll: '', //日期滚动值
timeScroll: '' ,//时间滚动值 timeScroll: '' ,//时间滚动值
openid:uni.getStorageSync('openid') || '',//openid openid:uni.getStorageSync('openid') || '',//openid
couponData:[], //所有劵数据 couponData:[], //所有劵数据
...@@ -373,9 +377,9 @@ export default { ...@@ -373,9 +377,9 @@ export default {
ableConpon: '', //没有可用优惠券时，达到一定条件可用，显示达到的条件 ableConpon: '', //没有可用优惠券时，达到一定条件可用，显示达到的条件
orderStatus:'',//上下架状态，任何一个产品状态为下架，该状态为下架 orderStatus:'',//上下架状态，任何一个产品状态为下架，该状态为下架
chooseTimeList:[],//选中产品时间列表 chooseTimeList:[],//选中产品时间列表
chooseTimeData: '', //选中的时间传给子组件
moreDateIndex:0,//点击的更多日期下标 moreDateIndex:0,//点击的更多日期下标
dateList:[],//点击更多日期时对应的日期列表 moreTimeIndex:0,//点击的更多时间下标
chooseDateList:[],//点击更多日期时对应的日期列表
showTelephone:true,//用于判断是否显示输入联系人电话号码 showTelephone:true,//用于判断是否显示输入联系人电话号码
areaIndex:0,//选择站点时对应的产品下标 areaIndex:0,//选择站点时对应的产品下标
contactTotal: [], //所有联系人列表 contactTotal: [], //所有联系人列表
...@@ -492,7 +496,7 @@ export default { ...@@ -492,7 +496,7 @@ export default {
// } // }
this.$refs.calendar.setDefaultDate(this.productList[index].chooseDate)//日历组件选中日期 this.$refs.calendar.setDefaultDate(this.productList[index].chooseDate)//日历组件选中日期
this.moreDateIndex=index this.moreDateIndex=index
this.dateList=this.productList[index].priceStockList this.chooseDateList=this.productList[index].priceStockList
this.$refs.calendar.showPop = true this.$refs.calendar.showPop = true
}, },
//---日期选择---已改 //---日期选择---已改
...@@ -505,7 +509,6 @@ export default { ...@@ -505,7 +509,6 @@ export default {
this.$refs.calendar.setDefaultDate(item.chooseDate)//日历组件选中日期 this.$refs.calendar.setDefaultDate(item.chooseDate)//日历组件选中日期
item.endDate=item2.endTime//开始日期 item.endDate=item2.endTime//开始日期
item.startDate=item2.startTime//结束日期 item.startDate=item2.startTime//结束日期
this.chooseTimeData=''//清除之前选中的时间
if(item.productType==3){ if(item.productType==3){
//productType=3为场次票 //productType=3为场次票
item.cruisePlanId='' item.cruisePlanId=''
...@@ -517,19 +520,19 @@ export default { ...@@ -517,19 +520,19 @@ export default {
//解决点击日期无反应的情况 //解决点击日期无反应的情况
this.$forceUpdate() this.$forceUpdate()
}, },
//---日历确认事件---还未改完 //---日历确认事件
dateConfig(data) { dateConfig(data) {
let index=this.moreDateIndex let index2=chooseDateList.findIndex(item=>{
let index2=this.productList[index].priceStockList.findIndex(item=>{
return item.startTime.substr(0,10)==data return item.startTime.substr(0,10)==data
}) })
let item=this.productList[index] let item=this.productList[this.moreDateIndex]
let item2=item.priceStockList[index2] let item2=item.priceStockList[index2]
this.dateChoose(item,item2,index) //选中确认的日期 this.dateChoose(item,item2,index2) //选中确认的日期
//下面需要处理 let width=0
// this.docQuery.selectAll('.date-list').boundingClientRect(data => { this.docQuery.select('.date-list').boundingClientRect(data => {
// this.dateScroll = (data[index].width + 4) * index width = data.width
// }).exec() }).exec()
item.dateScroll=(width+6)*index2
}, },
//---展示更多时间---已改好 //---展示更多时间---已改好
showTime(item,index) { showTime(item,index) {
...@@ -542,31 +545,31 @@ export default { ...@@ -542,31 +545,31 @@ export default {
} }
this.$refs.times.showPop = true this.$refs.times.showPop = true
}, },
//---时间选择---已改好，数据更新需要测试 //---时间选择---已改好
chooseTime(item,item2,index) { chooseTime(item,item2,index2) {
if(item2.copyLast!='售罄'){ if(item2.copyLast!='售罄'){
item.timeActive=index item.timeActive=index2
item.cruisePlanId=item2.cruisePlanId//获取班次Id item.cruisePlanId=item2.cruisePlanId//获取班次Id
this.chooseTimeData=item2.startPlanTime
item.maxBookNum=Math.min(item.maxBookNum,item2.last) item.maxBookNum=Math.min(item.maxBookNum,item2.last)
//如果为场次票,开始时间为班次时间的开始时间，结束时间为班次时间的结束时间，班次时间的结束时间为空时，结束时间为班次时间的开始时间 //如果为场次票,开始时间为班次时间的开始时间，结束时间为班次时间的结束时间，班次时间的结束时间为空时，结束时间为班次时间的开始时间
item.startPlayTime=item2.startPlanTime item.startPlayTime=item2.startPlanTime
item.endPlayTime=item2.endPlanTime||item2.startPlanTime item.endPlayTime=item2.endPlanTime||item2.startPlanTime
// this.$forceUpdate() //解决时间下标未及时选中的问题
this.$forceUpdate()
} }
}, },
//---时间确认事件 //---时间确认事件
timeConfig(data) { timeConfig(index2) {
let index = this.timeList.findIndex(item => { let item=this.productList[this.moreTimeIndex]
return item.startPlanTime == data let item2=this.chooseTimeList[index2]
}) this.chooseTime(item,item2,index2)
if (index > -1) { //由于没有数据需要测试
//子组件点击确认之后有选择的时间 let width=0
this.chooseTime(index) //选中确认的日期 this.docQuery.select('.time-list').boundingClientRect(data => {
this.docQuery.selectAll('.time-list').boundingClientRect(data => { width = data.width
this.timeScroll = (data[index].width + 4) * index }).exec()
}).exec() item.timeScroll=(width+6)*index2
}
}, },
//---获取点击的编辑联系人信息，传给编辑联系人组件 //---获取点击的编辑联系人信息，传给编辑联系人组件
getEditContact(data) { getEditContact(data) {
...@@ -1273,11 +1276,14 @@ export default { ...@@ -1273,11 +1276,14 @@ export default {
min-height: 100%; min-height: 100%;
background: #f5f5f5; background: #f5f5f5;
} }
.middle { .middle{
position: relative; position: relative;
top: -100rpx; top: -100rpx;
padding: 30rpx 20rpx;
background: #ffffff; background: #ffffff;
padding:0 20rpx 30rpx 20rpx;
}
.list{
padding-top: 30rpx;
} }
.title-text{ .title-text{
font-size: 32rpx; font-size: 32rpx;
...@@ -1308,23 +1314,23 @@ export default { ...@@ -1308,23 +1314,23 @@ export default {
.buyKnow view:nth-child(2) { .buyKnow view:nth-child(2) {
display: flex; display: flex;
} }
.middle-place { .list-place {
height: 100rpx; height: 100rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.middle-place view:nth-child(2) { .list-place view:nth-child(2) {
flex: 1; flex: 1;
margin-left: 20rpx; margin-left: 20rpx;
color: $theme; color: $theme;
font-size: 28rpx; font-size: 28rpx;
font-weight: bolder; font-weight: bolder;
} }
.middle-Date{ .list-Date{
margin-top: 40rpx; margin-top: 40rpx;
} }
.middle-Datelist { .list-Datelist {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -1387,10 +1393,10 @@ export default { ...@@ -1387,10 +1393,10 @@ export default {
.date-more-content { .date-more-content {
margin-right:8rpx; margin-right:8rpx;
} }
.middle-time{ .list-time{
margin-top: 40rpx; margin-top: 40rpx;
} }
.middle-timelist { .list-timelist {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -1439,12 +1445,12 @@ export default { ...@@ -1439,12 +1445,12 @@ export default {
flex: 1; flex: 1;
font-weight: bolder; font-weight: bolder;
} }
.middle-divider{ .list-divider{
height: 2rpx; height: 2rpx;
background:$divider; background:$divider;
margin: 40rpx 0; margin: 40rpx 0;
} }
.middle-Number { .list-Number {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -1473,13 +1479,13 @@ export default { ...@@ -1473,13 +1479,13 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.middle-coupon{ .list-coupon{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding:30rpx 0; padding:30rpx 0;
} }
.middle-coupon view:first-child{ .list-coupon view:first-child{
width: 36rpx; width: 36rpx;
height: 36rpx; height: 36rpx;
background: $theme; background: $theme;
...@@ -1488,18 +1494,18 @@ export default { ...@@ -1488,18 +1494,18 @@ export default {
line-height:32rpx; line-height:32rpx;
border-radius:4rpx; border-radius:4rpx;
} }
.middle-coupon view:nth-child(2){ .list-coupon view:nth-child(2){
flex: 1; flex: 1;
margin-left: 10rpx; margin-left: 10rpx;
} }
.middle-coupon view:nth-child(3){ .list-coupon view:nth-child(3){
display: flex; display: flex;
color: $theme; color: $theme;
font-weight: bold; font-weight: bold;
} }
/*中间下面部分*/ /*中间下面部分*/
.middle-visitor { .list-visitor {
padding-bottom: 40rpx; padding-bottom: 40rpx;
border-bottom: 1px solid $divider; border-bottom: 1px solid $divider;
} }
...@@ -1578,12 +1584,13 @@ export default { ...@@ -1578,12 +1584,13 @@ export default {
.edit-list view:nth-child(3) { .edit-list view:nth-child(3) {
flex: 1; flex: 1;
} }
.middle-phone { .telephone {
margin-top: 30rpx; margin-top: 30rpx;
display: flex; display: flex;
align-items: center; align-items: center;
font-weight: bold;
} }
.middle-phone input { .telephone input {
flex: 1; flex: 1;
} }
/*押金部分*/ /*押金部分*/
...@@ -1609,8 +1616,7 @@ export default { ...@@ -1609,8 +1616,7 @@ export default {
max-width: 750rpx; max-width: 750rpx;
z-index: 10; z-index: 10;
padding: 0 24rpx 0 40rpx; padding: 0 24rpx 0 40rpx;
box-sizing: border-box; box-shadow: 0px 4px 12px rgba(0,0,0,0.16)
box-shadow: 0 0 3rpx #666666;
} }
.bottom-left > text:first-child { .bottom-left > text:first-child {
font-size: 28rpx; font-size: 28rpx;
......
pages/scenic/scenicComponents/times.vue
View file @ 83b83478
<template> <template>
<u-popup :show="showPop" :round="20" @close="showPop=false" closeable> <u-popup :show="showPop" :round="20" @close="confirm()" closeable>
<view class="son-wrap"> <view class="son-wrap">
<view class="time-title"> <view class="time-title">
时间选择 时间选择
...@@ -14,15 +14,17 @@ ...@@ -14,15 +14,17 @@
:key="index" v-if="item.last>0"> :key="index" v-if="item.last>0">
<view> <view>
{{item.startPlanTime?item.startPlanTime.substr(0,5):""}} {{item.startPlanTime?item.startPlanTime.substr(0,5):""}}
<text v-if="item.endPlanTime">-</text> <text v-if="!item.saleOnlyShowFromDate">
{{item.endPlanTime?item.endPlanTime.substr(0,5):""}} -{{item.endPlanTime?item.endPlanTime.substr(0,5):""}}
</text>
</view> </view>
<view> <view>
剩余：{{item.last}} <text v-if="item.copyLast!='余票充足'&&item.copyLast!='售罄'">剩余：</text>
{{item.copyLast}}
</view> </view>
</view> </view>
</view> </view>
<view style="padding: 0.5rem 0rem;color: #FF0000;" v-else> <view style="padding:50rpx 0;color: #FF0000;" v-else>
空空如也... 空空如也...
</view> </view>
<view class="time-sure"> <view class="time-sure">
...@@ -37,7 +39,7 @@ ...@@ -37,7 +39,7 @@
<script> <script>
export default { export default {
props: ['chooseTimeList', 'chooseTimeData', 'timeActive'], props: ['chooseTimeList', 'timeActive'],
watch: { watch: {
timeActive: { //父组件选中的下标 timeActive: { //父组件选中的下标
handler(newValue, oldValue) { handler(newValue, oldValue) {
...@@ -53,25 +55,20 @@ export default { ...@@ -53,25 +55,20 @@ export default {
return { return {
showPop: false, //控制该组件显示隐藏 showPop: false, //控制该组件显示隐藏
active: 10000, //默认不选中 active: 10000, //默认不选中
times: '', //时间
timeNumber: '', //当前时间转化为数字
} }
}, },
methods: { methods: {
//---时间选择 //---时间选择
chooseTime(i) { chooseTime(i) {
this.active = i this.active = i
this.times = this.chooseTimeList[i].startPlanTime
}, },
//---时间确认事件 //---时间确认事件
confirm(date) { confirm() {
this.showPop = false this.showPop = false
this.$emit('timeConfig', this.times) if(this.active!=10000){
}, this.$emit('timeConfig', this.active)
}, }
mounted() { }
let times = new Date().Format('yyyy-MM-dd hh:mm:ss')
this.timeNumber = parseInt(this.$commonjs.changeTime(times))
} }
} }
</script> </script>
......
pages/scenic/scenicOrder/scenicOrder.vue
View file @ 83b83478
...@@ -91,13 +91,13 @@ ...@@ -91,13 +91,13 @@
<view class="time-list" v-for="(item, index) of timeList" @click="chooseTime(index)" :class="{ on: timeActive == index }" :key="index"> <view class="time-list" v-for="(item, index) of timeList" @click="chooseTime(index)" :class="{ on: timeActive == index }" :key="index">
<view> <view>
{{ item.startPlanTime ? item.startPlanTime.substr(0, 5) : '' }} {{ item.startPlanTime ? item.startPlanTime.substr(0, 5) : '' }}
<text v-if="item.endPlanTime&&!item.saleOnlyShowFromDate"> <text v-if="!item.saleOnlyShowFromDate">
-{{ item.endPlanTime ? item.endPlanTime.substr(0, 5) : '' }} -{{ item.endPlanTime ? item.endPlanTime.substr(0, 5) : '' }}
</text> </text>
</view> </view>
<view> <view>
<text v-if="item.copyLast!='余票充足'&&item.copyLast!='售罄'">剩余：</text> <text v-if="item.copyLast!='余票充足'&&item.copyLast!='售罄'">剩余：</text>
{{ item.last }} {{ item.copyLast }}
</view> </view>
<view v-if="timeActive == index" class="date-icon"> <view v-if="timeActive == index" class="date-icon">
<u-icon name="checkmark" color="#ffffff"></u-icon> <u-icon name="checkmark" color="#ffffff"></u-icon>
...@@ -329,7 +329,7 @@ ...@@ -329,7 +329,7 @@
:sortArr="sortArr" :sortArr="sortArr"
:defaultAreaCode="defaultAreaCode" :defaultAreaCode="defaultAreaCode"
></chooseArea> ></chooseArea>
<times ref="times" :chooseTimeList="timeList" @timeConfig="timeConfig" :chooseTimeData="chooseTimeData" :timeActive="timeActive"></times> <times ref="times" :chooseTimeList="timeList" @timeConfig="timeConfig" :timeActive="timeActive"></times>
<editContacts ref="editContacts" :editContact="editContact" :contactTotal="contactTotal"></editContacts> <editContacts ref="editContacts" :editContact="editContact" :contactTotal="contactTotal"></editContacts>
<contactList <contactList
ref="contactList" ref="contactList"
...@@ -420,7 +420,6 @@ export default { ...@@ -420,7 +420,6 @@ export default {
chooseContact: [], //选中的游客信息列表 chooseContact: [], //选中的游客信息列表
contactNum: 1, //需要选择几位联系人数量 contactNum: 1, //需要选择几位联系人数量
cruisePlanId: '', //班次Id cruisePlanId: '', //班次Id
chooseTimeData: '', //选中的时间传给子组件
timeNumber: '', //当前时间转化为数字 timeNumber: '', //当前时间转化为数字
startDate: '', //开始日期 startDate: '', //开始日期
endDate: '', //结束日期 endDate: '', //结束日期
...@@ -589,7 +588,7 @@ export default { ...@@ -589,7 +588,7 @@ export default {
}) })
this.dateChoose(index) //选中确认的日期 this.dateChoose(index) //选中确认的日期
this.docQuery.selectAll('.date-list').boundingClientRect(data => { this.docQuery.selectAll('.date-list').boundingClientRect(data => {
this.dateScroll = (data[index].width + 4) * index this.dateScroll = (data[index].width + 6) * index
}).exec() }).exec()
}, },
//---展示更多时间 //---展示更多时间
...@@ -601,7 +600,6 @@ export default { ...@@ -601,7 +600,6 @@ export default {
if(this.timeList[i].copyLast!='售罄'){ if(this.timeList[i].copyLast!='售罄'){
this.timeActive = i this.timeActive = i
this.cruisePlanId = this.timeList[i].cruisePlanId //获取班次Id this.cruisePlanId = this.timeList[i].cruisePlanId //获取班次Id
this.chooseTimeData = this.timeList[i].startPlanTime
this.maxBookNum = Math.min(this.timeList[i].last, this.productIfo.maxBookNum) //获取剩余库存 this.maxBookNum = Math.min(this.timeList[i].last, this.productIfo.maxBookNum) //获取剩余库存
//如果为班次票,开始时间为班次时间的开始时间，结束时间为班次时间的结束时间，班次时间的结束时间为空时，结束时间为班次时间的开始时间 //如果为班次票,开始时间为班次时间的开始时间，结束时间为班次时间的结束时间，班次时间的结束时间为空时，结束时间为班次时间的开始时间
this.startPlayTime = this.timeList[i].startPlanTime this.startPlayTime = this.timeList[i].startPlanTime
...@@ -609,17 +607,11 @@ export default { ...@@ -609,17 +607,11 @@ export default {
} }
}, },
//---时间确认事件 //---时间确认事件
timeConfig(data) { timeConfig(index) {
let index = this.timeList.findIndex(item => { this.chooseTime(index) //选中确认的日期
return item.startPlanTime == data this.docQuery.selectAll('.time-list').boundingClientRect(data => {
}) this.timeScroll = (data[index].width + 6) * index
if (index > -1) { }).exec()
//子组件点击确认之后有选择的时间
this.chooseTime(index) //选中确认的日期
this.docQuery.selectAll('.time-list').boundingClientRect(data => {
this.timeScroll = (data[index].width + 4) * index
}).exec()
}
}, },
//---获取点击的编辑联系人信息，传给编辑联系人组件 //---获取点击的编辑联系人信息，传给编辑联系人组件
getEditContact(data) { getEditContact(data) {
...@@ -1713,8 +1705,7 @@ export default { ...@@ -1713,8 +1705,7 @@ export default {
max-width: 750rpx; max-width: 750rpx;
z-index: 10; z-index: 10;
padding: 0 24rpx 0 40rpx; padding: 0 24rpx 0 40rpx;
box-sizing: border-box; box-shadow: 0px 4px 12px rgba(0,0,0,0.16)
box-shadow: 0 0 3rpx #666666;
} }
.bottom-left > text:first-child { .bottom-left > text:first-child {
font-size: 28rpx; font-size: 28rpx;
......
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