Browse Source

开发作品播放组件的状态

sunxf 2 years ago
parent
commit
c5f897aca8
3 changed files with 79 additions and 6 deletions
  1. 2 0
      api/video.js
  2. 72 2
      pages/userWorks/index.js
  3. 5 4
      pages/userWorks/index.wxml

+ 2 - 0
api/video.js

@@ -5,4 +5,6 @@ import {
 module.exports = {
     //设置视频状态。比如删除。禁用
     setVideoStatus: data => request('/userRead', 'put', data),
+    // 作品点赞
+    likeVideo: data => request(`/userRead/like/${data}`, 'get')
 }

+ 72 - 2
pages/userWorks/index.js

@@ -2,7 +2,8 @@ import {
     getSelfRead
 } from '~/api/user'
 import {
-    setVideoStatus
+    setVideoStatus,
+    likeVideo
 } from '~/api/video'
 let videoContext = null
 Page({
@@ -101,7 +102,13 @@ Page({
             status: info.status === 'NORMAL' ? 'DISABLE' : 'NORMAL'
         }
         let res = await setVideoStatus(data)
-        this.getSelfRead()
+        let index = this.data.list.findIndex(item => {
+            return item.userRead.id == info.id
+        })
+        let status = `list[${index}].userRead.status`;
+        this.setData({
+            [status]: info.status === 'NORMAL' ? 'DISABLE' : 'NORMAL'
+        })
         if (res.status == 'DISABLE') {
             wx.showToast({
                 title: '该作品仅自己可见',
@@ -110,6 +117,69 @@ Page({
             })
         }
     },
+    // 下载视频
+    download: function ({
+        currentTarget
+    }) {
+        wx.showLoading({
+            title: '保存到本地',
+            mask: true
+        })
+        const {
+            url
+        } = currentTarget.dataset;
+        wx.downloadFile({
+            url,
+            success(res) {
+                // 只要服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务需要自行判断是否下载到了想要的内容
+                if (res.statusCode === 200) {
+                    wx.saveVideoToPhotosAlbum({
+                        filePath: res.tempFilePath,
+                        success(res) {
+                            wx.hideLoading()
+                            wx.showToast({
+                                title: '成功保存到相册!',
+                                duration: 3000,
+                                icon: 'success',
+                                mask: true
+                            })
+                        }
+                    })
+                }
+            },
+            fail() {
+                wx.hideLoading()
+                wx.showToast({
+                    title: '网络不给力',
+                    icon: 'error',
+                    duration: 3000,
+                    mask: true
+                })
+            }
+        })
+    },
+    // 点赞
+    async likeVideo({
+        currentTarget
+    }) {
+        let {
+            id,
+            like
+        } = currentTarget.dataset;
+        if (like) {
+            return
+        }
+        await likeVideo(id)
+        let index = this.data.list.findIndex(item => {
+            return item.userRead.id == id
+        })
+        let likeStr = `list[${index}].isLike`;
+        let likeNumStr = `list[${index}].userRead.likeAmount`;
+        this.setData({
+            [likeStr]: true,
+            [likeNumStr]: this.data.list[index].userRead.likeAmount + 1
+        })
+    },
     /**
      * 页面上拉触底事件的处理函数
      */

+ 5 - 4
pages/userWorks/index.wxml

@@ -12,7 +12,8 @@
                     </view>
                 </view>
                 <view class="wH-right" wx:if="{{item.userRead.status!='CHECK'}}">
-                    <view class="wH-right-btn">
+                    <view class="wH-right-btn" bindtap="download"
+                        data-url="{{item.userRead.markPath ? item.userRead.markPath : '' }}">
                         <image class="img" src="/static/index/down.png" mode="" />
                         <view class="text">下载</view>
                     </view>
@@ -61,9 +62,9 @@
                         </view>
                     </view>
                     <view class="mangeL">
-                        <view class="mangeL-box">
-                            <image
-                                src="{{item.userRead.isLike ? '/static/index/heart_colored.png' : '/static/index/heart.png'}}"
+                        <view class="mangeL-box" bindtap="likeVideo" data-like="{{item.isLike}}"
+                            data-id="{{item.userRead.id}}">
+                            <image src="{{item.isLike ? '/static/index/heart_colored.png' : '/static/index/heart.png'}}"
                                 mode="" class="icon" />
                             <view class="icon-name">{{filters.numFilter(item.userRead.likeAmount)}}</view>
                         </view>