优化逻辑

app.js

@@ -15,14 +15,20 @@ App({
         this.getNavbarInfo()
     },
     async onShow(options) {
-        let shareUid = options.query.uid
-        this.login(shareUid)
-    },
-    login(shareUid) {
         this.storeBindings = createStoreBindings(this, {
             store,
             actions: ['setUser']
         })
+        let shareUid = options.query.uid
+        let uid = wx.getStorageSync('uid')
+        let userInfo = wx.getStorageSync('user')
+        if (uid && userInfo) {
+            this.setUser(userInfo)
+        } else {
+            this.login(shareUid)
+        }
+    },
+    login(shareUid) {
         wx.login({
             success: async (res) => {
                 if (res.code) {

pages/index/index.js

@@ -30,17 +30,13 @@ Page({
                 selected: 1
             })
         }
-        this.storeBindings = createStoreBindings(this, {
-            store,
-            fields: {
-                userInfo: 'userInfo'
-            },
-        })
-        this.storeBindings.updateStoreBindings()
+
         if (wx.getStorageSync('uid')) {
+            this.getLocUserInfo()
             this.loadMore()
         } else {
             getApp().callBack = (res) => {
+                this.getLocUserInfo()
                 this.loadMore()
             }
         }
@@ -48,6 +44,15 @@ Page({
     onUnload() {
         this.storeBindings.destroyStoreBindings()
     },
+    getLocUserInfo() {
+        this.storeBindings = createStoreBindings(this, {
+            store,
+            fields: {
+                userInfo: 'userInfo'
+            },
+        })
+        this.storeBindings.updateStoreBindings()
+    },
     loadMore() {
         if (this.data.currentType == '1') {
             this.getData(getHotrecommendList, {

pages/reading/index.js

@@ -2,6 +2,7 @@ import {
     getreadInfo
 } from '~/api/video'
 let rowHeight = 0
+let videoContext = null
 Page({
     data: {
         videoInfo: {},
@@ -82,6 +83,7 @@ Page({
             this.rowHeight = rect.height
             console.log(rect);
         }).exec()
+        this.videoContext = wx.createVideoContext('myVideo')
     },
     async getreadInfo(videoId) {
         let videoInfo = await getreadInfo(videoId)
@@ -95,26 +97,30 @@ Page({
     },
     // 开始录制
     setCountDown() {
-        // this.setData({
-        //     state: true,
-        //     'countDown.state': true
-        // })
-        // let sto = setInterval(() => {
-        //     if (this.data.countDown.num == 0) {
-        //         clearInterval(sto)
-        //         this.setData({
-        //             countDown: {
-        //                 state: false,
-        //                 num: 3
-        //             }
-        //         })
-        this.startRecording()
-        //     } else {
-        //         this.setData({
-        //             'countDown.num': --this.data.countDown.num
-        //         })
-        //     }
-        // }, 1000)
+        if (this.data.state) {
+            return
+        }
+        this.setData({
+            'countDown.state': true
+        })
+        setInterval(() => {
+            if (this.data.countDown.num == 0) {
+                clearInterval(this.stl)
+                this.setData({
+                    state: true,
+                    countDown: {
+                        state: false,
+                        num: 3
+                    }
+                })
+                this.videoContext.play()
+                this.startRecording()
+            } else {
+                this.setData({
+                    'countDown.num': --this.data.countDown.num
+                })
+            }
+        }, 1000)
     },
     startRecording() {
         if (this.data.currentRow == null) {
@@ -137,6 +143,14 @@ Page({
             },
             row.readTime);
     },
+    // 视频播放结束
+    videoEnd() {
+        this.setData({
+            currentRow: null,
+            state: false,
+            scrollTop: 0,
+        })
+    },
     /**
      * 生命周期函数--监听页面卸载
      */

pages/reading/index.less

@@ -24,7 +24,7 @@
             position: absolute;
             top: 0rpx;
             width: 100%;
-            height: 90rpx;
+            height: 80rpx;
             z-index: 10;
             background: linear-gradient(to bottom, rgb(255, 255, 255), rgba(255, 255, 255, 0.4))
         }
@@ -38,8 +38,8 @@
             box-sizing: border-box;
 
             .row {
-                padding: 16rpx 0rpx;
-                font-size: 42rpx;
+                padding: 18rpx 0rpx;
+                font-size: 40rpx;
             }
 
             .currentRow {
@@ -75,6 +75,7 @@
             width: 114rpx;
             height: 114rpx;
             box-shadow: #4EC4FF 0px 0rpx 14rpx;
+            background-color: #4EC4FF;
         }
 
         .text {
@@ -86,13 +87,13 @@
 
     .playImgBg {
         position: absolute;
-        width: 126rpx;
-        height: 126rpx;
+        width: 134rpx;
+        height: 124rpx;
         z-index: 1;
-        left: -2rpx;
+        left: -1rpx;
         right: 0px;
         margin: auto;
-        bottom: calc(54rpx + env(safe-area-inset-bottom));
+        bottom: calc(56rpx + env(safe-area-inset-bottom));
         background-color: white;
         box-shadow: rgba(14, 30, 37, 0.12) 0px 2rpx 4rpx 0px, rgba(14, 30, 37, 0.32) 0px 2rpx 16rpx 0px;
         border-radius: 50%;

pages/reading/index.wxml

@@ -1,20 +1,20 @@
 <view class="readingBox">
-    <video id="myVideo" src="{{videoInfo.userRead.videoPath}}" controls="{{false}}"
+    <video id="myVideo" src="{{videoInfo.userRead.videoPath}}" bindended='videoEnd' controls="{{false}}"
         show-center-play-btn="{{false}}"></video>
     <view class="contentBox">
         <view class="articleMask"></view>
         <scroll-view class="content" scroll-y enhanced show-scrollbar="{{false}}" scroll-top="{{scrollTop}}"
             scroll-with-animation>
-            <view style="height: 86rpx;"></view>
+            <view style="height: 60rpx;"></view>
             <view class="row {{currentRow==index?'currentRow':''}}" wx:for="{{article}}" wx:key="id">{{item.text}}
             </view>
         </scroll-view>
     </view>
-    <view class="controller" wx:if="{{!state}}">
-        <image src="/static/work.png" class="playImg" bindtap="setCountDown" />
-        <view class="text">开始挑战</view>
+    <view class="controller">
+        <image src="{{state?'/static/readingNow.gif':'/static/work.png'}}" class="playImg" bindtap="setCountDown" />
+        <view class="text">{{state?'完成录制':'开始挑战'}}</view>
     </view>
-    <view class="playImgBg" wx:if="{{!state}}"></view>
+    <view class="playImgBg"></view>
     <!-- 倒计时 -->
     <view class="countDownBox" wx:if="{{countDown.state}}">
         <view class="countDown">

pages/reading/index.wxss

@@ -20,7 +20,7 @@
   position: absolute;
   top: 0rpx;
   width: 100%;
-  height: 90rpx;
+  height: 80rpx;
   z-index: 10;
   background: linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0.4));
 }
@@ -33,8 +33,8 @@
   box-sizing: border-box;
 }
 .readingBox .contentBox .content .row {
-  padding: 16rpx 0rpx;
-  font-size: 42rpx;
+  padding: 18rpx 0rpx;
+  font-size: 40rpx;
 }
 .readingBox .contentBox .content .currentRow {
   font-weight: bold;
@@ -65,6 +65,7 @@
   width: 114rpx;
   height: 114rpx;
   box-shadow: #4EC4FF 0px 0rpx 14rpx;
+  background-color: #4EC4FF;
 }
 .readingBox .controller .text {
   position: absolute;
@@ -73,13 +74,13 @@
 }
 .readingBox .playImgBg {
   position: absolute;
-  width: 126rpx;
-  height: 126rpx;
+  width: 134rpx;
+  height: 124rpx;
   z-index: 1;
-  left: -2rpx;
+  left: -1rpx;
   right: 0px;
   margin: auto;
-  bottom: calc(54rpx + env(safe-area-inset-bottom));
+  bottom: calc(56rpx + env(safe-area-inset-bottom));
   background-color: white;
   box-shadow: rgba(14, 30, 37, 0.12) 0px 2rpx 4rpx 0px, rgba(14, 30, 37, 0.32) 0px 2rpx 16rpx 0px;
   border-radius: 50%;