效果图如下
注意读取选项参数及格式化选项参数
workbook = XLSX.read(result, { type: "array",cellDates:true, cellNF: false, cellText:false});
XLSX.utils.sheet_to_json(workbook.Sheets[sheet],{raw:false, dateNF:"yyyy-mm-DD"})
#文件上传
uploadChange = async info => {
console.log(info);
fileList= info.fileList
file=info.file
this.readExcel(file)
}
#读取ExcelData;
readExcel = file => {
console.log('readExcel')
const fileReader = new FileReader();
fileReader.onload = event => {
try {
const { result } = event.target;
// 以二进制流方式读取得到整份excel表格对象
//const workbook = XLSX.read(result, { type: "binary" });
const workbook = XLSX.read(result, { type: "array",cellDates:true, cellNF: false, cellText:false});
let data = []; // 存储获取到的数据
let sheetHeader = [];
// 遍历每张工作表进行读取(这里默认只读取第一张表)
for (const sheet in workbook.Sheets) {
if (workbook.Sheets.hasOwnProperty(sheet)) {
// 利用 sheet_to_json 方法将 excel 转成 json 数据
data = data.concat(
XLSX.utils.sheet_to_json(workbook.Sheets[sheet],{raw:false, dateNF:"yyyy-mm-DD"})
);
//获取表第一行数据返回数组;
sheetHeader = this.getExcelTitleRow(workbook.Sheets[sheet]);
break; // 如果只取第一张表,就取消注释这行
}
}
this.metaAction.sfs({
"data.excelData": fromJS(data),
"data.sheetHeader": fromJS(sheetHeader)
});
console.log("dd",data, sheetHeader);
} catch (e) {
console.log("Excel解析失败");
return;
}
fileReader.readAsArrayBuffer(file);//兼容ie11
/* if(fileReader.readAsBinaryString){
// 以二进制方式打开文件
fileReader.readAsBinaryString(file);//ie11不支持
}else{
fileReader.readAsArrayBuffer(file);
} */
};
获取excel表头
getExcelTitleRow = sheet => {
if(sheet == null || sheet["!ref"] == null) return [];
let val, hdr = [] ,v=0, vv="",cols=[];
let range=XLSX.utils.decode_range(sheet["!ref"])
let c = range.e.c;
let CC = 0;
let rr = XLSX.utils.encode_row(range.s.r)
for (let i = 0; i <= c; i++) {
cols[i] = XLSX.utils.encode_col(i);
let val =sheet[cols[i] + rr];
vv = v = XLSX.utils.format_cell(val, null);
if(v == null||v =='') continue;
let counter=0
for(CC = 0; CC < hdr.length; ++CC){
if(hdr[CC] == vv) vv = v + "_" + (++counter);
}
hdr.push(vv);
}
return hdr;
};·
判断是否符合基本模板
sheetDataAutoMatch = (baseTemplate, sheetHeader) => {
let isBaseTemplate = true; //是否完全匹配基本模板
let relationShip = []; //模板匹配关系
baseTemplate.forEach(item => {
if (sheetHeader.includes(item.baseTitle)) {
relationShip.push({ ...item, excelTitle: item.baseTitle });
}else if(sheetHeader.includes("*"+item.baseTitle)){
relationShip.push({ ...item, excelTitle: "*"+item.baseTitle });
} else {
isBaseTemplate = false;
let synonym = item.synonym ? [...item.synonym] : [];
let isMatchsynonym = false;
synonym.forEach(synonymItem => {
if (sheetHeader.includes(synonymItem)) {
relationShip.push({
...item,
excelTitle: synonymItem
});
isMatchsynonym = true;
}else if(sheetHeader.includes("*"+synonymItem)){
relationShip.push({
...item,
excelTitle: "*"+synonymItem
});
isMatchsynonym = true;
}
});
isMatchsynonym
? ""
: relationShip.push({
...item,
excelTitle: ""
});
}
});
return { isBaseTemplate, relationShip };
};
自调整匹配头
let baseTemplate = []; //基本模板
let excelData = []; //EXCEL数据
let relationShip = []; //EXCEL匹配关系
let sheetHeader = []; //EXCEL数据中表头提取
let dropDownSheetHeader = []; //可调整EXCEL数据表头
//Excel表头匹配修改
sheetHeaderChange = (e, fieldName) => {
let relationShip = this.metaAction.gf("data.relationShip").toJS();
let sheetHeader = this.metaAction.gf("data.sheetHeader").toJS();
relationShip = relationShip.map(item => {
if (item.fieldName == fieldName) {
item.excelTitle = e.key == "0" ? "" : e.key;
}
return item;
});
let dropDownSheetHeader = this.getDropDownSheetHeader(
relationShip,
sheetHeader
);
this.metaAction.sfs({
"data.relationShip": fromJS(relationShip),
"data.dropDownSheetHeader": fromJS(dropDownSheetHeader)
});
};