|
@@ -24,26 +24,35 @@
|
|
|
'dot-g':personInfo.memberLevel>2,
|
|
|
}">
|
|
|
|
|
|
+ </view>
|
|
|
+ <view class="dot dot4" :class="{
|
|
|
+ 'dot-g':personInfo.memberLevel>3,
|
|
|
+ }">
|
|
|
+
|
|
|
</view>
|
|
|
<!-- 会员名称 -->
|
|
|
<view class="member-text1">
|
|
|
联盟
|
|
|
+ </view>
|
|
|
+ <view class="member-text2">
|
|
|
+ 白银
|
|
|
</view>
|
|
|
- <view class="member-text2">
|
|
|
+ <view class="member-text3">
|
|
|
黄金
|
|
|
</view>
|
|
|
- <view class="member-text3">
|
|
|
+ <view class="member-text4">
|
|
|
铂金
|
|
|
</view>
|
|
|
<view class="blockOut">
|
|
|
|
|
|
<view class="block rotate1" :class="{
|
|
|
- block1:personInfo.memberLevel==1,
|
|
|
+ block1:personInfo.memberLevel==1||personInfo.memberLevel==null,
|
|
|
block2:personInfo.memberLevel==2,
|
|
|
- block3:personInfo.memberLevel==3,
|
|
|
+ block3:personInfo.memberLevel==3,
|
|
|
+ block4:personInfo.memberLevel==4,
|
|
|
}"></view>
|
|
|
<!-- 会员信息 -->
|
|
|
- <view class="title" v-if="personInfo.memberLevel<3&&list[personInfo.memberLevel].num>carImg3span1" >
|
|
|
+ <view class="title" v-if="personInfo.memberLevel<4&&list[personInfo.memberLevel].num>carImg3span1" >
|
|
|
累计充电量还差{{list[personInfo.memberLevel].num-carImg3span1}}度升级{{list[personInfo.memberLevel].name}}
|
|
|
</view>
|
|
|
<view class="title" v-else >
|
|
@@ -121,8 +130,15 @@
|
|
|
</u-grid-item>
|
|
|
</u-grid>
|
|
|
<u-grid :col="3" :border="false">
|
|
|
-
|
|
|
- <u-grid-item v-show="[1,2].indexOf(uCurrent)>-1">
|
|
|
+ <u-grid-item v-show="[1,2,3].indexOf(uCurrent)>-1">
|
|
|
+
|
|
|
+ <view class="img-box">
|
|
|
+ <img src="../../../assets/img/riFill-gift-2-fill@3x.png" alt="">
|
|
|
+ </view>
|
|
|
+ <view class="grid-text">小礼品</view>
|
|
|
+ <view class="grid-text2">不定期赠送</view>
|
|
|
+ </u-grid-item>
|
|
|
+ <u-grid-item v-show="[1,2,3].indexOf(uCurrent)>-1">
|
|
|
|
|
|
<view class="img-box">
|
|
|
<img src="../../../assets/img/riFill-heart-2-fill@3x.png" alt="">
|
|
@@ -130,40 +146,36 @@
|
|
|
<view class="grid-text">工会福利</view>
|
|
|
<view class="grid-text2">不定期赠送</view>
|
|
|
</u-grid-item>
|
|
|
- <u-grid-item v-show="[1,2].indexOf(uCurrent)>-1" >
|
|
|
+
|
|
|
+ <u-grid-item v-show="[2,3].indexOf(uCurrent)>-1">
|
|
|
|
|
|
<view class="img-box">
|
|
|
- <img src="../../../assets/img/riFill-customer-service-2-fill@3x.png" alt="">
|
|
|
+ <img src="../../../assets/img/riFill-battery-charge-fill@3x.png" alt="">
|
|
|
</view>
|
|
|
- <view class="grid-text">生日问候</view>
|
|
|
- <view class="grid-text2">需完善信息</view>
|
|
|
- </u-grid-item>
|
|
|
- <u-grid-item v-show="[2].indexOf(uCurrent)>-1">
|
|
|
-
|
|
|
- <view class="img-box">
|
|
|
- <img src="../../../assets/img/riFill-timer-flash-fill@3x.png" alt="">
|
|
|
- </view>
|
|
|
- <view class="grid-text">预约充电</view>
|
|
|
- <view class="grid-text2">免费使用</view>
|
|
|
+ <view class="grid-text">快捷充电</view>
|
|
|
+ <view class="grid-text2">扫码即冲</view>
|
|
|
</u-grid-item>
|
|
|
+
|
|
|
</u-grid>
|
|
|
<u-grid :col="3" :border="false">
|
|
|
|
|
|
- <u-grid-item v-show="[2,3].indexOf(uCurrent)>-1">
|
|
|
+
|
|
|
+
|
|
|
+ <u-grid-item v-show="[3].indexOf(uCurrent)>-1" >
|
|
|
|
|
|
<view class="img-box">
|
|
|
- <img src="../../../assets/img/riFill-gift-2-fill@3x.png" alt="">
|
|
|
+ <img src="../../../assets/img/riFill-customer-service-2-fill@3x.png" alt="">
|
|
|
</view>
|
|
|
- <view class="grid-text">小礼品</view>
|
|
|
- <view class="grid-text2">不定期赠送</view>
|
|
|
+ <view class="grid-text">生日问候</view>
|
|
|
+ <view class="grid-text2">需完善信息</view>
|
|
|
</u-grid-item>
|
|
|
- <u-grid-item v-show="[2].indexOf(uCurrent)>-1">
|
|
|
-
|
|
|
- <view class="img-box">
|
|
|
- <img src="../../../assets/img/riFill-battery-charge-fill@3x.png" alt="">
|
|
|
- </view>
|
|
|
- <view class="grid-text">快捷充电</view>
|
|
|
- <view class="grid-text2">扫码即冲</view>
|
|
|
+ <u-grid-item v-show="[3].indexOf(uCurrent)>-1">
|
|
|
+
|
|
|
+ <view class="img-box">
|
|
|
+ <img src="../../../assets/img/riFill-timer-flash-fill@3x.png" alt="">
|
|
|
+ </view>
|
|
|
+ <view class="grid-text">预约充电</view>
|
|
|
+ <view class="grid-text2">免费使用</view>
|
|
|
</u-grid-item>
|
|
|
|
|
|
</u-grid>
|
|
@@ -173,13 +185,14 @@
|
|
|
<view class="p pMain">会员等级:</view>
|
|
|
<view class="p">当您注册成为“51充电联盟”汽车充电会员以后,可享受如下权益:</view>
|
|
|
<view class="p">1、注册51充电联盟平台用户并完善信息即成为联盟会员。</view>
|
|
|
- <view class="p">2、会员体系设置联盟会员、黄金会员及铂金会员三级;</view>
|
|
|
+ <view class="p">2、会员体系设置联盟会员、白银会员、黄金会员及铂金会员四级;</view>
|
|
|
<view class="p">3、每月累计充电量达到不同等级的要求,下个月即可升级。</view>
|
|
|
- <view class="p">a)联盟会员:完成注册</view>
|
|
|
- <view class="p">b)黄金会员:248≤月充电量<1000度</view>
|
|
|
- <view class="p">c)铂金会员:月充电量≥1000度</view>
|
|
|
+ <view class="p">a)联盟会员:完成注册</view>
|
|
|
+ <view class="p">b)白银会员:248≤月充电量<600度</view>
|
|
|
+ <view class="p">c)黄金会员:600≤月充电量<1000度</view>
|
|
|
+ <view class="p">d)铂金会员:月充电量≥1000度</view>
|
|
|
<view class="p">4、不同会员等级,享有不同会员等级权益</view>
|
|
|
- <view class="p">5、联盟会员永久有效,黄金会员、铂金会员等级有效期为1个自然月。</view>
|
|
|
+ <view class="p">5、联盟会员永久有效,白银会员、黄金会员、铂金会员等级有效期为1个自然月。</view>
|
|
|
<view class="p"> 6、每月1号凌晨4点根据上个月累计充电量情况评定当月会员级别。</view>
|
|
|
|
|
|
<view class="p pMain">会员权益:</view>
|
|
@@ -208,7 +221,8 @@
|
|
|
|
|
|
|
|
|
<td></td>
|
|
|
- <td >联盟</td>
|
|
|
+ <td >联盟</td>
|
|
|
+ <td >白银</td>
|
|
|
<td>黄金</td>
|
|
|
<td>铂金</td>
|
|
|
</tr>
|
|
@@ -216,13 +230,15 @@
|
|
|
<tr>
|
|
|
<td class="td1">评级标准及月充电量</td>
|
|
|
<td>完成注册</td>
|
|
|
- <td>248~999</td>
|
|
|
+ <td>248~599</td>
|
|
|
+ <td>600~999</td>
|
|
|
<td>≥1000</td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="td1">有效期</td>
|
|
|
<td>永久</td>
|
|
|
<td>1个月</td>
|
|
|
+ <td>1个月</td>
|
|
|
<td>1个月</td>
|
|
|
</tr>
|
|
|
<tr>
|
|
@@ -231,22 +247,25 @@
|
|
|
</td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="td1">
|
|
|
月卡
|
|
|
</td>
|
|
|
- <td><span class="span2">●</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="td1">
|
|
|
荆鹏软件园
|
|
|
</td>
|
|
|
- <td><span class="span2">●</span></td>
|
|
|
- <td><span class="span2">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
</tr>
|
|
|
|
|
@@ -254,42 +273,49 @@
|
|
|
<td class="td1">
|
|
|
小礼品
|
|
|
</td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
- <td><span class="span2">●</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="td1">
|
|
|
工会福利
|
|
|
</td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
- <td><span class="span2">●</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td class="td1">
|
|
|
- 充电预约
|
|
|
- </td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td class="td1">
|
|
|
- 生日问候
|
|
|
- </td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="td1">
|
|
|
+ 快捷充电
|
|
|
+ </td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="td1">
|
|
|
+ 生日问候
|
|
|
+ </td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">●</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td class="td1">
|
|
|
- 快捷充电
|
|
|
+ 充电预约
|
|
|
</td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
- <td><span class="span2">○</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
+ <td><span class="span1">○</span></td>
|
|
|
<td><span class="span1">●</span></td>
|
|
|
</tr>
|
|
|
+
|
|
|
+
|
|
|
</table>
|
|
|
|
|
|
</view>
|
|
@@ -317,17 +343,30 @@
|
|
|
name:"联盟会员",
|
|
|
num:0,
|
|
|
// 激活
|
|
|
- image: require('@../../..//assets/img/member/01.svg'),
|
|
|
- background:"linear-gradient(157.61deg, rgba(254,249,242,1) -4.44%,rgba(201,228,255,1) 86.29%)",
|
|
|
- color1:"rgba(20, 124, 255, 1)",
|
|
|
- color2:"rgba(36, 94, 167, 1)",
|
|
|
- color3:"rgba(36, 94, 167, 1)",
|
|
|
+ image: require('@../../..//assets/img/member/00.svg'),
|
|
|
+ background:"linear-gradient(157.61deg, rgba(242,254,248,1) -4.44%,rgba(201,255,224,1) 86.29%)",
|
|
|
+ color1:"#00A155",
|
|
|
+ color2:"#137B4A",
|
|
|
+ color3:"#137B4A",
|
|
|
// 未达标
|
|
|
// image:require('@../../..//assets/img/notQualifiedGold.png')
|
|
|
- },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name:"白银会员",
|
|
|
+ num:248,
|
|
|
+ // 激活
|
|
|
+ image: require('@../../..//assets/img/member/01.svg'),
|
|
|
+ background:"linear-gradient(157.61deg, rgba(254,249,242,1) -4.44%,rgba(201,228,255,1) 86.29%)",
|
|
|
+ color1:"rgba(20, 124, 255, 1)",
|
|
|
+ color2:"rgba(36, 94, 167, 1)",
|
|
|
+ color3:"rgba(36, 94, 167, 1)",
|
|
|
+ // 未达标
|
|
|
+ // image:require('@../../..//assets/img/notQualifiedGold.png')
|
|
|
+ },
|
|
|
+
|
|
|
{
|
|
|
name:"黄金会员",
|
|
|
- num:248,
|
|
|
+ num:600,
|
|
|
// 未达标
|
|
|
//image: require('@../../..//assets/img/platinumMember.png'),
|
|
|
image: require('@../../..//assets/img/member/02.svg'),
|
|
@@ -353,7 +392,7 @@
|
|
|
}
|
|
|
],
|
|
|
personInfo: {
|
|
|
- memberLevel:1
|
|
|
+ memberLevel:4
|
|
|
},
|
|
|
carImg3span1: 0,
|
|
|
carImg3span2: 0,
|
|
@@ -476,7 +515,7 @@
|
|
|
}
|
|
|
}
|
|
|
this.carImg3span1 = parseInt(num1 / 10000);
|
|
|
- this.carImg3span2 = parseInt(num2);
|
|
|
+ this.carImg3span1 = parseInt(num2);
|
|
|
|
|
|
|
|
|
}).catch(error => {
|
|
@@ -559,14 +598,19 @@
|
|
|
|
|
|
.dot2 {
|
|
|
position: absolute;
|
|
|
- top: 352rpx;
|
|
|
- left: 48%;
|
|
|
+ top: 272rpx;
|
|
|
+ left: 165rpx;
|
|
|
}
|
|
|
|
|
|
.dot3 {
|
|
|
position: absolute;
|
|
|
- top: 78rpx;
|
|
|
- right: 82rpx;
|
|
|
+ top: 272rpx;
|
|
|
+ right: 170rpx;
|
|
|
+ }
|
|
|
+ .dot4 {
|
|
|
+ position: absolute;
|
|
|
+ top: 78rpx;
|
|
|
+ right: 80rpx;
|
|
|
}
|
|
|
|
|
|
// 会员名称
|
|
@@ -582,23 +626,29 @@
|
|
|
.member-text2 {
|
|
|
color: rgba(204, 204, 204, 1);
|
|
|
position: absolute;
|
|
|
- left: 45%;
|
|
|
- top: 380rpx;
|
|
|
+ left: 150rpx;
|
|
|
+ top: 322rpx;
|
|
|
}
|
|
|
|
|
|
.member-text3 {
|
|
|
color: rgba(204, 204, 204, 1);
|
|
|
position: absolute;
|
|
|
- top: 28rpx;
|
|
|
- right: 56rpx;
|
|
|
+ top: 322rpx;
|
|
|
+ right: 150rpx;
|
|
|
+ }
|
|
|
+ .member-text4 {
|
|
|
+ color: rgba(204, 204, 204, 1);
|
|
|
+ position: absolute;
|
|
|
+ top: 28rpx;
|
|
|
+ right: 56rpx;
|
|
|
}
|
|
|
-
|
|
|
.block {
|
|
|
width: 586rpx;
|
|
|
height: 586rpx;
|
|
|
- //border-left: 12rpx solid #00b962;
|
|
|
- //border-top: 12rpx solid #00b962;
|
|
|
-
|
|
|
+ border-left: 12rpx solid #00b962;
|
|
|
+ border-top: 12rpx solid #00b962;
|
|
|
+ border-right: 12rpx solid gray;
|
|
|
+ border-bottom: 12rpx solid gray;
|
|
|
border-radius: 50%;
|
|
|
box-sizing: border-box;
|
|
|
position: absolute;
|
|
@@ -606,26 +656,33 @@
|
|
|
margin-top: 100px;
|
|
|
}
|
|
|
|
|
|
- .block1 {
|
|
|
- border-left: 12rpx solid gray;
|
|
|
- border-top: 12rpx solid gray;
|
|
|
- border-right: 12rpx solid gray;
|
|
|
- border-bottom: 12rpx solid gray;
|
|
|
- }
|
|
|
-
|
|
|
- .block2 {
|
|
|
- border-left: 12rpx solid #00b962;
|
|
|
- border-top: 12rpx solid #00b962;
|
|
|
- border-right: 12rpx solid gray;
|
|
|
- border-bottom: 12rpx solid gray;
|
|
|
- }
|
|
|
-
|
|
|
- .block3 {
|
|
|
- border-left: 12rpx solid #00b962;
|
|
|
- border-top: 12rpx solid #00b962;
|
|
|
- border-right: 12rpx solid #00b962;
|
|
|
- border-bottom: 12rpx solid #00b962;
|
|
|
- }
|
|
|
+ // .block1 {
|
|
|
+ // border-left: 12rpx solid gray;
|
|
|
+ // border-top: 12rpx solid gray;
|
|
|
+ // border-right: 12rpx solid gray;
|
|
|
+ // border-bottom: 12rpx solid gray;
|
|
|
+ // }
|
|
|
+
|
|
|
+ // .block2 {
|
|
|
+ // border-left: 12rpx solid #00b962;
|
|
|
+ // border-top: 12rpx solid #00b962;
|
|
|
+ // border-right: 12rpx solid gray;
|
|
|
+ // border-bottom: 12rpx solid gray;
|
|
|
+ // }
|
|
|
+
|
|
|
+ // .block3 {
|
|
|
+ // border-left: 12rpx solid #00b962;
|
|
|
+ // border-top: 12rpx solid #00b962;
|
|
|
+ // border-right: 12rpx solid #00b962;
|
|
|
+ // border-bottom: 12rpx solid #00b962;
|
|
|
+ // }
|
|
|
+
|
|
|
+ // .block4 {
|
|
|
+ // border-left: 12rpx solid #00b962;
|
|
|
+ // border-top: 12rpx solid #00b962;
|
|
|
+ // border-right: 12rpx solid #00b962;
|
|
|
+ // border-bottom: 12rpx solid #00b962;
|
|
|
+ // }
|
|
|
|
|
|
.blockOut {
|
|
|
// padding-top: 16rpx;
|
|
@@ -656,11 +713,18 @@
|
|
|
}
|
|
|
|
|
|
}
|
|
|
-
|
|
|
- .block.rotate1 {
|
|
|
- transform: rotate(-45deg);
|
|
|
+ .block.rotate1.block1 {
|
|
|
+ transform: rotate(40deg);
|
|
|
+ }
|
|
|
+ .block.rotate1.block2 {
|
|
|
+ transform: rotate(-0deg);
|
|
|
+ }
|
|
|
+ .block.rotate1.block3 {
|
|
|
+ transform: rotate(-85deg);
|
|
|
+ }
|
|
|
+ .block.rotate1.block4 {
|
|
|
+ transform: rotate(-130deg);
|
|
|
}
|
|
|
-
|
|
|
// 宫格
|
|
|
.grid-box {
|
|
|
|
|
@@ -770,9 +834,10 @@
|
|
|
}
|
|
|
|
|
|
.table {
|
|
|
- table {
|
|
|
+ table {
|
|
|
+ width: 100%;
|
|
|
border-spacing:0;
|
|
|
- font-size: 32rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
.th {
|
|
|
background-color: rgba(72, 83, 104, 1);
|
|
|
color: rgba(255, 255, 255, 1);
|
|
@@ -780,12 +845,14 @@
|
|
|
border-right: 1px solid #fff;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+ .span1{
|
|
|
+ font-size: 40rpx;
|
|
|
+ }
|
|
|
.td1 {
|
|
|
text-align: start;
|
|
|
background-color:#e5e5e5;
|
|
|
width: 200rpx;
|
|
|
- padding: 0 16rpx;
|
|
|
+ padding: 0 8rpx;;
|
|
|
border-bottom: 1px solid #fff;
|
|
|
|
|
|
|
|
@@ -794,7 +861,7 @@
|
|
|
td {
|
|
|
text-align: center;
|
|
|
|
|
|
- width: 160rpx;
|
|
|
+ max-width: 160rpx;
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -803,7 +870,7 @@
|
|
|
|
|
|
.grid-box-index{
|
|
|
background-color: #fff;
|
|
|
- margin: 32rpx;
|
|
|
+ margin: 24rpx;
|
|
|
padding-bottom: 80rpx;
|
|
|
border-radius: 8px;
|
|
|
overflow: hidden;
|