批量上传说明书

src/api/common.js

@@ -44,20 +44,5 @@ export default {
   getArea(params) {
     return axios.get('/v2/common/area', { params })
   },
-  /**
-   * 上传分片
-   */
-  uploadChunks(data) {
-    return axios.post('/v2/common/upload/chunks?_=' + new Date().getTime(), data)
-  },
-  /**
-   * 合并分片
-   */
-  mergeChunks(params) {
-    return axios({
-      url: '/v2/common/upload/chunks/merge',
-      method: 'post',
-      params: params
-    })
-  }
+
 }

src/api/newApi/file.js

@@ -8,6 +8,10 @@ export default {
     return axios.get('/fileManager/downloadFile', {params},prop)
   },
 
+  //开始上传分片
+  startChunks(data) {
+    return axios.post('/fileManager/startChunks', data)
+  },
   //上传分片
   uploadChunks(data) {
     return axios.post('/fileManager/chunks?_=' + new Date().getTime(), data)

src/utils/model/ImportProgress/index.vue

@@ -13,7 +13,7 @@
             </div>
         </div>
         <div class="btn">
-            <el-button size="mini" v-if="isStop" @click="stop">暂停</el-button>
+            <el-button size="mini" v-if="!isStop" @click="stop">暂停</el-button>
             <el-button size="mini" v-else @click="keepOn">继续</el-button>
             <el-button size="mini" @click="cancel">取消</el-button>
         </div>
@@ -43,7 +43,8 @@ export default {
         file:{},
         recordMessage:'',
         len:0,
-        currentIndex:0
+        currentIndex:0,
+        resumePromise:null,
     };
   },
   watch: {
@@ -65,6 +66,10 @@ export default {
   computed: {},
   created() {},
   mounted() {},
+  beforeDestroy() {  
+    this.isPaused = true;  
+    this.resumePromise = null;  
+  }, 
   methods: {
     init(){
         console.log(this.form)
@@ -84,13 +89,17 @@ export default {
          // this.record('等待读取文件MD5')
         this.recordMessage = '等待读取文件MD5'
         let fileChunks = createFileChunk(this.form.file)
-        console.log(fileChunks)
-        return
+        // console.log(fileChunks)
+        // return
+        fileChunks = [1,2,3,4,5]
         this.len = fileChunks.length + 3
         
           getFileMD5(this.form.file, async (md5) => {
             this.record('文件MD5：' + md5)
-            
+            const start = await this.$api.startChunks({md5: md5, fileName: this.form.file.name})
+            if(!start.data){
+                return
+            }
             await this.uploadChunks(fileChunks, md5, 0)
             this.record('等待服务器合并分片')
             const response = await this.$api.mergeChunks({ md5: md5, fileName: this.form.file.name })
@@ -108,7 +117,35 @@ export default {
       this.currentIndex += 1
       this.percentage =parseInt( this.currentIndex / this.len * 100)
     },
-    uploadChunks(fileChunks, md5, index) {
+    async uploadChunks(fileChunks, md5, index=0) {
+        for(var i = index;i<fileChunks.length;i++){
+           
+            await new Promise((resolve,reject) => {
+                let formData = new FormData()
+                formData.append('file', fileChunks[i].file)
+                formData.append('md5', md5)
+                formData.append('index', i)
+                // setTimeout(()=>{
+                //     const status = `将分片上传至服务器(${i + 1}/${fileChunks.length})`
+                //     this.record(status)
+                //     resolve()
+                    
+                // },5000)
+                this.$api.uploadChunks(formData).then(async (response) => {
+                    const status = `将分片上传至服务器(${i + 1}/${fileChunks.length})`
+                    this.record(status)
+                    resolve()
+                })
+            });  
+            if (this.isStop) {  
+                // 如果循环被暂停，则等待直到被恢复  
+                await new Promise(resolve => {  
+                    this.resumePromise  = resolve; 
+                });  
+            }
+
+        }
+        return
       return new Promise((resolve, reject) => {
         if (index >= fileChunks.length) {
           resolve(true)
@@ -160,10 +197,12 @@ export default {
     //继续
     keepOn(){
         this.isStop = false
+        this.resumePromise()
+        this.resumePromise = null;
     },
     //取消
     cancel(){
-
+        this.del()
     },
     timedShutdown(){
         setTimeout(function() {