修改文件上传逻辑

src/components/file/box/uploadFile/Box.vue

@@ -91,7 +91,7 @@
               <ul class="file-list" v-show="!collapse">
                 <li
                   class="file-item"
-                  :class="{ 'custom-status-item': file.statusStr !== '' }"
+                  :class="{ 'custom-status-item': uploadStatus[file.id] !== '' }"
                   v-for="file in props.fileList"
                   :key="file.id"
                 >
@@ -101,7 +101,7 @@
                     :list="true"
                   ></uploader-file>
                   <!-- 自定义状态 -->
-                  <span class="custom-status">{{ file.statusStr }}</span>
+                  <span class="custom-status">{{ uploadStatus[file.id] }}</span>
                 </li>
                 <div class="no-file" v-if="!props.fileList.length">
                   <i class="icon-empty-file"></i> 暂无待上传文件
@@ -123,6 +123,7 @@ import { mapState } from "vuex";
 export default {
   data() {
     return {
+      uploadStatus: {},
       // 上传组件配置项
       options: {
         target: `${process.env.VUE_APP_BASE_API}/v1/api/folder/transfer/uploadfile`, // 上传文件-目标 URL
@@ -304,15 +305,16 @@ export default {
      * @param {string} response 服务端响应内容，永远都是字符串
      */
     handleFileSuccess(rootFile, file, response) {
+    
       if (response == "") {
-        file.statusStr = "上传失败";
+        this.uploadStatus[file.id] = "上传失败";
         this.callback(false);
         return;
       }
 
       let result = JSON.parse(response);
-      if (result.success) {
-        file.statusStr = "";
+      if (result.code===200) {
+        this.uploadStatus[file.id] = "";
         if (this.filesLength === 1) {
           // 本次所有的文件均已上传完毕
           this.$message.success(`上传完毕`);
@@ -327,7 +329,7 @@ export default {
         }
       } else {
         this.$message.error(result.message);
-        file.statusStr = "上传失败";
+        this.uploadStatus[file.id] = "上传失败";
       }
       this.filesLength--;
     },
@@ -358,7 +360,7 @@ export default {
       let chunks = Math.ceil(file.size / chunkSize);
       let spark = new SparkMD5.ArrayBuffer();
       // 文件状态设为"计算MD5"
-      file.statusStr = "计算MD5";
+      this.uploadStatus[file.id] = "计算MD5";
       file.pause();
       loadNext();
       fileReader.onload = (e) => {
@@ -367,9 +369,10 @@ export default {
           currentChunk++;
           loadNext();
           // 实时展示MD5的计算进度
-          file.statusStr = `校验MD5 ${((currentChunk / chunks) * 100).toFixed(
+          this.uploadStatus[file.id] = `校验MD5 ${((currentChunk / chunks) * 100).toFixed(
             0
           )}%`;
+          this.uploadStatus = JSON.parse(JSON.stringify(this.uploadStatus))
         } else {
           let md5 = spark.end();
           this.calculateFileMD5End(md5, file);
@@ -406,7 +409,8 @@ export default {
       file.uniqueIdentifier = md5;
       file.resume();
       // 移除自定义状态
-      file.statusStr = "";
+			this.uploadStatus[file.id] = ''
+			this.uploadStatus = JSON.parse(JSON.stringify(this.uploadStatus))
     },
     /**
      * 关闭上传面板，并停止上传