TmOct5/BlockChainH5
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

更新

Browse Source
This commit is contained in:
zhangmanman
2021-09-30 13:58:17 +08:00
parent 7ef9ad26ac
commit 341286a42e
2 changed files with 70 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
pages/user/index.vue
View File

@@ -56,13 +56,13 @@
<view class="userVip" :class="{ animated: animatedShow }"> <view class="userVip" :class="{ animated: animatedShow }">
<view class="userVip-top"> <view class="userVip-top">
<view class="userVip-top-name" v-if="userIdentity.right"> <view class="userVip-top-name" v-if="userIdentity.right">
开通{{userIdentity.right.name}}。 {{ userData.identity.id == 1 ? '开通' + userIdentity.right.name : '到期时间：' + userIdentity.times.ended_at}}
</view> </view>
<view class="userVip-top-btn" v-if="!userIdentity.is_top" @click="$Router.push({name: 'vipIndex'})"> <view class="userVip-top-btn" v-if="userData.identity.id != 5" @click="openVip(userIdentity.right.identity_id)">
去开通<image class="userVip-top-arrow" src="/static/user/userVip_arrow.png"></image> {{ userData.identity.id == 1 ? '去开通' : '去升级'}}<image class="userVip-top-arrow" src="/static/user/userVip_arrow.png"></image>
</view> </view>
<view class="userVip-top-btn" v-else> <view class="userVip-top-btn" v-else>
终身有效 已达成满级
</view> </view>
</view> </view>
@@ -275,6 +275,26 @@ export default {
this.animatedShow = false this.animatedShow = false
}, },
methods: { methods: {
// 开通VIP
openVip(identityId){
if(!this.userData.certification){
uni.showModal({
title: '提示',
content: '为了保障您的用户权益，未个人认证无法开通节点',
cancelColor: '#555',
cancelText: '稍后开通',
confirmColor: '#8b64fd',
confirmText: '去认证',
success: res => {
if(res.confirm){
this.$Router.push({name: 'Personal'})
}
}
})
return
}
this.$Router.push({name: 'vipIndex', params:{identity_id: identityId}})
},
// 用户信息 // 用户信息
userInfo() { userInfo() {
// 读取配置信息 // 读取配置信息
@@ -382,10 +402,10 @@ export default {
this.moving = false this.moving = false
return return
}else{ }else{
if (moveDistance > 0 && moveDistance <= 120) { if (moveDistance > 0 && moveDistance <= 130) {
this.coverTransform = `translateY(${moveDistance}px)` this.coverTransform = `translateY(${moveDistance}px)`
} }
this.moving = moveDistance >= 120 this.moving = moveDistance >= 130
} }
}, },
coverTouchend() { coverTouchend() {
@@ -398,7 +418,7 @@ export default {
}, },
runRefresh() { runRefresh() {
this.coverTransition = 'transform .1s linear' this.coverTransition = 'transform .1s linear'
this.coverTransform = 'translateY(120px)' this.coverTransform = 'translateY(130px)'
this.playState = true this.playState = true
this.$emit('refresh') this.$emit('refresh')
} }
@@ -618,21 +638,21 @@ export default {
// 会员信息 // 会员信息
.header { .header {
background-image: linear-gradient(to right, #7c52fc, #976dff); background-image: linear-gradient(to right, #7c52fc, #976dff);
height: 628rpx; height: 314px;
// user工具 // user工具
.user-tool { .user-tool {
text-align: right; text-align: right;
line-height: 80rpx; line-height: 40px;
.user-tool-name { .user-tool-name {
flex: 1; flex: 1;
line-height: 80rpx; line-height: 40px;
text-align: left; text-align: left;
color: #fff; color: #fff;
font-size: 28rpx; font-size: 28rpx;
} }
.user-tool-icon { .user-tool-icon {
padding-right: $padding; padding-right: $padding;
margin-top: 20rpx; margin-top: 10px;
width: $uni-img-size-sm; width: $uni-img-size-sm;
height: $uni-img-size-sm; height: $uni-img-size-sm;
vertical-align: top; vertical-align: top;
@@ -642,24 +662,24 @@ export default {
.user-info { .user-info {
position: relative; position: relative;
width: 100%; width: 100%;
height: 140rpx; height: 70px;
box-sizing: border-box; box-sizing: border-box;
padding-left: $padding; padding-left: $padding;
padding-right: $padding; padding-right: $padding;
color: $uni-text-color-inverse; color: $uni-text-color-inverse;
.user-portrait { .user-portrait {
width: 140rpx; width: 70px;
height: 140rpx; height: 70px;
border-radius: $uni-border-radius-circle; border-radius: $uni-border-radius-circle;
position: relative; position: relative;
.user-portrait-head { .user-portrait-head {
border-radius: $uni-border-radius-circle; border-radius: $uni-border-radius-circle;
border: 4rpx solid #bfaaff; border: 4rpx solid #bfaaff;
position: absolute; position: absolute;
left: 8rpx; left: 4px;
top: 14rpx; top: 7px;
width: calc(100% - 24rpx); width: calc(100% - 12px);
height: calc(100% - 24rpx); height: calc(100% - 12px);
} }
.user-portrait-tips { .user-portrait-tips {
position: absolute; position: absolute;
@@ -672,14 +692,14 @@ export default {
z-index: 2; z-index: 2;
position: absolute; position: absolute;
left: 50%; left: 50%;
bottom: -20rpx; bottom: -10px;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
background:linear-gradient(to right, #211d1e,#4b403c); background:linear-gradient(to right, #211d1e,#4b403c);
color: $uni-text-color-inverse; color: $uni-text-color-inverse;
font-size: $uni-font-size-sm; font-size: $uni-font-size-sm;
border-radius: $radius; border-radius: $radius;
height: 30rpx; height: 15px;
line-height: 30rpx; line-height: 15px;
width: 64rpx; width: 64rpx;
text-align: center; text-align: center;
text { text {
@@ -698,29 +718,29 @@ export default {
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 0 0 0 calc(#{$uni-img-size-lg + 20} + (#{$padding * 2} + 10rpx)); padding: 0 0 0 calc(#{$uni-img-size-lg + 20} + (#{$padding * 2} + 5px));
box-sizing: border-box; box-sizing: border-box;
.user-name { .user-name {
display: flex; display: flex;
margin: 30rpx 0 5rpx; margin: 15px 0 2.5px;
font-size: 36rpx; font-size: 36rpx;
.user-name-identity { .user-name-identity {
width: 100rpx; width: 90rpx;
height: 36rpx; height: 15px;
margin: 4rpx 0 0 10rpx; margin: 5px 0 0 5px;
} }
} }
.user-status { .user-status {
opacity: .7; opacity: .7;
font-size: $title-size-sm; font-size: $title-size-sm;
display: flex; display: flex;
line-height: 46rpx; line-height: 23px;
.user-status-copy { .user-status-copy {
font-size: $title-size !important; font-size: $title-size !important;
border: 1rpx solid #FFFFFF; border: 1rpx solid #FFFFFF;
border-radius: $radius * 3; border-radius: $radius * 3;
line-height: 44rpx; line-height: 22px;
height: 46rpx; height: 23px;
transform:scale(.6); transform:scale(.6);
padding: 0 $padding + 5; padding: 0 $padding + 5;
} }
@@ -729,19 +749,19 @@ export default {
} }
// 会员卡 // 会员卡
.card { .card {
height: 200rpx; height: 100px;
margin: 0 30rpx; margin: 0 15px;
background: #555555; background: #555555;
} }
} }
// 按钮内容 // 按钮内容
.mian { .mian {
margin-top: -260rpx; margin-top: -130px;
padding: 30rpx 30rpx 30rpx; padding: 15px 30rpx 5px;
background: #F5F5F5; background: #F5F5F5;
// 我的资产模块 // 我的资产模块
.userAssets { .userAssets {
margin-bottom: 30rpx; margin-bottom: 15px;
background-color: #FFFFFF; background-color: #FFFFFF;
overflow: hidden; overflow: hidden;
border-radius: 15rpx; border-radius: 15rpx;
@@ -749,7 +769,7 @@ export default {
background-color: #fff3dc; background-color: #fff3dc;
color: #654c2d; color: #654c2d;
font-size: 28rpx; font-size: 28rpx;
padding: 20rpx; padding: 10px;
box-sizing: border-box; box-sizing: border-box;
height: 94rpx; height: 94rpx;
position: relative; position: relative;
@@ -765,13 +785,13 @@ export default {
} }
.withdraw-btn { .withdraw-btn {
position: absolute; position: absolute;
right: 20rpx; right: 10px;
top: 20rpx; top: 10px;
background-image:linear-gradient(to right, #f9c869, #eca824); background-image:linear-gradient(to right, #f9c869, #eca824);
color: #f7eedc; color: #f7eedc;
width: 140rpx; width: 140rpx;
text-align: center; text-align: center;
line-height: 54rpx; line-height: 27px;
border-radius: 80rpx; border-radius: 80rpx;
font-size: 26rpx; font-size: 26rpx;
} }
@@ -906,9 +926,9 @@ export default {
color: #5e5e5e; color: #5e5e5e;
} }
.userNew-icon { .userNew-icon {
width: 46rpx; width: 40rpx;
height: 46rpx; height: 40rpx;
margin: 22rpx 20rpx 0 0; margin: 24rpx 20rpx 0 0;
} }
} }
} }

10
pages/vip/vip.vue
View File

@@ -9,7 +9,7 @@
<view class="canPop-btn" @click="canSubmit">提交</view> <view class="canPop-btn" @click="canSubmit">提交</view>
</view> </view>
<swiper class="vip-container" previous-margin="55rpx" next-margin="55rpx" circular @change="swiperChange"> <swiper class="vip-container" previous-margin="55rpx" next-margin="55rpx" :current="tabsIndex" circular @change="swiperChange">
<swiper-item class="swiper-item" v-for="(item, index) in identitie" :key="index"> <swiper-item class="swiper-item" v-for="(item, index) in identitie" :key="index">
<view class="vip-item" :class="tabsIndex == index ? 'color-item-img' : ''"> <view class="vip-item" :class="tabsIndex == index ? 'color-item-img' : ''">
<image class="vip-back" :src="item.card_cover" mode="scaleToFill"></image> <image class="vip-back" :src="item.card_cover" mode="scaleToFill"></image>
@@ -124,11 +124,12 @@ export default {
}, },
created() { created() {
// 获取当前用户信息 // 获取当前用户信息
this.idenInfo(); this.idenInfo('cre');
}, },
methods: { methods: {
// 当前用户信息 // 当前用户信息
idenInfo() { idenInfo(type) {
identities().then(res => { identities().then(res => {
res.identities.map(item => { res.identities.map(item => {
item.obj_condition = new Object(); item.obj_condition = new Object();
@@ -141,6 +142,9 @@ export default {
return item; return item;
}); });
this.identitie = res.identities; this.identitie = res.identities;
if(type === 'cre'){
this.tabsIndex = res.identities.findIndex(val => val.identity_id == this.$Route.query.identity_id)
}
this.openCondition = res.identities[this.tabsIndex].obj_condition; this.openCondition = res.identities[this.tabsIndex].obj_condition;
this.rights = res.identities[this.tabsIndex].rights; this.rights = res.identities[this.tabsIndex].rights;
this.total = res.identities[this.tabsIndex].price; this.total = res.identities[this.tabsIndex].price;