更新C端

This commit is contained in:
red-deng-deng 2021-11-27 19:05:52 +08:00
parent 77e72e5957
commit 7115f8dfce
1 changed files with 59 additions and 15 deletions

View File

@ -48,6 +48,14 @@
<div class="swiper-container"> <div class="swiper-container">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item,index) in swiperDataList" :key="index"> <div class="swiper-slide" v-for="(item,index) in swiperDataList" :key="index">
<div class="imgitemMask" v-if="item.available!=1">
<span >
<img v-if="item.available==4" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/yet.png" alt="">
<img v-if="item.available==2" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/future.png" alt="">
<img v-if="item.available==3" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/overdue.png" alt="">
<img v-if="item.available==6" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/empty.png" alt="">
</span>
</div>
<div class="imgbox"> <div class="imgbox">
<img class="le-img" :src="item.show_url" :class="item.stock&&item.stock<0?'changegray':''"></img> <img class="le-img" :src="item.show_url" :class="item.stock&&item.stock<0?'changegray':''"></img>
</div> </div>
@ -57,7 +65,7 @@
</div> </div>
</div> </div>
<!-- 立即兑换 --> <!-- 立即兑换 -->
<div class="exchangeBtn" :style="{'background': bgcolor,'color':'#fff'}" @click="exchangeBtn(this.proname)"> <div class="exchangeBtn" :class="gstatus!=1?'noexchangeBtn':''" :style="{'background': bgcolor,'color':'#fff'}" @click="exchangeBtn()">
立即兑换 立即兑换
</div> </div>
</div> </div>
@ -73,7 +81,8 @@
<img :src="item.show_url" alt="" :class="item.stock&&item.stock<0?'changegray':''"> <img :src="item.show_url" alt="" :class="item.stock&&item.stock<0?'changegray':''">
<font :class="item.stock&&item.stock<0?'changegray':''">{{item.product_name}}</font> <font :class="item.stock&&item.stock<0?'changegray':''">{{item.product_name}}</font>
</div> </div>
<span :style="{'background':bgcolor?bgcolor:'#F98F5B'}" @click="exchangeBtn(item)">兑换</span> <span v-if="item.available==1" :style="{'background':bgcolor?bgcolor:'#F98F5B'}" @click="exchangeBtn(item)">兑换</span>
<span v-if="item.available!=1" :style="{'background':item.available==2?'#3E8EE2':'#CCCCCC'}" @click="exchangeBtn(item)">{{item.available==2?'即将开始':item.available==3?'已过期':item.available==4?'已兑换':'已兑完'}}</span>
</li> </li>
</ul> </ul>
</div> </div>
@ -86,6 +95,12 @@
<ul class="listcommity"> <ul class="listcommity">
<li :class="item.stock&&item.stock<0?'changegray':''" v-for="(item,i) in swiperDataList" :key="i" @click="exchangeBtn(item)"> <li :class="item.stock&&item.stock<0?'changegray':''" v-for="(item,i) in swiperDataList" :key="i" @click="exchangeBtn(item)">
<div> <div>
<span class="goodsIcon">
<img v-if="item.available==4" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/yet.png" alt="">
<img v-if="item.available==2" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/future.png" alt="">
<img v-if="item.available==3" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/overdue.png" alt="">
<img v-if="item.available==6" src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/empty.png" alt="">
</span>
<img :src="item.show_url" alt=""> <img :src="item.show_url" alt="">
</div> </div>
<font>{{item.product_name}}</font> <font>{{item.product_name}}</font>
@ -118,6 +133,14 @@
<span @click="surexchangeBtn">确认兑换</span> <span @click="surexchangeBtn">确认兑换</span>
</div> </div>
</div> </div>
<!-- 弹出提示 -->
<div class="popboxshow" v-if="popboxshow&&popboxtype=='提示'" :class="popboxshow?'active':''">
<div class="tip">
<p :class="gstatus==4||gstatus==6?'yettip':''">{{tiptext}}</p>
<span @click="successchangeBtn" :class="gstatus==4||gstatus==6?'yetexchange':''">知道了</span>
</div>
</div>
<!-- 失败 --> <!-- 失败 -->
<div class="popboxshow" v-if="popboxshow&&popboxtype=='失败'" :class="popboxshow?'active':''"> <div class="popboxshow" v-if="popboxshow&&popboxtype=='失败'" :class="popboxshow?'active':''">
<div > <div >
@ -141,23 +164,25 @@
data() { data() {
return { return {
swiperDataList: [], //轮播 swiperDataList: [], //轮播
baseimgurl: 'https://lsxd-customcard-h5.oss-cn-hangzhou.aliyuncs.com/category_icon/' layout:3,
,
layout:1,
maskshow:false, maskshow:false,
proname:'黄金爱奇艺', proname:'黄金爱奇艺',
promtshow:false, promtshow:false,
promttip:'', promttip:'',
codebid:'',
account:'', account:'',
reaccount:'', reaccount:'',
product_id:'', product_id:'',
productType:1, productType:1,
placeholder:'请输入手机号', placeholder:'请输入手机号',
iptshow:false, iptshow:false,
gstatus:1,
popboxshow:false, popboxshow:false,
popboxtype:'兑换', popboxtype:'兑换',
topImg:'', topImg:'',
exchangeCommity:{},//兑换选择的商品
bgcolor:'', bgcolor:'',
tiptext:'还没开始哟兑换时间为2021-12-05 12:12:12至2021-01-01 12:12:12',
successTip:'兑换成功,请关注短信通知!' successTip:'兑换成功,请关注短信通知!'
} }
}, },
@ -166,7 +191,6 @@
this.topImg=sessionStorage.getItem('top_img'); this.topImg=sessionStorage.getItem('top_img');
// this.layout=sessionStorage.getItem('showTyle'); // this.layout=sessionStorage.getItem('showTyle');
this.swiperDataList=JSON.parse(sessionStorage.getItem('goodsList')); this.swiperDataList=JSON.parse(sessionStorage.getItem('goodsList'));
}, },
mounted() { mounted() {
let self = this; let self = this;
@ -190,6 +214,7 @@
onSelected(item) { onSelected(item) {
this.proname=item.product_name; this.proname=item.product_name;
this.product_id=item.product_id; this.product_id=item.product_id;
this.exchangeCommity=item;
}, },
// 单条弹框 // 单条弹框
openDialog() { openDialog() {
@ -199,13 +224,31 @@
this.promttip = ''; this.promttip = '';
}, 3000) }, 3000)
}, },
//兑换 //选择商品点击兑换
exchangeBtn(row){ exchangeBtn(row=this.exchangeCommity){
this.codebid=row.code_batch_id;
let gstatus=row.available;
this.gstatus=gstatus;
if(gstatus==1){
this.maskshow=true; this.maskshow=true;
this.iptshow=true; this.iptshow=true;
this.proname=row.product_name; this.proname=row.product_name;
this.product_id=row.product_id; this.product_id=row.product_id;
this.productType=row.product_type; this.productType=row.product_type;
}else{
this.maskshow=true;
this.popboxshow=true;
this.popboxtype='提示';
if(gstatus==2){//未开始
this.tiptext='还没开始哟,兑换时间为'+row.begin_time+'至'+row.end_time;
}else if(gstatus==3){//已结束
this.tiptext='兑换码已过期,兑换时间为'+row.begin_time+'至'+row.end_time;
}else if(gstatus==4){//仅兑换一次
this.tiptext='亲,仅可兑换一次哦!';
}else if(gstatus==6){//无库存
this.tiptext='暂无库存,看看其他商品吧~';
}
}
}, },
//取消 //取消
cancelBtn(){ cancelBtn(){
@ -264,6 +307,7 @@
"key":sessionStorage.getItem('key'), "key":sessionStorage.getItem('key'),
"product_id":this.product_id, "product_id":this.product_id,
"account":this.account, "account":this.account,
"code_batch_id":this.codebid
} }
req.axiosPostusage('/key/usage',data).then(res=>{ req.axiosPostusage('/key/usage',data).then(res=>{
if(res.code==200){ if(res.code==200){
@ -307,7 +351,7 @@
} else { } else {
this.placeholder = "请输入手机号或QQ号"; this.placeholder = "请输入手机号或QQ号";
} }
} },
}, },
}); });
</script> </script>