cckj-util/src/classes/zip.js

A common util lib for cj

import JSZip from "jszip";
import {saveAs} from "file-saver";
import CJUtil from "../utils";
import _ from "lodash";

/**
 * CJZip 打包压缩文件
 * @constructor CJZip
 * @param {Object[]} data - 打包文件的数组
 * @param {string}   data[].url - 图片的链接地址
 * @param {string}   data[].name - 图片的名称
 * @param {string}   data[].group - 图片的分类（没有则放根目录）
 * @param {string=}  [output=test.zip] - 输出的文件夹名称
 * @example
 * let data =  [
 *               { url: 'http://img.cdn.com/1.jpg',name:'图片1.jpg',group:'文件夹 1'},
 *               { url: 'http://img.cdn.com/2.jpg',name:'图片2.jpg',group:''}
 *             ]
 * let myZip = new CJZip({ data, output:'test.zip'})
 * // 输出文档
 * myZip.run()
 */
class CJZip {
  constructor({ data, output = "test.zip" }) {
    // 源数据
    this.data = data;
    this.output = output;
    this._zip = new JSZip();

    if (this.data.length === 0) {
      throw Error("请传入 data 数据！");
    }
  }

  /**
   * 生成文件
   */
  run() {
    let _this = this;

    // 1. 遍历文件夹，在每个文件夹中生成数据
    let groupData = _.groupBy(this.data, "group");

    Object.keys(groupData).forEach((source) => {
      let folderName = source.slice(0);
      let targetFolder = this._zip;

      if (folderName !== "") {
        // 不是根目录，生成文件夹
        targetFolder = this._zip.folder(folderName);
      }

      // 遍历对应的文件夹，插入数据
      groupData[source].forEach((item) => {
        console.log(111);
        // 获取类型，调用方法
        let str = item.type
        str = str.replace(str[0],str[0].toUpperCase())
        _this['_zip'+str](targetFolder, item.name, item.content)
      });
    });

  }

  /**
   * 是否下载完整
   * @private
   * @returns {Boolean} 是否下载完整，可以进行打包
   */
  isLoadOver(data,currentZip) {
    let targetLen = 0;

    let groupData = _.groupBy(data,'group');

    // 排除根目录
    let newFolder = Object.keys(groupData).filter(group => group !== '')

    // 新增文件夹的数量
    targetLen = newFolder.length;

    //  + 文件的数量
    targetLen += data.length

     // 实际下载的数量
    let realLen = Object.values(currentZip.files).length;
    return targetLen === realLen;
  }

  /**
   * 插入文本
   * @private
   * @param {*} targetFolder 目标文件夹
   * @param {*} name 名称
   * @param {*} content 内容
   */
  _zipText(targetFolder,name,content){
    targetFolder.file(name,content)
  }

  /**
   * 插入图片
   * @private
   * @param {*} targetFolder 目标文件夹
   * @param {*} name 名称
   * @param {*} content 内容
   */
  _zipImage(targetFolder,name,content) {
    let _this = this


    CJUtil.File.getBase64Image(content, function (dataURL) {
      // 对获取的图片base64数据进行处理
      var img_arr = dataURL.split(",");

      //根据base64数据在压缩包中生成jpg数据
      targetFolder.file(name, img_arr[1], {
        base64: true,
      });

      // 如果全部的图片和文件夹都已经创建好，则开始打包
      if (_this.isLoadOver(_this.data, _this._zip)) {
        //当所有图片都已经生成打包并保存zip
        _this._zip.generateAsync({ type: "blob" }).then(function (content) {
          saveAs(content, _this.output);
        });
      }
    });
  }

}

export default CJZip;