Excel导出模块

 一、js-xlsx 介绍：js-xlsx的使用 - 千年轮回 - 博客园js-xlsx 介绍 由SheetJS出品的js-xlsx是一款非常方便的只需要纯JS即可读取和导出excel的工具库，功能强大，支持格式众多，支持xls、xlsx、ods(一种OpenOffice专https://www.cnblogs.com/ajaemp/p/12880847.html二、具体步骤

1、安装依赖

$ npm i xlsx

//注意：导出功能需要额外的依赖安装
//Excel 的导入导出都是依赖于[js-xlsx](https://github.com/SheetJS/js-xlsx)来实现的。
//在 `js-xlsx`的基础上又封装了[Export2Excel.js](https://github.com/PanJiaChen/vue-element-admin/blob/master/src/vendor/Export2Excel.js)来方便导出数据
npm install xlsx file-saver -S
npm install script-loader -S -D

2、引入vue-element-admin封装好的功能导出模块

Export2Excel.js：vue-element-admin/Export2Excel.js at master · PanJiaChen/vue-element-admin · GitHub

（非必要不引入 ）Export2Zip.js：https://github.com/PanJiaChen/vue-element-admin/blob/master/src/vendor/Export2Zip.js

3、使用懒加载方式引入依赖

    import('@/vendor/Export2Excel').then(excel => {
      excel.export_json_to_excel({
        header: tHeader, //表头 必填
        data, //具体数据 必填
        filename: 'excel-list', //非必填
        autoWidth: true, //非必填
        bookType: 'xlsx' //非必填
      })
    })

参数介绍：

4、改变result(导出的数据)为接口类型

formatJson(headers, rows) {
      // 首先遍历数组
      // [{ username: "xxx"},...]  => [["xxx"],...]
      return rows.map(item => {
        return Object.keys(headers).map(key => {
            //-----注意：此判断可省略 依照项目需求判断-----
          if (headers[key] === 'timeOfEntry' || headers[key] === 'correctionTime') {
            return changeDate(item[headers[key]]) // 导出的时间进行转变
          } else if (headers[key] === 'formOfEmployment') {
            var en = EmployeeEnum.hireType.find(obj => obj.id === item[headers[key]])
            return en ? en.value : '未知' //导出的类型进行转变
          }
          return item[headers[key]]
        }) // =>返回出来的数据格式： ["xxx", "xxx"，...]
      })
    }

---

---

整体代码如下：

exportExecl() {
      const header = {
        '姓名': 'username',
        '手机号': 'mobile',
        '工号': 'workNumber',
        '入职日期': 'timeOfEntry',
        '转正日期': 'correctionTime'

      }
      import('@/vendor/Export2Excel').then(async excel => {
        const { rows } = await getEmployeeList({ page: 1, size: this.total })
        const data = this.formatJson(header, rows)
        excel.export_json_to_excel({
          header: Object.keys(header), // 表头 必填
          data, // 具体数据 必填
          filename: 'excel-list', // 非必填
          autoWidth: true, // 非必填
          bookType: 'xlsx' // 非必填
        })
      })
    },
    formatJson(headers, rows) {
      console.log(rows)
      // 首先遍历数组
      // [{ username: '张三'},{},{}]  => [[’张三'],[],[]]
      return rows.map(item => {
        return Object.keys(headers).map(key => {
          if (headers[key] === 'timeOfEntry' || headers[key] === 'correctionTime') {
            return changeDate(item[headers[key]]) 
          } else if (headers[key] === 'formOfEmployment') {
            var en = EmployeeEnum.hireType.find(obj => obj.id === item[headers[key]])
            return en ? en.value : '未知'
          }
          return item[headers[key]]
        }) // => ["张三", "13811"，"2018","1", "2018", "10002"]
      })
    }