加入标签搜索，优化搜索逻辑以及代码，加入部分注释，抽取简短名称的处理函数（同步更新）

src/components/DashBoard.vue

@@ -3,24 +3,29 @@
     <span>E站额度本周已用:{{weekUsed.weekUsedAmount}} 上次重置时间:{{weekUsed.lastResetAmountTime}}</span><br>
     <el-button @click="queryWeekUsedAmount">查询用量</el-button>
     <hr>
-    <el-input v-model="link" placeholder="输入链接"/>
+    <el-row>
-    <br>
+      <el-col>
-    <el-button @click="queryTask">查询远程任务</el-button>
+       查询参数类型: <el-select style="width: 125px" v-model="type">
-    <el-button @click="searchByLink">查找当前页任务</el-button>
+          <el-option value="link" label="链接"/>
-    <br>
+          <el-option value="keyword" label="关键字"/>
-    <hr>
+          <el-option value="tag" label="标签"/>
-    <br>
+        </el-select>
-    <el-input v-model="keyword" placeholder="输入关键字"/>
+        参数:
-    <br>
+        <el-input style="width: 250px;" v-model="param"></el-input>
-    <el-button @click="searchRemoteByKeyword">查找所有任务</el-button>
+      </el-col>
-    <el-button @click="searchLocalByKeyword">查找当前页任务</el-button>
+      <el-col>
+        <el-button @click="queryRemoteTask" v-show="type === 'link'">远程查询</el-button>
+        <el-button @click="queryLocalTask">当前页查询</el-button>
+      </el-col>
+    </el-row>
     <br>
     <hr>
     <el-button @click="isAlterAuthCode = true">修改授权码</el-button>
     <hr>
     <div v-show="thumbnailGallery !== {}">
       <span>
-        {{thumbnailGallery.shortName}}
+        {{thumbnailGallery.shortName}}<br>
+        <el-space v-show="thumbnailGallery.tag !== ''">标签:{{thumbnailGallery.tag}}</el-space>
       </span><br>
       <picture>
         <el-image :src="thumbnailGallery.url" :preview-src-list="[thumbnailGallery.url,]" :initial-index="0" class="preview"></el-image>
@@ -98,20 +103,21 @@
   </div>
 </template>
 
-<script>
+<script setup>
 import store from "../store";
 import {computed, ref, onMounted} from "vue";
 import {ElMessage} from "element-plus"
-export default {
+
-  name: "DashBoard",
-  setup(){
 let AuthCode = ref("")
 let isRemember = ref(false)
 let isAlterAuthCode = ref(false)
 let newAuthCode = ref("")
 let tempAuthCode = ref("")
-    let keyword = ref("")
+
-    let link = ref("")
+
+let type = ref("link")
+let param = ref("")
+
 let targetResolution = ref("")
 
 let realAuthCode = computed(() => {
@@ -121,7 +127,6 @@ export default {
 let chosenGallery = computed(() => {
   return store.state.chosenGallery
 })
-
 let chosenVideo = computed(() => {
   return store.state.chosenVideo
 })
@@ -129,11 +134,9 @@ export default {
 let loadComplete = computed(() => {
   return store.state.loadComplete
 })
-
 let maskDomain = computed(() => {
   return store.state.maskDomain
 })
-
 let weekUsed = computed(() => {
   return store.state.weekUsed
 })
@@ -142,6 +145,7 @@ export default {
   return store.state.thumbnailGallery
 })
 
+//修改授权码
 function alterAuthCode(){
   if(newAuthCode.value.trim() === "" || tempAuthCode.value.trim() === "" || newAuthCode.value !== tempAuthCode.value)
     ElMessage("请检查授权码输入是否错误")
@@ -152,13 +156,13 @@ export default {
     tempAuthCode.value = ""
   }
 }
-
+//查询用量
 function queryWeekUsedAmount(){
   store.dispatch("loadWeekUsedAmount")
 }
-
+//提交任务
 function postTask(){
-      if(!validateLink(link.value)){
+  if(!validateLink(param.value)){
     ElMessage("链接错误")
     return
   }
@@ -166,41 +170,50 @@ export default {
     ElMessage("请选择分辨率再提交")
     return
   }
-      let tempLink = coverLink(link.value)
+  let tempLink = coverLink(param.value)
-      if(link.value.includes("hentai")) {
+  if(param.value.includes("hentai"))
     store.dispatch("postGalleryTask", {link: tempLink, targetResolution: targetResolution.value})
-        targetResolution.value = ""
+  else
-      }
-      else {
     store.dispatch("postVideoTask", {link: tempLink, targetResolution: targetResolution.value})
+
   targetResolution.value = ""
 }
-    }
 
-    function queryTask(){
+//查询任务
-      if(!validateLink(link.value)){
+function queryRemoteTask(){
+  if(!validateLink(param.value)){
     ElMessage("链接错误")
     return
   }
-      let tempLink
+  let tempLink = coverLink(param.value)
-      if(link.value.includes("hentai")) {
+  if(param.value.includes("hentai"))
-        tempLink = coverLink(link.value)
     store.dispatch("queryGalleryTask", tempLink)
-      }
+  else
-      else{
-        tempLink = coverLink(link.value)
     store.dispatch("queryVideoTask", tempLink)
 }
+function queryLocalTask(){
+  switch (type.value){
+    case "link":
+      store.commit("_searchLocalByLink", param.value)
+      break
+    case "keyword":
+      store.commit("_searchLocalByKeyword", param.value)
+      break
+    case "tag":
+      store.commit("_searchLocalByTag", param.value.includes(",") ? param.value.split(","): [param.value])
+      break
+  }
 }
 
+//删除任务
 function deleteVideo(){
   store.dispatch("deleteVideo", chosenVideo.value.id)
 }
-
 function deleteGallery(){
   store.dispatch("deleteGallery", chosenGallery.value.gid)
 }
 
+//验证授权码
 function validate(){
   if(AuthCode.value.trim() === ""){
     ElMessage("请输入授权码后再验证")
@@ -212,6 +225,7 @@ export default {
   }
 }
 
+//验证链接以及伪装链接
 function validateLink(rawLink){
   if(rawLink.trim() === "")
     return false
@@ -225,7 +239,6 @@ export default {
     return rawLink.includes("view_video.php")
   }
 }
-
 function coverLink(rawLink){
   let url = new URL(rawLink)
   maskDomain.value.forEach((mask) => {
@@ -235,28 +248,10 @@ export default {
   return rawLink;
 }
 
-    function searchByLink() {
+//在线阅读以及展示缩略图
-      if(!validateLink(link.value)){
-        ElMessage("请检查输入的链接")
-      }
-      else {
-        store.dispatch("searchByLink", link.value)
-      }
-    }
-
-    function searchLocalByKeyword(){
-      console.log(keyword.value)
-      store.dispatch("searchLocalByKeyword",keyword.value)
-    }
-
-    function searchRemoteByKeyword(){
-      store.dispatch("searchRemoteByKeyword", keyword.value)
-    }
-
 function onlineGalleryReader(name){
   window.open("http://zfile.lionwebsite.xyz/1/gallery/" + encodeURI(name))
 }
-
 function showThumbnailGallery(gallery){
   store.commit("_changeThumbnailGallery", gallery)
   document.querySelector(".preview > img").click()
@@ -269,15 +264,6 @@ export default {
     AuthCode.value = localStorage.getItem("auth")
   }
 })
-
-    return {postTask, queryTask, validate, searchByLink, searchLocalByKeyword, searchRemoteByKeyword,
-            queryWeekUsedAmount, deleteVideo, deleteGallery, onlineGalleryReader, showThumbnailGallery, alterAuthCode,
-            link, loadComplete, AuthCode, realAuthCode, keyword, isRemember, chosenGallery, chosenVideo, targetResolution, weekUsed,
-             thumbnailGallery, isAlterAuthCode, newAuthCode, tempAuthCode,
-      store
-    }
-  }
-}
 </script>
 
 <style scoped>
@@ -287,7 +273,6 @@ export default {
     background-color: ghostwhite;
     text-align: center;
   }
-
   .el-input{
     width: 300px;
   }

src/components/Side.vue

@@ -133,23 +133,29 @@
   </div>
 </template>
 
-<script>
+<script setup>
 import store from "../store";
 import {computed, ref} from "vue";
-export default {
+
-  name: "Side",
+//输入
-  setup(){
 let inputNode = ref(null)
+//是否正在编辑页数
 let isEditingPage = ref(false)
+//是否正在编辑标签
 let isEditingTag = ref(false)
+//临时变量
 let tempTag = ref("")
 let tempGid = ref("")
+
+
 let showNameType = ref("shortName")   // shortName name
 let showType = ref("gallery")     // gallery video collect
 let sortType = ref("shortName")   // shortName name createTime
 let targetPage = ref(1)
-    let debounceTimer = 0
 
+//防抖计时器
+let debounceTimer = 0
+//是否加载完成
 let loadComplete = computed(() => {
   return store.state.loadComplete
 })
@@ -157,7 +163,6 @@ export default {
 let galleryTasks = computed(() => {
     return store.getters.galleryTasks ? store.getters.galleryTasks: null
 })
-
 let videoTasks = computed(() => {
     return store.getters.videoTasks ? store.getters.videoTasks: null
 })
@@ -165,7 +170,6 @@ export default {
 let isShowVideoHistory = computed(() => {
   return store.state.showType === "video"
 })
-
 let isShowGalleryHistory = computed(() => {
   return store.state.showType === "gallery" || store.state.showType === "collect"
 })
@@ -173,51 +177,53 @@ export default {
 let min = computed(() => {
   return store.getters.min
 })
-
 let max = computed(() => {
   if(targetPage.value > store.getters.max)
     store.commit("_changePage", store.getters.max)
   return store.getters.max
 })
-
 let page = computed(() => {
   targetPage.value = store.state.page
   return store.state.page
 })
 
+//翻页
 function next() {
   if(targetPage.value < max.value) {
     targetPage.value++
     store.commit("_changePage", targetPage.value)
   }
 }
-
 function previous() {
   if(targetPage.value > min.value) {
     targetPage.value--
     store.commit("_changePage", targetPage.value)
   }
 }
-
 function toMax() {
   store.commit("_changePage", max.value)
   targetPage.value = max.value
 }
-
 function toMin(){
   store.commit("_changePage", min.value)
   targetPage.value = min.value
 }
-
 function changePage(){
   if(targetPage.value >= min.value && targetPage.value <= max.value)
     store.commit("_changePage", targetPage.value)
 }
+function reverseEditMode(){
+  isEditingPage.value = !isEditingPage.value
+  if(isEditingPage.value){
+    inputNode.value.focus()
+  }
+  targetPage.value = page.value
+}
 
+//改变展示类型
 function changeShowType(){
   store.commit("_setShowType", showType.value)
 }
-
 function changeShowNameType(){
   store.commit("_setShowNameType", showNameType.value)
 
@@ -226,7 +232,6 @@ export default {
     sortType.value = showNameType.value
   }
 }
-
 function changeSortType(){
   store.commit("_setSortType", sortType.value)
 
@@ -236,19 +241,18 @@ export default {
   }
 }
 
+//收藏,编辑标签,提交编辑
 function changeCollect(gid, isCollect){
   if(isCollect)
     store.dispatch("disCollectGallery", gid)
   else
     store.dispatch("collectGallery", gid)
 }
-
 function editTag(gid, tag){
   tempTag.value = tag
   tempGid.value = gid
   isEditingTag.value = true
 }
-
 function submitTag(){
   store.dispatch("updateTag", {gid:tempGid.value, tag:tempTag.value})
   tempTag.value = ''
@@ -256,34 +260,24 @@ export default {
   isEditingTag.value = false
 }
 
-    function reverseEditMode(){
+//下载，删除，在线看
-      isEditingPage.value = !isEditingPage.value
-      if(isEditingPage.value){
-        inputNode.value.focus()
-      }
-      targetPage.value = page.value
-    }
-
 function downloadTask(link){
   window.open(link)
 }
-
 function deleteGallery(gid){
   store.dispatch("deleteGallery", gid)
 }
-
 function deleteVideo(id){
   store.dispatch("deleteVideo", id)
 }
-
 function onlineGalleryReader(name){
   window.open("http://zfile.lionwebsite.xyz/1/gallery/" + encodeURI(name))
 }
-
 function onlineVideoViewer(){
   window.open("http://zfile.lionwebsite.xyz/1/video/")
 }
 
+//显示缩略图
 function showThumbnail(gallery){
   if(gallery.download !== undefined)
     clearTimeout(debounceTimer)
@@ -291,15 +285,6 @@ export default {
       store.commit("_changeThumbnailGallery", gallery)
     }, 500)
 }
-
-    return {galleryTasks, videoTasks, min, max, targetPage, loadComplete, page, isEditingPage, isEditingTag, inputNode, isShowVideoHistory,
-            isShowGalleryHistory, showType, showNameType, sortType, tempTag, tempGid,
-            reverseEditMode, changePage, changeShowType, changeShowNameType, changeSortType, changeCollect, toMax, toMin, previous, next, downloadTask, deleteGallery,
-            deleteVideo, onlineGalleryReader, onlineVideoViewer, showThumbnail, editTag, submitTag,
-            store
-    }
-  }
-}
 </script>
 
 <style scoped>
@@ -311,8 +296,9 @@ export default {
     display: block;
   }
   .pageChanger{
-    position: absolute;
+    /*position: absolute;*/
-    top: 85vh;
+    /*top: 85vh;*/
+    margin-top: 5vh;
   }
   .el-select{
     width: 125px;

src/store/index.js

@@ -155,9 +155,8 @@ const actions = {
                 id:state.userId
             })).then((res) => {
             ElMessage(res.data.data)
-            if(res.data.result === 'success'){
+            if(res.data.result === 'success')
                 context.commit("_collectGallery", gid)
-            }
         })
     },
     disCollectGallery(context, gid){
@@ -167,57 +166,17 @@ const actions = {
                 id:state.userId
             })).then((res) => {
             ElMessage(res.data.data)
-            if(res.data.result === 'success'){
+            if(res.data.result === 'success')
                 context.commit("_disCollectGallery", gid)
-            }
         })
     },
     updateTag(context, data){
         axios.post(GalleryManageUrl + "/tag?" + qs.stringify(data)).then((res) => {
             ElMessage(res.data.data)
-            if(res.data.result === 'success'){
+            if(res.data.result === 'success')
                 context.commit("_updateTag", data)
-            }
         })
     },
-    searchByLink(context, link){
-        context.commit("_searchByLink", link)
-    },
-    searchLocalByKeyword(context, keyword){
-        context.commit("_searchLocalByKeyword", keyword)
-    },
-    searchRemoteByKeyword(context, keyword){
-        if(context.state.showType === "gallery"){
-            axios.get(GalleryManageUrl, {
-                params:{
-                    type:"name",
-                    param:keyword
-                }
-            }).then((res) => {
-                if(res.data.result === 'success'){
-                    context.commit("_setChosenGallery", {'gallery':JSON.parse(res.data.data)})
-                }
-                else{
-                    ElMessage(res.data.data)
-                }
-            })
-        }
-        else{
-            axios.get(VideoManageUrl, {
-                params:{
-                    type:"name",
-                    param:keyword
-                }
-            }).then((res) => {
-                if(res.data.result === 'success'){
-                    context.commit("_setChosenVideo", {'video': JSON.parse(res.data.data)})
-                }
-                else{
-                    ElMessage(res.data.data)
-                }
-            })
-        }
-    },
     deleteGallery(context, gid){
         axios.delete(GalleryManageUrl, {
             params:{
@@ -278,9 +237,8 @@ const mutations = {
             if(gallery.isCollect && gallery.gid === gid)
                 gallery.isCollect = false
 
-            if(gallery.isCollect)
+            else if(gallery.isCollect)
                 state.collectGallery.push(gallery)
-
         })
     },
     _updateTag(state, data){
@@ -297,26 +255,7 @@ const mutations = {
             state.collectGallery.slice(0)
             tasks.forEach((task) => {
                 //处理名字
-                if (task.name.includes("[")) {
+                task.shortName = getShortname(task.name)
-                    let name = task.name
-                    let lastIndex = name.lastIndexOf("[")
-                    name = name.substring(0, lastIndex)
-                    while (name.includes("[") && name.includes("]")) {
-                        let start = name.indexOf("[")
-                        let end = name.indexOf("]") + 1
-                        let temp = name.substring(start, end)
-                        name = name.replace(temp, "")
-                    }
-                    while (name.includes("(") && name.includes(")")) {
-                        let start = name.indexOf("(")
-                        let end = name.indexOf(")") + 1
-                        let temp = name.substring(start, end)
-                        name = name.replace(temp, "")
-                    }
-                    task.shortName = name.trim()
-                } else {
-                    task.shortName = task.name
-                }
 
                 //处理进度相关
                 switch (task.status) {
@@ -469,28 +408,27 @@ const mutations = {
         ElMessage("授权码错误")
         localStorage.removeItem("auth")
     },
-    _searchByLink(state, link){
+    _searchLocalByLink(state, link){
         let tasks
-        if(state.showType === "gallery") {
-            tasks = state.totalGalleryTask
-        }
-        else
-            tasks = state.totalVideoTask
         let i = 0
         let found = false
-        for (i = 0; i < tasks.length; i++) {
+
+        if(state.showType === "gallery")
+            tasks = state.totalGalleryTask
+        else
+            tasks = state.totalVideoTask
+
+        for (i = 0; i < tasks.length; i++)
             if (tasks[i].link === link) {
                 state.page = Math.floor(i / state.length) + 1
                 found = true
                 break
             }
-        }
+
-        if(!found){
+        if(!found)
             ElMessage("未找到此任务")
-        }
+        else
-        else{
             ElMessage("已跳转到该任务所在页数")
-        }
     },
     _searchLocalByKeyword(state, keyword){
         state.searchTask.splice(0)
@@ -510,6 +448,29 @@ const mutations = {
             }
         }
     },
+    _searchLocalByTag(state, tags) {
+        state.searchTask.splice(0)
+        state.page = 1
+
+        let tagAmount = tags.length
+        let hitAmount
+        let tasks = state.totalGalleryTask
+
+        if (tags[0].trim() !== '') {
+            tasks.forEach((task) => {
+                hitAmount = 0
+                tags.forEach((tag) => {
+                    if (task.tag.includes(tag))
+                        hitAmount++
+                })
+                if (hitAmount === tagAmount)
+                    state.searchTask.push(task)
+            })
+
+            if (state.searchTask.length === 0)
+                ElMessage("未找到符合这些tag的任务")
+        }
+    },
     _deleteGallery(state, gid){
         state.totalGalleryTask.forEach((item, index, arr) => {
             if(item.gid === gid){
@@ -525,11 +486,12 @@ const mutations = {
     },
     _setChosenGallery(state,data){
         if(data.gallery === false) {
-            //state.chosenGallery.shortName = getShortName(state.chosenGallery.name)
+            state.chosenGallery.shortName = getShortname(state.chosenGallery.name)
             state.chosenGallery.resolution = data.resolution
             state.chosenGallery.fileSize = "等待下载完成后再查看"
             state.chosenGallery.createTimeDisplay = "等待下载完成后再查看"
             state.chosenGallery.progress = "已提交"
+            state.chosenGallery.tag = ""
             state.totalGalleryTask.push(state.chosenGallery)
         }
         state.chosenGallery = data.gallery
@@ -602,7 +564,7 @@ const state = {
     defaultLength:7,                        //默认个数
     shortLength:10,                         //简洁个数
 
-    userId:-1,
+    userId:-1,                              //用户id
     isAuth:false,                           //是否授权
     AuthCode:'',                            //授权码
     loadComplete:false,                     //是否加载完成
@@ -610,7 +572,6 @@ const state = {
 
     isInclude:false,                        //是否搜索到任务
     searchTask:[],                          //搜索到的任务
-    showHistory:'',                         //是否打开面板
     showType:'gallery',                     //展示类型
     sortType:'shortName',                    //排序类型
     weekUsed:{},                            //每周用量
@@ -651,12 +612,13 @@ const getters = {
         else if(state.showType === "video")
                 if(state.totalVideoTask.length)
                     tasks = state.totalVideoTask
+
         if(!tasks)
             return 1
+
         max = Math.floor(tasks.length/state.length)
-        if(tasks.length % state.length !== 0){
+        if(tasks.length % state.length !== 0)
             max += 1
-        }
 
         if(max === 0)
             return 1
@@ -671,3 +633,24 @@ export default new vuex.Store({
     getters
 })
 
+function getShortname(name){
+    if (name.includes("[")) {
+        let lastIndex = name.lastIndexOf("[")
+        name = name.substring(0, lastIndex)
+        while (name.includes("[") && name.includes("]")) {
+            let start = name.indexOf("[")
+            let end = name.indexOf("]") + 1
+            let temp = name.substring(start, end)
+            name = name.replace(temp, "")
+        }
+        while (name.includes("(") && name.includes(")")) {
+            let start = name.indexOf("(")
+            let end = name.indexOf(")") + 1
+            let temp = name.substring(start, end)
+            name = name.replace(temp, "")
+        }
+        return name.trim()
+    } else {
+        return name
+    }
+}