bayi 9 months atrás
parent
commit
de1ae4418a
6 changed files with 90 additions and 103 deletions
  1. 2 2
      app.js
  2. 1 0
      pages/index/index.js
  3. 0 1
      pages/my/index.js
  4. 43 52
      pages/my/index.less
  5. 9 7
      pages/my/index.wxml
  6. 35 41
      pages/my/index.wxss

+ 2 - 2
app.js

@@ -34,7 +34,7 @@ App({
         let uid = wx.getStorageSync('uid')
         if (uid) {
             let userInfo = await getMyInfo()
-            console.log(userInfo);
+            console.log(userInfo,'zzz');
             this.setUser(userInfo)
             this.globalData.userInfo = userInfo
             if (getApp().callBack) {
@@ -42,7 +42,7 @@ App({
             }
         } else {
             let userRes = await androidLogin({extOpenId:'1234567',channel:'3016',grade:'PRIMARY_FIRST_GRADE'})
-            console.log(userRes);
+            console.log(userRes,'455');
             this.setUser(userRes)
             wx.setStorageSync('uid', userRes.uid)
             wx.setStorageSync('user', userRes)

+ 1 - 0
pages/index/index.js

@@ -62,6 +62,7 @@ Page({
         })
     },
     async getResource() {
+        console.log(this.data.userInfo);
         let data = await getResourceList({
             grade: this.data.userInfo.grade
         })

+ 0 - 1
pages/my/index.js

@@ -79,7 +79,6 @@ Page({
         currentTarget
     }) {
         let product = currentTarget.dataset.product
-        console.log(product);
         this.selectComponent('#donutBuy').open(product)
     },
     jump({

+ 43 - 52
pages/my/index.less

@@ -81,72 +81,63 @@
         }
     }
 
-    .goodsList {
+    .product {
         margin-top: 40rpx;
         width: 100%;
-        height: 310rpx;
-        white-space: nowrap;
         box-sizing: border-box;
+        background-color: white;
+        padding: 18rpx 23rpx 70rpx;
+        border-radius: 20rpx;
 
-        .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;
-            }
+        .title {
+            margin-bottom: 14rpx;
+            font-size: 28rpx;
+            color: #000000;
         }
 
-        .payBox::after {
-            content: '';
-            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;
-        }
+        .goodsList {
 
-        .pbbg1 {
-            background-image: url(http://reader-wx.ai160.com/images/reader/v3/12992x.png);
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
 
-            .pay {
-                background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
-            }
-        }
+            .payBox {
+                position: relative;
+                width: 318rpx;
+                height: 318rpx;
+                background-size: cover;
+                text-align: center;
+                display: inline-block;
+                border-radius: 20rpx;
 
-        .pbbg2 {
-            background-image: url(http://reader-wx.ai160.com/images/reader/v3/2992x.png);
+                .name {
+                    margin-top: 42rpx;
+                    font-weight: 500;
+                    font-size: 40rpx;
+                }
 
-            .pay {
-                background: linear-gradient(285deg, #DFF2EE 0%, #D8E9FD 39%, #BDE6F8 72%, #BAE7F7 100%);
-            }
-        }
+                .price {
+                    margin-top: 22rpx;
+                    font-weight: 500;
+                    font-size: 56rpx;
+                }
 
+                .originPrice {
+                    margin-top: 28rpx;
+                    font-size: 24rpx;
+                    text-decoration: line-through;
+                }
+            }
 
-        .pbbg3 {
-            background-image: url(http://reader-wx.ai160.com/images/reader/v3/55152x.png);
+            .year {
+                background-image: url(https://reader-wx.ai160.com/images/reader/pay/yuedao365.webp);
+                color: #FEF4B5;
+            }
 
-            .pay {
-                background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
+            .month {
+                background-image: url(http://reader-wx.ai160.com/images/reader/pay/yuedao90.webp);
+                color: #7D320A;
             }
         }
-
     }
-  
 }

+ 9 - 7
pages/my/index.wxml

@@ -21,15 +21,17 @@
             </view>
         </view>
     </view>
-    <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 class="product">
+        <view class="title">开通会员</view>
+        <view class="goodsList">
+            <view wx:for="{{products}}" wx:key="id" class="payBox {{item.payType=='YEAR'?'year':'month'}}"
+                bindtap="openDonutBuy" data-product="{{item}}">
+                <view class="name">{{item.title}}</view>
+                <view class="price">{{item.price/100}}元</view>
+                <view class="originPrice">原价:330元</view>
             </view>
         </view>
-    </scroll-view>
+    </view>
     <donutBuy id="donutBuy" bind:reload='paySuccess'></donutBuy>
     <vipModal id="vipModal"></vipModal>
 </view>

+ 35 - 41
pages/my/index.wxss

@@ -67,59 +67,53 @@
   font-size: 24rpx;
   color: #666;
 }
-.container .goodsList {
+.container .product {
   margin-top: 40rpx;
   width: 100%;
-  height: 310rpx;
-  white-space: nowrap;
   box-sizing: border-box;
+  background-color: white;
+  padding: 18rpx 23rpx 70rpx;
+  border-radius: 20rpx;
+}
+.container .product .title {
+  margin-bottom: 14rpx;
+  font-size: 28rpx;
+  color: #000000;
+}
+.container .product .goodsList {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }
-.container .goodsList .payBox {
+.container .product .goodsList .payBox {
   position: relative;
-  margin-right: 22rpx;
-  width: 268rpx;
-  height: 268rpx;
+  width: 318rpx;
+  height: 318rpx;
   background-size: cover;
   text-align: center;
   display: inline-block;
   border-radius: 20rpx;
 }
-.container .goodsList .payBox .pay {
-  position: absolute;
-  bottom: 24rpx;
-  left: 50%;
-  transform: translateX(-50%);
-  padding: 6rpx 40rpx;
-  font-size: 26rpx;
-  font-weight: bold;
-  border-radius: 50rpx;
-}
-.container .goodsList .payBox::after {
-  content: '';
-  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;
-}
-.container .goodsList .pbbg1 {
-  background-image: url(http://reader-wx.ai160.com/images/reader/v3/12992x.png);
-}
-.container .goodsList .pbbg1 .pay {
-  background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
+.container .product .goodsList .payBox .name {
+  margin-top: 42rpx;
+  font-weight: 500;
+  font-size: 40rpx;
 }
-.container .goodsList .pbbg2 {
-  background-image: url(http://reader-wx.ai160.com/images/reader/v3/2992x.png);
+.container .product .goodsList .payBox .price {
+  margin-top: 22rpx;
+  font-weight: 500;
+  font-size: 56rpx;
 }
-.container .goodsList .pbbg2 .pay {
-  background: linear-gradient(285deg, #DFF2EE 0%, #D8E9FD 39%, #BDE6F8 72%, #BAE7F7 100%);
+.container .product .goodsList .payBox .originPrice {
+  margin-top: 28rpx;
+  font-size: 24rpx;
+  text-decoration: line-through;
 }
-.container .goodsList .pbbg3 {
-  background-image: url(http://reader-wx.ai160.com/images/reader/v3/55152x.png);
+.container .product .goodsList .year {
+  background-image: url(https://reader-wx.ai160.com/images/reader/pay/yuedao365.webp);
+  color: #FEF4B5;
 }
-.container .goodsList .pbbg3 .pay {
-  background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
+.container .product .goodsList .month {
+  background-image: url(http://reader-wx.ai160.com/images/reader/pay/yuedao90.webp);
+  color: #7D320A;
 }