vue 导出本地模板将动态数据写入模板

npm install file-saver xlsx

npm install exceljs file-saver --save

import { saveAs } from 'file-saver'

import ExcelJS from 'exceljs'

fillExcel(dataToFill) {
      const templateUrl = '/模板.xlsx';
      fetch(templateUrl)
        .then(response => {
          if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
          }
          return response.arrayBuffer();
        })
        .then(buffer => {
          const workbook = new ExcelJS.Workbook();
          return workbook.xlsx.load(buffer).then(() => {
            const worksheet = workbook.getWorksheet(1);

            // 定义每个字段对应的单元格格式
            const cellFormats = {
              voucherDate: 'yyyy-mm-dd',
              businessDate: 'yyyy-mm-dd',
              maturityDate: 'yyyy-mm-dd'
              // oriCurrencyAmt: '0.00',
              // debitAmt: '0.00',
              // creditAmt: '0.00',
              // 可以根据需要添加更多字段的格式
            };

            // 第 5 行开始填充数据
            let rowIndex = 5;
            dataToFill.forEach(item => {
              let colIndex = 1;
              for (const key in item) {
                if (item.hasOwnProperty(key)) {
                  const cell = worksheet.getCell(rowIndex, colIndex);
                  cell.value = item[key];
                  if (cellFormats[key]) {
                    cell.numFmt = cellFormats[key];
                  }
                  colIndex++;
                }
              }
              rowIndex++;
            });

            return workbook.xlsx.writeBuffer().then(buffer => {
              const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
              saveAs(blob, `${this.excelConfig.fileName + '.xlsx'}`);
            });
          });
        })
        .catch(error => {
          console.error('导出填充数据后的模板失败:', error);
        });
    },