118 lines
3.4 KiB
Vue
118 lines
3.4 KiB
Vue
<template>
|
|
<view v-if="isLoading">
|
|
<status-nav :ifReturn="true" navBarTitle="优惠券" :marginBottom="0"></status-nav>
|
|
<!-- 优惠券 -->
|
|
<view class="record-nav border-box flex" style="background-color: #f5f5f5;padding: 40rpx 20rpx;margin: 0;">
|
|
<view class="item color-8c radius20 border-box" :class="index==navIndex?'cur':''" v-for="(item,index) in navList" :key="index" @tap="changeNav(index)">{{item.title}}</view>
|
|
</view>
|
|
<!-- 优惠券列表 -->
|
|
<view class="coupon-list pad-zy20 border-box">
|
|
<view class="coupon-item radius30 mar-s40 flex" :class="navIndex==2?'grey':''" v-for="(item,index) in couponList" :key="index">
|
|
<view class="price color-ff border-box"><text class="font30">￥</text>{{item.amount.split(".")[0]}}<text class="font30">{{'.'+item.amount.split(".")[1]}}</text></view>
|
|
<view class="txt">
|
|
<view class="font36">{{item.name}}</view>
|
|
<view class="font24 color-8c mar-s10">满{{parseInt(item.condition)}}减{{parseInt(item.amount)}}</view>
|
|
<view class="font24 color-8c mar-s10">{{item.begin_at}}至{{item.end_at}}</view>
|
|
</view>
|
|
<view class="btn mar-zy20 color-ff font24" v-if="navIndex==0" @tap="useEv">使用</view>
|
|
<view class="btn mar-zy20 color-ff font24" v-if="navIndex==1" @tap="receiveEv(item.id,index)">领取</view>
|
|
</view>
|
|
</view>
|
|
<!-- 到底啦 -->
|
|
<view class="no-more font24" v-if="noMore" style="margin-top: 20rpx;"><text>—— 到底啦 ——</text></view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
navList:[
|
|
{title:'已领取',tag:'normal'},
|
|
{title:'可领取',tag:'waiting'},
|
|
{title:'已过期',tag:'invalid'}
|
|
], //导航数据
|
|
navIndex:0, //导航位置
|
|
couponList:[], //优惠券列表
|
|
page:1,
|
|
size:10,
|
|
noMore:false,
|
|
isLoading:false,
|
|
}
|
|
},
|
|
onLoad(op) {
|
|
if(op.index){
|
|
this.navIndex = op.index;
|
|
}
|
|
},
|
|
onShow() {
|
|
this.getCouponEv();
|
|
},
|
|
onReachBottom() {
|
|
if(!this.noMore){
|
|
this.page++;
|
|
// 查询优惠券
|
|
this.getCouponEv();
|
|
}
|
|
},
|
|
methods: {
|
|
// 查询优惠券
|
|
getCouponEv(){
|
|
uni.showLoading({
|
|
title:'加载中'
|
|
})
|
|
let params = {
|
|
page:this.page,
|
|
size:this.size,
|
|
status:this.navList[this.navIndex].tag
|
|
}
|
|
this.$requst.post('/api/user/get-coupon-list',params).then(res=>{
|
|
if(res.code == 0){
|
|
console.log(res,'优惠券列表');
|
|
if(res.data.length == 0){
|
|
this.noMore = true;
|
|
}
|
|
this.couponList = this.couponList.concat(res.data);
|
|
}
|
|
uni.hideLoading();
|
|
this.isLoading = true;
|
|
})
|
|
},
|
|
// 使用优惠券
|
|
useEv(){
|
|
// 去首页
|
|
uni.reLaunch({
|
|
url:`/pages/index/index`
|
|
})
|
|
},
|
|
// 领取优惠券
|
|
receiveEv(id,index){
|
|
this.$requst.get('/api/user/get-coupon',{coupon_id:id}).then(res=>{
|
|
if(res.code == 0){
|
|
this.$toolAll.tools.showToast('领取成功');
|
|
this.couponList.splice(index,1)
|
|
}else{
|
|
this.$toolAll.tools.showToast(res.msg);
|
|
}
|
|
})
|
|
},
|
|
// 导航切换
|
|
changeNav(index){
|
|
if(index!==this.navIndex){
|
|
this.navIndex = index;
|
|
// 清除数据
|
|
this.noMore = false;
|
|
this.couponList = [];
|
|
this.page = 1;
|
|
// 查询优惠券
|
|
this.getCouponEv();
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|