新增在线看本子，去除视频在线看。优化本子名称缩短使其至少不为空白。优化部分代码。(同步更新)

src/components/Side.vue

@@ -16,7 +16,7 @@
               标签:{{props.row.tag === '' ? '无': props.row.tag}} <br>
               <el-button @click="downloadTask(props.row.download)" :disabled="props.row.download === undefined">下载</el-button>
               <el-button @click="deleteGallery(props.row.gid)" :disabled="props.row.download === undefined">删除</el-button>
-              <el-button @click="onlineGalleryReader(props.row.name)" :disabled="props.row.download === undefined">在线看</el-button>
+              <el-button @click="onlineGalleryReader(props.row.gid)" :disabled="props.row.download === undefined">在线看</el-button>
               <el-button @click="showThumbnail(props.row)" :disabled="props.row.download === undefined">预览封面</el-button><br>
               <el-button @click="changeCollect(props.row.gid, props.row.isCollect)" :disabled="props.row.download === undefined">{{props.row.isCollect ? '取消收藏' : '收藏'}}</el-button>
               <el-button @click="editTag(props.row.gid, props.row.tag)" :disabled="props.row.download === undefined">编辑标签</el-button>
@@ -51,7 +51,6 @@
               任务创建时间:{{props.row.createTimeDisplay}}<br>
               <el-button @click="downloadTask(props.row.download)" :disabled="props.row.download === undefined">下载</el-button>
               <el-button @click="deleteVideo(props.row.id)" :disabled="props.row.download === undefined">删除</el-button>
-              <el-button @click="onlineVideoViewer()" :disabled="props.row.download === undefined">在线看</el-button>
             </template>
           </el-table-column>
 
@@ -71,7 +70,7 @@
 
         <el-row class="pageChanger">
           <el-col>
-            筛选:<el-select v-model="showType" @change="changeShowType">
+            筛选:<el-select v-model="showType" @change="changeShowType" class="el-select">
             <el-option value="gallery" label="本子"/>
             <el-option value="video" label="视频"/>
             <el-option value="collect" label="收藏"/>
@@ -124,6 +123,13 @@
       <el-button @click="submitTag">提交修改</el-button>
     </el-footer>
   </el-dialog>
+
+  <el-dialog v-model="isOnlineReading" title="在线预览" @close="closeOnlineReader" width="90%" top="0">
+    <el-scrollbar height="80vh">
+      <el-image v-for="(link, index) in currentLinks" :src="link" :style="{'width': 'auto', 'text-align': 'center', 'background-color': 'ghostwhite'}"
+                :preview-src-list="currentLinks" :initial-index="index" loading="lazy"/>
+    </el-scrollbar>
+  </el-dialog>
 </template>
 
 <script setup>
@@ -142,9 +148,9 @@ let tempTag = ref("")
 let tempGid = ref("")
 
 
-let showNameType = ref("shortName")   // shortName fullName
+let showNameType = ref("shortName")       // shortName fullName
-let showType = ref("gallery")     // gallery video collect
+let showType = ref("gallery")             // gallery video collect
-let sortType = ref("shortName")   // shortName fullName createTime
+let sortType = ref("shortName")           // shortName fullName createTime
 let targetPage = ref(1)
 
 let loadComplete = computed(() => {
@@ -161,30 +167,33 @@ let videoTasks = computed(() => {
 let isShowVideoHistory = computed(() => {
   return store.state.showType === "video"
 })
-
 let isShowGalleryHistory = computed(() => {
   return store.state.showType === "gallery" || store.state.showType === "collect"
 })
-
 let isOpenHistoryPanel = computed(() => {
   return store.state.isShowHistory
 })
+let isOnlineReading = computed(() => {
+  return store.state.isOnlineReading
+})
 
 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
 })
 
+let currentLinks = computed(() => {
+  return store.state.currentLinks
+})
+
 //翻页
 function next() {
   if(targetPage.value < max.value) {
@@ -233,7 +242,6 @@ function changeShowNameType(){
 function changeSortType(){
   store.commit("_setSortType", sortType.value)
 
-
   if(sortType.value !== showNameType.value && sortType.value !== "createTime") {
     store.commit("_setShowNameType", sortType.value)
     showNameType.value = sortType.value
@@ -272,11 +280,11 @@ function deleteGallery(gid){
 function deleteVideo(id){
   store.dispatch("deleteVideo", id)
 }
-function onlineGalleryReader(name){
+function onlineGalleryReader(gid){
-  window.open("http://zfile.lionwebsite.xyz/1/gallery/" + encodeURI(name))
+  store.dispatch("queryOnlineLinks", gid)
 }
-function onlineVideoViewer(){
+function closeOnlineReader(){
-  window.open("http://zfile.lionwebsite.xyz/1/video/")
+  store.state.isOnlineReading = false
 }
 
 //显示缩略图

src/store/index.js

@@ -116,6 +116,26 @@ const actions = {
                 ElMessage("查询失败")
         })
     },
+    queryOnlineLinks(context, gid){
+        // 如果本地有缓存，则直接返回，没有再请求
+        if(context.state.onlineLinks[gid] !== undefined){
+            context.commit("_setOnlineLinks", gid)
+        }
+        else {
+            axios.get(GalleryManageUrl + "/onlineLinks", {
+                params: {
+                    AuthCode: state.AuthCode,
+                    gid,
+                }
+            }).then((res) => {
+                if (res.data.result === "success")
+                    context.commit("_addAndSetOnlineLinks", {gid, links: res.data.data})
+
+                else
+                    ElMessage(res.data.data)
+            })
+        }
+    },
     updateGallery(context, link){
         axios.post(GalleryManageUrl + "/update", qs.stringify({AuthCode: state.AuthCode, link}))
             .then((res) => {
@@ -135,10 +155,13 @@ const actions = {
             if(res.data.result === 'success'){
                 state.userId = parseInt(res.data.data)
                 context.commit("_authed", AuthCode)
+                //初始化
                 context.dispatch("loadMaskDomain").then()
                 context.dispatch("loadWeekUsedAmount").then()
                 context.dispatch("updateGalleryTasks", "all").then()
                 context.dispatch("updateVideoTasks", "all").then()
+
+                //手机不需要设置宽度
             }
             else
                 context.commit("_unAuthed")
@@ -555,6 +578,27 @@ const mutations = {
     _setMaskDomain(state, maskDomain){
         state.maskDomain = maskDomain
     },
+    _addAndSetOnlineLinks(state, data){
+        let links = JSON.parse(data.links)
+        state.onlineLinks[data.gid] = []
+        state.currentLinks.splice(0)
+        state.currentGid = data.gid
+
+        links.forEach((link) => {
+            state.onlineLinks[data.gid].push('http://downloader.lionwebsite.xyz/GalleryManage/onlineImage/' + link + '?gid=' + state.currentGid + '&AuthCode=' + state.AuthCode)
+            state.currentLinks.push('http://downloader.lionwebsite.xyz/GalleryManage/onlineImage/' + link + '?gid=' + state.currentGid + '&AuthCode=' + state.AuthCode)
+        })
+
+        state.isOnlineReading = true
+    },
+    _setOnlineLinks(state, gid){
+        state.currentLinks.splice(0)
+        state.onlineLinks[gid].forEach((link) => {
+            state.currentLinks.push(link)
+        })
+        state.currentGid = gid
+        state.isOnlineReading = true
+    },
     _openHistoryPanel(state){
         state.isShowHistory = true
     },
@@ -573,6 +617,11 @@ const state = {
     thumbnailGallery:{},                    //预览本子
     collectGallery:[],                      //收藏的本子
 
+    onlineLinks:{},                         //在线本子链接
+    isOnlineReading: false,                 //是否在线看
+    currentGid: "",                         //当前GID
+    currentLinks: [],                       //当前本子链接
+
     totalVideoTask:[],                      //存放视频数据的数组
     chosenVideo:false,                      //准备下载的视频
 
@@ -657,13 +706,25 @@ function getShortname(name){
             let start = name.indexOf("[")
             let end = name.indexOf("]") + 1
             let temp = name.substring(start, end)
-            name = name.replace(temp, "")
+            temp = name.replace(temp, "")
+            if(temp.trim() === ""){
+                name = name.replace("[", "").replace("]", "")
+                break
+            }
+            else
+                name = 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, "")
+            temp = name.replace(temp, "")
+            if(temp.trim() === ""){
+                name = name.replace("(", "").replace(")", "")
+                break
+            }
+            else
+                name = temp
         }
         return name.trim()
     } else {