合并

app.json

@@ -22,7 +22,8 @@
     "navigationBarBackgroundColor": "#61CA54",
     "navigationBarTitleText": "小学语文课文朗读",
     "navigationBarTextStyle": "white",
-    "backgroundColor": "#61CA54"
+    "backgroundColor": "#61CA54",
+    "onReachBottomDistance": 50
   },
   "debug": false
 }

component/hot/hot.js

@@ -19,6 +19,7 @@ export const hotInit = (that) => {
         banner: [],
         recommend: [],
         hotWorks: [],
+        winH: that.data.winH
       }
     }),
     // 搜索方法
@@ -70,7 +71,7 @@ export const hotInit = (that) => {
     httpRequestApi.getIndex(
       uid
     ).success((res) => {
-    
+
       const banner = res.data.data.banner;
       const recommend = res.data.data.recommendLesson;
       const bannerTemp = [];
@@ -79,7 +80,7 @@ export const hotInit = (that) => {
         temp.url = item.boothContent;
         temp.type = item.operationType;
         temp.id = item.operationContent;
-    
+
         bannerTemp.push(temp);
       });
       const recommendTemp = [];
@@ -105,24 +106,28 @@ export const hotInit = (that) => {
       pageNo,
       pageSize
     ).success((res) => {
-      const recommendRes = res.data.data.list;
-      const recommendWorks = [];
-      recommendRes.forEach(item => {
-        const temp = {};
-        temp.title = item.userRead.title;
-        temp.grade = item.userRead.title;
-        temp.img = item.userRead.iconImg;
-        temp.plays = item.userRead.playAmount ? item.userRead.playAmount : 0;
-        temp.likes = item.userRead.likeAmount ? item.userRead.likeAmount : 0;
-        temp.classId = item.userRead.id;
-        recommendWorks.push(temp);
-      });
-      const hotStr = 'hotData.hotWorks'
-      that.setData({
-        [hotStr]: recommendWorks
-      })
+      console.log(res)
+        const recommendRes = res.data.data.list;
+        // const recommendWorks = [];
+        recommendRes.forEach(item => {
+          const temp = {};
+          temp.title = item.userRead.title;
+          temp.grade = item.userRead.title;
+          temp.img = item.userRead.iconImg;
+          temp.plays = item.userRead.playAmount ? item.userRead.playAmount : 0;
+          temp.likes = item.userRead.likeAmount ? item.userRead.likeAmount : 0;
+          temp.classId = item.userRead.id;
+          // recommendWorks.push(temp);
+          that.data.hotData.hotWorks.push(temp);
+        });
+        const hotStr = 'hotData.hotWorks'
+        that.setData({
+          [hotStr]: that.data.hotData.hotWorks,
+          recommendTotalNo: res.data.data.totalNo
+        })
     })
   }
+
   // 去全部课本
   that.goToBooks = () => {
     wx.navigateTo({
@@ -134,10 +139,14 @@ export const hotInit = (that) => {
     const id = e.currentTarget.dataset.id;
     switch (type) {
       case 'LESSON':
-        that.openClass('tap',id);
+        that.openClass('tap', id);
         break;
     }
   }
+  // 下拉加载
+  that.scrollUpdate = (e) => {
+    console.log(e)
+  }
   that.getIndex();
   that.getHotRecommend(1, 1, 3)
 }

component/hot/hot.wxml

@@ -46,7 +46,7 @@
                 <text>人气推荐</text>
             </view>
         </view>
-        <view class="hotWares" style="flex-direction:row;">
+        <view class="hotWares"  >
             <view wx:for="{{hotData.hotWorks}}" wx:key="{{index}}" class="hotWareCard" bindtap="openWorks" data-readId="1541489786444388" data-title="{{item.title}}">
                 <image class="wareCardImg" src="{{item.img}}" />
                 <text class="wareCardTitle">{{item.title}}</text>

pages/index/index.js

@@ -39,7 +39,12 @@ Page({
         templates: 'my',
       }
     ],
+    winH: 568,
     myIndex: 1,
+    recommendPageNo:1,
+    recommendTotalNo:0,
+    followPageNo:1,
+    followPageSize:0,
     templates: 'hot',
     title: 'index中的title',
     jurisdictionFlag: true,
@@ -84,6 +89,14 @@ Page({
     }
   },
   onLoad: function (options) {
+    this.uid = wx.getStorageSync('uid');
+    wx.getSystemInfo({
+      success: (res) => {
+        this.setData({
+          winH: res.windowHeight
+        });
+      }
+    });
     if (options.index) {
       this.updateData(options.index)
     }
@@ -93,8 +106,7 @@ Page({
   },
   onShow: function () {
     // this.init();
-    getOpenidSessionKey((res) => {
-    }, (error) => {
+    getOpenidSessionKey((res) => {}, (error) => {
       // console.log(error)
       this.setData({
         hide: !this.data.hide
@@ -116,5 +128,22 @@ Page({
       //   jurisdictionFlag: false
       // })
     });
+  },
+  // 触底加载
+  onReachBottom: function () {
+    console.log(this.data.recommendPageNo)
+    console.log('bottom')
+    // 当前在推荐页面 加载推荐
+    if (this.data.myIndex === 1) {
+      this.setData({
+        recommendPageNo: this.data.recommendPageNo+1
+      })
+      if(this.data.recommendPageNo <= this.data.recommendTotalNo ){
+        this.getHotRecommend(this.uid, this.data.recommendPageNo, 3);
+        
+      } else {
+        console.log('没有更多')
+      }
+    }
   }
 })

pages/index/index.json

@@ -1,5 +1,8 @@
 {
     "usingComponents": {
         "Dialog": "../../component/dialog/dialog"
-    }
+    },
+    "window": {
+        "onReachBottomDistance": 50
+      }
   }

pages/main/class/class.js

@@ -83,5 +83,9 @@ Page({
         works: readTemp
       })
     });
+  },
+  // 下拉加载
+  scrollUpdate:function(e){
+    console.log(e)
   }
 })

pages/main/class/class.wxml

@@ -1,6 +1,6 @@
 <view class="classPage">
     <video id="classVideo" class="videoSection" src="{{videoUrl}}" controls show-fullscreen-btn="{{fullScreenBtn}}" show-play-btn="{{playBtn}}"></video>
-    <view class="readWorksSection">
+    <scroll-view class="readWorksSection" lower-threshold="160" bindscrolltolower="scrollUpdate">
         <view class="peopleNum">
             <image class="peoplesIcon" src="../../../static/image/peoples.png" />
             <view class="title">共有{{total}}人完成了录音</view>
@@ -16,7 +16,7 @@
                 <text class="likeNum">{{item.likes}}</text>
             </view>
         </view>
-    </view>
+    </scroll-view>
     <view class="footSection">
         <image class="blackbord" src="../../../static/image/blackbord.png" />
         <view class="collectBtn footerBtn">

pages/main/class/class.wxss

@@ -70,6 +70,7 @@
 }
 .readWorksSection {
     width: 100%;
+    height: 100%;
     background: #e8e8e8;
     margin-bottom: 150rpx;
 }

pages/social/works/works.js

@@ -1,5 +1,7 @@
 import httpRequestApi from '../../../utils/APIClient';
-import {formatDate} from '../../../utils/util';
+import {
+    formatDate
+} from '../../../utils/util';
 Page({
     data: {
         fullScreenBtn: false,
@@ -12,6 +14,9 @@ Page({
         user: [],
         inputValue: 'smdx',
         replyList: [],
+        howMuch: '2000',
+        moneySelect: 'moneySelect',
+        moneyNormal: 'moneyNormal'
     },
     onLoad: function (option) {
         if (option.title) {
@@ -42,6 +47,7 @@ Page({
                 user: othersTemp,
                 author: author.wechatName,
                 authorAvatar: author.avatar,
+                authorUid: author.uid,
                 videoSrc: works.originVideo,
                 audioSrc: works.audioPath
             })
@@ -103,16 +109,16 @@ Page({
             console.log(res.data.data.list);
             const replyList = res.data.data.list;
             const replyTemp = [];
-            replyList.forEach((item)=>{
+            replyList.forEach((item) => {
                 const temp = {};
                 temp.nickName = item.user.wechatName;
                 temp.avatar = item.user.avatar;
                 temp.text = item.detailDesc;
                 temp.id = item.id;
-                temp.replyCount=item.replyCount;
-                temp.time = formatDate(item.gmtCreated,3);
+                temp.replyCount = item.replyCount;
+                temp.time = formatDate(item.gmtCreated, 3);
                 console.log(temp.time)
-                replyTemp.push(temp); 
+                replyTemp.push(temp);
             });
             this.setData({
                 replyList: replyTemp,
@@ -149,5 +155,55 @@ Page({
                 console.log(res);
             });
         }
-    }
+    },
+    // 选择金额
+    setMoney: function(e){
+        this.setData({
+            howMuch: e.currentTarget.dataset.money
+        })
+    },
+    // 奖励
+    rewardMoney: function () {
+        console.log(this.data.authorUid);
+        const data = {
+            targetUid: this.data.authorUid,
+            amount: "50"
+        }
+        let uid = wx.getStorageSync('uid');
+        httpRequestApi.rewardMoney(uid, data).success(res => {
+            console.log(res);
+            this.payMoneyt(res.data.data);
+        })
+
+    },
+    //支付
+    payMoneyt: function (orderInfo) {
+        wx.requestPayment({
+            'appId': orderInfo.appId,
+            'timeStamp': orderInfo.timeStamp,
+            'nonceStr': orderInfo.nonceStr,
+            'package': orderInfo.package,
+            'signType': orderInfo.signType,
+            'paySign': orderInfo.sign,
+            'success': function (res) {
+                console.log(res)
+                wx.showModal({
+                    title: '提示',
+                    content: '支付成功',
+                    success(res) {
+                        if (res.confirm) {
+                            console.log('点击确定')
+                        } else if (res.cancel) {
+                            console.log('取消')
+                        }
+                    }
+                })
+
+            },
+            'fail': function (res) {
+                console.log('支付失败', res)
+            }
+        })
+    },
+
 })

pages/social/works/works.wxml

@@ -19,7 +19,7 @@
         <scroll-view scroll-x class="scrollWrapper" scroll-with-animation="true">
             <view class="avatarRow">
                 <view class="userItem" wx:for="{{user}}" wx:key="{{index}}">
-                    <image src="{{item.image}}" bindtap="goToOthers" data-uid = "{{item.uid}}" />
+                    <image src="{{item.image}}" bindtap="goToOthers" data-uid="{{item.uid}}" />
                 </view>
             </view>
         </scroll-view>
@@ -29,13 +29,15 @@
         <input class="commentInput" bindconfirm="sendHandler" confirm-type="send" placeholder="听了这么多，说点什么吧" bindinput="inputValue"></input>
     </view>
     <view class="commentArea">
-        <view class="commentItem" wx:for="{{replyList}}" wx:key="{{index}}" >
+        <view class="commentItem" wx:for="{{replyList}}" wx:key="{{index}}">
             <image class="avatar" src="{{item.avatar}}" />
             <view class="commentCore">
                 <text class="nickName">{{item.nickName}}</text>
                 <text class="time">{{item.time}}</text>
                 <text class="gut">{{item.text}}</text>
-                <view class="commentAll" bindtap="goToDetail" data-id="{{item.id}}" data-count="{{item.replyCount}}">共有{{item.replyCount}}条评论</view>
+                <view class="commentAll" bindtap="goToDetail" data-id="{{item.id}}" data-count="{{item.replyCount}}">
+                    共有{{item.replyCount}}条评论
+                </view>
             </view>
             <view class="btnWrapper">
                 <image class="commentBtn" src="../../../static/image/comment.png" />
@@ -47,7 +49,7 @@
     </view>
     <view class="footSection">
         <image class="blackbord" src="../../../static/image/blackbord.png" />
-        <view class="collectBtn footerBtn">
+        <view class="collectBtn footerBtn" bindtap="reward">
             <image src="../../../static/image/bonus.png" />
             <text>奖励</text>
         </view>
@@ -56,10 +58,30 @@
             <text>我要朗读</text>
         </view>
         <view class="shareBtn footerBtn">
-            <button open-type="share" plain="true" hover-class="none" >
+            <button open-type="share" plain="true" hover-class="none">
                 <image src="../../../static/image/share.png" />
                 <text>分享</text>
             </button>
         </view>
     </view>
+    <!-- 奖励弹窗 -->
+    <cover-view class="modalWrapper">
+        <cover-view class="rewardContent">
+            <cover-image class="rewardWrapper" src="../../../static/image/reward_wrapper.png" />
+            <cover-image class="rewardAvatar" src="{{authorAvatar}}" />
+            <cover-view class="rewardNickName">奖励给朗读者：{{author}}</cover-view>
+            <cover-view class="moneyArea">
+                <cover-view class="{{howMuch ==='1000' ? 'money moneySelect' : 'money moneyNormal'}}" bindtap="setMoney" data-money="1000">
+                    1.0元
+                </cover-view>
+                <cover-view class="{{howMuch ==='2000' ? 'money moneySelect' : 'money moneyNormal'}}" bindtap="setMoney" data-money="2000">
+                    2.0元
+                </cover-view>
+                <cover-view class="{{howMuch ==='3000' ? 'money moneySelect' : 'money moneyNormal'}}" bindtap="setMoney" data-money="3000">
+                    3.0元
+                </cover-view>
+            </cover-view>
+            <cover-view class="rewardBtn" bindtap="rewardMoney">立即奖励</cover-view>
+        </cover-view>
+    </cover-view>
 </view>

pages/social/works/works.wxss

@@ -326,4 +326,107 @@ button::after {
 
 .footSection .readingBtn text {
     margin-top: -10rpx;
+}
+
+/* 弹框 */
+.modalWrapper {
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    top: 0;
+    left: 0;
+    background: rgba(0, 0, 0, .2);
+    z-index: 2;
+}
+
+.modalWrapper .rewardContent {
+    width: 670rpx;
+    height: 926rpx;
+    position: relative;
+    margin: 50rpx auto 0;
+}
+
+.rewardContent .rewardWrapper {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+.rewardAvatar {
+    width: 172rpx;
+    height: 172rpx;
+    position: absolute;
+    z-index: 999;
+    border-radius: 50%;
+    top: 104rpx;
+    left: 260rpx;
+}
+
+.rewardNickName {
+    width: 100%;
+    margin: 0 auto;
+    font-size: 36rpx;
+    color: #fff;
+    text-align: center;
+    position: absolute;
+    top: 328rpx;
+
+}
+
+.moneyArea {
+    width: 84%;
+    height: 100rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 36rpx;
+    color: #fa8133;
+    margin: 0 65rpx;
+    position: absolute;
+    top: 550rpx;
+
+}
+
+.money {
+    width: 150rpx;
+    height: 90rpx;
+    border: 2rpx solid #ff9600;
+    border-radius: 12rpx;
+    text-align: center;
+    line-height: 90rpx;
+}
+
+.moneyNormal {
+    border: 2rpx solid #ff9600;
+    background: ff9600;
+}
+
+.moneySelect {
+    background: #fa8133;
+    color: #fff;
+    border: 0;
+}
+.rewardBtn {
+    width: 464rpx;
+    height: 80rpx;
+    display: block;
+    border-radius: 80rpx;
+    background: linear-gradient(180deg, #FEC953, #FCA40F);
+    background: -webkit-linear-gradient(180deg, #FEC953, #FCA40F);
+    background: -o-linear-gradient(180deg, #FEC953, #FCA40F);
+    background: -moz-linear-gradient(180deg, #FEC953, #FCA40F);
+    box-shadow: 0 6rpx 18rpx 0 rgba(0, 0, 0, 0.5);
+    background:  #FCA40F;
+    font-size: 40rpx;
+    color: #fff;
+    line-height: 80rpx;
+    text-align: center;
+    position: absolute;
+    z-index: 9999;
+    top: 718rpx;
+    left: 115rpx;
+
 }

utils/APIClient.js

@@ -203,4 +203,11 @@ module.exports = {
 			uid: wx.getStorageSync('uid')
 		}).url(url).send();
 	},
+	// 发起奖励
+	rewardMoney(uid, data){
+		let url = getBaseUrl(`wx/wallet/award`);
+		return request.getInstance().header({
+			uid
+		}).url(url).data(data).method('POST').send();
+	},
 }