exportExcel($refs.tabs.$el, '導出名稱', 2)
import XLSX from 'xlsx'
import XLSXStyle from 'xlsx-style';
import { saveAs } from 'file-saver';
// 無樣式
// export function exportExcel(name, el){//導出excel
// el.querySelector('th').style='text-align:center; background:#0e396b;color:#07c0eb;'
// el.querySelector('th').setAttribute('align', 'center');
// let wb = XLSX.utils.table_to_book(el);//document.querySelector('table')
// // 表Sheet1
// wb.Sheets.Sheet1["!cols"] = [];
// // 動態添加前24列 寬爲140px
// for (let a = 0; a < 24; a++) {
// wb.Sheets.Sheet1["!cols"].push({
// wpx: 140,
// })
// }
// let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' });
// try {
// saveAs(new Blob([wbout], { type: 'application/octet-stream' }), name+'.xlsx')
// } catch (e) {
// if (typeof console !== 'undefined')
// console.log(e, wbout)
// }
// return wbout
// }
/**
*
* @param el // 當前table
* @param fileName 導出的文件名
* @param titleNum 標題行數(是否合併行)
* @param sheetName // 工作簿;
*/
export function exportExcel(el, name, titleNum){//導出excel
exportTable(el, name, titleNum)
function exportTable(el, fileName, titleNum=1, sheetName='Sheet1'){
let wb = XLSX.utils.table_to_book(el, { sheet: sheetName, raw: true });
let range = XLSX.utils.decode_range(wb.Sheets[sheetName]['!ref']);
//單元格邊框樣式
let borderStyle = {
top: {
style: "thin",
color: { rgb: "0e3b6e" }
},
bottom: {
style: "thin",
color: { rgb: "0e3b6e" }
},
left: {
style: "thin",
color: { rgb: "0e3b6e" }
},
right: {
style: "thin",
color: { rgb: "000000" }
}
};
let cWidth = [];
for (let C = range.s.c; C < range.e.c; ++C) { //SHEET列
let len = 100; //默認列寬
let len_max = 400; //最大列寬
for (let R = range.s.r; R <= range.e.r; ++R) { //SHEET行
let cell = { c: C, r: R }; //二維 列行確定一個單元格
let cell_ref = XLSX.utils.encode_cell(cell); //單元格 A1、A2
if(wb.Sheets[sheetName][cell_ref]){
// if (R == 0){
if (R < titleNum){
wb.Sheets[sheetName][cell_ref].s = { //設置(標題)單元格的樣式 style
font:{
sz:12,
color:{rgb:'0e3b6e'},
bold:false
},
alignment:{
horizontal:'center',
vertical:'center',
},
fill:{
fgColor:{rgb:'66b1ff'},
},
border: borderStyle,//用上面定義好的邊框樣式
};
}else { // 內容
wb.Sheets[sheetName][cell_ref].s = {
font:{
sz:12,
color:{rgb:'0e3b6e'},
bold:false
},
alignment:{
horizontal:'left',
vertical:'center',
},
border: borderStyle,//用上面定義好的邊框樣式
};
}
if(C==0 && R >= titleNum){ // 第一列
wb.Sheets[sheetName][cell_ref].s = {
font:{
sz:12,
color:{rgb:'dc362e'},
bold:true
},
alignment:{
horizontal:'left',
vertical:'center',
},
}
}
//動態自適應:計算列寬
let va = JSON.parse(JSON.stringify(wb.Sheets[sheetName][cell_ref].v));
var card1 = JSON.parse(JSON.stringify(va)).match(/[\u4e00-\u9fa5]/g); //匹配中文
var card11 = "";
if (card1){
card11 = card1.join("")
}
var card2 = JSON.parse(JSON.stringify(va)).replace(/([^\u0000-\u00FF])/g,""); //剔除中文
let st = 0;
if (card11){
// st += card11.length * 16 //中文字節碼長度
st += card11.length * 20 //中文字節碼長度
}
if (card2){
// st += card2.length * 8 //非中文字節碼長度
st += card2.length * 10 //非中文字節碼長度
}
if (st > len){
len = st;
}
}
}
if (len > len_max){//最大寬度
len = len_max;
}
cWidth.push({'wpx':len}); //列寬
}
wb.Sheets[sheetName]['!cols'] = cWidth;
var wopts = { bookType: 'xlsx', bookSST: false, type: 'binary' };
var wbout = XLSXStyle.write(wb, wopts); //一定要用XLSXStyle不要用XLSX,XLSX是沒有格式的!
saveAs(new Blob([s2ab(wbout)], { type: "" }), fileName + '.xlsx');
}
function s2ab(s) {
var buf = new ArrayBuffer(s.length);
var view = new Uint8Array(buf);
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
}