前端导出zip压缩包

文章描述了如何在JavaScript中,通过点击按钮触发函数`dczip`,合并单元格并生成包含多张表格的Excel文件,最后将这些文件打包成ZIP文件进行下载。涉及到了JSON对象的创建、数据处理和XLSX库的使用。
摘要由CSDN通过智能技术生成

点击“导出”按钮, 需要一次导出多个Excel文件,为方便使用,将多个文件放入zip文件夹中进行下载。

<el-button type="primary" @click="dczip">导出</el-button>

dczip(){
    let jsonArray=[],map={}
    
    // 进行所有表头的单元格合并
    let merges = [];
    
    let jsonData = []
    
    if (flag){
        list.forEach(item=> {
            merges.push('1B:1E')
            
            let data = []
            data[0] = item.title
            data[1] = item.zfsqhydl==null?0.00.toFixed(2):item.zfsqhydl.toFixed(2)
            data[2] = item.zfsqhydj==null?0.00.toFixed(2):item.zfsqhydj.toFixed(2)
            data[3] = item.zfsqhydf==null?0.00.toFixed(2):item.zfsqhydf.toFixed(2)
            data[4] = item.ydsbdl==null?0.00.toFixed(2):item.ydsbdl.toFixed(2)
            data[5] = item.ydsbdj==null?0.00.toFixed(2):item.ydsbdj.toFixed(2)
            
            jsonData.push(data)
        })
        let header1 = ['',month.substring(0,4)+'年'+month.substring(5,7)*1+'月','','','','']
        let header2  = ['编号:','','','','','单位:MWh']
        let header3 = ['时间','总结算电量','总结算电价','总结算电费','售电公司应得费用','']
        
        
        map['th1']=header1
        map['th2']=header2
        map['th3']=header3
        map['merges']=merges
        map['jsonData'] = jsonData
        map['title'] = month.substring(0,7)+"结算单"
        
        jsonArray.push(map)
    }else{
        merges=[]
        merges.push('1C:1F')
        
        let header2  = ['编号:','','','','','单位:MWh、元/MWh、元']
        let header3 = ['时段', '日前统一结算价格','日前偏差电费','实时用电量', '启动分摊','总结算电费']
        
        
        let resMap = res.data.data
        for (var key in resMap) {
            map={}
            jsonData=[]
            let list =resMap[key]
            list.forEach(item=>{
                let data = []
                data[0] = item.title
                data[1] = item.zfsqhydl==null?0.000.toFixed(3):item.zfsqhydl.toFixed(3)
                data[2] = item.zfsqhydj==null?0.000.toFixed(3):item.zfsqhydj.toFixed(3)
                data[3] = item.zfsqhydf==null?0.000.toFixed(3):item.zfsqhydf.toFixed(3)
                data[4] = item.ydsbdl==null?0.000.toFixed(3):item.ydsbdl.toFixed(3)
                data[5] = item.ydsbdj==null?0.000.toFixed(3):item.ydsbdj.toFixed(3)
               
                jsonData.push(data)
            })
        
            let header1 = ['','',key.substring(0,4)+'年'+key.substring(5,7)*1+'月'+key.substring(8)*1+'日','','','']
        
        
            map['th1']=header1
            map['th2']=header2
            map['th3']=header3
            map['merges']=merges
            map['jsonData'] = jsonData
            map['title'] =key +"结算单"
            jsonArray.push(map)
        }
    }
    let zipName = month.substring(0,4)+'年'+this.formData.month.substring(5,7)*1+'月结算单'
    
    require.ensure([], () => {
        const {export_json_to_excel_zip} = require('@/excel/Export2Excel'); //这里必须使用绝对路径(见附件)
        export_json_to_excel_zip(jsonArray,zipName);
    })
},

附件:

import JSZip from "jszip";

require('script-loader!file-saver');
require('./Blob');
require('script-loader!xlsx/dist/xlsx.core.min');

function datenum(v, date1904) {
    if (date1904) v += 1462;
    var epoch = Date.parse(v);
    return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);
}

function sheet_from_array_of_arrays(data, opts) {
    var ws = {};
    var range = {s: {c: 10000000, r: 10000000}, e: {c: 0, r: 0}};
    for (var R = 0; R != data.length; ++R) {
        for (var C = 0; C != data[R].length; ++C) {
            if (range.s.r > R) range.s.r = R;
            if (range.s.c > C) range.s.c = C;
            if (range.e.r < R) range.e.r = R;
            if (range.e.c < C) range.e.c = C;
            var cell = {v: data[R][C]};
            if (cell.v == null) continue;
            var cell_ref = XLSX.utils.encode_cell({c: C, r: R});

            if (typeof cell.v === 'number') cell.t = 'n';
            else if (typeof cell.v === 'boolean') cell.t = 'b';
            else if (cell.v instanceof Date) {
                cell.t = 'n';
                cell.z = XLSX.SSF._table[14];
                cell.v = datenum(cell.v);
            }
            else cell.t = 's';

            ws[cell_ref] = cell;
        }
    }
    if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range);
    return ws;
}

function Workbook() {
    if (!(this instanceof Workbook)) return new Workbook();
    this.SheetNames = [];
    this.Sheets = {};
}

function s2ab(s) {
    var buf = new ArrayBuffer(s.length);
    var view = new Uint8Array(buf);
    for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
}

export function export_json_to_excel_zip(jsonArray,zipName) {

    /* original data */
    if (jsonArray != null && jsonArray.length > 0) {
        const zip = new JSZip();

        for (let i = 0; i < jsonArray.length; i++) {
            let th1 = jsonArray[i].th1==undefined?[]:jsonArray[i].th1;
            let th2 = jsonArray[i].th2==undefined?[]:jsonArray[i].th2;
            let th3 = jsonArray[i].th3==undefined?[]:jsonArray[i].th3;
            let jsonData = jsonArray[i].jsonData;
            var title = jsonArray[i].title || '文件'+i;
            let merges = jsonArray[i].merges

            var data = jsonData;
            if (th3.length != 0){data.unshift(th3);}
            if (th2.length != 0){data.unshift(th2);}
            if (th1.length != 0){data.unshift(th1);}
            var ws_name = "SheetJS";

            var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);

            if (merges.length > 0) {
                if (!ws['!merges']) ws['!merges'] = [];
                merges.forEach(item => {
                    ws['!merges'].push(XLSX.utils.decode_range(item))
                })
            }

            /* add worksheet to workbook */
            wb.SheetNames.push(ws_name);
            wb.Sheets[ws_name] = ws;

            var wbout = XLSX.write(wb, {bookType: 'xlsx', bookSST: false, type: 'binary'});
            let blob = new Blob([s2ab(wbout)], {type: ""})

            zip.file(title + ".xlsx", blob, {binary: true})

        }
        zip.generateAsync({type: 'blob'}).then(function (content) {
            saveAs(content, zipName+'.zip');
        });
    }
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值