视频加入收藏以及标签功能。去除moment.js，改为原生格式化。加入任务的分类（收藏，下载，全部）。（同步更新）

src/components/Side.vue

@@ -19,7 +19,7 @@
             </span>
 
             <el-button @click="deleteGallery(props.row.gid)" :disabled="props.row.download === undefined">删除</el-button>
-            <el-button @click="editTag(props.row.gid, props.row.tag)">编辑标签</el-button>
+            <el-button @click="editGalleryTag(props.row.gid, props.row.tag)">编辑标签</el-button>
             <el-button @click="updateGallery(props.row.link)" :disabled="props.row.download === undefined">更新</el-button>
             <el-button @click="shareGallery({gid:props.row.gid, shortName:props.row.shortName + '.zip'})" v-show="isLion">分享</el-button>
           </template>
@@ -37,7 +37,7 @@
           <template #default="scoped">
             <span>
               <el-button @click="downloadTask(scoped.row.download)" :disabled="scoped.row.download === undefined">下载</el-button>
-              <el-button @click="changeCollect(scoped.row.gid, scoped.row.isCollect)">{{scoped.row.isCollect ? '取消收藏' : '收藏'}}</el-button>
+              <el-button @click="changeGalleryCollect(scoped.row.gid, scoped.row.isCollect)">{{scoped.row.isCollect ? '取消收藏' : '收藏'}}</el-button>
               <el-button @click="onlineGalleryReader(scoped.row.gid)" :disabled="scoped.row.download === undefined">在线看</el-button>
             </span>
           </template>
@@ -59,20 +59,27 @@
             视频长度:{{props.row.duration}} <br>
             分辨率:{{props.row.resolution}} <br>
             任务创建时间:{{props.row.createTimeDisplay}}<br>
+            标签:{{props.row.tag === '' ? '无': props.row.tag}} <br>
+            <span v-show="isLion">
+              downloader:{{props.row.downloader}}
+            </span>
+
+            <el-button @click="deleteVideo(props.row.gid)" :disabled="props.row.download === undefined">删除</el-button>
+            <el-button @click="editVideoTag(props.row.id, props.row.tag)">编辑标签</el-button>
           </template>
         </el-table-column>
 
-        <el-table-column label="名字" width="300">
+        <el-table-column label="名字" width="300vw">
           <template #default="scoped">
             {{scoped.row.name}}
           </template>
         </el-table-column>
 
-        <el-table-column label="操作" width="250">
+        <el-table-column label="操作" width="300vw">
           <template #default="scoped">
             <span>
               <el-button @click="downloadTask(scoped.row.download)" :disabled="scoped.row.download === undefined">下载</el-button>
-              <el-button @click="deleteVideo(scoped.row.id)" :disabled="scoped.row.download === undefined">删除</el-button>
+              <el-button @click="changeVideoCollect(scoped.row.id, scoped.row.isCollect)">{{scoped.row.isCollect ? '取消收藏' : '收藏'}}</el-button>
               <el-button @click="openVideoPanel(scoped.row.download)" :disabled="scoped.row.download === undefined">在线播放</el-button>
             </span>
           </template>
@@ -130,7 +137,7 @@
         </el-form-item>
       </el-form>
       <el-footer>
-        <el-button @click="submitTag">提交修改</el-button>
+        <el-button @click="tempGid === '' ? submitVideoTag(): submitGalleryTag()">提交修改</el-button>
       </el-footer>
     </el-dialog>
 
@@ -170,6 +177,7 @@ let player = ref()
 //临时变量
 let tempTag = ref("")
 let tempGid = ref("")
+let tempId = ref("")
 
 let showNameType = ref("shortName")     // shortName name
 let showType = ref("gallery")           // gallery video collect
@@ -216,6 +224,7 @@ let isLion = computed(() => {
   return store.state.userId === 3
 })
 
+//在线预览相关
 let currentLinks = computed(() => {
   return store.state.currentLinks
 })
@@ -281,23 +290,40 @@ function changeSortType(){
 }
 
 //收藏,编辑标签,提交编辑
-function changeCollect(gid, isCollect){
+function changeGalleryCollect(gid, isCollect){
   if(isCollect)
     store.dispatch("disCollectGallery", gid)
   else
     store.dispatch("collectGallery", gid)
 }
-function editTag(gid, tag){
+function changeVideoCollect(id, isCollect){
+  if(isCollect)
+    store.dispatch("disCollectVideo", id)
+  else
+    store.dispatch("collectVideo", id)
+}
+function editGalleryTag(gid, tag){
   tempTag.value = tag
   tempGid.value = gid
   isEditingTag.value = true
 }
-function submitTag(){
+function editVideoTag(id, tag){
+  tempTag.value = tag
+  tempId.value = id
+  isEditingTag.value = true
+}
+function submitGalleryTag(){
   store.dispatch("updateTag", {gid:tempGid.value, tag:tempTag.value})
   tempTag.value = ''
   tempGid.value = ''
   isEditingTag.value = false
 }
+function submitVideoTag(){
+  store.dispatch("updateVideoTag", {id:tempId.value, tag:tempTag.value})
+  tempTag.value = ''
+  tempId.value = ''
+  isEditingTag.value = false
+}
 
 //下载，删除，在线看
 function downloadTask(link){

src/store/index.js

@@ -2,7 +2,6 @@ import vuex from "vuex"
 import axios from "axios"
 import {ElMessage} from "element-plus"
 import qs from "qs"
-import moment from 'moment'
 const BaseUrl = "http://downloader.lionwebsite.xyz/"
 const GalleryManageUrl = BaseUrl + "GalleryManage"
 const VideoManageUrl = BaseUrl + "VideoManage"
@@ -153,7 +152,7 @@ const actions = {
     validate(context, AuthCode){
         axios.post(BaseUrl + "validate?AuthCode=" + AuthCode).then((res)=>{
             if(res.data.result === 'success'){
-                context.commit("_authed", {AuthCode, userId: parseInt(res.data.data)})
+                context.commit("_authed", {AuthCode, ...JSON.parse(res.data.data)})
                 //初始化
                 context.dispatch("loadMaskDomain").then()
                 context.dispatch("loadWeekUsedAmount").then()
@@ -207,9 +206,18 @@ const actions = {
                 context.commit("_collectGallery", gid)
         })
     },
+    collectVideo(context, id){
+        axios.post(VideoManageUrl + "/collect?" + qs.stringify({
+            id,
+            userId: state.userId
+        })).then((res) => {
+            ElMessage(res.data.data)
+            if(res.data.result === 'success')
+                context.commit("_collectVideo", id)
+        })
+    },
     disCollectGallery(context, gid){
-        axios.post(GalleryManageUrl + "/disCollect?" + qs.stringify(
+        axios.post(GalleryManageUrl + "/disCollect?" + qs.stringify({
-            {
                 gid,
                 id:state.userId
             })).then((res) => {
@@ -218,11 +226,28 @@ const actions = {
                 context.commit("_disCollectGallery", gid)
         })
     },
-    updateTag(context, data){
+    disCollectVideo(context, id){
+        axios.post(VideoManageUrl + "/disCollect?" + qs.stringify({
+            id,
+            userId: state.userId
+        })).then((res) => {
+            ElMessage(res.data.data)
+            if(res.data.result === "success")
+                context.commit("_disCollectVideo", id)
+        })
+    },
+    updateGalleryTag(context, data){
         axios.post(GalleryManageUrl + "/tag?" + qs.stringify(data)).then((res) => {
             ElMessage(res.data.data)
             if(res.data.result === 'success')
-                context.commit("_updateTag", data)
+                context.commit("_updateGalleryTag", data)
+        })
+    },
+    updateVideoTag(context, data){
+        axios.post(VideoManageUrl + "/tag?" + qs.stringify(data)).then((res) => {
+            ElMessage(res.data.data)
+            if(res.data.result === 'success')
+                context.commit("_updateVideoTag", data)
         })
     },
     deleteGallery(context, gid){
@@ -279,6 +304,14 @@ const mutations = {
             }
         })
     },
+    _collectVideo(state, id){
+        state.totalVideoTask.forEach((video) => {
+            if(!video.isCollect && video.id === id){
+                video.isCollect = true
+                state.collectVideo.push(video)
+            }
+        })
+    },
     _disCollectGallery(state, gid){
         state.collectGallery.splice(0)
         state.totalGalleryTask.forEach((gallery) => {
@@ -289,18 +322,38 @@ const mutations = {
                 state.collectGallery.push(gallery)
         })
     },
-    _updateTag(state, data){
+    _disCollectVideo(state, id){
+        state.collectVideo.splice(0)
+        state.totalVideoTask.forEach((video) => {
+            if(video.isCollect && video.id === id)
+                video.isCollect = false
+
+            else if(video.isCollect)
+                state.collectVideo.push(video)
+
+        })
+    },
+    _updateGalleryTag(state, data){
         state.totalGalleryTask.forEach((gallery) => {
             if(gallery.gid === data.gid){
                 gallery.tag = data.tag
             }
         })
     },
+    _updateVideoTag(state, data){
+        state.totalVideoTask.forEach((video) => {
+            if(video.id === data.id){
+                video.tag = data.tag
+            }
+        })
+    },
     _updateGalleryTasks(state, data){
         let {tasks, type} = data
         if(type === 'all') {
             state.totalGalleryTask.splice(0)
             state.collectGallery.slice(0)
+            state.downloadGallery.splice(0)
+
             tasks.forEach((task) => {
                 //处理名字
                 task.shortName = getShortname(task.name)
@@ -326,7 +379,7 @@ const mutations = {
                 }
 
                 //处理时间戳
-                task.createTimeDisplay = moment(task.createTime * 1000).format("YYYY-MM-DD HH:mm:ss")
+                task.createTimeDisplay = new Date(task.createTime * 1000).toLocaleString("zh")
 
                 //处理标签
                 if (task.tag === undefined) {
@@ -348,6 +401,10 @@ const mutations = {
                         task.isCollect = false
                 }
 
+                //处理是否下载
+                if(task.downloader === state.username)
+                    state.downloadGallery.push(task)
+
                 state.totalGalleryTask.push(task)
             })
         }
@@ -401,8 +458,12 @@ const mutations = {
         let {tasks, type} = data
         if(type === 'all') {
             state.totalVideoTask.splice(0)
+            state.collectVideo.splice(0)
+            state.downloadVideo.splice(0)
+
             tasks.forEach((task) => {
                 task.progress = task.status
+                //视频下载很快，所以不太注重下载进度
                 if (task.status === "下载完成") {
                     let tempLink
                     let url = new URL(task.link)
@@ -412,8 +473,35 @@ const mutations = {
                             tempLink = task.link.replace(mask['raw'], mask['mask'])
                     })
                     task.download = VideoManageUrl + "/file/" + encodeURI(task.name) + "?link=" + tempLink + "&AuthCode=" + state.AuthCode
-                    task.createTimeDisplay = moment(task.createTime * 1000).format("YYYY-MM-DD HH:mm:ss")
                 }
+
+                //处理时间戳
+                task.createTimeDisplay = new Date(task.createTime * 1000).toLocaleString("zh")
+
+                //处理标签
+                if(task.tag === undefined)
+                    task.tag = ""
+
+                //处理是否收藏
+                if(task.collector !== undefined){
+                    let collector = task.collector.split(",")
+                    delete task.collector
+                    for(let i=0; i<collector.length; i++){
+                        if(parseInt(collector[i]) === state.userId){
+                            task.isCollect = true
+                            state.collectVideo.push(task)
+                            break
+                        }
+                    }
+
+                    if(task.isCollect === undefined)
+                        task.isCollect = false
+                }
+
+                //处理是否下载
+                if(task.downloader === state.username)
+                    state.downloadVideo.push(task)
+
                 state.totalVideoTask.push(task)
             })
         }
@@ -448,6 +536,7 @@ const mutations = {
     _authed(state, data){
         state.AuthCode = data.AuthCode
         state.userId = data.userId
+        state.username = data.username
         state.isAuth = true
         ElMessage("验证成功,加载中")
     },
@@ -455,6 +544,7 @@ const mutations = {
         state.isAuth = false
         state.AuthCode = ""
         state.userId = -1
+        state.username = ""
         ElMessage("授权码错误")
         localStorage.removeItem("auth")
     },
@@ -637,6 +727,7 @@ const state = {
     chosenGallery:false,                    //准备下载的本子
     thumbnailGallery:{},                    //缩略图链接
     collectGallery:[],                      //收藏的本子
+    downloadGallery:[],                     //下载的本子
 
     onlineLinks:{},                         //在线本子链接
     isOnlineReading: false,                 //是否在线看
@@ -645,8 +736,10 @@ const state = {
     imageWidth: "",                         //图片宽度
     imagePadding: "",                       //图片padding
 
-    totalVideoTask:[],                      //存放视频数据的数组
+    totalVideoTask: [],                      //存放视频数据的数组
-    chosenVideo:false,                      //准备下载的视频
+    chosenVideo: false,                      //准备下载的视频
+    collectVideo: [],                        //收藏的视频
+    downloadVideo: [],                       //下载的视频
 
     page:1,                                 //当前页数
     length:10,                              //每页能有多少个链接
@@ -654,6 +747,7 @@ const state = {
     shortLength:10,                         //简洁个数
 
     userId:-1,                              //用户id
+    username: "",                           //用户名
     isAuth:false,                           //是否授权
     AuthCode:'',                            //授权码
     loadComplete:false,                     //是否加载完成