Skip to content

G
gxpt_wechat
Commit dc1de781 by zhangzhen
Options

细节优化

parent 5730b1e7
Showing with 130 additions and 40 deletions
pages/couponList/index.vue
......@@ -25,17 +25,18 @@
:class="item.useStatus==0?'text-pink':'text-gray'">{{statusEnum[item.useStatus]}}</text>
</view>
<view class="flex-1 flex-row text-gray">
<text class="">来源：</text>
<text>{{couponSourceEnum[item.sourceType]}} {{item.platformType!==1? '('+platformEnum[item.platformType]+')' : ''}}</text>
<view class="flex-1 flex-row-center">
<text class="text-gray">来源：</text>
<text class="text-gray">{{couponSourceEnum[item.sourceType]}} {{item.platformType!==1? '('+platformEnum[item.platformType]+')' : ''}}</text>
<text class="text-title margin-left-sm text-sm">(原价:￥{{item.originalPrice}})</text>
</view>
<view v-if=" [4,5].includes(item.couponType) " class="flex-1 flex-row text-gray ">
<view v-if="item.couponType == 3" class="flex-1 flex-row text-gray ">
<text class="">使用说明：</text>
<text>{{item.remark || ''}}</text>
<text class="">满{{item.minPrice}}元，优惠{{item.subPrice}}元</text>
</view>
<view v-else class="flex-1 flex-row text-gray ">
<text class="">使用说明：</text>
<text class="">满{{item.minPrice}}元，优惠{{item.subPrice}}元</text>
<text >{{item.remark || '' }}</text>
</view>
<view v-if="item.couponTimeStart && item.couponTimeEnd" class="flex-1 des text-gray ">
<view class="flex-row">
......@@ -63,6 +64,7 @@
<text>适用门店：全门店通用</text>
</view>
<view class="">
<button class="cu-btn bg-pink sm" @tap="onNavToHome(1)">去使用</button>
</view>
</view>
<view v-else-if="item.useStatus===1&&item.storeName" class="flex-between part-bottom-store">
......@@ -70,6 +72,7 @@
<text>使用门店：{{item.storeName}}</text>
</view>
<view class="">
<button class="cu-btn bg-pink sm" @tap="onNavToHome(2)">去使用</button>
</view>
</view>
</view>
......@@ -277,6 +280,14 @@
this.list = []
this.onLoading()
},
onNavToHome(val) {
if(val ===2){
uni.setStorageSync("storeId", this.list[0].storeId)
}
uni.switchTab({
url: `/pages/index/index`
})
},
}
}
</script>
......
pages/order/order.vue
......@@ -215,48 +215,84 @@
</view>
<view v-if="userInfo && (secondaryCardList.length || monthlyCardList.length)" class="flex-col card-use">
<text class="text-black text-left">专属权益</text>
<view class="radio-group-box">
<view class="flex-between" @tap="onShowMorePayWay">
<text class="text-black text-left">钱包支付</text>
<view class="flex-row-center">
<text class="cuIcon-right" :class="showMorePayWay? 'show-more-pay-way':''"></text>
</view>
</view>
<view class="radio-group-box" :class="showMorePayWay? 'radio-group-box-height':''">
<radio-group class="radio-group">
<label v-if="secondaryCardList.length" class="flex-between" @tap="onRadioChange('secondaryCard')">
<view class="flex-row-center">
<text>{{secondaryCard.name}}(剩余{{secondaryCard.number}}次)</text>
<label v-if="Number(computePriceInfo.availableBalance)" class="flex-between" @tap="onRadioChange('availableBalance')">
<view class="flex-1 flex-between">
<view class="flex-row-center">
<text>余额: <text class="text-pink text-bold">￥{{computePriceInfo.availableBalance}}</text> 可用</text>
</view>
<view class="flex-row-center margin-right-sm">
<text>{{userInfo.memberConfig.levelName}}: <text class="text-pink text-bold">{{userInfo.memberConfig.discountRatio}}</text> 折</text>
</view>
</view>
<view class="flex-row-center" >
<text>请选择</text>
<radio class='pink radio' :class="radioChecked=='secondaryCard'?'checked':''" value="secondaryCard" :checked="radioChecked=='secondaryCard'?true:false" style="transform:scale(0.7)" />
<!-- <text>请选择</text> -->
<radio class='pink radio' :class="radioChecked=='availableBalance'?'checked':''" value="availableBalance" :checked="radioChecked == 'availableBalance'?true:false" style="transform:scale(0.7)" />
</view>
</label >
<label v-if="monthlyCardList.length" class="flex-between" @tap="onRadioChange('monthlyCard')">
<view class="flex-row-center">
<text>{{monthlyCardList[0].confName}}</text>
<text>{{monthlyCardList[0].confName}}:</text>
<text class="text-pink text-bold">{{monthlyCardList[0].freeDuration}}</text>
<text>小时可用</text>
</view>
<view class="flex-row-center" >
<text>请选择</text>
<!-- <text>请选择</text> -->
<radio class='pink radio' :class="radioChecked=='monthlyCard'?'checked':''" value="monthlyCard" :checked="radioChecked == 'monthlyCard'?true:false" style="transform:scale(0.7)" />
</view>
</label >
<label v-if="secondaryCardList.length" class="flex-between" @tap="onRadioChange('secondaryCard')">
<view class="flex-row-center">
<text>{{secondaryCard.name}}:剩 <text class="text-pink text-bold">{{secondaryCard.number}}</text> 次可用</text>
</view>
<view class="flex-row-center" >
<!-- <text>请选择</text> -->
<radio class='pink radio' :class="radioChecked=='secondaryCard'?'checked':''" value="secondaryCard" :checked="radioChecked=='secondaryCard'?true:false" style="transform:scale(0.7)" />
</view>
</label >
<label v-if="computePriceInfo && computePriceInfo.availableDuration" class="flex-between" @tap="onRadioChange('availableDuration')">
<view class="flex-1 flex-between">
<view class="flex-row-center">
<text>时长: <text class="text-pink text-bold">{{Number(computePriceInfo.availableDuration).toFixed(1)}}</text>小时可用</text>
</view>
</view>
<view class="flex-row-center" >
<!-- <text>请选择</text> -->
<radio class='pink radio' :class="radioChecked=='availableDuration'?'checked':''" value="availableDuration" :checked="radioChecked == 'availableDuration'?true:false" style="transform:scale(0.7)" />
</view>
</label >
</radio-group>
</view>
</view>
<view v-if="userInfo && !secondaryCardList.length && !monthlyCardList.length" class="flex-between price use-coupon-box">
<view class="flex-between price use-coupon-box">
<text
class="text-black text-left">{{useCouponList[selectCouponIndex].couponType==2? '团购券':'优惠券'}}</text>
<view class="flex-1 flex-row" @tap="onNavToSelectCoupon">
<text class="" :class="useCouponList.length?'text-pink':'text-gray'">
{{ useCouponList.length && selectCouponIndex>=0? useCouponList[selectCouponIndex].name: couponList.length? '请选择':'暂无可用'}}</text>
{{ useCouponList.length && selectCouponIndex>=0? useCouponList[selectCouponIndex].name: useCouponList.length? '请选择':'暂无可用'}}</text>
<text class="cuIcon-right " :class="useCouponList.length?'text-pink':'text-gray'"></text>
</view>
</view>
<view v-if="userInfo && !secondaryCardList.length && !monthlyCardList.length" class="flex-between price">
<!-- <view v-if="userInfo && !radioChecked" class="flex-between price">
<text class="text-black text-left">可用时长</text>
<view class="flex-row">
<text class="text-pink text-lg text-bold">{{computePriceInfo && computePriceInfo.availableDuration? Number(computePriceInfo.availableDuration).toFixed(1) : 0}}</text>
<text class="text-pink">小时</text>
</view>
</view>
</view> -->
<view v-if="computePriceInfo.duration" class="flex-between price">
<text class="text-black text-left">时长抵扣</text>
<view class="flex-row">
......@@ -270,13 +306,13 @@
<text class="text-pink">优先使用钱包余额</text>
</view>
</view>
<view v-if="computePriceInfo.availableBalance" class="flex-between price">
<!-- <view v-if="computePriceInfo.availableBalance" class="flex-between price">
<text class="text-black text-left">可用余额</text>
<view class="flex-row">
<text class="text-pink">￥</text>
<text class="text-pink text-lg text-bold">{{computePriceInfo.availableBalance}}</text>
</view>
</view>
</view> -->
<view v-if="computePriceInfo.balance" class="flex-between price">
<text class="text-black text-left">余额抵扣</text>
<view class="flex-row">
......@@ -615,7 +651,7 @@
warnTip:'',
activityDate:{},
storeCleanDuration: getSysConfigValue('StoreCleanDuration')? Number(getSysConfigValue('StoreCleanDuration')):30,
radioChecked:'',
radioChecked:'availableBalanceAndavailableDuration',
monthlyCardList:[],
secondaryCardList:[],
secondaryCard:{
......@@ -623,7 +659,8 @@
number: 0,
name:'次卡'
},
submitBtnStatus:false
submitBtnStatus:false,
showMorePayWay: true
};
},
filters: {
......@@ -673,6 +710,9 @@
}
},
methods: {
onShowMorePayWay(){
this.showMorePayWay = !this.showMorePayWay
},
onActiviteClose(){
this.$refs.popupActivite.close();
uni.setStorageSync('activite',true)
......@@ -683,6 +723,7 @@
}else{
this.radioChecked = e
}
this.selectCouponIndex = -1;
this.onComputePrice();
},
// 日期切换
......@@ -1316,12 +1357,12 @@
events: {
getSelectData(data) {
if (data.couponId && that.useCouponList.length) {
that.selectCouponIndex = that.useCouponList.findIndex(item => item.id === data
.couponId)
that.selectCouponIndex = that.useCouponList.findIndex(item => item.id === data.couponId);
that.radioChecked = ''
} else {
that.selectCouponIndex = -1
}
that.onQueryCardUse();
that.onComputePrice();
}
},
success(res) {
......@@ -1360,8 +1401,10 @@
if(res.data.data && res.data.data.consumerMonthlyCard && res.data.data.consumerMonthlyCard.length){
this.radioChecked = "monthlyCard";
this.selectCouponIndex = -1;
}else if(res.data.data && res.data.data.consumerSecondaryCard && res.data.data.consumerSecondaryCard.length){
this.radioChecked = "secondaryCard";
this.selectCouponIndex = -1;
}else{
this.radioChecked = ""
}
......@@ -1403,15 +1446,31 @@
storeId: this.roomInfo.storeId,
roomId: this.roomInfo.id,
buyType: this.orderTypeList[this.index].type,
couponId: this.useCouponList.length && this.selectCouponIndex >= 0 ? this.useCouponList[this.selectCouponIndex].id : '',
couponId: this.useCouponList.length && this.selectCouponIndex >= 0 && !this.radioChecked ? this.useCouponList[this.selectCouponIndex].id : '',
orderType: this.orderType,
preStartDate:this.formatAllData.startDateTime,
preEndDate: this.formatAllData.endDateTime,
orderMode: this.modeIndex2 >= 0 || (this.modeIndex>=0 && this.roomLabelList.length && this.roomLabelList[this.modeIndex].openPack==1)? 1 : 0,
packId: this.modeIndex2 >= 0 ? this.packageMode[this.modeIndex2].id : this.modeIndex>=0 && this.roomLabelList.length && this.roomLabelList[this.modeIndex].openPack==1? this.roomLabelList[this.modeIndex].packId : '',
roomLabelId :this.modeIndex >= 0 ? this.roomLabelList[this.modeIndex].id : '',
isBalance: 0,
isDuration:0
}
if( this.radioChecked === 'availableBalanceAndavailableDuration'){
params.isBalance = 1
params.isDuration = 1
}else if(this.radioChecked && ['availableBalance','availableDuration'].includes(this.radioChecked)){
if(this.radioChecked == "availableBalance"){
params.isBalance = 1
}else if(this.radioChecked == "availableDuration" && this.monthlyCardList.length){
params.isDuration = 1
}
}else {
params.isBalance = 0
params.isDuration = 0
}
if(this.radioChecked == "secondaryCard" && this.secondaryCardList.length){
params.secondaryCardId = this.secondaryCardList[0].id
}else if(this.radioChecked == "monthlyCard" && this.monthlyCardList.length){
......@@ -2903,14 +2962,28 @@
padding: 15upx 30upx;
.radio-group-box{
width: 100%;
height: 0;
margin-top: 15upx;
border-radius: 12upx;
padding: 15upx 24upx;
box-shadow: 0 0 12upx rgba(255, 170, 255, 0.8);
border-radius: 4upx;
padding: 0 24upx;
border: 1upx solid transparent;
box-shadow: 0 0 12upx transparent inset;
transition: all 0.5s;
overflow: hidden;
.radio-group{
width: 100%;
margin: 20upx 0;
}
}
.radio-group-box-height{
height: auto;
border-color: rgba(255, 170, 255, 0.8) ;
box-shadow: 0 0 12upx rgba(255, 170, 255, 0.8) inset;
}
.cuIcon-right{
transition: all 0.5s;
}
}
.activite-box{
width: 92vw;
......@@ -2930,4 +3003,8 @@
font-size: 80upx;
}
}
.show-more-pay-way{
transform-origin: center center;
transform: rotate(90deg);
}
</style>
\ No newline at end of file
pages/useCoupon/index.vue
......@@ -8,18 +8,19 @@
<view class="coupon-name">
<text class="text-title text-lg text-bold">{{item.name}}</text>
</view>
<view v-if="item.couponType == 4" class="flex-row margin-top">
<view v-if="item.couponType == 2" class="flex-row margin-top">
<text class="part-tip">使用说明：</text>
<text>{{item.remark || ''}}</text>
<text>原价:{{item.originalPrice}}元，{{item.storeName}}门店核验</text>
</view>
<view v-else class="flex-row margin-top">
<view v-else-if="item.couponType == 3" class="flex-row margin-top">
<text class="part-tip">使用说明：</text>
<text class="">满{{item.minPrice}}元，优惠{{item.subPrice}}元</text>
</view>
<!-- <view class="flex-row margin-top">
<text class="text-black">使用说明：</text>
<text class="text-black">满{{item.minPrice}}元，优惠{{item.subPrice}}元</text>
</view> -->
<view v-else class="flex-row margin-top">
<text class="part-tip">使用说明：</text>
<text v-if="item.remark">{{item.remark }}</text>
<text v-else>原价￥{{item.originalPrice}}，可进行抵扣</text>
</view>
<view v-if="item.couponTimeStart && item.couponTimeEnd" class="des margin-top">
<view class="flex-row">
<text class="text-black">可用时段：</text>
......@@ -206,7 +207,7 @@
padding: 20upx 30upx;
z-index: 44;
.part-tip{
width: 160upx;
}
}
.part-bottom{
......
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