['我的资产-我的足迹']
This commit is contained in:
253
pages/property/coupon/couponMore.vue
Normal file
253
pages/property/coupon/couponMore.vue
Normal file
@@ -0,0 +1,253 @@
|
||||
<template>
|
||||
<view class="Coupon">
|
||||
<!-- 有优惠券列表 -->
|
||||
<view class="coupon-content">
|
||||
<couponTemplate v-for="(item,index) in lists" :key='index' :item="{...item}" :action="actions" />
|
||||
</view>
|
||||
|
||||
<!-- 没有优惠券列表 -->
|
||||
<no-list v-if="lists.length === 0" name='no-counpon' :txt="showTxt" />
|
||||
|
||||
<!-- <u-toast ref="uToast" /> -->
|
||||
<u-toast ref="uToast" />
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getCouponsListById
|
||||
} from '@/apis/interfaces/coupon'
|
||||
import couponTemplate from '@/components/coupon-template/coupon-template-1'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
lists:[],
|
||||
id:'',
|
||||
page:1,
|
||||
has_more:true,
|
||||
showTxt: '没有任何优惠券哦~'
|
||||
};
|
||||
},
|
||||
components: {
|
||||
couponTemplate
|
||||
},
|
||||
onLoad(e) {
|
||||
console.log(e)
|
||||
this.id = e.id
|
||||
this.getMyCoupon()
|
||||
},
|
||||
onShow() {
|
||||
if (wx.getStorageSync('refresh')) {
|
||||
this.lists = []
|
||||
this.getMyCoupon()
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.page = 1
|
||||
this.lists = []
|
||||
this.has_more = true
|
||||
this.getMyCoupon()
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.has_more) {
|
||||
this.page = this.page + 1
|
||||
this.getMyCoupon()
|
||||
} else {
|
||||
this.$refs.uToast.show({
|
||||
title: '吼吼吼~我是有底的~',
|
||||
type: 'primary',
|
||||
duration: 3000
|
||||
})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getMyCoupon() {
|
||||
let id = this.id
|
||||
let data={
|
||||
page:this.page,
|
||||
pageSize:4
|
||||
}
|
||||
getCouponsListById(id,data).then(res => {
|
||||
console.log(res)
|
||||
this.lists = this.lists.concat(res.data)
|
||||
if (res.page.has_more) {
|
||||
this.has_more = true
|
||||
} else {
|
||||
this.has_more = false
|
||||
}
|
||||
uni.stopPullDownRefresh()
|
||||
wx.setStorageSync('refresh',false)
|
||||
}).catch(err => {
|
||||
this.$refs.uToast.show({
|
||||
title: err.message,
|
||||
type: 'primary',
|
||||
duration: 3000
|
||||
})
|
||||
})
|
||||
},
|
||||
// 选择顶部菜单
|
||||
// selectNav(id) {
|
||||
// console.log(typeof id)
|
||||
// this.showTxt = (id === 1 ? '没有领取到任何优惠券哦~' : id === 2 ? '没有使用过任何优惠券哦~' : '没有任何过期优惠券哦~')
|
||||
// if (id !== this.selectNavId) {
|
||||
// this.selectNavId = id
|
||||
// this.page = 1
|
||||
// this.lists = []
|
||||
// this.has_more = true
|
||||
// this.getMyCoupon()
|
||||
// }
|
||||
// },
|
||||
// 切换商品分类
|
||||
selectNav(id) {
|
||||
console.log(id)
|
||||
this.selectNavId = id
|
||||
this.getMyCoupon()
|
||||
// if (this.selectCategoryId !== id) {
|
||||
// this.goodsList = []
|
||||
// this.has_more = true
|
||||
// this.page = 1
|
||||
// this.getGoodsByCompanyidCaregoryid()
|
||||
// }
|
||||
},
|
||||
selectCategory(id) {
|
||||
console.log(id)
|
||||
this.selectCategoryId = id
|
||||
this.getMyCoupon()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.Coupon {
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
background-color: #F7F7F7;
|
||||
|
||||
.coupon-nav {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
padding: 30rpx 60rpx 0 60rpx;
|
||||
color: #cacaca;
|
||||
|
||||
.nav-item {
|
||||
padding: 20rpx 30rpx 30rpx 30rpx;
|
||||
border-bottom: solid 4rpx #fff;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.nav-item-select {
|
||||
border-bottom: solid 6rpx $main-color;
|
||||
color: $main-color;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-top {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
|
||||
.scroll-view_H {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
box-sizing: border-box;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
padding: 30rpx 30rpx 0 30rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.scroll-view-item_H {
|
||||
margin-right: 60rpx;
|
||||
padding: 20rpx 0 40rpx 0;
|
||||
// height: 100rpx;
|
||||
display: inline-block;
|
||||
min-width: 120rpx;
|
||||
font-size: 28rpx;
|
||||
border-bottom: #fff;
|
||||
background-color: #fff;
|
||||
transition: .1s;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.scroll-view-item_H_selected {
|
||||
// border-bottom: solid $main-color 4rpx;
|
||||
color: $main-color;
|
||||
font-weight: bold;
|
||||
// font-size: 36rpx;
|
||||
// transition: .3s;
|
||||
text-shadow: 6rpx 8rpx 30rpx rgba($color: $main-color, $alpha: .5);
|
||||
position: relative;
|
||||
|
||||
&:after {
|
||||
// content: '';
|
||||
// position: absolute;
|
||||
// bottom: 10rpx;
|
||||
// left: 0;
|
||||
// height: 8rpx;
|
||||
// width: 100%;
|
||||
// background-color: $main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-view_H-1 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
box-sizing: border-box;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
padding: 0 30rpx 30rpx 30rpx;
|
||||
background-color: #fff;
|
||||
// position: sticky;
|
||||
// top: 100rpx;
|
||||
// z-index: 1000;
|
||||
|
||||
.scroll-view-item_H-1 {
|
||||
display: inline-block;
|
||||
min-width: 120rpx;
|
||||
font-size: 24rpx;
|
||||
border-bottom: #fff;
|
||||
background-color: #f7f7f7;
|
||||
margin-left: 20rpx;
|
||||
padding: 10rpx 30rpx;
|
||||
text-align: center;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.scroll-view-item_H_selected-1 {
|
||||
// border-bottom: solid $main-color 4rpx;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
background-image: linear-gradient(to left, $main-color, $main-color-light);
|
||||
// font-size: 36rpx;
|
||||
// transition: .3s;
|
||||
// text-shadow: 6rpx 8rpx 30rpx rgba($color: $main-color, $alpha: .5);
|
||||
position: relative;
|
||||
|
||||
&:after {
|
||||
// content: '';
|
||||
// position: absolute;
|
||||
// bottom: 10rpx;
|
||||
// left: 0;
|
||||
// height: 8rpx;
|
||||
// width: 100%;
|
||||
// background-color: $main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user