Skip to content

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

单产品下单，优惠券开发

parent 470be20f
Show whitespace changes
Inline Side-by-side
Showing with 460 additions and 451 deletions
components/buyKnow.vue
View file @ 7a7e3a5b
......@@ -68,7 +68,6 @@ export default {
<style scoped="scoped">
.son-wrap{
position: relative;
height:80vh;
display: flex;
flex-direction:column;
......
components/orderCoupon.vue
View file @ 7a7e3a5b
<template>
<!----------------适用于订单选择券的时候展示券列表-------------------------->
<u-popup :show="show" :round="20" closeable @close="show=false">
<view class="title">
<view class="titleContent" v-for="(item,index) of navTitle" :key="index" :class="{on:active==index}" @click="navClick(index)">
<view style="position: relative;top:15rpx;">{{item}}</view>
<view v-show="active==index">
<text></text>
</view>
<!-- -----------------------适用于下单页面选择券的时候展示券列表-------------------------- -->
<u-popup :show="showPop" :round="20" closeable @close="showPop=false">
<view class="son-wrap">
<view class="head">
<view class="headlist" v-for="(item,index) of navTitle" :key="index" :class="{on:active==index}" @click="navClick(index)">
<text>
{{item}}
</text>
</view>
</view>
<!----------------------------------------------------可用------------------------------------------>
<view v-show="active==0">
<view class="middle">
<checkbox-group @change="checkboxChange" v-if="couponList.masterSlaveCouponList&&couponList.masterSlaveCouponList.length>0">
<view v-for="(item,index) of couponList.masterSlaveCouponList" :key="index" class="listBox">
<label class="listLabel">
<!------------------------------------可用-------------------------------------->
<view class="middle" v-if="active==0">
<checkbox-group @change="checkboxChange" v-if="masterSlaveCouponList&&masterSlaveCouponList.length>0">
<view v-for="(item,index) of masterSlaveCouponList" :key="index" class="list-box">
<label>
<view>
{{item.couponName}}
<checkbox :value="item.couponId" :checked="item.couponId==chooseCoupon.couponId" />
<checkbox :value="JSON.stringify(item)" :checked="item.couponId==chooseCoupon.couponId" class="blue" />
</view>
<view>
{{item.couponRule}}
......@@ -33,17 +31,14 @@
</label>
</view>
</checkbox-group>
</view>
<view class="empty" v-if="!couponList.masterSlaveCouponList||couponList.masterSlaveCouponList.length==0">
<view class="empty" v-else>
空空如也...
</view>
</view>
<!--------------------------------------不可用------------------------------------------------------------>
<view v-show="active==1">
<view class="middle" v-if="couponList.unusableCouponList&&couponList.unusableCouponList.length>0">
<view v-for="(item,index) of couponList.unusableCouponList" :key="index" class="listBox">
<!-- -------------------------------不可用-------------------------------- -->
<view v-if="active==1" class="middle">
<view v-if="unusableCouponList&&unusableCouponList.length>0">
<view v-for="(item,index) of unusableCouponList" :key="index" class="list-box">
<view>
{{item.couponName}}
</view>
......@@ -59,10 +54,14 @@
</view>
</view>
</view>
<view class="empty" v-if="!couponList.unusableCouponList||couponList.unusableCouponList.length==0">
<view class="empty" v-else>
空空如也...
</view>
</view>
</view>
<view class="bottom-sure" @click="showPop=false">
确定
</view>
</u-popup>
</template>
......@@ -72,16 +71,25 @@
export default{
props:['couponData','chooseCouponObj'],
watch: {
couponData:{//
couponData:{//劵列表
handler(newValue, oldValue){
if(newValue){
this.couponList=this.couponData
//可用优惠券去重
this.masterSlaveCouponList=[]
if(newValue.masterSlaveCouponList){
newValue.masterSlaveCouponList.forEach(item=>{
if(!this.masterSlaveCouponList.find(item2=>item2.couponId==item.couponId)){
this.masterSlaveCouponList.push(item)
}
})
}
this.unusableCouponList=newValue.unusableCouponList
}
},
deep:true,
immediate:true
},
chooseCouponObj:{//
chooseCouponObj:{//选中的券
handler(newValue, oldValue){
if(newValue){
this.chooseCoupon=this.chooseCouponObj
......@@ -94,36 +102,26 @@ export default{
data(){
return{
active:0,//导航栏下标
show:false,//控制弹窗显示隐藏
current:0,//控制选项卡默认显示第几个
couponList:'',//券列表
showPop:false,//控制弹窗显示隐藏
masterSlaveCouponList:[],//可用优惠券列表
unusableCouponList:[],//不可用优惠券列表
chooseCoupon:'',//选中的劵
navTitle:['可用','不可用'],//导航标题
}
},
methods:{
navClick(index){//------------------------------------------导航栏点击
//---导航栏点击
navClick(index){
this.active=index
},
showCoupon(){//----------------------------------------展示弹窗
this.show=true
},
//---多选框值变化
checkboxChange(evt){
if(evt.detail.value.length==2){
//删除第一个
evt.detail.value.splice(0,1)
//获取选中券，传值给父组件
this.chooseCoupon=this.couponList.masterSlaveCouponList.find((item)=>{
return item.couponId==evt.detail.value[0]
})
this.$emit('couponChoose',this.chooseCoupon)
}else if(evt.detail.value.length==1){
this.chooseCoupon=this.couponList.masterSlaveCouponList.find((item)=>{
return item.couponId==evt.detail.value[0]
})
this.$emit('couponChoose',this.chooseCoupon)
}else if(evt.detail.value.length==0){
checkboxChange(e){
let value=e.detail.value
if(value.length>0){
let obj=JSON.parse(value[value.length-1])
this.$emit('couponChoose',obj)
}
if(value.length==0){
this.$emit('couponChoose','')
}
}
......@@ -133,19 +131,80 @@ export default{
</script>
<style scoped="scoped" lang="scss">
.title{display: flex;height: 80rpx;}
.titleContent{flex:1;text-align: center;font-size:30rpx;}
.titleContent.on{color: $theme;font-weight: bold;}
.titleContent view text{width: 40rpx;height: 6rpx;background:$theme;border-radius:6rpx;display:inline-block;position: relative;top:-10rpx;}
.middle{padding:24rpx;background:#f5f5f5;}
.listBox{background: #FFFFFF;padding:24rpx;border-radius:10rpx;}
.middle .listBox:not(:first-child){margin-top:20rpx;}
.middle view view:not(:first-child){margin-top:20rpx;}
.middle view view{display: flex;justify-content: space-between;}
.middle view view:first-child{font-weight: bold;}
.middle view view:nth-child(2){font-size:24rpx;}
.middle view view:last-child{color: #666666;font-size:24rpx;}
.middle view text{color:#f9690e;font-size:30rpx;font-weight: bolder;}
.middle view text text{font-size:24rpx;font-weight: 400;}
.empty{padding:100rpx 0;text-align: center;background: #f5f5f5;}
.son-wrap{
height:80vh;
display: flex;
flex-direction:column;
}
.head{
display: flex;
}
.headlist{
width: 50%;
height: 90rpx;
line-height: 90rpx;
text-align: center;
font-size:30rpx;
}
.headlist.on text{
border-bottom: 6rpx solid $theme;
color: $theme;
font-weight: bold;
}
.middle{
padding:24rpx 24rpx 100rpx 24rpx;
background:#f5f5f5;
flex: 1;
overflow-y: scroll;
}
.list-box{
background: #FFFFFF;
padding:24rpx;
border-radius:10rpx;
}
.middle .list-box:not(:first-child){
margin-top:20rpx;
}
.list-box view:not(:first-child){
margin-top:20rpx;
}
.list-box view{
display: flex;
justify-content: space-between;
}
.list-box view:first-child{
font-weight: bold;
}
.list-box view:last-child{
color: #999999;
font-size:24rpx;
}
.list-box text{
color:#f9690e;
font-size:32rpx;
font-weight: bold;
}
.list-box text text{
font-size:24rpx;
font-weight: 400;
}
.empty{
padding:160rpx 0;
text-align: center;
color: $red;
}
.bottom-sure{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
justify-content: center;
background:$theme;
font-size:32rpx;
font-weight: bold;
color: #ffffff;
}
</style>
pages/payment/ourPayment/ourPayment.vue
View file @ 7a7e3a5b
......@@ -364,7 +364,7 @@ export default {
},
showCoupon() {
//---展示券列表
this.$refs.orderCoupon.showCoupon()
this.$refs.orderCoupon.showPop=true
},
//---初始化获取商家名称，大商家
initMerchant() {
......
pages/scenic/scenicComponents/contactList.vue
View file @ 7a7e3a5b
......@@ -257,7 +257,7 @@ export default {
display: flex;
align-items: center;
justify-content: center;
background: #3688ff;
background:$theme;
font-size:32rpx;
font-weight: bold;
color: #ffffff;
......
pages/scenic/scenicComponents/times.vue
View file @ 7a7e3a5b
......@@ -83,7 +83,6 @@ export default {
display: flex;
flex-direction:column;
}
.time-title{
text-align: center;
font-size: 32rpx;
......@@ -91,44 +90,32 @@ export default {
padding: 30rpx 24rpx;
border-radius: 20rpx 20rpx 0 0;
}
.time-content {
display: flex;
flex-wrap: wrap;
}
.time-list {
width: 30%;
height: 80rpx;
text-align: center;
width:30%;
height: 90rpx;
line-height: 30rpx;
color: #666666;
background: rgb(242, 242, 242);
border-radius: 16rpx;
margin-right: 5%;
margin-top: 30rpx;
}
.time-list view:first-child {
margin-top: 10rpx;
text-align: center;
margin-right:5%;
border-radius: 15rpx;
display: inline-block;
background:#f2f2f2;
position: relative;
padding-bottom: 8rpx;
}
.time-list view {
width: 100%;
text-align: center;
margin-top: 10rpx;
}
.time-content view:nth-child(3n) {
margin-right: 0;
}
.time-list.on {
background: none;
color: $theme;
border: 1px solid $theme;
box-sizing: border-box;
background: #DAE6F6;
}
.time-sure{
margin-top:60rpx;
text-align: center;
......
pages/scenic/scenicOrder/scenicOrder.vue
View file @ 7a7e3a5b
......@@ -2,11 +2,11 @@
<view class="orderBox">
<view class="head"> </view>
<view class="middle">
<!-- --------------------------------------------产品信息部分----------------------------------- -->
<view class="middle1">
<view class="middle1Product">
<view class="middle-top">
<!-- --------------------------------------------产品信息部分------------------------------------- -->
<view class="middle-Product">
<view class="merchantName">
<text>
<text class="title-text">
{{ productIfo.merchantName || '' }}
</text>
<text>
......@@ -23,7 +23,7 @@
</view>
<view>
购买须知
<u-icon name="arrow-right"></u-icon>
<u-icon name="arrow-right" color='#FC6703'></u-icon>
</view>
</view>
</view>
......@@ -51,20 +51,21 @@
<u-icon name="arrow-right" color="#3688FF"></u-icon>
</view>
</view> -->
<view class="middle1Date">
<text>游玩日期</text>
<view class="middle-Date">
<view class="title-text">游玩日期</view>
<view class="middle-Datelist">
<scroll-view class="date-content" scroll-x="true" :scroll-left="dateScroll" v-if="dateList.length > 0">
<view class="date-list" v-for="(item, index) of dateList" :class="{ on: active == index }" @click="dateChoose(index)" :key="index">
<view class="date-time">
<text v-if="item.week">
<view v-if="item.week">
<text v-if="item.week != '今天' && item.week != '明天' && item.week != '后天'">周</text>
{{ item.week }}
</text>
</view>
<view>
{{ item.startTime ? item.startTime.substr(5, 5) : '' }}
</view>
<view class="date-price">
<text>¥</text><text>{{ item.sellingPrice }}</text>
¥<text style="font-weight: bold;">{{ item.sellingPrice }}</text>
</view>
<view v-if="active == index" class="date-icon">
......@@ -78,12 +79,14 @@
<view>更多</view>
<view>日期</view>
</view>
<u-icon name="arrow-right" color="#3688FF"></u-icon>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</view>
<view class="middle1Time" v-if="productIfo.productType == 3">
<text> 游玩时间 </text>
<view class="middle-time" v-if="productIfo.productType == 3">
<view class="title-text"> 场次 </view>
<view class="middle-timelist">
<scroll-view class="time-content" scroll-x="true" :scroll-left="timeScroll" v-if="timeList.length> 0">
<view class="time-list" v-for="(item, index) of timeList" @click="chooseTime(index)" :class="{ on: timeActive == index }" :key="index">
<view>
......@@ -92,6 +95,9 @@
{{ item.endPlanTime ? item.endPlanTime.substr(0, 5) : '' }}
</view>
<view> 剩余：{{ item.last }} </view>
<view v-if="timeActive == index" class="date-icon">
<u-icon name="checkmark" color="#ffffff"></u-icon>
</view>
</view>
</scroll-view>
<text class="no-time" v-if="startDate && endDate && timeList.length == 0"> 该日票种已售罄，请选择其他日期 </text>
......@@ -99,17 +105,29 @@
<view class="timeMore" @click="showTime()">
<view class="time-more-content">
<view>更多</view>
<view>时间</view>
<view>场次</view>
</view>
<u-icon name="arrow-right" color="#3688FF"></u-icon>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="middle1Number">
<view style="font-size: 32rpx; font-weight: bolder"> 购买数量 </view>
</view>
<view class="middle-divider">
</view>
<view class="middle-Number">
<view class="title-text"> 购买数量 </view>
<view>
<u-number-box
<u-number-box v-model="buyNum">
<view slot="minus" class="number-minus" >
<u-icon name="minus" color="#FFFFFF" size="32"></u-icon>
</view>
<text slot="input" class="number-input">{{buyNum}}</text>
<view slot="plus" class="number-plus">
<u-icon name="plus" color="#FFFFFF" size="32"></u-icon>
</view>
</u-number-box>
<!-- <u-number-box
@change='buyNumChange'
v-model="buyNum"
bg-color='#3688FF'
......@@ -119,59 +137,46 @@
input-width="100"
:min="1"
:max="maxBookNum">
</u-number-box>
</view>
</u-number-box> -->
</view>
</view>
<!-- -----------------------------有可用优惠券,并且未选中----------------------------------------------------- -->
<!-- <div class="middle1Coupon" v-if="couponData.masterSlaveCouponList&&couponData.masterSlaveCouponList.length>0&&chooseCouponObj==''" @click="showCoupon()">
<span>
<view class=" middle-coupon" v-if="couponData.length>0" @click="showCoupon()">
<view>
券
</span>
<span>
</view>
<!-- 有可用优惠券,并且未选中 -->
<template v-if="couponData.masterSlaveCouponList&&couponData.masterSlaveCouponList.length>0&&!chooseCouponObj">
<view>
{{couponData.masterSlaveCouponList[0].couponName}}
</span>
<span>
未选优惠券
<svg class="icon" aria-hidden="true" style="font-size: 0.24rem;color: #666666;">
<use xlink:href="#iconyou"></use>
</svg>
</span>
</div> -->
<!-- -----------------------------有可用优惠券----------------------------------------------------- -->
<!-- <div class="middle1Coupon" v-if="chooseCouponObj!=''&&savedMoney>0" @click="showCoupon()">
<span>
券
</span>
<span>
<b>{{chooseCouponObj.couponName}}</b>
</span>
<span>
<i>-¥</i><i>{{parseFloat(savedMoney.toFixed(2))}}</i>
<svg class="icon" aria-hidden="true" style="font-size: 0.24rem;color: #666666;">
<use xlink:href="#iconyou"></use>
</svg>
</span>
</div> -->
<!-- -----------------------------------------------可用优惠券条件--------------------------------------- -->
<!-- <div class="middle1Coupon" v-if="ableConpon!=''" @click="showCoupon()">
<span>
券
</span>
</view>
<view >
未使用优惠券
</view>
</template>
<!-- 有可用优惠券 -->
<template v-if="chooseCouponObj&&savedMoney>0">
<view>
{{chooseCouponObj.couponName}}
</view>
<span>
<b>{{ableConpon.couponName}}</b>
</span>
<view style="font-size: 32rpx;">
<text style="font-size: 24rpx;position: relative;top: 6rpx;">¥</text>
{{parseFloat(savedMoney.toFixed(2))}}
</view>
</template>
<!-- 可用优惠券条件-->
<template v-if="ableConpon">
<view>
{{ableConpon.couponName}}
</view>
<span>
<view>
{{ableConpon.couponRule}}
<svg class="icon" aria-hidden="true">
<use xlink:href="#iconyou"></use>
</svg>
</span>
</div> -->
</view>
</template>
<u-icon name="arrow-right" color="#3688FF"></u-icon>
</view>
<!-- --------------------------------------------额外服务部分-------------------------------------------- -->
<view class="extraService" v-if="serviceList.length>0&&showErmai">
<checkbox-group @change="extraChange">
......@@ -184,21 +189,48 @@
<view>
<text style="font-size: 24rpx;">¥</text>
<text style="font-size: 32rpx;margin-right: 20rpx;">{{item.sellingPrice}}</text>
<checkbox class="blue" :value="JSON.stringify(item)" style="transform: scale(0.7);" :checked="item.ifChoose" />
<text style="font-size: 32rpx;font-weight: bold;">{{item.sellingPrice}}</text>
<checkbox class="blue" :value="JSON.stringify(item)" style="transform: scale(0.7);position: relative;left: 10rpx;" :checked="item.ifChoose" />
</view>
</label>
</view>
</checkbox-group>
</view>
<!-- ----------------------------------------------游客信息----------------------------------------- -->
<view class="middle2" v-if="productIfo.tripTemplateFlag != 2">
<view class="middle2Visitor">
<!-- -----------------------------------支付之后有额外服务，没有选额外服务的弹窗------------------------- -->
<u-popup :show="showExtraPop" :round="20" @close="showExtraPop = false" closeable>
<view class="extra-wrap">
<view style="font-weight: bold;font-size: 32rpx;">
云智能导览耳机
</view>
<view style="color: #666666;margin:40rpx 0;">
深度了解索道典故由来，周边攻略推荐
</view>
<view>
<text @click="extraNo()" class="btn" style="background: #fff;color: #333;border: 1px solid #c0c0c0;">
不需要
</text>
<text @click="extraYes()" class="btn" style="margin-left: 40rpx;">
需要
</text>
</view>
</view>
</u-popup>
</view>
<view class="middle-divider">
</view>
<!-- ---------------------------------------------游客信息-------------------------------------------- -->
<view class="middle-bottom" v-if="productIfo.tripTemplateFlag != 2">
<view class="middle-visitor">
<view class="visitorTitle">
<text> 游客信息 </text>
<text class="title-text"> 用户信息 </text>
<text>
需填<text class="title-bold">{{ contactNum }}</text>位出行人
<text class="title-bold" v-if="contactNum - chooseContact.length > 0">，还需{{ contactNum - chooseContact.length }}位</text>
<!-- <text class="title-bold" v-if="contactNum - chooseContact.length > 0">，还需{{ contactNum - chooseContact.length }}位</text> -->
</text>
</view>
<view class="visitorPlus" v-if="contactTotal.length>0">
......@@ -247,47 +279,21 @@
</view>
</view>
<view class="middle2Phone" v-if="productIfo.tripTemplateFlag != 2">
<view class="phoneTitle"> 联系信息 </view>
<view class="phoneNumber">
<view class="middle-phone" v-if="productIfo.tripTemplateFlag != 2">
<text> 联系电话： </text>
<input type="number" maxlength="11" placeholder="请输入联系电话" v-model.trim="ticketPhone" />
</view>
</view>
</view>
<!-- --------------------------------------------------------产品押金部分-------------------------------------------------- -->
<!-- ---------------------------------------------产品押金部分---------------------------------------- -->
<view class="productDeposit" v-if="productIfo.deposit">
<text>
<view>
{{ productIfo.name }}
押金
</text>
<text style="color: #ff0000"> {{ productIfo.deposit }}元 </text>
</view>
<!-- -----------------------------------支付之后有额外服务，没有选额外服务的弹窗------------------------------------- -->
<u-popup :show="showExtraPop" :round="20" @close="showExtraPop = false" closeable>
<view class="extra-wrap">
<view style="font-weight: bold;font-size: 32rpx;">
云智能导览耳机
<text style="color: #FC6703;margin-left: 10rpx;">押金</text>
</view>
<view style="color: #666666;margin:40rpx 0;">
深度了解索道典故由来，周边攻略推荐
<view style="color: #FC6703"> {{ productIfo.deposit }}元 </view>
</view>
<view>
<text @click="extraNo()" class="btn" style="background: #fff;color: #333;border: 1px solid #c0c0c0;">
不需要
</text>
<text @click="extraYes()" class="btn" style="margin-left: 40rpx;">
需要
</text>
</view>
</view>
</u-popup>
</view>
<view class="bottom">
......@@ -429,7 +435,7 @@ export default {
endPlayTime: '', //结束时间
areaObj: '', //区域组件的传值
templateList: [], //该产品联系人必须要填写的信息
flag: '', //setTimeout函数
timeFlag: '', //setTimeout函数
savedMoney: 0, //优惠价格
serviceList: [], //所有额外服务
chooseService: [], //选中的额外服务
......@@ -446,8 +452,9 @@ export default {
dateScroll: '', //日期滚动值
timeScroll: '' ,//时间滚动值
openid:uni.getStorageSync('openid') || '',//openid
couponData: '', //所有劵数据
couponData:[], //所有劵数据
chooseCouponObj: '', //默认选中最优价格优惠券
ableConpon: '', //没有可用优惠券时，达到一定条件可用，显示达到的条件
}
},
onLoad(option) {
......@@ -540,6 +547,10 @@ export default {
//选择了南站不显示耳麦
this.showErmai = false
this.chooseService = []
//多选框状态设置成未选中
this.serviceList.forEach(item=>{
item.ifChoose=false
})
} else {
this.showErmai = true
}
......@@ -576,6 +587,7 @@ export default {
this.timeActive = 10000
uni.$u.throttle(this.getTimeStock, 3000)
}
this.initCoupon()
},
//---日历确认事件
dateConfig(data) {
......@@ -685,6 +697,10 @@ export default {
//非实名制
this.contactNum = 1
}
clearTimeout(this.timeFlag)
this.timeFlag = setTimeout(()=>{
this.initCoupon()
}, 1500)
},
//---展示购票须知
showBuyKnow() {
......@@ -809,6 +825,7 @@ export default {
//如果为班次票，请求班次票接口
this.getTimeStock()
}
this.initCoupon() //获取优惠券
}
} else {
uni.showToast({
......@@ -962,23 +979,24 @@ export default {
}
})
},
//---加载优惠券(暂未开发)
//---加载优惠券
initCoupon() {
let savedMoneyList = []
this.chooseCouponObj = ''
this.ableConpon = ''
this.couponData=[]
let data = {
productId: this.productId, //产品id
tickets: this.buyNum, //房间数量
singleMoney: this.sellingPrice, //单价
money: parseFloat((this.buyNum * this.sellingPrice).toFixed(2)), //订单总价，不算券，和现金红包
merchantId: this.merchantId, //商户Id
openid:this.$store.state.openId
openid:this.openid
}
this.axios.post(this.wechatUserJs.usableCouponList(), data).then((res) => {
if (res.data.code == '00') {
this.couponData = res.data.data
let masterSlaveCouponList=res.data.data.masterSlaveCouponList
this.$request('wechatUser/myPage/usableCouponList', data).then((res) => {
if (res.code == '00') {
this.couponData = res.data
let masterSlaveCouponList=res.data.masterSlaveCouponList
if (masterSlaveCouponList&&masterSlaveCouponList.length>0) {
masterSlaveCouponList.forEach((item) => { //获取最优券
savedMoneyList.push(item.savedMoney)
......@@ -1001,8 +1019,8 @@ export default {
}
this.savedMoney=this.chooseCouponObj.savedMoney
} else {
if (res.data.data.unusableCouponList.length > 0) {
res.data.data.unusableCouponList.forEach((item, i) => { //没有可用优惠券，有达到条件可以用的优惠券，先显示条件，达到条件时显示可用优惠券
if (res.data.unusableCouponList.length > 0) {
res.data.unusableCouponList.forEach((item, i) => { //没有可用优惠券，有达到条件可以用的优惠券，先显示条件，达到条件时显示可用优惠券
if (item.isProduct == 1) {
this.ableConpon = item
}
......@@ -1034,7 +1052,7 @@ export default {
},
//---展示券列表
showCoupon() {
this.$refs.orderCoupon.showCoupon()
this.$refs.orderCoupon.showPop=true
},
//---额外服务多选框变化
extraChange(e) {
......@@ -1047,6 +1065,14 @@ export default {
value.forEach(item=>{
this.chooseService.push(JSON.parse(item))
})
//获取选中的多选框为选中状态
this.serviceList.forEach(item=>{
this.chooseService.forEach(item2=>{
if(item.id==item2.id){
item.ifChoose=true
}
})
})
},
//---不需要享受耳麦服务
extraNo() {
......@@ -1217,7 +1243,7 @@ export default {
let couponList = []
if (this.chooseCouponObj) {
if(this.chooseCouponObj.slaveList.length>0){//有从卷取值从卷，没有从卷取值主劵
if(this.chooseCouponObj.slaveList.length>0){//有从券取值从券，没有从券取值主劵
couponList=[//券列表
{
couponId:this.chooseCouponObj.slaveCouponId,//券id
......@@ -1325,49 +1351,30 @@ export default {
height: 160rpx;
background: linear-gradient(to bottom, #2984ef, #d8eaf6);
}
.orderBox {
min-height: 100%;
background: #f5f5f5;
}
.middle {
position: relative;
top: -100rpx;
padding: 0 20rpx;
padding-bottom: 20rpx;
}
/*中间第一部分*/
.middle1 {
padding: 32rpx 20rpx 0 20rpx;
padding: 30rpx 20rpx;
background: #ffffff;
border-radius: 10rpx;
}
.middle1 > view:not(:last-child) {
border-bottom: 1px solid #e5e5e5;
}
.middle1Product {
padding-bottom: 20rpx;
.title-text{
font-size: 32rpx;
font-weight: bold;
}
/*中间上面部分*/
.merchantName {
display: flex;
align-items: center;
}
.merchantName text:first-child {
font-size: 36rpx;
font-weight: bolder;
}
.merchantName text:nth-child(2) {
color: #666666;
margin-left: 20rpx;
}
.buyKnow {
margin-top: 20rpx;
background: #fef0e6;
......@@ -1378,97 +1385,69 @@ export default {
padding-left: 10rpx;
align-items: center;
border-radius: 5rpx;
color:$red;
}
.buyKnow view:first-child {
color: #f9690e;
}
.buyKnow view:nth-child(2) {
color: #6d4d00;
display: flex;
}
.middle-place {
height: 100rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
.middle-place view:nth-child(2) {
flex: 1;
margin-left: 20rpx;
color: #f9690e;
color: $theme;
font-size: 28rpx;
font-weight: bolder;
}
.middle1Date {
.middle-Date{
margin-top: 40rpx;
}
.middle-Datelist {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx 0;
}
.middle1Date > text:first-child {
flex-shrink: 0;
margin-top: 30rpx;
}
.date-content {
flex: 1;
margin-left: 20rpx;
overflow-x: scroll;
white-space: nowrap;
height: 90rpx;
}
.date-content::-webkit-scrollbar {
display: none;
}
.date-list {
width: 130rpx;
height: 90rpx;
width: 140rpx;
text-align: center;
border: 1px solid #cccccc;
margin-right: 8rpx;
margin-right:12rpx;
border-radius: 10rpx;
position: relative;
display: inline-block;
background: #f2f2f2;
padding-bottom: 8rpx;
}
.date-list.on {
border: 1px solid $theme;
background: #DAE6F6;
}
.no-date {
color: #ff0000;
flex: 1;
margin-left: 30rpx;
font-weight: bolder;
}
.date-time {
font-size: 24rpx;
margin-top: 8rpx;
.date-list>view{
margin-top: 6rpx;
}
.date-price {
margin-top: 8rpx;
color: #f9690e;
font-size: 32rpx;
color: $red;
}
.date-price text {
.no-date {
color: $red;
flex: 1;
margin-left: 30rpx;
font-weight: bolder;
font-size: 30rpx;
}
.date-price text:first-child {
font-weight: 400;
font-size: 24rpx;
}
.date-icon {
position: absolute;
right: -1px;
......@@ -1479,126 +1458,138 @@ export default {
background:$theme;
border-radius: 10rpx 0;
}
.dateMore {
flex-shrink: 0;
width: 100rpx;
height: 90rpx;
border: 1px solid $theme;
border-radius: 10rpx;
padding: 20rpx 0;
width: 120rpx;
display: flex;
justify-content: center;
align-items: center;
}
.date-more-content {
margin: 0 4rpx;
color: $theme;
margin-right:8rpx;
}
.middle1Time {
.middle-time{
margin-top: 40rpx;
}
.middle-timelist {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx 0;
}
.middle1Time > text:first-child {
flex-shrink: 0;
margin-top: 30rpx;
}
.time-content {
flex: 1;
margin-left: 20rpx;
overflow-x: scroll;
white-space: nowrap;
height: 90rpx;
}
.time-content::-webkit-scrollbar {
display: none;
}
.time-list {
width: 180rpx;
width: 200rpx;
height: 90rpx;
line-height: 30rpx;
text-align: center;
margin-right: 8rpx;
border-radius: 15rpx;
display: inline-block;
background: rgb(242, 242, 242);
background:#f2f2f2;
position: relative;
padding-bottom: 8rpx;
}
.time-list view {
margin-top: 10rpx;
}
.time-list.on {
background: none;
color: $theme;
border: 1px solid $theme;
box-sizing: border-box;
background: #DAE6F6;
}
.timeMore {
flex-shrink: 0;
width: 100rpx;
height: 90rpx;
border: 1px solid $theme;
border-radius: 10rpx;
width: 120rpx;
display: flex;
justify-content: center;
align-items: center;
}
.time-more-content {
margin: 0 4rpx;
color: $theme;
margin-right:8rpx;
}
.no-time {
color: #ff0000;
color:$red;
flex: 1;
margin-left: 30rpx;
font-weight: bolder;
}
.middle1Number {
.middle-divider{
height: 2rpx;
background:$divider;
margin: 40rpx 0;
}
.middle-Number {
display: flex;
justify-content: space-between;
padding: 36rpx 0;
align-items: center;
}
/*中间第二部分*/
.middle2 {
padding: 40rpx 20rpx;
background: #ffffff;
border-radius: 10rpx;
margin-top: 20rpx;
.number-minus {
width: 52rpx;
height: 52rpx;
background:#ccc;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.middle2Visitor {
padding-bottom: 40rpx;
border-bottom: 1px solid #e5e5e5;
.number-input {
padding:0 20rpx;
width: 100rpx;
text-align: center;
font-size: 40rpx;
}
.visitorTitle {
position: relative;
.number-plus{
width: 52rpx;
height: 52rpx;
background:$theme;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
.visitorTitle > text:first-child {
font-size: 32rpx;
font-weight: bolder;
.middle-coupon{
display: flex;
justify-content: space-between;
align-items: center;
padding:30rpx 0;
}
.middle-coupon view:first-child{
width: 36rpx;
height: 36rpx;
background: $theme;
color: #FFFFFF;
text-align: center;
line-height:32rpx;
border-radius:4rpx;
}
.middle-coupon view:nth-child(2){
flex: 1;
margin-left: 10rpx;
}
.middle-coupon view:nth-child(3){
display: flex;
color: $theme;
font-weight: bold;
}
/*中间下面部分*/
.middle-visitor {
padding-bottom: 40rpx;
border-bottom: 1px solid $divider;
}
.visitorTitle > text:nth-child(2) {
font-size: 24rpx;
color: #666666;
margin-left: 10rpx;
}
.title-bold {
color: #f9690e;
font-weight: bolder;
......@@ -1616,11 +1607,10 @@ export default {
border-radius:20rpx;
}
.visitorPlus {
margin-top: 30rpx;
margin-top: 20rpx;
display: flex;
flex-wrap: wrap;
}
.plus-list {
height: 70rpx;
display: flex;
......@@ -1630,43 +1620,35 @@ export default {
padding: 5rpx 0;
width: 145rpx;
text-align: center;
color: #999999;
border: 1px solid #999999;
margin-right: 15rpx;
background: #f2f2f2;
border-radius: 5rpx;
position: relative;
margin-top: 20rpx;
margin: 20rpx 15rpx 0 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.plus-list-last {
color: $theme;
background: #efefef;
width: 170rpx;
border: none;
}
.plus-list.on {
border: 1px solid $theme;
color: $theme;
background: #DAE6F6;
}
.visitorEdit {
margin-top: 40rpx;
}
.visitorEdit > view:not(first-child) {
margin-top: 25rpx;
}
.edit-list {
display: flex;
justify-content: space-between;
align-items: center;
}
.edit-list view:nth-child(2) {
display: inline-block;
width: 120rpx;
......@@ -1675,29 +1657,17 @@ export default {
overflow: hidden;
margin-left: 30rpx;
}
.edit-list view:nth-child(3) {
flex: 1;
}
.phoneTitle {
font-size: 28rpx;
font-weight: bolder;
margin-top: 30rpx;
}
.phoneNumber {
.middle-phone {
margin-top: 30rpx;
border-bottom: 1px solid #e6e6e6;
display: flex;
align-items: center;
padding-bottom: 10rpx;
}
.phoneNumber input {
.middle-phone input {
flex: 1;
}
/*押金部分*/
.productDeposit {
padding: 40rpx 15rpx;
......@@ -1706,14 +1676,15 @@ export default {
margin-top: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
/*额外服务部分*/
.extraService {
padding: 30rpx 20rpx;
background: #ffffff;
padding: 20rpx;
background:#DAE6F6;
margin-top: 30rpx;
border-radius: 10rpx;
margin-top: 20rpx;
}
.extraService label {
width: 100%;
......@@ -1744,32 +1715,26 @@ export default {
box-sizing: border-box;
box-shadow: 0 0 3rpx #666666;
}
.bottom-left > text:first-child {
font-size: 28rpx;
text-decoration: line-through;
margin-right: 16rpx;
}
.bottom-left text:nth-child(2) {
font-size: 40rpx;
font-weight: bolder;
color: #f45803;
}
.bottom-left text:nth-child(2) text {
font-size: 32rpx;
}
.bottom-right {
display: flex;
align-items: center;
}
.bottom-detail {
display: flex;
}
.bottom-btn {
position: relative;
width: 240rpx;
......@@ -1782,7 +1747,6 @@ export default {
background: $red;
text-align: center;
}
.bottom-btn text {
position: absolute;
width: 100%;
......
uni.scss
View file @ 7a7e3a5b
......@@ -34,6 +34,6 @@ $red:#FC6703;
$grey:#999;
// 分割线颜色
$divider:#DBDBDB;
$divider:#f3f3f3;
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