Skip to content

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

单产品下单，优惠券开发

parent 470be20f
Expand all 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
This diff is collapsed.
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