开发邀新

pages/invite/index.js

@@ -5,7 +5,7 @@ Page({
      * 页面的初始数据
      */
     data: {
-        count: 5
+        count: 9
     },
 
     /**

pages/invite/index.less

@@ -1,6 +1,6 @@
 .invite {
     width: 100%;
-    padding: 0 24rpx;
+    padding: 0 20rpx;
     box-sizing: border-box;
     min-height: 100vh;
     background-color: #291068;
@@ -60,6 +60,14 @@
                     height: 60rpx;
                 }
 
+                .current {
+                    position: absolute;
+                    top: 30rpx;
+                    left: 0rpx;
+                    width: 87rpx;
+                    height: 64rpx;
+                }
+
                 .rewardNum {
                     position: absolute;
                     bottom: 24rpx;

pages/invite/index.wxml

@@ -7,6 +7,7 @@
             <view class="numBox" wx:for="{{2}}" wx:key="index">
                 <view class="num">邀{{index+1}}人</view>
                 <image src="{{count>=index+1?'/static/lock-2.png':'/static/lock-1.png'}}" class="icon" />
+                <image src="/static/ct.png" class="current" wx:if='{{count==index+1}}' />
             </view>
             <view class="numBox {{count>2?'qualify':''}}">
                 <view class="rewardNum">VIP7天</view>
@@ -20,6 +21,7 @@
             <view class="numBox" wx:for="{{3}}" wx:key="index">
                 <view class="num">邀{{index+3}}人</view>
                 <image src="{{count>=index+3?'/static/lock-2.png':'/static/lock-1.png'}}" class="icon" />
+                <image src="/static/ct.png" class="current" wx:if='{{count==index+3}}' />
             </view>
             <view class="numBox {{count>=5?'qualify':''}}">
                 <view class="rewardNum">VIP15天</view>
@@ -30,30 +32,15 @@
         <!-- 第三关 -->
         <view class="row ">
             <view class="line"></view>
-            <view class="numBox">
-                <view class="num">邀6人</view>
-                <image src="/static/lock-2.png" class="icon" />
+            <view class="numBox" wx:for="{{5}}" wx:key="index">
+                <view class="num">邀{{index+6}}人</view>
+                <image src="{{count>=index+6?'/static/lock-2.png':'/static/lock-1.png'}}" class="icon" />
+                <image src="/static/ct.png" class="current" wx:if='{{count==index+6}}' />
             </view>
-            <view class="numBox">
-                <view class="num">邀7人</view>
-                <image src="/static/lock-1.png" class="icon" />
-            </view>
-            <view class="numBox">
-                <view class="num">邀8人</view>
-                <image src="/static/lock-1.png" class="icon" />
-            </view>
-            <view class="numBox">
-                <view class="num">邀9人</view>
-                <image src="/static/lock-1.png" class="icon" />
-            </view>
-            <view class="numBox">
-                <view class="num">邀10人</view>
-                <image src="/static/lock-1.png" class="icon" />
-            </view>
-            <view class="numBox">
+            <view class="numBox {{count>=10?'qualify':''}}">
                 <view class="rewardNum">VIP1个月</view>
                 <view class="rewardN">第三关</view>
-                <image src="/static/qb-2.png" class="reward" />
+                <image src="{{count>=10?'/static/qb-2.png':'/static/qb-1.png'}}" class="reward" />
             </view>
         </view>
     </view>

pages/invite/index.wxss

@@ -1,6 +1,6 @@
 .invite {
   width: 100%;
-  padding: 0 24rpx;
+  padding: 0 20rpx;
   box-sizing: border-box;
   min-height: 100vh;
   background-color: #291068;
@@ -56,6 +56,13 @@
   width: 60rpx;
   height: 60rpx;
 }
+.invite .progressBox .row .numBox .current {
+  position: absolute;
+  top: 30rpx;
+  left: 0rpx;
+  width: 87rpx;
+  height: 64rpx;
+}
 .invite .progressBox .row .numBox .rewardNum {
   position: absolute;
   bottom: 24rpx;