;(function (factory) {
if (typeof define === 'function' && define.amd) {
define(['jquery'], factory);
} else {
factory(jQuery);
}
}(function ($) {
'use strict';
// Default options
var pluginName = "excelPreview",
defaults = {
height: 500
};
// Constructor, initialise everything you need here
var Plugin = function (element, options) {
this.element = element;
this.settings = $.extend({}, defaults, options);
this._defaults = defaults;
this._name = pluginName;
defaults = this.settings;
this.init();
};
// Plugin methods and shared properties
Plugin.prototype = {
// Reset constructor - http://goo.gl/EcWdiy
constructor: Plugin,
init: function () {
var e = this;
$(e.element).prev('input[type=file]').fileinput({
language: 'zh',
showUpload: false,
dropZoneEnabled: false,
hideThumbnailContent: true,
showPreview: false,
allowedFileExtensions: ['xlsx'],
elErrorContainer: '#kartik-file-errors',
// showRemove: false
}).on('change', function (file) {
e.excelPreview(file);
})
},
excelPreview: function (file) {
var e = this;
loadFile(file, e.element);
$(e.element).prev('input[type=file]').fileinput('refresh');
return true;
}
}
function loadFile(event, ele) {
let file = event.target.files;
if(file.length == 0)return;
var fileReader = new FileReader();
fileReader.onload = (ev) => {
try {
var data = ev.target.result,
workbook = XLSX.read(data, {
type: 'binary',
cellStyles: true
}), // 以二进制流方式读取得到整份excel表格对象
persons = []; // 存储获取到的数据
} catch (e) {
console.log('文件类型不正确');
return;
}
//所有表名
var sheetNames = workbook.SheetNames; // 返回 ['sheet1', 'sheet2']
initTabs(ele, sheetNames, workbook);
// //根据表名获取对应某张表
// var worksheet = workbook.Sheets[sheetNames[0]];
}
fileReader.readAsBinaryString(file[0]);
}
function initTabs(ele, sheetNames, workbook) {
$(ele).empty().append(`
`);
sheetNames.forEach(sheet => {
let tabNav = $(ele).find(".nav-tabs");
let nav = $(`${sheet}`);
nav.find('a').on('click', (e) => {
tabChange($(e.target), workbook, tabNav);
});
tabNav.append(nav);
tabChange(tabNav.find(' li:first > a'), workbook, tabNav);
tabNav.find("li:first").addClass('active');
})
}
function getTableData(sheet) {
const headers = []
const range = XLSX.utils.decode_range(sheet['!ref'])
let C
const R = range.s.r /* start in the first row */
for (C = range.s.c; C <= range.e.c; ++C) { /* walk every column in the range */
var cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })] /* find the cell in the first row */
headers.push({
field: 'column_' + C,
title: 'column_' + C
})
}
let datas = [];
for(let rowIndex = range.s.r; rowIndex <= range.e.r; ++rowIndex) {
let data = {};
for (let colIndex = range.s.c; colIndex <= range.e.c; ++colIndex) { /* walk every column in the range */
var cell = sheet[XLSX.utils.encode_cell({ c: colIndex, r: rowIndex })]; /* find the cell in the first row */
data['column_' + colIndex] = XLSX.utils.format_cell(cell);
}
datas.push(data);
}
return {
columns: headers,
data: datas
}
}
function mergeCell(merge, $table) {
let rowspan = Math.abs(merge.e.r - merge.s.r + 1);
let colspan = Math.abs(merge.e.c - merge.s.c + 1);
$table.bootstrapTable('mergeCells', {
index: merge.s.r,
field: 'column_' + merge.s.c,
rowspan: rowspan,
colspan: colspan
});
}
function mergeCells(worksheet, $table) {
var merges = worksheet['!merges'];
if (!merges) { return; }
merges.forEach((merge, index) => {
mergeCell(merge, $table);
})
}
/**
* key = AA2, start: A1, end = AA8, return {r: 1, c: 26}
* @param {*} key
* @param {*} start
* @param {*} end
*/
function getRowColIndex(key, start) {
start = CUSTOM_UTIL.splitRC(start);
key = CUSTOM_UTIL.splitRC(key);
let col = key.c - start.c ;
let row = CUSTOM_UTIL.computeR(key.r, start.r);
return {
r: col,
c: row
}
}
function setCellStyle(rowColIndex, style, $table) {
var cellDom = $table.find("tbody").find('tr:eq(' + rowColIndex.r + ')').find('td:eq(' + rowColIndex.c + ')');
if(style.font) {
cellDom.css('fontWeight', style.font.bold ? 'bold' : 'normal');
if(style.font.color) {
style.font.color.rgb = style.font.color.rgb == 'FFFFFF' ? 'FF000000' : style.font.color.rgb;
cellDom.css('color', CUSTOM_UTIL.rgbaToRgb(style.font.color.rgb));
}
}
if (style.fill && style.fill.fgColor) {
cellDom.css('backgroundColor', CUSTOM_UTIL.rgbaToRgb(style.fill.fgColor));
}
if (style.alignment && style.alignment.horizontal) {
let alignMap = {'bottom': 'left', 'center': 'center', 'top': 'right'};
cellDom.css('textAlign', alignMap[style.alignment.horizontal]);
}
}
function setStyles(worksheet, $table) {
var range = worksheet['!ref'].split(":");
var start = range[0], end = range[1];
for(let key in worksheet) {
if(key >= start && key <= end) {
var rowColIndex = getRowColIndex(key, start, end);
var style = worksheet[key].s;
if(!style) {return;}
setCellStyle(rowColIndex, style, $table);
}
}
}
function loadTabContent(sheetName, workbook, $table) {
var worksheet = workbook.Sheets[sheetName];
var tableConf = {
height: defaults.height,
showHeader: false
};
var tableData = getTableData(worksheet);
$.extend(tableConf, tableData)
$table.bootstrapTable(tableConf);
setStyles(worksheet, $table);
mergeCells(worksheet, $table);
}
function tabChange(target, workbook, tabNav) {
let sheetName = target.html();
tabNav.find("li").removeClass('active');
target.parent('li').addClass('active');
let $table = $(``);
tabNav.next('div.tab-content').find('.tab-pane').empty().append($table);
loadTabContent(sheetName, workbook, $table.find('table'));
}
// Create the jQuery plugin
$.fn[ pluginName ] = function (options) {
// Do a deep copy of the options - http://goo.gl/gOSSrg
options = $.extend(true, {}, defaults, options);
return this.each(function () {
var $this = $(this);
// Create a new instance for each element in the matched jQuery set
// Also save the instance so it can be accessed later to use methods/properties etc
// e.g.
// var instance = $('.element').data('plugin');
// instance.someMethod();
if ( !$.data( $this, "plugin_" + pluginName ) ) {
$.data( $this, "plugin_" + pluginName, new Plugin( this, options ) );
}
});
};
// Expose defaults and Constructor (allowing overriding of prototype methods for example)
$.fn[ pluginName ].defaults = defaults;
$.fn[ pluginName ].Plugin = Plugin;
}));