开发推荐中心页面

app.wxss

@@ -61,7 +61,9 @@ text {
 .seat2 {
     padding-bottom: calc(130rpx + env(safe-area-inset-bottom)) !important;
 }
-
+.rtext{
+    text-align: right;
+}
 .isFixed {
     position: fixed;
     z-index: 998;

salesperson/pages/saleOffice/index.js

@@ -20,6 +20,13 @@ Page({
             }
         })
     },
+    jump({
+        currentTarget
+    }) {
+        wx.navigateTo({
+            url: `/salesperson/pages/${currentTarget.dataset.url}/index`,
+        })
+    },
     /**
      * 用户点击右上角分享
      */

salesperson/pages/saleOffice/index.less

@@ -7,7 +7,7 @@
 
     .userBox {
         display: flex;
-        align-items: center;
+        align-items: flex-start;
         justify-content: space-between;
 
         .left {
@@ -22,6 +22,7 @@
 
             .identity {
                 margin-left: 24rpx;
+
                 .nickName {
                     margin: 6rpx 0 20rpx;
                     font-size: 30rpx;
@@ -37,6 +38,115 @@
                 }
             }
         }
+
+        .right {
+            padding: 8rpx 20rpx;
+            margin-right: -24rpx;
+            border-radius: 26rpx 0rpx 0rpx 26rpx;
+            font-size: 28rpx;
+            color: #FFFFFF;
+            background: #F19511;
+        }
+    }
+
+    .statistics {
+        margin: 44rpx 0 30rpx;
+        padding: 25rpx 41rpx;
+        background: #FFFFFF;
+        box-shadow: 0rpx 2rpx 14rpx 0rpx rgba(0, 0, 0, 0.02);
+        border-radius: 20rpx;
+
+        .above {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            padding-bottom: 18rpx;
+            border-bottom: 1rpx solid #EEEEEE;
+
+            .left {
+                .label {
+                    font-size: 28rpx;
+                    font-weight: bold;
+                    color: #000000;
+                }
+
+                .money {
+                    margin-top: 12rpx;
+                    font-size: 43rpx;
+                    font-weight: 600;
+                    color: #FF8200;
+                }
+            }
+
+            .withdrawal {
+                padding: 8rpx 20rpx 8rpx 24rpx;
+                background: #FFA343;
+                border-radius: 28rpx;
+                color: white;
+
+                .rbtn {
+                    margin-left: 2rpx;
+                    width: 16rpx;
+                    height: 22rpx;
+                }
+            }
+        }
+
+        .below {
+            padding-top: 26rpx;
+            display: flex;
+            justify-content: space-between;
+
+            .box {
+                font-size: 28rpx;
+
+                .label {
+                    color: #666666;
+                }
+
+                .money {
+                    margin-top: 18rpx;
+                    font-weight: bold;
+                }
+            }
+        }
+    }
+
+    .boxs {
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+
+        .box {
+            width: 220rpx;
+            height: 172rpx;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            align-items: center;
+            background: #FFFFFF;
+            border-radius: 10rpx;
+
+            .b1 {
+                width: 74rpx;
+                height: 74rpx;
+            }
+
+            .b2 {
+                width: 62rpx;
+                height: 70rpx;
+            }
+
+            .b3 {
+                width: 70rpx;
+                height: 63rpx;
+            }
+
+            .name {
+                margin-top: 12rpx;
+                font-size: 28rpx;
+            }
+        }
     }
 
     .bottom {

salesperson/pages/saleOffice/index.wxml

@@ -7,8 +7,44 @@
                 <view class="tag">初级团长</view>
             </view>
         </view>
+        <view class="right" bindtap="jump" data-url="commission">查看分销规则</view>
+    </view>
+    <view class="statistics">
+        <view class="above">
+            <view class="left">
+                <view class="label">可提现金额（元）</view>
+                <view class="money">1200.00</view>
+            </view>
+            <view class="withdrawal">
+                去提现
+                <image src="/static/rbtn.png" class="rbtn" />
+            </view>
+        </view>
+        <view class="below">
+            <view class="box">
+                <view class="label">今日收益（元）</view>
+                <view class="money">33.33</view>
+            </view>
+            <view class="box">
+                <view class="label rtext">累计收益（元）</view>
+                <view class="money rtext" style="padding-right:20rpx;">33.33</view>
+            </view>
+        </view>
+    </view>
+    <view class="boxs">
+        <view class="box">
+            <image src="../../image/b1.png" class="b1" />
+            <view class="name">邀请记录</view>
+        </view>
+        <view class="box">
+            <image src="../../image/b2.png" class="b2" />
+            <view class="name">订单管理</view>
+        </view>
+        <view class="box">
+            <image src="../../image/b3.png" class="b3" />
+            <view class="name">收益报表</view>
+        </view>
     </view>
-
     <view class="bottom">
         <button class="resetBtn btn" open-type="share">
             邀请用户

salesperson/pages/saleOffice/index.wxss

@@ -7,7 +7,7 @@
 }
 .container .userBox {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   justify-content: space-between;
 }
 .container .userBox .left {
@@ -34,6 +34,96 @@
   color: #FC6E1C;
   background: #FFFFFF;
 }
+.container .userBox .right {
+  padding: 8rpx 20rpx;
+  margin-right: -24rpx;
+  border-radius: 26rpx 0rpx 0rpx 26rpx;
+  font-size: 28rpx;
+  color: #FFFFFF;
+  background: #F19511;
+}
+.container .statistics {
+  margin: 44rpx 0 30rpx;
+  padding: 25rpx 41rpx;
+  background: #FFFFFF;
+  box-shadow: 0rpx 2rpx 14rpx 0rpx rgba(0, 0, 0, 0.02);
+  border-radius: 20rpx;
+}
+.container .statistics .above {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 18rpx;
+  border-bottom: 1rpx solid #EEEEEE;
+}
+.container .statistics .above .left .label {
+  font-size: 28rpx;
+  font-weight: bold;
+  color: #000000;
+}
+.container .statistics .above .left .money {
+  margin-top: 12rpx;
+  font-size: 43rpx;
+  font-weight: 600;
+  color: #FF8200;
+}
+.container .statistics .above .withdrawal {
+  padding: 8rpx 20rpx 8rpx 24rpx;
+  background: #FFA343;
+  border-radius: 28rpx;
+  color: white;
+}
+.container .statistics .above .withdrawal .rbtn {
+  margin-left: 2rpx;
+  width: 16rpx;
+  height: 22rpx;
+}
+.container .statistics .below {
+  padding-top: 26rpx;
+  display: flex;
+  justify-content: space-between;
+}
+.container .statistics .below .box {
+  font-size: 28rpx;
+}
+.container .statistics .below .box .label {
+  color: #666666;
+}
+.container .statistics .below .box .money {
+  margin-top: 18rpx;
+  font-weight: bold;
+}
+.container .boxs {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+.container .boxs .box {
+  width: 220rpx;
+  height: 172rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background: #FFFFFF;
+  border-radius: 10rpx;
+}
+.container .boxs .box .b1 {
+  width: 74rpx;
+  height: 74rpx;
+}
+.container .boxs .box .b2 {
+  width: 62rpx;
+  height: 70rpx;
+}
+.container .boxs .box .b3 {
+  width: 70rpx;
+  height: 63rpx;
+}
+.container .boxs .box .name {
+  margin-top: 12rpx;
+  font-size: 28rpx;
+}
 .container .bottom {
   position: absolute;
   width: 100%;