会员相关功能更新
This commit is contained in:
GaoHao
353
pages/user/coupon - 副本.vue
Normal file
353
pages/user/coupon - 副本.vue
Normal file
@@ -0,0 +1,353 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="towcontent">
|
||||
<view class="towcontentlistxitem flex-start">
|
||||
<view class="towcontentlistxitembox flex-colum"
|
||||
:class="towcontentclickindex == index?'towcontentlistxitemboxopacity':''"
|
||||
v-for="(item,index) in listbox" :key="index" @click="towcontentclick(index,item)">
|
||||
<text>{{item.name}}</text>
|
||||
<image v-if="towcontentclickindex == index"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/dg.png" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="containertop">
|
||||
<view class="containertopbox">
|
||||
<view class="containertopboxitem flex-start" v-for="(item,index) in list" :key="index">
|
||||
<view class="containertopboxitemleft flex-colum"
|
||||
:class="item.status == 0?'':'containertopboxitemlefts'">
|
||||
<view class="containertopboxitemleft_one"
|
||||
:class="item.status == 0?'':'containertopboxitemleft_ones'">
|
||||
<text style="font-size: 28rpx;">￥</text>
|
||||
<text>{{item.couponsAmount || 0}}</text>
|
||||
</view>
|
||||
<view class="containertopboxitemleft_tow"
|
||||
:class="item.status == 0?'':'containertopboxitemleft_tows'">
|
||||
优惠券(元)
|
||||
</view>
|
||||
</view>
|
||||
<view class="containertopboxitemright">
|
||||
<view class="containertopboxitemright_one">
|
||||
无门槛使用
|
||||
</view>
|
||||
<view class="containertopboxitemright_tow">
|
||||
通用红包券
|
||||
</view>
|
||||
<view class="containertopboxitemright_there">
|
||||
有效期至：{{$u.timeFormat(item.endTime, 'yyyy/mm/dd') || '0'}}
|
||||
</view>
|
||||
<view
|
||||
:class="item.status == 0?'containertopboxitemright_four':'containertopboxitemright_fours'">
|
||||
{{item.status == 0 ? '兑换积分':'已过期'}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<image style="margin:32rpx auto;" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png"
|
||||
v-if="is_end" mode="aspectFill"></image>
|
||||
<u-loadmore :status="form.status" iconSize='24' fontSize='24' height='40' />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
listbox: [{
|
||||
name: '全部',
|
||||
type: ''
|
||||
},
|
||||
{
|
||||
name: '未使用',
|
||||
type: '0'
|
||||
},
|
||||
{
|
||||
name: '已过期',
|
||||
type: '1'
|
||||
}
|
||||
],
|
||||
towcontentclickindex: 0,
|
||||
list: [],
|
||||
is_end:false,
|
||||
form: {
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore',
|
||||
statuses: ''
|
||||
},
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.ordermineCouponsthis()
|
||||
},
|
||||
onReachBottom() {
|
||||
this.ordermineCouponsthis()
|
||||
},
|
||||
methods: {
|
||||
init_fn(e) {
|
||||
this.list = []
|
||||
this.form = {
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore',
|
||||
statuses: ''
|
||||
}
|
||||
try {
|
||||
if (e) {
|
||||
this.form.statuses = e
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
this.ordermineCouponsthis()
|
||||
},
|
||||
async ordermineCouponsthis() {
|
||||
try {
|
||||
let res = await this.api.ordermineCoupons({
|
||||
userId: uni.cache.get('userInfo').id,
|
||||
status: this.form.statuses,
|
||||
page: this.form.page,
|
||||
size: this.form.size,
|
||||
orderId:""
|
||||
})
|
||||
if (res.data.pages < this.form.page) {
|
||||
this.form.status = 'nomore'
|
||||
if (this.form.page == 1 && res.data.list == 0) {
|
||||
this.is_end = true
|
||||
}
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res.data.list];
|
||||
this.form.status = 'loading';
|
||||
if (res.data.pageNum == res.data.pages) {
|
||||
this.form.status = 'nomore';
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
towcontentclick(index, item) {
|
||||
this.towcontentclickindex = index
|
||||
this.form.statuses = item.type
|
||||
this.init_fn(item.type)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
.towcontent {
|
||||
padding: 0 28rpx;
|
||||
border-top: 16rpx solid #F9F9F9;
|
||||
|
||||
.towcontentlistxitem {
|
||||
width: 100%;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.towcontentlistxitembox {
|
||||
width: 33%;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
|
||||
image {
|
||||
margin-top: 6rpx;
|
||||
width: 38.83rpx;
|
||||
height: 8.62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentlistxitemboxopacity {
|
||||
width: 33%;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
|
||||
image {
|
||||
width: 38.83rpx;
|
||||
height: 8.62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.containertop {
|
||||
padding: 40rpx 32rpx;
|
||||
|
||||
.containertopbox {
|
||||
.containertopboxitem::after {
|
||||
position: absolute;
|
||||
bottom: 14rpx;
|
||||
left: 14rpx;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/coupontop.png) no-repeat;
|
||||
width: 72.83rpx;
|
||||
height: 77.14rpx;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.containertopboxitem {
|
||||
margin-top: 20rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
.containertopboxitemleft {
|
||||
position: relative;
|
||||
width: 182rpx;
|
||||
height: 192rpx;
|
||||
background: #F1CB66;
|
||||
border-radius: 18rpx 0rpx 0rpx 18rpx;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
|
||||
::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
left: 166rpx;
|
||||
background: #f9f9f9;
|
||||
display: inline-block;
|
||||
width: 32rpx;
|
||||
height: 16rpx;
|
||||
border-radius: 0 0 32rpx 32rpx;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
left: 166rpx;
|
||||
background: #f9f9f9;
|
||||
display: inline-block;
|
||||
width: 32rpx;
|
||||
height: 16rpx;
|
||||
line-height: 32rpx;
|
||||
border-radius: 32rpx 32rpx 0 0;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
|
||||
z-index: 999;
|
||||
|
||||
}
|
||||
|
||||
.containertopboxitemleft_one {
|
||||
text {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 60rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft_ones {
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft_tow {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.containertopboxitemleft_tows {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemlefts {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.containertopboxitemright {
|
||||
position: relative;
|
||||
padding: 0 32rpx;
|
||||
flex: auto;
|
||||
height: 192rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
border-radius: 0rpx 18rpx 18rpx 0rpx;
|
||||
|
||||
.containertopboxitemright_one {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
padding: 12rpx 0;
|
||||
border-bottom: 1rpx dotted #707070;
|
||||
}
|
||||
|
||||
.containertopboxitemright_tow {
|
||||
margin-top: 14rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.containertopboxitemright_there {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.containertopboxitemright_four {
|
||||
position: absolute;
|
||||
right: 32rpx;
|
||||
top: 50%;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
padding: 0 14rpx;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
text-align: center;
|
||||
background: #FE665E;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.containertopboxitemright_fours {
|
||||
position: absolute;
|
||||
right: 32rpx;
|
||||
top: 50%;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
padding: 0 14rpx;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
text-align: center;
|
||||
background: #F7F7F7;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -5,7 +5,7 @@
|
||||
<view class="towcontentlistxitembox flex-colum"
|
||||
:class="towcontentclickindex == index?'towcontentlistxitemboxopacity':''"
|
||||
v-for="(item,index) in listbox" :key="index" @click="towcontentclick(index,item)">
|
||||
<text>{{item.name}}</text>
|
||||
<text class="title">{{item.name}}</text>
|
||||
<image v-if="towcontentclickindex == index"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/dg.png" mode="widthFix">
|
||||
</image>
|
||||
@@ -144,7 +144,7 @@
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
@@ -152,8 +152,7 @@
|
||||
.container {
|
||||
.towcontent {
|
||||
padding: 0 28rpx;
|
||||
border-top: 16rpx solid #F9F9F9;
|
||||
|
||||
border-top: 16rpx solid #f7f7f7;
|
||||
.towcontentlistxitem {
|
||||
width: 100%;
|
||||
margin-top: 32rpx;
|
||||
@@ -176,9 +175,9 @@
|
||||
width: 33%;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
|
||||
text{
|
||||
color: #E3AD7F;
|
||||
}
|
||||
image {
|
||||
width: 38.83rpx;
|
||||
height: 8.62rpx;
|
||||
@@ -191,7 +190,6 @@
|
||||
|
||||
.containertop {
|
||||
padding: 40rpx 32rpx;
|
||||
|
||||
.containertopbox {
|
||||
.containertopboxitem::after {
|
||||
position: absolute;
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">生日</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="place r" @click="calendarShow = true">生日一旦填写不能修改</view>
|
||||
<view class="place r" @click="calendarShow = (birthDay ? false : true)"> {{ birthDay || '生日一旦填写不能修改'}}</view>
|
||||
<!-- <u-calendar @close="calendarShow = false" monthNum="99" minDate="1945-01-01" maxDate="2055-12-12" :show="calendarShow" mode="single" @confirm="confirmCalendar"></u-calendar> -->
|
||||
<!-- <u-picker :show="calendarShow" ref="uPicker" :columns="columns" @confirm="confirm" @change="changeHandler"></u-picker> -->
|
||||
<!-- <picker :show="calendarShow" mode="date"></picker> -->
|
||||
@@ -95,7 +95,7 @@
|
||||
label: '男'
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
value: 0,
|
||||
label: '女'
|
||||
},]
|
||||
],
|
||||
@@ -103,6 +103,7 @@
|
||||
userInfo: uni.cache.get('userInfo'),
|
||||
userHeadImg: "",
|
||||
nickName: '',
|
||||
birthDay: "",
|
||||
phonetitle: ""
|
||||
};
|
||||
},
|
||||
@@ -114,6 +115,10 @@
|
||||
this.userHeadImg = this.userInfo.headImg;
|
||||
this.nickName = this.userInfo.nickName;
|
||||
this.sex = this.userInfo.sex;
|
||||
if ( this.userInfo.sex != null ) {
|
||||
this.sexText = this.userInfo.sex == 1 ? '男' : '女';
|
||||
}
|
||||
this.birthDay = this.userInfo.birthDay;
|
||||
this.phonetitle = this.userInfo.telephone ? (this.userInfo.telephone.substr(0, 3) + "****" + this.userInfo.telephone.substr(7)) : ""
|
||||
this.date = this.getDate({ format: true})
|
||||
},
|
||||
@@ -125,8 +130,8 @@
|
||||
* @param {Object} e
|
||||
*/
|
||||
confirmTime(e) {
|
||||
console.log(e);
|
||||
console.log(this.getDate(e.value))
|
||||
this.calendarShow = false;
|
||||
this.birthDay = this.getDate(e.value);
|
||||
},
|
||||
|
||||
/**
|
||||
@@ -158,6 +163,9 @@
|
||||
* @param {Object} d
|
||||
*/
|
||||
async getPhone(d) {
|
||||
if ( this.phonetitle ) {
|
||||
return;
|
||||
}
|
||||
if (d.detail.iv) {
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
@@ -202,12 +210,7 @@
|
||||
* @param {Object} e
|
||||
*/
|
||||
uploadImg(e) {
|
||||
console.log(e)
|
||||
const {
|
||||
avatarUrl
|
||||
} = e.detail
|
||||
console.log(e)
|
||||
console.log(e.detail)
|
||||
const { avatarUrl } = e.detail
|
||||
// this.userHeadImg = avatarUrl
|
||||
uni.uploadFile({
|
||||
url: 'https://wxcashiertest.sxczgkj.cn/cashierService/common/upload',
|
||||
@@ -239,6 +242,7 @@
|
||||
headImg: this.userHeadImg,
|
||||
nickName: this.nickName,
|
||||
sex: this.sex,
|
||||
birthDay: this.birthDay,
|
||||
telephone: this.phonetitle == '请授权手机号' ? '' : this.phonetitle
|
||||
})
|
||||
if (res.code == 0) {
|
||||
|
||||
@@ -57,9 +57,9 @@
|
||||
teblist: [],
|
||||
myAssetsList: [
|
||||
{ name: "储值", type: "recharge", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png"},
|
||||
{ name: "积分", type: "my_coupon", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png"},
|
||||
{ name: "积分", type: "", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png"},
|
||||
{ name: "优惠券", type: "my_coupon", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/coupon.png"},
|
||||
{ name: "权益卡", type: "my_coupon", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/equityCard.png"}
|
||||
{ name: "权益卡", type: "", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/equityCard.png"}
|
||||
],
|
||||
myFunList: [
|
||||
{ name: "我的优惠券", type: "my_coupon", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_coupon.png"},
|
||||
|
||||
Reference in New Issue
Block a user