vue导出excel,自定义多级表头高度

先看结果:

1、我的列表由于我的是有动态列的,所以下面的代码会对动态列进行判断处理:

导出结果:

2、直接贴代码,我对1、2、3行做了适配业务处理

导入依赖,没有的直接搜一下安装,然后导入即可

import { saveAs } from 'file-saver';

import * as ExcelJS from 'exceljs';

建议导入4.*的,如果导入报错,很可能是兼容问题,换一个版本

导出方法贴代码:

exportToExcel() {
            this.$nextTick(async () => {
            //const workbook = XLSX.utils.book_new();// new ExcelJS.Workbook();
            const workbook = new ExcelJS.Workbook();
            const worksheet = workbook.addWorksheet('Sheet1');
            // 设置多级表头
            if(this.data.checkbox4 == true){
                worksheet.mergeCells('A1:I1'); // 合并
            }else{
                worksheet.mergeCells('A1:H1'); // 合并
            }
            let cell =  worksheet.getCell('E1');
            cell.value = '明细分类账';
            cell.alignment = { horizontal: 'center', vertical: 'middle' };
            cell.font = { size: 24 }; // 设置字体大小

            worksheet.mergeCells('A2:C2'); // 合并
            const datestr = this.getDeatilDate();
            cell =  worksheet.getCell('A2');
            cell.value = datestr;
            cell.alignment = { horizontal: 'center', vertical: 'middle',wrapText: true };//wrapText: true允许换行

            if(this.data.checkbox4 == true){
                worksheet.mergeCells('E2:I2'); // 合并
            }else{
                worksheet.mergeCells('E2:H2'); // 合并
            }
            const dm = this.getDetailShow();
            cell =  worksheet.getCell('G2');
            cell.value = dm;
            cell.alignment = { horizontal: 'center', vertical: 'middle' };

            worksheet.mergeCells('A3:A4'); // 合并第一列的3、4行
            const cell1 =  worksheet.getCell('A3');
            cell1.value = '凭证日期';
            cell1.alignment = { horizontal: 'center', vertical: 'middle' };

            worksheet.mergeCells('B3:B4'); // 合并
            const cell2 =  worksheet.getCell('B3');
            cell2.value = '凭证字号';
            cell2.alignment = { horizontal: 'center', vertical: 'middle' };


            worksheet.mergeCells('C3:C4'); // 合并
            const cell3 =  worksheet.getCell('C3');
            cell3.value = '摘要';
            cell3.alignment = { horizontal: 'center', vertical: 'middle' };


            worksheet.mergeCells('D3:D4'); // 合并
            const cell4 =  worksheet.getCell('D3');
            cell4.value = '对方科目';
            cell4.alignment = { horizontal: 'center', vertical: 'middle' };

            worksheet.mergeCells('E3:E4'); // 合并
            const cell5 =  worksheet.getCell('E3');
            cell5.value = '借方';
            cell5.alignment = { horizontal: 'center', vertical: 'middle' };


            worksheet.mergeCells('F3:F4'); // 合并
            const cell6 =  worksheet.getCell('F3');
            cell6.value = '贷方';
            cell6.alignment = { horizontal: 'center', vertical: 'middle' };


            if(this.data.checkbox4 == true){
                worksheet.mergeCells('G3:G4'); // 合并
                const cell7 =  worksheet.getCell('G3');
                cell7.value = '实际发生额';
                cell7.alignment = { horizontal: 'center', vertical: 'middle' };

                worksheet.mergeCells('H3:I3'); // 合并
                const cell8 =  worksheet.getCell('H3');
                cell8.value = '余额';
                cell8.alignment = { horizontal: 'center', vertical: 'middle' };

                const cell9 =  worksheet.getCell('H4');
                cell9.value = '方向';
                cell9.alignment = { horizontal: 'center', vertical: 'middle' };

                const cell10 =  worksheet.getCell('I4');
                cell10.value = '金额';
                cell10.alignment = { horizontal: 'center', vertical: 'middle' };
            }else {
                worksheet.mergeCells('G3:H3'); // 合并
                worksheet.getCell('G3').value = '余额';
                const cell8 =  worksheet.getCell('H3');
                cell8.value = '余额';
                cell8.alignment = { horizontal: 'center', vertical: 'middle' };

                const cell9 =  worksheet.getCell('G4');
                cell9.value = '方向';
                cell9.alignment = { horizontal: 'center', vertical: 'middle' };

                const cell10 =  worksheet.getCell('H4');
                cell10.value = '金额';
                cell10.alignment = { horizontal: 'center', vertical: 'middle' };
                
            }
            
            // 添加数据行
            if(this.data.checkbox4 == true){
                this.tableData.forEach(row => {
                    const currow = worksheet.addRow([
                        row.billdate,
                        row.credname,
                        row.brief,
                        row.targetSubjectName,
                        row.debit,
                        row.credit,
                        (row.debit == null ? 0 : row.debit) - (row.credit == null ? 0 : row.credit),
                        row.todebit,
                        row.lastMoney
                    ]);
                    // 设置整行内容居中对齐
                    currow.eachCell({ includeEmpty: true }, (cell) => {
                        cell.alignment = { horizontal: 'center', vertical: 'middle' };
                    });
                });

            }else {
                this.tableData.forEach(row => {
                  const currow = worksheet.addRow([
                        row.billdate,
                        row.credname,
                        row.brief,
                        row.targetSubjectName,
                        row.debit,
                        row.credit,
                        row.todebit,
                        row.lastMoney
                    ]);
                    // 设置整行内容居中对齐
                    currow.eachCell({ includeEmpty: true }, (cell) => {
                        cell.alignment = { horizontal: 'center', vertical: 'middle' };
                    });
                });
            }
            // 获取最后一行的行号
            const lastRowNumber = worksheet.rowCount;

            // 获取当前日期
            const currentDate = new Date();
            // 格式化日期为 YYYY-MM-DD
            const formattedDate = currentDate.toISOString().split('T')[0]; // 使用toISOString方法并截取日期部分
            worksheet.mergeCells('A'+(lastRowNumber+1)+':C'+(lastRowNumber+1)); // 合并
            cell =  worksheet.getCell('A'+(lastRowNumber+1));
            cell.value = '操作员:'+this.opname;
            cell.alignment = { horizontal: 'center', vertical: 'middle' };

            worksheet.mergeCells('E'+(lastRowNumber+1)+':H'+(lastRowNumber+1)); // 合并
            cell =  worksheet.getCell('E'+(lastRowNumber+1));
            cell.value = '打印时间:'+formattedDate;
            cell.alignment = { horizontal: 'center', vertical: 'middle' };


            // // 设置列宽、由于我上面设置了多级表头,这里的就不需要设置表头和宽度了
            // worksheet.columns = [
            // { header: '凭证日期', key: 'billdate', width: 15,  },
            // { header: '凭证字号', key: 'credname', width: 15,  },
            // { header: '摘要', key: 'brief', width: 30, },
            // { header: '对方科目', key: 'targetSubjectName', },
            // { header: '借方', key: 'debit', width: 15,  },
            // { header: '贷方', key: 'credit', width: 15, },
            // { header: '实际发生额', key: 'happenMoney', width: 15, },
            // { header: '余额', key: 'hadmoney', width: 15, },
            // ];
            // 设置特定行的高度(例如第2行)
            const rowNumber = 2; // 行号从1开始
            const rowHeight = 80; // 设置为80
            const row = worksheet.getRow(rowNumber);
            row.height = rowHeight;
            // 导出 Excel 文件
            const buffer = await workbook.xlsx.writeBuffer();
            saveAs(new Blob([buffer]), '明细分类账.xlsx');
            });
        },

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值