|
|
@@ -8,12 +8,18 @@
|
|
|
@init="init"
|
|
|
/>
|
|
|
<table-list
|
|
|
+ ref="tableList"
|
|
|
:tableSets="tableSet"
|
|
|
:tableData="tableData"
|
|
|
:navText="navText"
|
|
|
:loading="loading"
|
|
|
@editInfo="editInfo"
|
|
|
>
|
|
|
+ <template slot="customize">
|
|
|
+ <el-button size="small" type="success" @click="moreActive"
|
|
|
+ >批量下载</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
<template slot="btn" slot-scope="props">
|
|
|
<el-button type="text" @click="addClick(props.scope.row, 2)"
|
|
|
>下载</el-button
|
|
|
@@ -31,6 +37,8 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import JSZip from 'jszip'
|
|
|
+import FileSaver from 'file-saver'
|
|
|
import * as baseUrls from "@/utils/request.js";
|
|
|
import searchBoxNew from "@/components/searchBoxNew";
|
|
|
import tableList from "@/components/tableList";
|
|
|
@@ -90,7 +98,7 @@ export default {
|
|
|
placeholder1: "培训有效期开始时间",
|
|
|
placeholder2: "培训有效期结束时间",
|
|
|
scope: "moreDataPicker",
|
|
|
- Diszing:true,
|
|
|
+ Diszing: true,
|
|
|
},
|
|
|
{
|
|
|
prop: "searchKey",
|
|
|
@@ -178,6 +186,70 @@ export default {
|
|
|
this.search();
|
|
|
},
|
|
|
methods: {
|
|
|
+ /**
|
|
|
+ * 批量下载
|
|
|
+ */
|
|
|
+ moreActive() {
|
|
|
+ if (!this.$refs.tableList.allCheckData.length) {
|
|
|
+ this.$message.warning("请勾选需要下载的数据");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let arr = this.$refs.tableList.allCheckData.map((item) => {
|
|
|
+ return {
|
|
|
+ fileUrl: baseUrls.BASE_IMG_URL + "/" + item.certificatePath,
|
|
|
+ renameFileName: item.certificateCode,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ this.filesToRar(arr, "证书批量下载");
|
|
|
+ console.log(arr);
|
|
|
+ },
|
|
|
+ filesToRar(arrImages, filename) {
|
|
|
+ let _this = this;
|
|
|
+ let zip = new JSZip();
|
|
|
+ let cache = {};
|
|
|
+ let promises = [];
|
|
|
+ _this.title = "正在加载压缩文件";
|
|
|
+
|
|
|
+ for (let item of arrImages) {
|
|
|
+ const promise = _this.getImgArrayBuffer(item.fileUrl).then((data) => {
|
|
|
+ // 下载文件, 并存成ArrayBuffer对象(blob)
|
|
|
+ zip.file(item.renameFileName, data, { binary: true }); // 逐个添加文件
|
|
|
+ cache[item.renameFileName] = data;
|
|
|
+ });
|
|
|
+ promises.push(promise);
|
|
|
+ }
|
|
|
+
|
|
|
+ Promise.all(promises)
|
|
|
+ .then(() => {
|
|
|
+ zip.generateAsync({ type: "blob" }).then((content) => {
|
|
|
+ _this.title = "正在压缩";
|
|
|
+ // 生成二进制流
|
|
|
+ FileSaver.saveAs(content, filename); // 利用file-saver保存文件 自定义文件名
|
|
|
+ _this.title = "压缩完成";
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch((res) => {
|
|
|
+ _this.$message.error("文件压缩失败");
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //获取文件blob
|
|
|
+ getImgArrayBuffer(url) {
|
|
|
+ let _this = this;
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ //通过请求获取文件blob格式
|
|
|
+ let xmlhttp = new XMLHttpRequest();
|
|
|
+ xmlhttp.open("GET", url, true);
|
|
|
+ xmlhttp.responseType = "blob";
|
|
|
+ xmlhttp.onload = function () {
|
|
|
+ if (this.status == 200) {
|
|
|
+ resolve(this.response);
|
|
|
+ } else {
|
|
|
+ reject(this.status);
|
|
|
+ }
|
|
|
+ };
|
|
|
+ xmlhttp.send();
|
|
|
+ });
|
|
|
+ },
|
|
|
editInfo(v) {
|
|
|
this.addClick(v, 2);
|
|
|
},
|
