1.删除在 VideoPage 添加标签功能

2.添加视频下载功能

src/api/video.js

@@ -1,4 +1,4 @@
-import { get, post } from '@/utils/request'
+import { get, post, delete0 } from '@/utils/request'
 
 const videoApi = {
   videoCategoryApi: '/api/content/video/category',
@@ -9,12 +9,14 @@ const videoApi = {
   updateVideoFileApi: '/api/content/video/submit',
   videoInfoApi: '/api/content/video/detail',
   videoUrlApi: '/api/content/video/url',
+  videoDownloadApi: '/api/content/video/download',
+  videoDeleteApi: '/api/content/video/delete',
 
   videoRecommendApi: '/api/content/video/recommend',
   similarVideoApi: '/api/content/video/similar',
   videoPageApi: '/api/content/video/page',
   videoTagApi: '/api/content/video/tag',
-  userVideoListApi: '/api/content/video/user',
+  userVideoPostApi: '/api/content/video/user',
   hotVideoApi: '/api/content/video/hot',
   userContentDataApi: '/api/content/userdata',
   playerRecordApi: '/api/media/video/play/record',
@@ -62,6 +64,17 @@ export function videoUrl(videoId) {
   return get(videoApi.videoUrlApi + '/' + videoId)
 }
 
+// 下载视频接口
+export function downloadVideo(videoId) {
+  return get(videoApi.videoDownloadApi + '/' + videoId)
+}
+
+// 视频 URL 接口
+export function deleteVideo(videoId) {
+  return delete0(videoApi.videoDeleteApi + '/' + videoId)
+}
+
+/***********************************************************************************************************************/
 // 视频推荐接口
 export function videoRecommend(page) {
   return get(videoApi.videoRecommendApi + '/' + page)
@@ -90,7 +103,11 @@ export function submitPlayRecord(playerRecord) {
 
 // 用户视频列表
 export function userVideoList(pageNumber, userId, lastId) {
-  return get(videoApi.userVideoListApi + '?pageNumber=' + pageNumber + '&userId=' + userId + '&lastId=' + lastId)
+  return get(videoApi.userVideoPostApi + '?pageNumber=' + pageNumber + '&userId=' + userId + '&lastId=' + lastId)
+}
+
+export function userVideoPost(pageNumber) {
+  return get(videoApi.userVideoPostApi + '?pageNumber=' + pageNumber)
 }
 
 // 用户最近投稿的视频

src/views/home/VideoPage.vue

@@ -55,8 +55,7 @@
                 type="danger"
                 size="mini"
                 icon="el-icon-download"
-                :disabled="isCollection"
-                @click="collection(video.videoId)"
+                @click="getDownloadUrl(video.videoId)"
               >
                 <span>下载</span>
               </el-button>
@@ -77,7 +76,7 @@
             <!--视频标签行-->
             <div class="v-tag">
               <el-tag
-                v-for="(tag,index) in video.tagList"
+                v-for="(tag,index) in video.tags"
                 :key="index"
                 class="tag"
                 size="medium"
@@ -87,16 +86,6 @@
                   {{ tag }}
                 </router-link>
               </el-tag>
-              <el-input
-                v-if="inputVisible"
-                ref="saveTagInput"
-                v-model="inputValue"
-                class="input-new-tag"
-                size="mini"
-                @keyup.enter.native="handleInputConfirm"
-                @blur="handleInputConfirm"
-              />
-              <el-button v-else class="button-new-tag" size="mini" @click="showInput">+ 添加标签</el-button>
             </div>
           </div>
         </el-card>
@@ -156,7 +145,7 @@ import Comment from 'components/comment/Comment'
 import VideoCard from 'components/card/VideoCard'
 import UserAvatarCard from '@/components/card/UserAvatarCard'
 
-import { similarVideo, videoInfo, getVideoComment } from '@/api/video'
+import {similarVideo, videoInfo, getVideoComment, downloadVideo} from '@/api/video'
 import { collectVideo } from "@/api/collect";
 import {getUserInfo} from "@/api/user";
 
@@ -189,7 +178,7 @@ export default {
       showUpdateDialog: false,
       videoUpdate: {
       },
-      showPlaylist: false
+      showPlaylist: false,
     }
   },
   watch: {
@@ -259,24 +248,6 @@ export default {
           console.error(error.message)
         })
     },
-    // 添加标签相关方法
-    showInput() {
-      this.inputVisible = true
-      this.$nextTick(() => {
-        this.$refs.saveTagInput.$refs.input.focus()
-      })
-    },
-    handleInputConfirm() {
-      const inputValue = this.inputValue
-      if (this.tags.indexOf(inputValue) !== -1) {
-        this.$message.info('该标签已存在！')
-      } else {
-        this.tags.push(inputValue)
-        this.$message.info('添加标签！')
-      }
-      this.inputVisible = false
-      this.inputValue = ''
-    },
     // 换一换
     refreshSimilar() {
       console.log('刷新相关推荐')
@@ -346,6 +317,58 @@ export default {
         }
       })
     },
+    getDownloadUrl(videoId) {
+      let filename
+      downloadVideo(videoId).then(res => {
+        if (res.code === 0) {
+          const downloadUrl = res.data
+          fetch(downloadUrl.url, {
+            headers: {
+              Authorization: 'Bearer ' + downloadUrl.token
+            },
+            method: 'GET',
+            credentials: 'include',
+          }).then(res => {
+            /*
+            遍历 formdata
+            for (const key of res.headers.keys()) {
+              console.log(key + ' : ' + res.headers.get(key))
+            }*/
+            const header = res.headers.get('Content-Disposition');
+            const parts = header.split(';');
+            filename = parts[1].split('=')[1];
+            return res.blob()
+          }).then(data => {
+              const blobUrl = window.URL.createObjectURL(data);
+              const a = document.createElement('a');
+              a.download = filename;
+              a.href = blobUrl;
+              a.click();
+          }).catch(e => {
+            this.$notify({
+              title: '提示',
+              message: '视频下载失败',
+              type: 'warning',
+              duration: 3000
+            })
+          })
+        } else {
+          this.$notify({
+            title: '提示',
+            message: res.msg,
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      }).catch(error => {
+        this.$notify({
+          title: '提示',
+          message: error.message,
+          type: 'error',
+          duration: 3000
+        })
+      })
+    },
     displayErrorDialog() {
       this.showSubmitErrorDialog = true
     },
@@ -359,7 +382,7 @@ export default {
     updateVideoInfo(videoId) {
       console.log('更新视频信息')
       this.showUpdateDialog = false
-    }
+    },
   }
 }
 </script>
@@ -389,4 +412,11 @@ export default {
 .clearfix:after {
   clear: both;
 }
+
+.v-tag {
+  padding-top: 10px;
+}
+.tag{
+  margin-right: 3px;
+}
 </style>