Skip to content

G
gxpt_wechat
Commit f934e0c6 by zhangzhen
Options

细节优化

parent 18b23e5b
Showing with 80 additions and 36 deletions
config/index.config.js
......@@ -2,8 +2,8 @@ const CONFIG = {
// 开发环境配置
development: {
// assetsPath: 'https://www.coujio.com/wechat_static', // 静态资源路径
assetsPath: 'http://coujiao.pseer.com:8888/wechat_static', // 静态资源路径
// assetsPath: 'http://10.24.5.63:8211/static', // 静态资源路径
// assetsPath: 'http://coujiao.pseer.com:8888/wechat_static', // 静态资源路径
assetsPath: 'http://10.24.5.63:8211/static', // 静态资源路径
// baseUrl: 'https://www.coujio.com/front-api', // 后台接口请求地址
// baseUrl: 'https://coujiao.pseer.com/front-api', // 后台接口请求地址
baseUrl: 'https://coujiao.pseer.com/front-api',
......
pages/my/myInfo.vue
......@@ -14,16 +14,22 @@
<view class="flex-col margin-left user-info-box">
<text class="text-title text-lg text-bold text-xxl">{{userInfo.nickName||"凑角用户"}}</text>
<view class="flex-row" style="margin-top: 10rpx;">
<view class="relative" :class="userInfo.consumerMember&&userInfo.consumerMember.isRecharge?'':'grayscale'">
<view v-if="userInfo.consumerMember&&userInfo.consumerMember.isRecharge" class="relative">
<image class="img-icon" :src="assetsPath+'/tag_icon_1.png'" mode="widthFix"></image>
<view class="absolute">
<text class="text-1">充值会员</text>
</view>
</view>
<view class="relative" :class="userInfo.consumerMember&&userInfo.consumerMember.isRights?'':'grayscale'">
<view v-if="userInfo.consumerMember&&userInfo.consumerMember.isRights" class="relative" >
<image class="img-icon" :src="assetsPath+'/tag_icon_2.png'" mode="widthFix"></image>
<view class="absolute">
<text class="text-1">权益会员</text>
<text class="text-2">权益会员</text>
</view>
</view>
<view v-if="!userInfo.consumerMember || !(userInfo.consumerMember.isRights && userInfo.consumerMember.isRecharge) " class="relative" >
<image class="img-icon" :src="assetsPath+'/tag_icon_3.png'" mode="widthFix"></image>
<view class="absolute">
<text class="text-3">普通会员</text>
</view>
</view>
</view>
......@@ -39,11 +45,11 @@
<view class="remeber-info-box">
<view class="relative flex-7">
<image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level-bg" :src="assetsPath+'/user/tongj_bg_1.png'" mode="scaleToFill"></image>
<image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="level-bg" :src="assetsPath+'/user/tj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level-bg" :src="assetsPath+'/user/tongj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level-bg" :src="assetsPath+'/user/yj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===4" class="level-bg" :src="assetsPath+'/user/jj_bg_1.png'" mode="scaleToFill"></image>
<image v-else class="level-bg" :src="assetsPath+'/user/tj_bg_1.png'" mode="scaleToFill"></image>
<view v-else class="level-bg level-bg-0"></view>
<view class="absolute level-content">
<view class="part-left">
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===4" class="level level-4">
......@@ -55,7 +61,7 @@
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level level-3">
<view v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level level-3">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
......@@ -64,7 +70,7 @@
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level level-2">
<view v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level level-2">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
......@@ -73,7 +79,7 @@
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="level level-1">
<view v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="level level-1">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
......@@ -81,7 +87,16 @@
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view>
<view v-else class="level level-1">
<view v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel === 0" class="level level-0">
<text class="text-1">LV 0</text>
<!-- <text class="text-2">您还没有会员等级！</text> -->
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view>
<view v-else class="level level-0">
<text class="text-1">LV 0</text>
<text class="text-2">您还不是会员哦，快来加入吧！</text>
</view>
......@@ -91,7 +106,8 @@
<image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===4" class="tag-icon" :src="assetsPath+'/user/tag_icon_4.png'" mode="widthFix"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="tag-icon" :src="assetsPath+'/user/tag_icon_3.png'" mode="widthFix"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="tag-icon" :src="assetsPath+'/user/tag_icon_2.png'" mode="widthFix"></image>
<image v-else class="tag-icon" :src="assetsPath+'/user/tag_icon_1.png'" mode="widthFix"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="tag-icon" :src="assetsPath+'/user/tag_icon_1.png'" mode="widthFix"></image>
<image v-else class="tag-icon" :src="assetsPath+'/user/tag_icon_0.png'" mode="widthFix"></image>
</view>
</view>
......@@ -851,6 +867,9 @@
.text-2{
color: #472F1E;
}
.text-3{
color: #3E3A39;
}
}
.grayscale{
filter: grayscale(100%);
......@@ -876,6 +895,11 @@
width: 100%;
height: 136rpx;
}
.level-bg-0{
background: #F9F9F9;
border-radius: 14upx;
border: 1px solid #A9ACB4;
}
.level-content{
display: flex;
justify-content: space-between;
......@@ -921,52 +945,46 @@
}
.level-4{
.text-1{
background: linear-gradient(104deg, #FFB875 0%, #FFEDC4 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: #9D680D;
}
.text-2{
color: #F3E3C6;
color: #BC8902;
}
.flex-row{
background: #615D73;
border: 1px solid #F9ECEC;
background: #FDF4C4;
border: 1px solid #CB8402;
.text-3{
color: #F3E3C6;
color: #CB8402;
}
.text-4{
color: #FFB875;
color: #CB8402;
}
}
}
.level-3{
.text-1{
background: linear-gradient(-90deg, #222A5E 0%, #4C559E 46.9482421875%, #222A5E 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: #898E9D;
}
.text-2{
color: #5A63A5;
color: #898E9D;
}
.flex-row{
background: #BAC6D2;
border: 1px solid #464F8E;
background: #DDDEEB;
border: 1px solid #81828A;
.text-3{
color: #5A63A5;
color: #7A7B84;
}
.text-4{
color: #464F8E;
color: #81828A;
}
}
}
.level-2{
.text-1{
background: linear-gradient(47deg, #FD7C01 0%, #FCAB00 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: #FEEDE3;
}
.text-2{
color: #985E39;
color: #FFFFFF;
}
.flex-row{
background: #FFEED9;
......@@ -975,7 +993,7 @@
color: #985E39;
}
.text-4{
color: #701700;
color: #6F4133;
}
}
}
......@@ -989,13 +1007,38 @@
color: #F1F6F4;
}
.flex-row{
display: flex;
flex-direction: row;
align-items: center;
background: #F5E0ED;
border: 1px solid #F46DB9;
.text-3{
color: #E40583;
}
.text-4{
color: #C72380;
}
}
}
.level-0{
.text-1{
color: #969696;
}
.text-2{
color: #969696;
}
.flex-row{
display: flex;
flex-direction: row;
align-items: center;
background: #E3E6E8;
border-radius: 4upx;
border: 1px solid #E3E6E8;
.text-3{
color: #9D9D9D;
color: #333333;
}
.text-4{
color: #9D9D9D;
color: #333333;
}
}
}
......@@ -1008,6 +1051,7 @@
.tag-icon{
display: block;
width: 120upx;
max-height: 100upx;
}
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment