tabbar及我的

app.js

@@ -19,7 +19,7 @@ App({
         this.updateApplet()
         this.checkIsIos()
         // #elif ANDROID
-        wx.setStorageSync('channelCode', '12345')
+        wx.setStorageSync('channelCode', '3001')
         this.initPlugin()
         // #endif
         this.getNavbarInfo()

custom-tab-bar/index.js

@@ -28,8 +28,8 @@ Component({
         listTab: [{
             "pagePath": "/pages/activity/index",
             "text": "排行榜",
-            "iconPath": "/static/activity.png",
-            "selectedIconPath": "/static/activity2.png"
+            "iconPath": "/static/ranking.png",
+            "selectedIconPath": "/static/ranking2.png"
         }, {
             "pagePath": "/pages/works/index",
             "text": "作品",

pages/my/gzh/index.js

@@ -1,25 +0,0 @@
-
-Component({
-    data: {
-        show: false,
-        qrCode: 'https://reader-wx.ai160.com/images/reader/v3/ldxkx.jpg'
-    },
-    methods: {
-        open() {
-            this.getTabBar().setData({
-                mask: true
-            })
-            this.setData({
-                show: true,
-            })
-        },
-        closeModal() {
-            this.setData({
-                show: false
-            })
-            this.getTabBar().setData({
-                mask: false
-            })
-        },
-    }
-})

pages/my/gzh/index.json

@@ -1,4 +0,0 @@
-{
-    "component": true,
-    "usingComponents": {}
-}

pages/my/gzh/index.less

@@ -1,34 +0,0 @@
-.activationModal {
-    position: fixed;
-    z-index: 12;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    left: 0rpx;
-    top: 0rpx;
-    width: 100vw;
-    height: 100vh;
-    background: rgba(0, 0, 0, 0.7);
-
-    .modal {
-        margin-top: 400rpx;
-        width: 600rpx;
-        height: 680rpx;
-        background: url(https://reader-wx.ai160.com/images/reader/v3/bianzu73.png)no-repeat;
-        background-size: contain;
-        border-radius: 20rpx;
-        text-align: center;
-
-        .qrCode {
-            margin: 260rpx auto;
-            width: 324rpx;
-            height: 324rpx;
-        }
-    }
-
-    .close {
-        padding: 40rpx;
-        width: 54rpx;
-        height: 54rpx;
-    }
-}

pages/my/gzh/index.wxml

@@ -1,6 +0,0 @@
-<view class="activationModal" wx:if="{{show}}">
-    <view class="modal">
-        <image src="{{qrCode}}" class="qrCode" show-menu-by-longpress="true" />
-    </view>
-    <image src="/static/lollipop.png" class="close" catchtap="closeModal" />
-</view>

pages/my/gzh/index.wxss

@@ -1,31 +0,0 @@
-.activationModal {
-  position: fixed;
-  z-index: 12;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  left: 0rpx;
-  top: 0rpx;
-  width: 100vw;
-  height: 100vh;
-  background: rgba(0, 0, 0, 0.7);
-}
-.activationModal .modal {
-  margin-top: 400rpx;
-  width: 600rpx;
-  height: 680rpx;
-  background: url(https://reader-wx.ai160.com/images/reader/v3/bianzu73.png) no-repeat;
-  background-size: contain;
-  border-radius: 20rpx;
-  text-align: center;
-}
-.activationModal .modal .qrCode {
-  margin: 260rpx auto;
-  width: 324rpx;
-  height: 324rpx;
-}
-.activationModal .close {
-  padding: 40rpx;
-  width: 54rpx;
-  height: 54rpx;
-}

pages/my/index.js

@@ -20,14 +20,7 @@ Page({
     behaviors: [event],
     data: {
         userInfo: {},
-        vipTime: '',
-        tasks: [],
-        isIos: app.globalData.isIOS,
-        qrCode: '',
-        activationModal: false,
-        activationRes: {},
         products: [],
-        isPreferential: false
     },
     async onLoad() {
         // 手工绑定 
@@ -77,65 +70,11 @@ Page({
     async getProducts() {
         let {
             productList: products,
-            isPreferential
         } = await getProducts()
-        console.log(products);
         this.setData({
             products,
-            isPreferential
         })
     },
-    activationCode() {
-        wx.showModal({
-            title: '请输入激活码',
-            editable: true,
-            success: async ({
-                confirm,
-                content
-            }) => {
-                if (confirm) {
-                    let regexp = /^[a-zA-Z0-9]{4}$/
-                    if (regexp.test(content)) {
-                        let activationRes = await getLearnCard({
-                            cardNo: content
-                        })
-                        if (activationRes.code == 200) {
-                            activationRes = {
-                                code: 200,
-                                message: '快去朗读挑战吧！'
-                            }
-                        }
-                        this.setUserInfo()
-                        if (typeof this.getTabBar === 'function') {
-                            this.getTabBar().setData({
-                                mask: true
-                            })
-                        }
-                        this.setData({
-                            activationModal: true,
-                            activationRes
-                        })
-                    } else {
-                        if (typeof this.getTabBar === 'function') {
-                            this.getTabBar().setData({
-                                mask: true
-                            })
-                        }
-                        this.setData({
-                            activationModal: true,
-                            activationRes: {
-                                code: 581,
-                                message: '请检查激活码输入是否正确'
-                            }
-                        })
-                    }
-                }
-            }
-        })
-    },
-    toGzh() {
-        this.selectComponent('#gzh').open()
-    },
     openDonutBuy({
         currentTarget
     }) {
@@ -163,43 +102,5 @@ Page({
             }
         })
     },
-    closeModal() {
-        this.setData({
-            activationModal: false
-        })
-        if (typeof this.getTabBar === 'function') {
-            this.getTabBar().setData({
-                mask: false
-            })
-        }
-    },
 
-    // 分享配置
-    onShareAppMessage(res) {
-        // #if MP
-        return {
-            title: '自从用了它，家里朗朗书声，美妙极了！你家孩子也快来试试！',
-            path: `/pages/index/index?uid=${wx.getStorageSync('uid')}`,
-            imageUrl: 'http://reader-wx.ai160.com/images/reader/v3/375-300-1.jpg'
-        }
-        // #elif ANDROID
-        return {
-            title: '自从用了它，家里朗朗书声，美妙极了！你家孩子也快来试试！',
-            userName: 'gh_50f61361ad1d',
-            path: `/pages/index/index?uid=${wx.getStorageSync('uid')}`,
-            imagePath: '/static/375-300-2.jpg',
-            webpageUrl: 'http://www.efunbox.cn',
-            withShareTicket: true,
-            miniprogramType: 1,
-            scene: 0,
-        }
-        // #endif
-    },
-    onShareTimeline: function () {
-        return {
-            title: '终于找到适合孩子的朗读神器了！动画配音，边玩边学！',
-            query: `uid=${wx.getStorageSync('uid')}`,
-            imageUrl: 'http://reader-wx.ai160.com/images/reader/v3/yuwen.jpg'
-        }
-    },
 })

pages/my/index.json

@@ -1,7 +1,6 @@
 {
     "usingComponents": {
         "navigationBar": "/components/navigationBar/index",
-        "gzhModal": "./gzh/index",
         "donutBuy":"/components/donutBuy/index",
         "vipModal": "/components/vipModal/index"
     },

pages/my/index.less

@@ -59,11 +59,6 @@
                             font-size: 24rpx;
                             color: #989A9C;
                         }
-
-                        .validity {
-                            font-size: 24rpx;
-                            color: #FE9221;
-                        }
                     }
 
                     .uRtopRight {
@@ -86,209 +81,72 @@
         }
     }
 
-    .menu {
-        margin-top: 30rpx;
-        border-radius: 20rpx;
-        background-color: white;
-
-        .activation {
-            padding: 28rpx 20rpx;
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            border-bottom: 1rpx solid #EEEEEE;
-
-            .tips {
-                display: flex;
-                align-items: center;
-                font-weight: 400;
-
-                .tipsImg {
-                    margin-right: 14rpx;
-                    width: 44rpx;
-                    height: 44rpx;
-                }
-
-                font-size: 30rpx;
-            }
-
-            .black {
-                margin-right: 20rpx;
-                width: 16rpx;
-                height: 30rpx;
-                opacity: 0.8;
-            }
-        }
-
-        .activation:last-child {
-            border: none;
-        }
-    }
-
-    .scrollViewBox {
-        position: relative;
-        width: 100vw;
-
-        .goodsList {
-            margin-top: 40rpx;
-            width: 100%;
-            height: 310rpx;
-            white-space: nowrap;
-            box-sizing: border-box;
-
-            .payBox {
-                position: relative;
-                margin-right: 22rpx;
-                width: 268rpx;
-                height: 268rpx;
-                background-size: cover;
-                text-align: center;
-                display: inline-block;
-                border-radius: 20rpx;
-
-                .pay {
-                    position: absolute;
-                    bottom: 24rpx;
-                    left: 50%;
-                    transform: translateX(-50%);
-                    padding: 6rpx 40rpx;
-                    font-size: 26rpx;
-                    font-weight: bold;
-                    border-radius: 50rpx;
-                }
-            }
+    .goodsList {
+        margin-top: 40rpx;
+        width: 100%;
+        height: 310rpx;
+        white-space: nowrap;
+        box-sizing: border-box;
+
+        .payBox {
+            position: relative;
+            margin-right: 22rpx;
+            width: 268rpx;
+            height: 268rpx;
+            background-size: cover;
+            text-align: center;
+            display: inline-block;
+            border-radius: 20rpx;
 
-            .payBox::after {
-                content: '';
+            .pay {
                 position: absolute;
-                width: 268rpx;
-                height: 45rpx;
-                left: 0;
-                bottom: -42rpx;
-                background: linear-gradient(180deg, #2A2116 0%, rgba(255, 255, 255, 0) 100%);
-                border-radius: 22rpx 22rpx 0rpx 0rpx;
-                opacity: 0.26;
-            }
-
-            .pbbg1 {
-                background-image: url(http://reader-wx.ai160.com/images/reader/v3/12992x.png);
-
-                .pay {
-                    background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
-                }
-            }
-
-            .pbbg2 {
-                background-image: url(http://reader-wx.ai160.com/images/reader/v3/2992x.png);
-
-                .pay {
-                    background: linear-gradient(285deg, #DFF2EE 0%, #D8E9FD 39%, #BDE6F8 72%, #BAE7F7 100%);
-                }
-            }
-
-
-            .pbbg3 {
-                background-image: url(http://reader-wx.ai160.com/images/reader/v3/55152x.png);
-
-                .pay {
-                    background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
-                }
+                bottom: 24rpx;
+                left: 50%;
+                transform: translateX(-50%);
+                padding: 6rpx 40rpx;
+                font-size: 26rpx;
+                font-weight: bold;
+                border-radius: 50rpx;
             }
-
-        }
-
-        .goodsTips {
-            position: absolute;
-            font-size: 24rpx;
-            color: #555;
-            bottom: 0;
-        }
-    }
-
-    .longpressBox {
-        position: relative;
-
-        .iosVip {
-            margin-top: 30rpx;
-            height: 230rpx;
-            width: 710rpx;
         }
 
-        .qrCode {
-            position: absolute;
-            top: 59rpx;
-            right: 40rpx;
-            width: 174rpx;
-            height: 174rpx;
-        }
-    }
-
-    .activationModal {
-        position: fixed;
-        z-index: 2;
-        left: 0rpx;
-        top: 0rpx;
-        width: 100vw;
-        height: 100vh;
-        background: rgba(0, 0, 0, 0.7);
-
-        .box {
+        .payBox::after {
+            content: '';
             position: absolute;
+            width: 268rpx;
+            height: 45rpx;
             left: 0;
-            right: 0;
-            top: 30%;
-            margin: auto;
-            width: 496rpx;
-            height: 365rpx;
-            background-color: white;
-            border-radius: 20rpx;
-            text-align: center;
+            bottom: -42rpx;
+            background: linear-gradient(180deg, #2A2116 0%, rgba(255, 255, 255, 0) 100%);
+            border-radius: 22rpx 22rpx 0rpx 0rpx;
+            opacity: 0.26;
+        }
 
+        .pbbg1 {
+            background-image: url(http://reader-wx.ai160.com/images/reader/v3/12992x.png);
 
-            .sLcon {
-                margin-top: 34rpx;
-                width: 100rpx;
-                height: 100rpx;
+            .pay {
+                background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
             }
+        }
 
-            .tips1 {
-                margin: 36rpx 0rpx 24rpx;
-                color: #131313;
-                font-weight: bold;
-                font-size: 34rpx;
-            }
+        .pbbg2 {
+            background-image: url(http://reader-wx.ai160.com/images/reader/v3/2992x.png);
 
-            .tips2 {
-                font-size: 30rpx;
-                color: #12C962;
+            .pay {
+                background: linear-gradient(285deg, #DFF2EE 0%, #D8E9FD 39%, #BDE6F8 72%, #BAE7F7 100%);
             }
-
         }
 
-        /* .vipModal {
-      position: relative;
-      left: 0;
-      right: 0;
-      top: 30%;
-      margin: auto;
-      border-radius: 20rpx;
-      text-align: center;
 
-      .mBg {
-        width: 600rpx;
-      }
-    }
- */
-        .close {
-            position: absolute;
-            padding: 40rpx;
-            width: 54rpx;
-            height: 54rpx;
-            left: 0;
-            right: 0;
-            bottom: -140rpx;
-            margin: auto;
+        .pbbg3 {
+            background-image: url(http://reader-wx.ai160.com/images/reader/v3/55152x.png);
+
+            .pay {
+                background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
+            }
         }
 
     }
+  
 }

pages/my/index.wxml

@@ -1,4 +1,3 @@
-<wxs src="../../utils/filter.wxs" module="filters" />
 <navigationBar bind:reload='setUserInfo'></navigationBar>
 <view class="container">
     <!-- 用户信息 -->
@@ -13,11 +12,6 @@
                     <view class="uRtopleft">
                         <view class="nickName textOver">{{userInfo.user.nickName||'请输入昵称' }}</view>
                         <view class="gradeText textOver" catchtap="clipboar">学号：{{userInfo.user.eid}}</view>
-                        <!-- #if MP -->
-                        <view class="validity" wx:if="{{isPreferential&&!isIos}}">
-                            {{vipTime=='1'?'会员使用至：终身使用':!vipTime?'会员已过期':'会员使用至：'+filters.formatDate(vipTime,5)}}
-                        </view>
-                        <!-- #endif -->
                     </view>
                     <view class="uRtopRight">
                         <image class="edit" src="/static/edit_new.png" mode="" />
@@ -27,84 +21,15 @@
             </view>
         </view>
     </view>
-    <!-- #if MP -->
-    <view class="scrollViewBox" wx:if="{{vipTime!='1'&&!isIos}}">
-        <scroll-view class="goodsList" scroll-x="true" enhanced show-scrollbar="{{false}}">
-            <view wx:for="{{products}}" wx:key="id"
-                class="payBox {{item.payType=='LIFELONG'?'pbbg2':item.payType=='YEAR'?'pbbg1':'pbbg3'}}"
-                bindtap="openDonutBuy" data-product="{{item}}">
-                <view class="pay">
-                    {{isPreferential?'立即续费':'立即开通'}}
-                </view>
-            </view>
-        </scroll-view>
-        <view class="goodsTips">虚拟产品不支持退货</view>
-    </view>
-    <!-- #endif -->
-    <!-- ios -->
-    <!-- <view class="longpressBox" wx:if="{{isIos}}">
-        <image src="https://reader-wx.ai160.com/images/reader/v3/pay1.png" class="iosVip" />
-        <image src="{{qrCode}}" class="qrCode" show-menu-by-longpress="{{true}}" />
-    </view> -->
-    <!-- #if MP -->
-    <view class="menu">
-        <view class="activation" bindtap="activationCode" wx:if="{{vipTime!='1'}}">
-            <view class="tips">
-                <image src="/static/activation.png" class="tipsImg" />学习卡激活
-            </view>
-            <image class='black' src='/static/black.png'></image>
-        </view>
-        <view class="activation" bindtap="toGzh">
-            <view class="tips">
-                <image src="/static/care.png" class="tipsImg" />关注公众号不迷路，更多福利等您！
-            </view>
-            <image class='black' src='/static/black.png'></image>
-        </view>
-        <view class="activation" bindtap="jump" data-url="/salesperson/pages/sale/index"
-            wx:if="{{!userInfo.user.saleUserId}}">
-            <view class="tips">
-                <image src="/static/tjg.png" class="tipsImg" />成为推荐官
-            </view>
-            <image class='black' src='/static/black.png'></image>
-        </view>
-        <view class="activation" bindtap="jump" data-url="/salesperson/pages/saleOffice/index" wx:else>
-            <view class="tips">
-                <image src="/static/tjg.png" class="tipsImg" />推荐中心
-            </view>
-            <image class='black' src='/static/black.png'></image>
-        </view>
-        <view class="activation" bindtap="jump"
-            data-url="/pages/rankIntro/index?img=https://reader-wx.ai160.com/images/reader/v3/jghz.jpg">
-            <view class="tips">
-                <image src="/static/fs.png" class="tipsImg" style="height: 34rpx;" />机构合作
-            </view>
-            <image class='black' src='/static/black.png'></image>
-        </view>
-        <button class="resetBtn activation" open-type="contact" plain="true">
-            <view class="tips">
-                <image src="/static/contact.png" class="tipsImg" />联系我们
-            </view>
-            <image class='black' src='/static/black.png'></image>
-        </button>
-        <!--     <view class="activation" bindtap="jump" data-url="/pages/orderRecord/index">
-            <view class="tips">
-                <image src="/static/care.png" class="tipsImg" />购买记录
+    <scroll-view class="goodsList" scroll-x="true" enhanced show-scrollbar="{{false}}">
+        <view wx:for="{{products}}" wx:key="id"
+            class="payBox {{item.payType=='LIFELONG'?'pbbg2':item.payType=='YEAR'?'pbbg1':'pbbg3'}}"
+            bindtap="openDonutBuy" data-product="{{item}}">
+            <view class="pay">
+               立即开通
             </view>
-            <image class='black' src='/static/black.png'></image>
-        </view> -->
-    </view>
-    <!-- #endif -->
-    <!-- 弹窗 -->
-    <view class="activationModal" wx:if="{{activationModal}}">
-        <view class="box zoomIn">
-            <image src="{{activationRes.code==200?'/static/lan.png':'/static/df.png'}}" class="sLcon" />
-            <view class="tips1">{{activationRes.code==200?'恭喜您，激活成功':'很遗憾，激活失败'}}</view>
-            <view class="tips2">{{activationRes.message}}</view>
-            <image src="/static/lollipop.png" class="close" catchtap="closeModal" />
         </view>
-    </view>
+    </scroll-view>
     <donutBuy id="donutBuy" bind:reload='paySuccess'></donutBuy>
     <vipModal id="vipModal"></vipModal>
-    <gzhModal id="gzh"></gzhModal>
-    <canvas id='vip' type="2d"> </canvas>
 </view>

pages/my/index.wxss

@@ -54,10 +54,6 @@
   font-size: 24rpx;
   color: #989A9C;
 }
-.container .userBox .above .userRight .uRtop .uRtopleft .validity {
-  font-size: 24rpx;
-  color: #FE9221;
-}
 .container .userBox .above .userRight .uRtop .uRtopRight {
   display: flex;
   align-items: center;
@@ -71,50 +67,14 @@
   font-size: 24rpx;
   color: #666;
 }
-.container .menu {
-  margin-top: 30rpx;
-  border-radius: 20rpx;
-  background-color: white;
-}
-.container .menu .activation {
-  padding: 28rpx 20rpx;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  border-bottom: 1rpx solid #EEEEEE;
-}
-.container .menu .activation .tips {
-  display: flex;
-  align-items: center;
-  font-weight: 400;
-  font-size: 30rpx;
-}
-.container .menu .activation .tips .tipsImg {
-  margin-right: 14rpx;
-  width: 44rpx;
-  height: 44rpx;
-}
-.container .menu .activation .black {
-  margin-right: 20rpx;
-  width: 16rpx;
-  height: 30rpx;
-  opacity: 0.8;
-}
-.container .menu .activation:last-child {
-  border: none;
-}
-.container .scrollViewBox {
-  position: relative;
-  width: 100vw;
-}
-.container .scrollViewBox .goodsList {
+.container .goodsList {
   margin-top: 40rpx;
   width: 100%;
   height: 310rpx;
   white-space: nowrap;
   box-sizing: border-box;
 }
-.container .scrollViewBox .goodsList .payBox {
+.container .goodsList .payBox {
   position: relative;
   margin-right: 22rpx;
   width: 268rpx;
@@ -124,7 +84,7 @@
   display: inline-block;
   border-radius: 20rpx;
 }
-.container .scrollViewBox .goodsList .payBox .pay {
+.container .goodsList .payBox .pay {
   position: absolute;
   bottom: 24rpx;
   left: 50%;
@@ -134,7 +94,7 @@
   font-weight: bold;
   border-radius: 50rpx;
 }
-.container .scrollViewBox .goodsList .payBox::after {
+.container .goodsList .payBox::after {
   content: '';
   position: absolute;
   width: 268rpx;
@@ -145,102 +105,21 @@
   border-radius: 22rpx 22rpx 0rpx 0rpx;
   opacity: 0.26;
 }
-.container .scrollViewBox .goodsList .pbbg1 {
+.container .goodsList .pbbg1 {
   background-image: url(http://reader-wx.ai160.com/images/reader/v3/12992x.png);
 }
-.container .scrollViewBox .goodsList .pbbg1 .pay {
+.container .goodsList .pbbg1 .pay {
   background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
 }
-.container .scrollViewBox .goodsList .pbbg2 {
+.container .goodsList .pbbg2 {
   background-image: url(http://reader-wx.ai160.com/images/reader/v3/2992x.png);
 }
-.container .scrollViewBox .goodsList .pbbg2 .pay {
+.container .goodsList .pbbg2 .pay {
   background: linear-gradient(285deg, #DFF2EE 0%, #D8E9FD 39%, #BDE6F8 72%, #BAE7F7 100%);
 }
-.container .scrollViewBox .goodsList .pbbg3 {
+.container .goodsList .pbbg3 {
   background-image: url(http://reader-wx.ai160.com/images/reader/v3/55152x.png);
 }
-.container .scrollViewBox .goodsList .pbbg3 .pay {
+.container .goodsList .pbbg3 .pay {
   background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
 }
-.container .scrollViewBox .goodsTips {
-  position: absolute;
-  font-size: 24rpx;
-  color: #555;
-  bottom: 0;
-}
-.container .longpressBox {
-  position: relative;
-}
-.container .longpressBox .iosVip {
-  margin-top: 30rpx;
-  height: 230rpx;
-  width: 710rpx;
-}
-.container .longpressBox .qrCode {
-  position: absolute;
-  top: 59rpx;
-  right: 40rpx;
-  width: 174rpx;
-  height: 174rpx;
-}
-.container .activationModal {
-  position: fixed;
-  z-index: 2;
-  left: 0rpx;
-  top: 0rpx;
-  width: 100vw;
-  height: 100vh;
-  background: rgba(0, 0, 0, 0.7);
-  /* .vipModal {
-      position: relative;
-      left: 0;
-      right: 0;
-      top: 30%;
-      margin: auto;
-      border-radius: 20rpx;
-      text-align: center;
-
-      .mBg {
-        width: 600rpx;
-      }
-    }
- */
-}
-.container .activationModal .box {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 30%;
-  margin: auto;
-  width: 496rpx;
-  height: 365rpx;
-  background-color: white;
-  border-radius: 20rpx;
-  text-align: center;
-}
-.container .activationModal .box .sLcon {
-  margin-top: 34rpx;
-  width: 100rpx;
-  height: 100rpx;
-}
-.container .activationModal .box .tips1 {
-  margin: 36rpx 0rpx 24rpx;
-  color: #131313;
-  font-weight: bold;
-  font-size: 34rpx;
-}
-.container .activationModal .box .tips2 {
-  font-size: 30rpx;
-  color: #12C962;
-}
-.container .activationModal .close {
-  position: absolute;
-  padding: 40rpx;
-  width: 54rpx;
-  height: 54rpx;
-  left: 0;
-  right: 0;
-  bottom: -140rpx;
-  margin: auto;
-}