页面导入js文件
import htmlToExcel from "../../../../common/js/htmlToExcel";
导出按钮事件
// 下载表格按钮操作
exportExcel() {
htmlToExcel.getExcel("等位基因信息表");
},
js文件代码
import FileSaver from "file-saver";
import XLSX from "xlsx";
export default class fileSave {
/**
* 导出Excel文件
* @param {*} name 文件名
*/
static getExcel(name) {
if (!name || name == '') {
name = '等位基因数据表';
}
/* 从表生成工作簿对象 */
//var wb = XLSX.utils.table_to_book(document.querySelector("#outLTable"));
let tableDom = document.querySelector("#outLTable").cloneNode(true);
let tableHeader = tableDom.querySelector('.el-table__header-wrapper');
let tableBody = tableDom.querySelector('.el-table__body');
tableHeader.childNodes[0].append(tableBody.childNodes[1]);
let headerDom = tableHeader.childNodes[0].querySelectorAll('th');
// 移除左侧checkbox的节点
if (headerDom[0].querySelectorAll('.el-checkbox').length > 0) {
headerDom[0].remove();
}
for (let key in headerDom) {
if (headerDom[key].innerText === '操作') {
headerDom[key].remove();
}
}
// 清理掉checkbox 和操作的button
let tableList = tableHeader.childNodes[0].childNodes[2].querySelectorAll('td');
for (let key = 0; key < tableList.length; key++) {
if (tableList[key].querySelectorAll('.el-checkbox').length > 0 || tableList[key].querySelectorAll('.el-button').length > 0) {
tableList[key].remove();
}
}
// 获取web的节点
let webBook = XLSX.utils.table_to_book(tableHeader);
// 把当前的book节点写入XLSX中
let webOut = XLSX.write(webBook, { bookType: 'xlsx', bookSST: true, type: 'array' });
try {
FileSaver.saveAs(new Blob([webOut], { type: 'application/octet-stream' }), name + '.xlsx');
} catch (e) {
if (typeof console !== 'undefined') console.log(e, webOut)
}
}
}