加入视频下载，优化变量名称，

src/components/DashBoard.vue

@@ -2,7 +2,7 @@
   <div class="DashBoard" v-show="loadComplete">
     <el-input v-model="link" placeholder="输入链接"/>
     <br>
-    <el-button @click="query">查询本子</el-button>
+    <el-button @click="queryTask">查询任务</el-button>
     <el-button @click="searchByLink">查找任务</el-button>
     <br>
     <hr>
@@ -27,7 +27,22 @@
         </el-select>
       </tr>
     </table>
-    <el-button @click="post" v-if="preDownloadGallery.availableResolution">下载</el-button>
+    <el-button @click="postTask" v-if="preDownloadGallery.availableResolution">下载</el-button>
+  </el-dialog>
+
+  <el-dialog title="查询视频" v-model="preDownloadVideo">
+    <table>
+      <tr>视频名字:{{preDownloadVideo.name}}</tr>
+      <tr>视频网站: <el-link :href="preDownloadVideo.website">{{preDownloadVideo.website}}</el-link> </tr>
+      <tr>视频链接: <el-link :href="preDownloadVideo.link">{{preDownloadVideo.link}}</el-link></tr>
+      <tr>视频状态:{{preDownloadVideo.status}}</tr>
+      <tr v-if="!preDownloadVideo.resolution">
+        目标分辨率: <el-select v-model="targetResolution">
+          <el-option v-for="(resolution) in preDownloadVideo.availableResolution" :value="resolution" :label="resolution"/>
+        </el-select>
+      </tr>
+    </table>
+    <el-button @click="postTask" v-if="!preDownloadVideo.resolution">下载</el-button>
   </el-dialog>
 
   <div class="DashBoard" v-show="!loadComplete">
@@ -55,6 +70,10 @@ export default {
       return store.getters.preDownloadGallery
     })
 
+    let preDownloadVideo = computed(() => {
+      return store.getters.preDownloadVideo
+    })
+
     const loadComplete = computed(() => {
       return store.getters.loadComplete
     })
@@ -63,29 +82,40 @@ export default {
       return str1 + "   " + str2
     }
 
-    function post(){
+    function postTask(){
-      if(link.value.trim() === ''){
+      if(!validateLink(link.value)){
-        ElMessage("请输入链接后再提交")
+        ElMessage("链接错误")
+        return
       }
       if(targetResolution.value === ''){
         ElMessage("请选择分辨率再提交")
+        return
+      }
+      let tempLink = coverLink(link.value)
+      if(link.value.includes("hentai")) {
+        store.dispatch("postGalleryTask", {link: tempLink, targetResolution: targetResolution.value})
+        targetResolution.value = ""
       }
       else {
-        let gid = link.value.split('/')[4]
+        store.dispatch("postVideoTask", {link: tempLink, targetResolution: targetResolution.value})
-        if (!gid || !link.value.includes("hentai")) {
+        targetResolution.value = ""
-          ElMessage("请检查链接输入是否正确")
-        }
-        else
-          store.dispatch("post", {link: link.value, targetResolution: targetResolution.value})
       }
     }
 
-    function query(){
+    function queryTask(){
-      if(link.value.trim() === ''){
+      if(!validateLink(link.value)){
-        ElMessage("请输入链接后再查询")
+        ElMessage("链接错误")
+        return
+      }
+      let tempLink
+      if(link.value.includes("hentai")) {
+        tempLink = coverLink(link.value)
+        store.dispatch("queryGalleryTask", tempLink)
+      }
+      else{
+        tempLink = coverLink(link.value)
+        store.dispatch("queryVideoTask", tempLink)
       }
-      else
-        store.dispatch("query", link.value)
     }
 
     function validate(){
@@ -100,8 +130,8 @@ export default {
     }
 
     function searchByLink() {
-      if(link.value.trim() === ""){
+      if(!validateLink(link.value)){
-        ElMessage("请输入链接后查找")
+        ElMessage("请检查输入的链接")
       }
       else {
         store.dispatch("searchByLink", link.value)
@@ -116,6 +146,36 @@ export default {
       }, 500)
     }
 
+    function coverLink(rawLink){
+      let tempLink = ""
+      if(rawLink.includes("hentai")) {
+        if (rawLink.includes("exhentai.org"))
+          tempLink = rawLink.replace("exhentai.org", "element-plus.org")
+        else if (rawLink.includes("e-hentai.org"))
+          tempLink = rawLink.replace("e-hentai.org", "element.org")
+      }
+      else if(rawLink.includes("xvideos.com") || rawLink.includes("pornhub.com")){
+        tempLink = rawLink.replace("xvideos.com", "xiaomi.com").
+                            replace("cn.pornhub.com", "pixiv.com").
+                            replace("pornhub.com", "pixiv.com")
+      }
+      return tempLink;
+    }
+
+    function validateLink(rawLink){
+      if(rawLink.trim() === "")
+        return false
+      if(rawLink.includes("hentai")){
+        return rawLink.includes("/g/")
+      }
+      else if(rawLink.includes("xvideos.com")){
+        return true
+      }
+      else if(rawLink.includes("pornhub.com")){
+        return rawLink.includes("view_video.php")
+      }
+    }
+
     onMounted(() => {
       const auth = localStorage.getItem("auth")
       if(auth !== null){
@@ -123,8 +183,8 @@ export default {
       }
     })
 
-    return {post,
+    return {postTask,
-            query,
+            queryTask,
             validate,
             searchByLink,
             searchByKeyword,
@@ -135,6 +195,7 @@ export default {
             keyword,
             isRemember,
             preDownloadGallery,
+            preDownloadVideo,
             targetResolution,
             store
     }
@@ -145,7 +206,7 @@ export default {
 <style scoped>
   .DashBoard{
     width: auto;
-    height: 90vh;
+    height: 92vh;
     background-color: ghostwhite;
     text-align: center;
   }

src/components/Side.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="side" style="width: 100%">
-    <span>下载历史</span>
+    <span>{{showType}}历史</span>
     <div  v-show="loadComplete" class="load_complete">
-      <el-table :data="data">
+      <el-table :data="galleryTasks" v-show="isShowGalleryHistory">
 
         <el-table-column type="expand">
           <template #default="props">
             名字:{{ props.row.name}} <br>
-            链接:<el-link :href="props.row.link">Link</el-link> <br>
+            链接:<el-link :href="props.row.link">链接</el-link> <br>
             语言:{{props.row.language}} <br>
             页数:{{props.row.pages}} <br>
             文件大小:{{props.row.fileSize}}<br>
@@ -24,14 +24,48 @@
         <el-table-column label="操作" width="250">
           <template #default="scoped">
             <span v-show="scoped.row.download">
-              <el-button @click="downloadGallery(scoped.row.download)">下载</el-button>
+              <el-button @click="downloadTask(scoped.row.download)">下载</el-button>
               <el-button @click="deleteGallery(scoped.row.gid)">删除</el-button>
-              <el-button @click="onlineReader(scoped.row.name)">在线看</el-button>
+              <el-button @click="onlineGalleryReader(scoped.row.name)">在线看</el-button>
             </span>
           </template>
         </el-table-column>
 
-        <el-table-column label="进度" width="60">
+        <el-table-column label="进度" width="80">
+          <template #default="scoped">
+            {{ scoped.row.progress }}
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-table :data="videoTasks" v-show="isShowVideoHistory">
+        <el-table-column type="expand">
+          <template #default="props">
+            名字:{{props.row.name}}     <br>
+            网站:{{props.row.website}}  <br>
+            链接:<el-link :href="props.row.link">链接</el-link> <br>
+            文件大小:{{props.row.fileSize}} <br>
+            视频长度:{{props.row.duration}} <br>
+            分辨率:{{props.row.resolution}} <br>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="名字" width="300">
+          <template #default="scoped">
+            {{scoped.row.name}}
+          </template>
+        </el-table-column>
+
+        <el-table-column label="操作" width="250">
+          <template #default="scoped">
+            <span v-show="scoped.row.download">
+              <el-button @click="downloadTask(scoped.row.download)">下载</el-button>
+              <el-button @click="deleteVideo(scoped.row.id)">删除</el-button>
+              <el-button @click="onlineVideoViewer(scoped.row.name)">在线看</el-button>
+            </span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="进度" width="80">
           <template #default="scoped">
             {{ scoped.row.progress }}
           </template>
@@ -47,11 +81,14 @@
                     v-show="isEditing"
                     @blur="reverse()"
                     class="page"
-                    ref="input"></el-input>
+                    ref="inputNode"></el-input>
           <span @click="reverse" v-show="!isEditing" class="page">{{page}}</span>
           <el-button @click="next">+</el-button>
           <el-button @click="toMax">{{max}}</el-button>
         </el-col>
+        <el-col>
+          <el-button @click="changeShowType">切换</el-button>
+        </el-col>
       </el-row>
     </div>
     <span v-show="!loadComplete" class="side">请输入授权码后再查看</span>
@@ -68,16 +105,31 @@ export default {
     const targetPage = ref(1)
     const isEditing = ref(false)
 
-    let input = ref(null)
+    let inputNode = ref(null)
+    let showType = ref("本子")
 
-    let data = computed(() => {
+    let galleryTasks = computed(() => {
-      console.log(store.getters.task)
+      if(store.getters.galleryTasks)
-      if(store.getters.task)
+        return store.getters.galleryTasks
-        return store.getters.task
       else
         return null
     })
 
+    let videoTasks = computed(() => {
+      if(store.getters.videoTasks)
+        return store.getters.videoTasks
+      else
+        return null
+    })
+
+    let isShowVideoHistory = computed(() => {
+      return store.getters.showType === "video"
+    })
+
+    let isShowGalleryHistory = computed(() => {
+      return store.getters.showType === "gallery"
+    })
+
     let min = computed(() => {
       return store.getters.min
     })
@@ -130,12 +182,12 @@ export default {
     function reverse(){
       isEditing.value = !isEditing.value
       if(isEditing){
-        input.value.focus()
+        inputNode.value.focus()
       }
       targetPage.value = page.value
     }
 
-    function downloadGallery(link){
+    function downloadTask(link){
       window.open(link)
     }
 
@@ -143,28 +195,54 @@ export default {
       store.dispatch("deleteGallery", gid)
     }
 
-    function onlineReader(name){
+    function deleteVideo(id){
+      store.dispatch("deleteVideo", id)
+    }
+
+    function onlineGalleryReader(name){
       window.open("http://100.42.234.138:8080/1/gallery/" + encodeURI(name))
     }
 
+    function onlineVideoViewer(name){
+      window.open("http://100.42.234.138:8080/1/video/" + encodeURI(name + ".mp4"))
+    }
 
-    return {data,
+    function changeShowType(){
+      if(isShowVideoHistory.value){
+        store.commit("_setShowType", "gallery")
+        showType.value = "本子"
+      }
+      else{
+        store.commit("_setShowType", "video")
+        showType.value = "视频"
+      }
+    }
+
+
+    return {galleryTasks,
+            videoTasks,
             min,
             max,
             targetPage,
             loadComplete,
             page,
             isEditing,
-            input,
+            inputNode,
+            isShowVideoHistory,
+            isShowGalleryHistory,
+            showType,
             reverse,
             changePage,
+            changeShowType,
             toMax,
             toMin,
             previous,
             next,
-            downloadGallery,
+            downloadTask,
             deleteGallery,
-            onlineReader,
+            deleteVideo,
+            onlineGalleryReader,
+            onlineVideoViewer,
             store
     }
   }
@@ -181,7 +259,7 @@ export default {
   }
   .pageChanger{
     position: absolute;
-    top:92vh;
+    top:90vh;
     left: 150px;
   }
   .page{

src/store/index.js

@@ -4,29 +4,47 @@ import {ElMessage} from "element-plus"
 import qs from "qs"
 const BaseUrl = "http://100.42.234.138:8888/"
 const GalleryTaskHandlerUrl = BaseUrl + "GalleryTaskHandler/"
+const VideoTaskHandlerUrl = BaseUrl + "VideoTaskHandler/"
+
 const actions = {
-    update(context){
+    updateGalleryTasks(context){
         const AuthCode = context.state.AuthCode
         axios.get(GalleryTaskHandlerUrl, {
             params:{
                 param:"",
                 type:"all",
-                AuthCode: AuthCode
+                AuthCode
             }
         }).then((res) => {
             let temp = []
-            context.commit("_empty")
+            context.commit("_emptyGalleryTasks")
             JSON.parse(res.data.data).forEach((task) => {
                 temp.push(task)
             })
-            context.commit("_update", temp)
+            context.commit("_updateGalleryTasks", temp)
 
         })
     },
-    post(context, data){
+    updateVideoTasks(context){
         const AuthCode = context.state.AuthCode
+        axios.get(VideoTaskHandlerUrl, {
+            params:{
+                param:"123",
+                type:"all",
+                AuthCode
+            }
+        }).then(res => {
+            let temp = []
+            context.commit("_emptyVideoTasks")
+            JSON.parse(res.data.data).forEach(task => {
+                temp.push(task)
+            })
+            context.commit("_updateVideoTasks", temp)
+        })
+    },
+    postGalleryTask(context, data){
         axios.post(GalleryTaskHandlerUrl, qs.stringify({
-            AuthCode:AuthCode,
+            AuthCode:context.state.AuthCode,
             link:data.link,
             targetResolution:data.targetResolution
         })).then((res) => {
@@ -43,7 +61,26 @@ const actions = {
             }
         })
     },
-    query(context, link){
+    postVideoTask(context, data){
+        axios.post(VideoTaskHandlerUrl, qs.stringify({
+            AuthCode:context.state.AuthCode,
+            link: data.link,
+            targetResolution: data.targetResolution
+        })).then((res) => {
+            if(res.data.result === "success") {
+                ElMessage("提交成功")
+                context.commit("_setPreDownloadVideo", {video:false, resolution:data.targetResolution})
+            }
+            else{
+                if(res.data.data)
+                    ElMessage(res.data.data)
+                else{
+                    ElMessage("提交失败")
+                }
+            }
+        })
+    },
+    queryGalleryTask(context, link){
         const AuthCode = context.state.AuthCode
         axios.get(GalleryTaskHandlerUrl, {
             params:{
@@ -60,11 +97,29 @@ const actions = {
                 ElMessage("查询失败")
         })
     },
+    queryVideoTask(context, link){
+        const AuthCode = context.state.AuthCode
+        axios.get(VideoTaskHandlerUrl, {
+            params:{
+                param: link,
+                type:"link",
+                AuthCode
+            }
+        }).then((res) => {
+            if(res.data.result === 'success'){
+                const video = JSON.parse(res.data.data)
+                context.commit("_setPreDownloadVideo", {video})
+            }
+            else
+                ElMessage("查询失败")
+        })
+    },
     validate(context, AuthCode){
         axios.post(BaseUrl + "validate?AuthCode=" + AuthCode).then((res)=>{
             if(res.data.result === 'success'){
                 context.commit("_authed", AuthCode, context)
-                context.dispatch("update").then()
+                context.dispatch("updateGalleryTasks").then()
+                context.dispatch("updateVideoTasks").then()
                 setInterval(() => {
                     context.dispatch("update").then()
                 }, 30000)
@@ -74,6 +129,12 @@ const actions = {
             }
         })
     },
+    update(context){
+      if(context.state.showType === "video")
+          context.dispatch("updateVideoTasks").then()
+      else
+          context.dispatch("updateGalleryTasks").then()
+    },
     searchByLink(context, link){
         context.commit("_searchByLink", link)
     },
@@ -81,7 +142,11 @@ const actions = {
         context.commit("_searchByKeyword", keyword)
     },
     deleteGallery(context, gid){
-        axios.delete(GalleryTaskHandlerUrl, {params:{AuthCode:state.AuthCode, gid:gid}}).then((res) => {
+        axios.delete(GalleryTaskHandlerUrl, {
+            params:{
+                AuthCode:state.AuthCode,
+                gid
+            }}).then((res) => {
             if(res.data.result === "success"){
                 ElMessage("删除成功")
                 context.commit("_deleteGallery", gid)
@@ -90,34 +155,69 @@ const actions = {
                 ElMessage(res.data.data)
             }
         })
+    },
+    deleteVideo(context, id){
+        axios.delete(VideoTaskHandlerUrl, {
+            params:{
+                AuthCode:state.AuthCode,
+                id
+            }
+        }).then((res) => {
+            if(res.data.result === "success"){
+                ElMessage("删除成功")
+                context.commit("_deleteVideo", id)
+            }
+            else{
+                ElMessage(res.data.data)
+            }
+        })
     }
 }
 
 const mutations = {
-    _empty(state){
+    _emptyGalleryTasks(state){
-        state.totalTask.splice(0)
+        state.totalGalleryTask.splice(0)
     },
-    _update(state, tasks){
+    _emptyVideoTasks(state){
+        state.totalVideoTask.splice(0)
+    },
+    _updateGalleryTasks(state, tasks){
         const download_url = GalleryTaskHandlerUrl + "file?link="
-
         tasks.forEach((task) => {
-            if(task.status === "posted"){
+            if(task.status === "已提交"){
-                task.progress = "0%"
+                task.progress = "已提交"
             }
-            else if(task.status === "downloading"){
+            else if(task.status === "下载中"){
                 task.progress = (Math.round((task.proceeding / task.pages)*100)).toString() + "%"
             }
-            else if(task.status === "complete"){
+            else if(task.status === "下载完成"){
-                task.progress = "100%"
+                task.progress = "下载完成"
                 task.download = download_url + task.link + "&AuthCode=" + state.AuthCode
             }
-            state.totalTask.push(task)
+            state.totalGalleryTask.push(task)
         })
         if(state.isAuth && !state.loadComplete){
             state.loadComplete = true
             ElMessage("加载完成")
         }
     },
+    _updateVideoTasks(state, tasks){
+        const downloadUrl = VideoTaskHandlerUrl + "file?link="
+        tasks.forEach((task) => {
+            task.progress = task.status
+            if(task.status === "下载完成"){
+                let tempLink
+                if(task.link.includes("xvideos.com"))
+                    tempLink = task.link.replace("xvideos", "xiaomi")
+                else if(task.link.includes("cn.pornhub"))
+                    tempLink = task.link.replace("cn.pornhub", "pixiv")
+                else
+                    tempLink = task.link.replace("pornhub", "pixiv")
+                task.download = downloadUrl + tempLink + "&AuthCode=" + state.AuthCode
+            }
+            state.totalVideoTask.push(task)
+        })
+    },
     _changePage(state, targetPage){
         state.page = targetPage
     },
@@ -133,14 +233,16 @@ const mutations = {
         localStorage.removeItem("auth")
     },
     _searchByLink(state, link){
-        let gid = link.split('/')[4]
+        let tasks
-        if(!gid){
+        if(state.showType === "gallery") {
-            ElMessage("请检查链接输入是否正确")
+            tasks = state.totalGalleryTask
         }
+        else
+            tasks = state.totalVideoTask
         let i = 0
         let found = false
-        for(i=0; i<state.totalTask.length; i++){
+        for (i = 0; i < tasks.length; i++) {
-            if(state.totalTask[i].gid === gid){
+            if (tasks[i].link === link) {
                 state.page = Math.floor(i / state.length) + 1
                 found = true
                 break
@@ -149,32 +251,59 @@ const mutations = {
         if(!found){
             ElMessage("未找到此任务")
         }
+        else{
+            ElMessage("已跳转到该任务所在页数")
+        }
     },
     _searchByKeyword(state, keyword){
         state.searchTask.splice(0)
         state.page = 1
-        state.totalTask.forEach((task) => {
+        let tasks
+        if(state.showType === "video")
+            tasks = state.totalVideoTask
+        else
+            tasks = state.totalGalleryTask
+        tasks.forEach((task) => {
             if(task.name.includes(keyword))
                 state.searchTask.push(task)
         })
         if(state.searchTask.length === 0){
-            ElMessage("未找到该关键字的本子")
+            ElMessage("未找到该关键字的任务")
         }
     },
     _deleteGallery(state, gid){
-        state.totalTask.forEach((item, index, arr) => {
+        state.totalGalleryTask.forEach((item, index, arr) => {
             if(item.gid === gid){
                 arr.splice(index, 1)
             }
         })
     },
+    _deleteVideo(state, id){
+        state.totalVideoTask.forEach((item, index, arr) => {
+            if(item.id === id)
+                arr.splice(index, 1)
+        })
+    },
     _setPreDownloadGallery(state,data){
         if(data.gallery === false) {
             state.preDownloadGallery.resolution = data.resolution
-            state.totalTask.push(state.preDownloadGallery)
+            state.preDownloadGallery.fileSize = "等待下载完成后再查看"
+            state.totalGalleryTask.push(state.preDownloadGallery)
         }
         state.preDownloadGallery = data.gallery
     },
+    _setPreDownloadVideo(state,data){
+        if(data.video === false) {
+            state.preDownloadVideo.resolution = data.resolution
+            state.preDownloadVideo.fileSize = "下载完成后再查看"
+            state.preDownloadVideo.duration = "下载完成后再查看"
+            state.totalVideoTask.push(state.preDownloadVideo)
+        }
+        state.preDownloadVideo = data.video
+    },
+    _setShowType(state, showType){
+        state.showType = showType
+    },
     _openHistoryPanel(state){
         state.showHistory = true
     },
@@ -184,24 +313,38 @@ const mutations = {
 }
 
 const state = {
-    totalTask:[],                   //存放数据的数组
+    totalGalleryTask:[],                   //存放本子数据的数组
+    preDownloadGallery:false,              //准备下载的本子
+
+    totalVideoTask:[],                      //存放视频数据的数组
+    preDownloadVideo:false,                 //准备下载的视频
+
     page:1,                                 //当前页数
     length:8,                               //每页能有多少个链接
+
     isAuth:false,                           //是否授权
     AuthCode:'',                            //授权码
     loadComplete:false,                     //是否加载完成
+
     isInclude:false,                        //是否搜索到任务
     searchTask:[],                          //搜索到的任务
-    preDownloadGallery:false,       //准备下载的本子
+    showHistory:'',                         //是否打开面板
-    showHistory:false
+    showType:"gallery"
 }
 
 const getters = {
-    task(state){
+    galleryTasks(state){
         if(state.searchTask.length !== 0)
             return state.searchTask.slice((state.page-1)*state.length, state.page*state.length)
-        if(state.totalTask.length !== 0)
+        if(state.totalGalleryTask.length !== 0)
-            return state.totalTask.slice((state.page-1)*state.length, state.page*state.length)
+            return state.totalGalleryTask.slice((state.page-1)*state.length, state.page*state.length)
+        return null
+    },
+    videoTasks(state){
+        if(state.searchTask.length !== 0)
+            return state.searchTask.slice((state.page-1)*state.length, state.page*state.length)
+        if(state.totalVideoTask.length !== 0)
+            return state.totalVideoTask.slice((state.page-1)*state.length, state.page*state.length)
         return null
     },
     min(){
@@ -213,9 +356,12 @@ const getters = {
         if(state.searchTask.length !== 0){
             tasks = state.searchTask
         }
-        else if(state.totalTask.length !== 0){
+        else if(state.showHistory === "gallery")
-            tasks = state.totalTask
+                if(state.totalGalleryTask.length !== 0)
-        }
+                    tasks = state.totalGalleryTask
+        else if(state.showHistory === "video")
+                if(state.totalVideoTask.length)
+                    tasks = state.totalVideoTask
         if(!tasks)
             return 1
         max = Math.floor(tasks.length/state.length)
@@ -236,8 +382,14 @@ const getters = {
     preDownloadGallery(state){
         return state.preDownloadGallery
     },
+    preDownloadVideo(state){
+        return state.preDownloadVideo
+    },
     showHistory(state){
         return state.showHistory
+    },
+    showType(state){
+        return state.showType
     }
 }