Jelajahi Sumber

批量下载修改成所有文件批量下载,之前只可以下载图片

高敬炎 2 tahun lalu
induk
melakukan
aed81b3bef
1 mengubah file dengan 74 tambahan dan 21 penghapusan
  1. 74 21
      src/components/WsUpload/index.vue

+ 74 - 21
src/components/WsUpload/index.vue

@@ -125,6 +125,7 @@
 </template>
 
 <script>
+import axios from 'axios'
 import { getFileList, saveFiles } from '@/model/upload'
 import { getOssInterimCredentials } from '@/model/procurement/spare'
 import { uuid } from '@/utils/assist'
@@ -366,36 +367,88 @@ export default {
         }
       }
     },
+     getFile(url) {
+            return new Promise((resolve, reject) => {
+                axios({
+                    method: 'get',
+                    url,
+                    responseType: 'blob'
+                })
+                .then(data => {
+                    console.log('data', data)
+                    resolve(data.data)
+                })
+                .catch(error => {
+                    reject(error.toString())
+                })
+            })
+        },
     _handleDownClick(){
       console.log(this.fileList,111)
       var arr=[]
       for (let i = 0; i < this.fileList.length; i++) {
-        arr.push(this.fileList[i].url+'?s=' + Math.random().toString())
+        arr.push({url:this.fileList[i].url+'?s=' + Math.random().toString(),name:this.fileList[i].name})
       }
       let urls = arr
-          let promises = [];
-          urls.map((item) => {
-            promises.push(this.getBase64Image(item));
-          });
-
-          Promise.all(promises)
-            .then((result) => {
-              let zip = new JSZip();// 创建压缩包
-              let img = zip.folder("image"); // 创建文件夹
-              let number = 0;
-              result.map((p) => {
-                let i = number++;
-                img.file(`${i}.png`, p, {
-                  base64: true,
+          const zip = new JSZip();
+            const promises = [];
+            arr.forEach((item,index) => {
+                const promise = this.getFile(item.url).then(data => {
+                	//文件名称,data 是内容
+                    const file_name = item.name;
+                    zip.file(`${file_name}`,data, { binary: true });
                 });
-              });
-              zip.generateAsync({ type: "blob" }).then(function (content) {
-                // see FileSaver.js
-                FileSaver.saveAs(content, "image.zip");
-              });
+                promises.push(promise)
+            })
+            Promise.all(promises).then(() => {
+                zip.generateAsync({ type: 'blob' }).then(content => {
+                    // 利用file-saver保存文件  自定义文件名
+                    saveAs(content, 'file.zip') 
+                })
             })
-            .catch((err) => {});
+          // urls.map((item) => {
+          //   console.log(item)
+          //   if(item.type.toLowerCase()==('jpg'||'png'||'jpeg')){
+          //     console.log(this.getBase64Image(item.url))
+          //     promises.push({url:this.getBase64Image(item.url),type:item.type});
+          //   }else{
+          //     console.log(this.getFile(item.url))
+          //     promises.push({url:this.getFile(item.url),type:item.type});
+              
+          //   }
+            
+          // });
+          // console.log(promises)
+          // promises.forEach(item => {
+          // Promise.all(item.url)
+          //   .then((result) => {
+          //     console.log(result)
+          //     let zip = new JSZip();// 创建压缩包
+          //     let img = zip.folder("image"); // 创建文件夹
+          //     let number = 0;
+          //     let file = zip.folder("file"); // 创建文件夹
+          //     let number1 = 0;
+          //     imgresult=result.filter((item)=>{return item.type.toLowerCase()==('jpg'||'png'||'jpeg')})
+          //     fileresult=result.filter((item)=>{return item.type.toLowerCase()!=('jpg'||'png'||'jpeg')})
+          //     imgresult.map((p) => {
+          //       let i = number++;
+          //       img.file(`${i}.png`, p, {
+          //         base64: true,
+          //       });
+          //     });
+          //     fileresult.map((p) => {
+          //       let i = number1++;
+          //       file.file(`${i}.${item.type}`, p, { binary: true });
+          //     });
+          //     zip.generateAsync({ type: "blob" }).then(function (content) {
+          //       // see FileSaver.js
+          //       FileSaver.saveAs(content, "file.zip");
+          //     });
+          //   })
+          //   .catch((err) => {});
+          // })
     },
+
     getBase64Image(src) {
       return new Promise(function (resolve, reject) {
         var canvas = document.createElement("canvas"),