首页 > 其他分享 >基础lucksheet实现前端导出excel文件

基础lucksheet实现前端导出excel文件

时间:2023-12-04 20:45:00浏览次数:29  
标签:function return lucksheet luckyToExcel excel 导出 elem cell border

文章参考:https://blog.csdn.net/csdn_lsy/article/details/107179708

1.引入两个插件,其中exceljs负责将lucksheet的数据格式转化成excel的buffer流,file-saver负责将buffer转成blob文件流导出。

npm install exceljs
npm install file-saver

2.代码实现

const Excel = require('exceljs')
const FileSaver = require('file-saver')

const EXCEL_TYPE ="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8";

var exportExcel = exports.exportExcel =  async function (luckysheet) { // 参数为luckysheet.getluckysheetfile()获取的对象
                                                                       // 1.创建工作簿,可以为工作簿添加属性
  const workbook = new Excel.Workbook()
  // 2.创建表格,第二个参数可以配置创建什么样的工作表
  luckysheet.every(function (table) {
    if (table.data.length === 0) return true
    const worksheet = workbook.addWorksheet(table.name)
    // 3.设置单元格合并,设置单元格边框,设置单元格样式,设置值
    setStyleAndValue(table.data, worksheet)
    setMerge(table.config.merge, worksheet)
    setBorder(table.config.borderInfo, worksheet)
    return true
  })
  // 4.写入 buffer
  const buffer = await workbook.xlsx.writeBuffer()
  const blob = new Blob([buffer], { type: EXCEL_TYPE });
  FileSaver.saveAs(blob, "download.xlsx");
}

var setMerge = function (luckyMerge = {}, worksheet) {
  const mergearr = Object.values(luckyMerge)
  mergearr.forEach(function (elem) { // elem格式:{r: 0, c: 0, rs: 1, cs: 2}
    // 按开始行,开始列,结束行,结束列合并(相当于 K10:M12)
    worksheet.mergeCells(elem.r + 1, elem.c + 1, elem.r + elem.rs, elem.c + elem.cs)
  })
}

var setBorder = function (luckyBorderInfo, worksheet) {
  if (!Array.isArray(luckyBorderInfo)) return
  luckyBorderInfo.forEach(function (elem) {
    let border = borderConvert(elem.borderType, elem.style, elem.color)
    let rang = elem.range[0]
    // console.log(rang.column_focus + 1, rang.row_focus + 1)
    worksheet.getCell(rang.row_focus + 1, rang.column_focus + 1).border = border
  })
}
var setStyleAndValue = function (cellArr, worksheet) {
  if (!Array.isArray(cellArr)) return
  cellArr.forEach(function (row, rowid) {
    row.every(function (cell, columnid) {
      if (!cell) return true
      let fill = fillConvert(cell.bg)
      let font = fontConvert(cell.ff, cell.fc, cell.bl, cell.it, cell.fs, cell.cl, cell.ul)
      let alignment = alignmentConvert(cell.vt, cell.ht, cell.tb, cell.tr)
      let value
      if (cell.f) {
        value = { formula: cell.f, result: cell.v }
      } else {
        value = cell.v
      }
      let target = worksheet.getCell(rowid + 1, columnid + 1)
      target.fill = fill
      target.font = font
      target.alignment = alignment
      target.value = value
      return true
    })
  })
}

var fillConvert = function (bg) {
  if (!bg) {
    return {}
  }
  let fill = {
    type: 'pattern',
    pattern: 'solid',
    fgColor: {argb: bg.replace('#', '')}
  }
  return fill
}

var fontConvert = function (ff = 0, fc = '#000000', bl = 0, it = 0, fs = 10, cl = 0, ul = 0) { // luckysheet:ff(样式), fc(颜色), bl(粗体), it(斜体), fs(大小), cl(删除线), ul(下划线)
  const luckyToExcel = {
    0: '微软雅黑',
    1: '宋体(Song)',
    2: '黑体(ST Heiti)',
    3: '楷体(ST Kaiti)',
    4: '仿宋(ST FangSong)',
    5: '新宋体(ST Song)',
    6: '华文新魏',
    7: '华文行楷',
    8: '华文隶书',
    9: 'Arial',
    10: 'Times New Roman ',
    11: 'Tahoma ',
    12: 'Verdana',
    num2bl: function (num) {
      return num === 0 ? false : true
    }
  }

  let font = {
    name: luckyToExcel[ff],
    family: 1,
    size: fs,
    color: {argb: fc.replace('#', '')},
    bold: luckyToExcel.num2bl(bl),
    italic: luckyToExcel.num2bl(it),
    underline: luckyToExcel.num2bl(ul),
    strike: luckyToExcel.num2bl(cl)
  }

  return font
}

var alignmentConvert = function (vt = 'default', ht = 'default', tb = 'default', tr = 'default') { // luckysheet:vt(垂直), ht(水平), tb(换行), tr(旋转)
  const luckyToExcel = {
    vertical: {
      0: 'middle',
      1: 'top',
      2: 'bottom',
      default: 'top'
    },
    horizontal: {
      0: 'center',
      1: 'left',
      2: 'right',
      default: 'left'
    },
    wrapText: {
      0: false,
      1: false,
      2: true,
      default: false
    },
    textRotation: {
      0: 0,
      1: 45,
      2: -45,
      3: 'vertical',
      4: 90,
      5: -90,
      default: 0
    }
  }

  let alignment = {
    vertical: luckyToExcel.vertical[vt],
    horizontal: luckyToExcel.horizontal[ht],
    wrapText: luckyToExcel.wrapText[tb],
    textRotation: luckyToExcel.textRotation[tr]
  }
  return alignment

}

var borderConvert = function (borderType, style = 1, color = '#000') { // 对应luckysheet的config中borderinfo的的参数
  if (!borderType) {
    return {}
  }
  const luckyToExcel = {
    type: {
      'border-all': 'all',
      'border-top': 'top',
      'border-right': 'right',
      'border-bottom': 'bottom',
      'border-left': 'left'
    },
    style: {
      0: 'none',
      1: 'thin',
      2: 'hair',
      3: 'dotted',
      4: 'dashDot', // 'Dashed',
      5: 'dashDot',
      6: 'dashDotDot',
      7: 'double',
      8: 'medium',
      9: 'mediumDashed',
      10: 'mediumDashDot',
      11: 'mediumDashDotDot',
      12: 'slantDashDot',
      13: 'thick'
    }
  }
  let template = {style: luckyToExcel.style[style], color: {argb: color.replace('#', '')}}
  let border = {}
  if (luckyToExcel.type[borderType] === 'all') {
    border['top'] = template
    border['right'] = template
    border['bottom'] = template
    border['left'] = template
  } else {
    border[luckyToExcel.type[borderType]] = template
  }
  return border
}

 

标签:function,return,lucksheet,luckyToExcel,excel,导出,elem,cell,border
From: https://www.cnblogs.com/wxxwjef/p/17875912.html

相关文章

  • kubectl获取ConfigMap导出YAML时如何忽略某些字段
    前言:当我们在使用Kubernetes时,常常需要通过kubectl命令行工具来管理资源。有时我们也想将某个资源的配置导出为YAML文件,这样做有助于版本控制和资源的迁移。然而,默认情况下,使用kubectlget命令导出资源配置会包含一些元数据字段:如**annotations****,**creationTimestamp**,**r......
  • openGauss学习笔记-142 openGauss 数据库运维-例行维护-导出并查看wdr诊断报告
    openGauss学习笔记-142openGauss数据库运维-例行维护-导出并查看wdr诊断报告生成快照数据需参数enable_wdr_snapshot=on,访问WDR快照数据需要sysadmin或monadmin权限,因此需要使用root账号或其他拥有权限的账号来生成WDR诊断报告。执行如下命令新建报告文件。touch/home/om/w......
  • 发现一个很好用的excel的php扩展
    废话不多,直接给文档地址:xlswrite导出时不容易超出内存,号称最大使用内存为最后一行数据大小。导出速度也很6.  插入内容:使用 Spreadsheet时,可以切换使用存储方式,默认是内存,如果切换了其他的比如文件,可以减少内存压力。Settings::setCache需要传入实现接口CacheInte......
  • Excel -- 基本操作
    自定义序列导入CSVCtrl+S就不会弹错误了......
  • Java实现Excel导入和导出
    1.功能测试1.1测试准备在做测试前,我们需要將【2.环境准备】中的四个文件拷贝在工程里(如:我这里均放在了com.zyq.util.excel包下)。1.2数据导入1.2.1导入解析为JSON比如,我们有下面一个表格:Controller代码:@PostMapping("/import")publicJSONArrayimportUser(@Requ......
  • Excel实用工具分享
               大家好,相信大家在工作学习中都会用到Excel这个工具,虽然很方便,但是呢,小编想说的是,没有最方便只有最方便,接下来小编就分享一些,平时小编使用过的一些公式,在表格里面就可以直接使用哦! 1    谷歌翻译            =GoogleTranslateBy......
  • easypoi大批量导出excel数据
    easypoi导出excel数据最近,面临了一个新的需求,需要将表中的几百万数据导出到Excel文件中。为了满足这一需求,我决定采用EasyPoi库来实现该功能,并生成压缩包。<dependency><groupId>cn.afterturn</groupId><artifactId>easypoi-spring-boot-starter</artifactId>......
  • python处理Excel文件
    一.读取Excel文件在Python中,你可以使用pandas库来读取Excel文件。首先,确保你已经安装了pandas和openpyxl库。如果没有安装,可以使用以下命令进行安装:pipinstallpandasopenpyxl安装完成后,你可以使用以下代码来读取Excel文件:importpandasaspd#读取Excel文件fil......
  • python实现Excel指定区域截图
    方法一:xlwingsimportos.pathimporttimeimportuuidfromioimportBytesIOfromtypingimportUnionimportxlwingsasxwfromPILimportImageGrabdefexcel_grab(excel_path,sheet_name:Union[str,int]=0,cell_area=None,pic_path=None,visible=False,......
  • 一键导出数据库中表结构定义(数据字典)的工具
    导出数据库中标的定义,即所谓的数据字典一、新建maven工程中加入依赖在maven工程的pom.xml中添加依赖<dependency><groupId>cn.smallbun.screw</groupId><artifactId>screw-core</artifactId><version>1.0.5</version></dependency>......