ExtJs6.0匯出gridPanel資料到本地excel中
阿新 • • 發佈：2019-01-02
//本人根據實際情況改寫的，引用的時候還請注意
/**
*
* function grid2Excel(grid,filename)
* @param grid Extjs grid panel
* @param filename Excel 檔名稱
*
* **/
(function(){
function export_excel_ie(tableStr, fileName) {//整個表格拷貝到EXCEL中
tableToExcel(tableStr, fileName);
}
function Cleanup() {
window.clearInterval(idTmr);
CollectGarbage();
}
var Base64 = (function() {
// private property
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
// private method for UTF-8 encoding
function utf8Encode(string) {
string = string.replace(/\r\n/g,"\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
}
// public method for encoding
return {
//encode : (typeof btoa == 'function') ? function(input) { return btoa(input); } : function (input) {
encode : function (input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;
input = utf8Encode(input);
while (i < input.length) {
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
output = output +
keyStr.charAt(enc1) + keyStr.charAt(enc2) +
keyStr.charAt(enc3) + keyStr.charAt(enc4);
}
return output;
}
};
})();
var format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) };
var tableToExcel = function(table, fileName) {
var uri = 'data:application/vnd.ms-excel;base64,'
,fileName = fileName || 'excelexport'
, template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><meta name="renderer" content="webkit"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>';
var ctx = {worksheet:'Worksheet', table: table};
var a = document.createElement('a');
document.body.appendChild(a);
var filedate = new Date().format("yyyy-MM-dd--HH-mm");
a.hreflang = 'zh';
a.charset = 'utf8';
a.type="application/vnd.ms-excel";
a.href = uri + Base64.encode(format(template,ctx));
a.target = '_blank';
a.download = fileName+filedate+ '.xls';
a.tableBorder = 1;
a.click();
};
window.grid2Excel = function(grid, fileName) {
var columns = grid.initialConfig.columns|| [],
store = grid.getStore(),
headLevel1 = [],dataIndex =[], headLevel = 1,tableStr = '<table border="1" bordercolor="#000"><thead>{thead}</thead><tbody>{tbody}</tbody></table>';
var blankColumn = 0;
var blankColumn3 = 0;
var ifWithCheckOrNumFirst;
var indexen = 0;
columns.forEach(function(column) {
if(column.dataIndex) {
column.colspan = 1;
//有橫向合併單元格的話，這個縱向合併就會變多。是2層表頭的話，這個rowspan就是2.其實不管他有沒有橫向合併這個數取過來就對
if (headLevel == 3) {
column.rowspan = headLevel;
} else if (headLevel == 2) {
column.rowspan = headLevel;
} else {
column.rowspan = 1;
}
headLevel1.push(column);
dataIndex.push(column);
}else{
//不是橫向合併的單元格，還有可能是第一列是checkbox或者是序號所以需要判斷一下，如果是checkbox或者序號，則不push到數組裡
if (ifWithCheckOrNumFirst) {
} else {
var items = column.columns ||[];
headLevel1.push(column);
}
}
});
var tbl_filed = [];
var headLevel1Str = '<tr>';
headLevel1.forEach(function(head) {
if (head.dataIndex != 'operate') {
tbl_filed.push(head.header);
}
});
for(var p=1 ; p<tbl_filed.length;p++){
headLevel1Str += '<th>'+tbl_filed[p]+'</th>';
}
headLevel1Str += '</tr>';
var theadStr = headLevel1Str,
tbodyStr = '',defRenderer = function(value) {
return value;
};
store.each(function(r) {
tbodyStr += '<tr>';
dataIndex.forEach(function(c) {
if (c.dataIndex != 'operate') {
var renderere = c.renderer || defRenderer;
var str_Value = r.get(c.dataIndex);
tbodyStr += '<td>'+str_Value+ "" +'</td>' ;
}
});
tbodyStr +='</tr>'
});
tableStr = format(tableStr,{
thead:theadStr,
tbody:tbodyStr
});
export_excel_ie(tableStr,fileName);
}
})()
/**
*
* function grid2Excel(grid,filename)
* @param grid Extjs grid panel
* @param filename Excel 檔名稱
*
* **/
(function(){
function export_excel_ie(tableStr, fileName) {//整個表格拷貝到EXCEL中
tableToExcel(tableStr, fileName);
}
function Cleanup() {
window.clearInterval(idTmr);
CollectGarbage();
}
var Base64 = (function() {
// private property
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
// private method for UTF-8 encoding
function utf8Encode(string) {
string = string.replace(/\r\n/g,"\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
}
// public method for encoding
return {
//encode : (typeof btoa == 'function') ? function(input) { return btoa(input); } : function (input) {
encode : function (input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;
input = utf8Encode(input);
while (i < input.length) {
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
output = output +
keyStr.charAt(enc1) + keyStr.charAt(enc2) +
keyStr.charAt(enc3) + keyStr.charAt(enc4);
}
return output;
}
};
})();
var format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) };
var tableToExcel = function(table, fileName) {
var uri = 'data:application/vnd.ms-excel;base64,'
,fileName = fileName || 'excelexport'
, template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><meta name="renderer" content="webkit"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>';
var ctx = {worksheet:'Worksheet', table: table};
var a = document.createElement('a');
document.body.appendChild(a);
var filedate = new Date().format("yyyy-MM-dd--HH-mm");
a.hreflang = 'zh';
a.charset = 'utf8';
a.type="application/vnd.ms-excel";
a.href = uri + Base64.encode(format(template,ctx));
a.target = '_blank';
a.download = fileName+filedate+ '.xls';
a.tableBorder = 1;
a.click();
};
window.grid2Excel = function(grid, fileName) {
var columns = grid.initialConfig.columns|| [],
store = grid.getStore(),
headLevel1 = [],dataIndex =[], headLevel = 1,tableStr = '<table border="1" bordercolor="#000"><thead>{thead}</thead><tbody>{tbody}</tbody></table>';
var blankColumn = 0;
var blankColumn3 = 0;
var ifWithCheckOrNumFirst;
var indexen = 0;
columns.forEach(function(column) {
if(column.dataIndex) {
column.colspan = 1;
//有橫向合併單元格的話，這個縱向合併就會變多。是2層表頭的話，這個rowspan就是2.其實不管他有沒有橫向合併這個數取過來就對
if (headLevel == 3) {
column.rowspan = headLevel;
} else if (headLevel == 2) {
column.rowspan = headLevel;
} else {
column.rowspan = 1;
}
headLevel1.push(column);
dataIndex.push(column);
}else{
//不是橫向合併的單元格，還有可能是第一列是checkbox或者是序號所以需要判斷一下，如果是checkbox或者序號，則不push到數組裡
if (ifWithCheckOrNumFirst) {
} else {
var items = column.columns ||[];
headLevel1.push(column);
}
}
});
var tbl_filed = [];
var headLevel1Str = '<tr>';
headLevel1.forEach(function(head) {
if (head.dataIndex != 'operate') {
tbl_filed.push(head.header);
}
});
for(var p=1 ; p<tbl_filed.length;p++){
headLevel1Str += '<th>'+tbl_filed[p]+'</th>';
}
headLevel1Str += '</tr>';
var theadStr = headLevel1Str,
tbodyStr = '',defRenderer = function(value) {
return value;
};
store.each(function(r) {
tbodyStr += '<tr>';
dataIndex.forEach(function(c) {
if (c.dataIndex != 'operate') {
var renderere = c.renderer || defRenderer;
var str_Value = r.get(c.dataIndex);
tbodyStr += '<td>'+str_Value+ "" +'</td>' ;
}
});
tbodyStr +='</tr>'
});
tableStr = format(tableStr,{
thead:theadStr,
tbody:tbodyStr
});
export_excel_ie(tableStr,fileName);
}
})()