新增简洁名字(仅限本子)，大幅度优化手机端体验，可选择显示全名以及简称，切换时每页的本子数会变化。排序新增简洁名字排序，并且与显示绑定。优化代码结构，去除部分无用代码。修复查找任务bug(同步更新) 更新vite至3.x

src/components/Side.vue

@@ -18,16 +18,16 @@
 
         <el-table-column label="名字" width="300">
           <template #default="scoped">
-            {{scoped.row.name}}
+            {{showNameType === 'shortName' ? scoped.row.shortName: scoped.row.name}}
           </template>
         </el-table-column>
 
         <el-table-column label="操作" width="250">
           <template #default="scoped">
             <span>
-              <el-button @click="downloadTask(scoped.row.download)" :disabled="operational(scoped.row.download)">下载</el-button>
-              <el-button @click="deleteGallery(scoped.row.gid)" :disabled="operational(scoped.row.download)">删除</el-button>
-              <el-button @click="onlineGalleryReader(scoped.row.name)" :disabled="operational(scoped.row.download)">在线看</el-button>
+              <el-button @click="downloadTask(scoped.row.download)" :disabled="scoped.row.download === undefined">下载</el-button>
+              <el-button @click="deleteGallery(scoped.row.gid)" :disabled="scoped.row.download === undefined">删除</el-button>
+              <el-button @click="onlineGalleryReader(scoped.row.name)" :disabled="scoped.row.download === undefined">在线看</el-button>
             </span>
           </template>
         </el-table-column>
@@ -60,9 +60,9 @@
         <el-table-column label="操作" width="250">
           <template #default="scoped">
             <span>
-              <el-button @click="downloadTask(scoped.row.download)" :disabled="operational(scoped.row.download)">下载</el-button>
-              <el-button @click="deleteVideo(scoped.row.id)" :disabled="operational(scoped.row.download)">删除</el-button>
-              <el-button @click="onlineVideoViewer()" :disabled="operational(scoped.row.download)">在线看</el-button>
+              <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="onlineVideoViewer()" :disabled="scoped.row.download === undefined">在线看</el-button>
             </span>
           </template>
         </el-table-column>
@@ -77,8 +77,13 @@
       <el-row class="pageChanger">
         <el-col>
           排列顺序:<el-select v-model="sortType" @change="changeSortType">
-            <el-option value="name" label="名字"></el-option>
-            <el-option value="time" label="任务创建时间"></el-option>
+            <el-option value="fullName" label="名字"></el-option>
+            <el-option value="shortName" label="简洁名字"></el-option>
+            <el-option value="createTime" label="任务创建时间"></el-option>
+          </el-select>
+          显示:<el-select v-model="showNameType" @change="changeShowNameType">
+            <el-option value="fullName" label="名字"></el-option>
+            <el-option value="shortName" label="简洁名字"></el-option>
           </el-select>
         </el-col>
         <el-col>
@@ -87,10 +92,10 @@
           <el-input v-model="targetPage"
                     @change="changePage"
                     v-show="isEditing"
-                    @blur="reverse()"
+                    @blur="reverseEditMode"
                     class="page"
                     ref="inputNode"></el-input>
-          <span @click="reverse" v-show="!isEditing" class="page">{{page}}</span>
+          <span @click="reverseEditMode" v-show="!isEditing" class="page">{{page}}</span>
           <el-button @click="next">+</el-button>
           <el-button @click="toMax">{{max}}</el-button>
         </el-col>
@@ -109,13 +114,16 @@ import {computed, ref} from "vue";
 export default {
   name: "Side",
   setup(){
-
-    const targetPage = ref(1)
-    const isEditing = ref(false)
-
     let inputNode = ref(null)
-    let showType = ref("gallery")
-    let sortType = ref("name")
+    let isEditing = ref(false)
+    let showNameType = ref("shortName")   // shortName fullName
+    let showType = ref("gallery")     // gallery video
+    let sortType = ref("shortName")   // shortName fullName createTime
+    let targetPage = ref(1)
+
+    let loadComplete = computed(() => {
+      return store.state.loadComplete
+    })
 
     let galleryTasks = computed(() => {
       if(store.getters.galleryTasks)
@@ -154,10 +162,6 @@ export default {
       return store.state.page
     })
 
-    let loadComplete = computed(() => {
-      return store.state.loadComplete
-    })
-
     function next() {
       if(targetPage.value < max.value) {
         targetPage.value++
@@ -182,13 +186,41 @@ export default {
       targetPage.value = min.value
     }
 
-
     function changePage(){
       if(targetPage.value >= min.value && targetPage.value <= max.value)
         store.commit("_changePage", targetPage.value)
     }
 
-    function reverse(){
+    function changeShowType(){
+      if(isShowVideoHistory.value){
+        store.commit("_setShowType", "gallery")
+        showType.value = "gallery"
+      }
+      else{
+        store.commit("_setShowType", "video")
+        showType.value = "video"
+      }
+    }
+
+    function changeShowNameType(){
+      store.commit("_setShowNameType", showNameType.value)
+
+      if(showNameType.value !== sortType.value){
+        store.commit("_setSortType", showNameType.value)
+        sortType.value = showNameType.value
+      }
+    }
+
+    function changeSortType(){
+      store.commit("_setSortType", sortType.value)
+
+      if(sortType.value !== showNameType.value && sortType.value !== "createTime") {
+        store.commit("_setShowNameType", sortType.value)
+        showNameType.value = sortType.value
+      }
+    }
+
+    function reverseEditMode(){
       isEditing.value = !isEditing.value
       if(isEditing){
         inputNode.value.focus()
@@ -216,30 +248,10 @@ export default {
       window.open("http://zfile.lionwebsite.xyz/1/video/")
     }
 
-    function changeShowType(){
-      if(isShowVideoHistory.value){
-        store.commit("_setShowType", "gallery")
-        showType.value = "gallery"
-      }
-      else{
-        store.commit("_setShowType", "video")
-        showType.value = "video"
-      }
-    }
-
-    function changeSortType(sortType){
-      store.commit("_setSortType", sortType)
-    }
-
-    function operational(download){
-      return download === undefined
-    }
-
-
     return {galleryTasks, videoTasks, min, max, targetPage, loadComplete, page, isEditing, inputNode, isShowVideoHistory,
-            isShowGalleryHistory, showType, sortType,
-            reverse, changePage, changeShowType, changeSortType, toMax, toMin, previous, next, downloadTask, deleteGallery,
-            deleteVideo, onlineGalleryReader, onlineVideoViewer, operational,
+            isShowGalleryHistory, showType, showNameType, sortType,
+            reverseEditMode, changePage, changeShowType, changeShowNameType, changeSortType, toMax, toMin, previous, next, downloadTask, deleteGallery,
+            deleteVideo, onlineGalleryReader, onlineVideoViewer,
             store
     }
   }
@@ -257,7 +269,6 @@ export default {
   .pageChanger{
     position: absolute;
     top: 85vh;
-    left: 75px;
   }
   .page{
     display: inline-block;