fix: 修复上传大量文件传输进度条卡住的问题

src/components/ShowFile/ShowFile.vue

@@ -1490,9 +1490,6 @@ export default {
           this.path = ''
         }
         if (fileDoc) {
-          if (this.$store.state.uploaderState) {
-            return
-          }
           if (fileDoc.$set) {
             let path = fileDoc.$set.path
             path = path.replace(/\\/g, '/')

src/components/SimpleUploader/globalUploader.vue

@@ -112,7 +112,6 @@
 
 <script>
 
-// import { ACCEPT_CONFIG } from '@/assets/js/config'
 import store from '@/store'
 import $ from 'jquery'
 import SparkMD5 from 'spark-md5'
@@ -133,7 +132,7 @@ export default {
         // speedSmoothingFactor: 0.1,
         // progressCallbacksInterval: 500,
         maxChunkRetries: 3, // 最大重试次数
-        simultaneousUploads: 5, // 并发上传数
+        simultaneousUploads: 3, // 并发上传数
         testChunks: true, // 是否开启服务器分片校验
         // 服务器分片校验函数，秒传及断点续传基础
         checkChunkUploadedByResponse: function (chunk, message) {
@@ -230,6 +229,17 @@ export default {
             $('#folder-uploader-btn').click()
           }
           break
+        case 'request':
+          if (msg.data === 0) {
+            if (this.uploader.fileList.length  === 0 && this.panelShow) {
+              this.fileListLength = this.uploader.fileList.length
+              this.process = 100
+              this.setPageTitle()
+              this.uploader.cancel()
+              this.displayPanel(false)
+            }
+          }
+          break
       }
     }
   },
@@ -359,7 +369,6 @@ export default {
     },
     displayPanel(display) {
       this.panelShow = display
-      this.$store.dispatch('updateUploaderState', display)
     },
     doUploadBefore(files) {
       this.fileListLength = this.uploader.fileList.length
@@ -378,9 +387,6 @@ export default {
             currentDirectory: encodeIfNeeded(this.params.currentDirectory),
             username: this.params.username,
             userId: this.params.userId
-          }).then(() => {
-            this.getFileList()
-          }).catch(e => {
           })
         })
       }
@@ -404,6 +410,13 @@ export default {
         this.uploader.resume()
       })
     },
+    setPageTitle() {
+      if (this.process === -10 || this.process === 100 || this.fileListLength === 0) {
+        document.title = `${this.$route.meta.title}`
+      } else {
+        document.title = `${this.process}% | ${this.$route.meta.title}`
+      }
+    },
     onFileProgress(rootFile, file, chunk) {
       this.netSpeed = formatNetSpeed(file.currentSpeed)
       this.process = Math.trunc(window.uploader.progress() * 100)

src/store/index.js

@@ -16,23 +16,16 @@ const store = new Vuex.Store({
   getters,
   state: {
     message: null,
-    uploaderState: null,
   },
   mutations: {
     setMessage(state, message) {
       state.message = message;
     },
-    setUploaderState(state, uploaderState) {
-      state.uploaderState = uploaderState;
-    },
   },
   actions: {
     updateMessage({ commit }, message) {
       commit('setMessage', message);
     },
-    updateUploaderState({ commit }, uploaderState) {
-      commit('setUploaderState', uploaderState);
-    },
   }
 })
 

src/utils/request.js

@@ -12,6 +12,7 @@ const service = axios.create({
 // request interceptor
 service.interceptors.request.use(
   config => {
+    store.dispatch('updateMessage', { event: 'request', data: 1})
     // do something before request is sent
     if (store.getters.token) {
       config.headers['jmal-token'] = getToken()
@@ -44,6 +45,7 @@ service.interceptors.response.use(
    * You can also judge the status by HTTP Status Code
    */
   response => {
+    store.dispatch('updateMessage', { event: 'request', data: 0})
     const res = response.data
     if (res.code !== 0) {
       if (res.code === -2) {