- 安装xlsx插件
// 安装插件
npm install xlsx –save
// 在vue中导入XLSX
import XLSX from ‘xlsx’
–
这里使用 element-ui 的上传组件
关闭默认上传的操作,在on-change事件上绑定importExcel上传函数
如果用传统的input上传组件也可以<input type=”file” @change=”importExcel($event.target)” />
<el-upload
ref="upload"
action="/"
:show-file-list="false"
:on-change="importExcel"
:auto-upload="false">
<el-button
slot="trigger"
icon="el-icon-upload"
size="small"
type="primary">
上传文件
</el-button>
</el-upload>
上传文件的方法importExcel
importExcel(file) {
// let file = file.files[0] // 使用传统的input方法需要加上这一步
let self = this;
const types = file.name.split(".")[1];
const fileType = ["xlsx", "xlc", "xlm", "xls", "xlt", "xlw", "csv"].some(
item => item === types
);
if (!fileType) {
alert("格式错误!请重新选择");
return;
}
this.file2Xce(file).then(tab => {
if (tab && tab.length > 0) {
this.tab = tab;
if (this.tab.length != 0) {
this.xlscList = [];
this.tab[0].sheet.forEach(item => {
if (item.indexOf("C") != -1) {
let inputInfo = item.split("'");
if (inputInfo.length == 2) {
self.xlscList.push(inputInfo[1]);
}
}
});
}
if (this.xlscList.length != 0) {
this.setInputToForm();
}
// this.xlscListthis.tab[0].sheet.filter(item=>{if(item.findIndex('C')!=-1){
// return item
// }})
// this.xlscList = tabArray.filter(item => item.includes('C'))
}
});
},
setInputToForm(){
if (this.xlscList.length > 13) {
this.form.safetyPointCheckDTO.sensitiveInfoCollection = this.xlscList[1],
this.form.safetyPointCheckDTO.dataTransSecurity = this.xlscList[2],
this.form.safetyPointCheckDTO.dataLocalStorageSecurity = this.xlscList[1],
this.form.safetyPointCheckDTO.sensitiveInfoUse = this.xlscList[1],
this.form.safetyPointCheckDTO.permissionList = this.xlscList[1],
this.form.safetyPointCheckDTO.dynamicLoadFunction = this.xlscList[1],
this.form.safetyPointCheckDTO.updateFunction = this.xlscList[1],
this.form.safetyPointCheckDTO.classLoaderInjectFunction = this.xlscList[1],
this.form.safetyPointCheckDTO.logSecurity = this.xlscList[1],
this.form.safetyPointCheckDTO.componentSecurity = this.xlscList[1],
this.form.safetyPointCheckDTO.encryDecryAlgorithm = this.xlscList[1],
this.form.safetyPointCheckDTO.databaseSecurity = this.xlscList[1],
this.form.safetyPointCheckDTO.staticCodeCheck = this.xlscList[1]
}else{
this.$message({
message: '上传格式不對',
type: 'warning'
})
}
},
file2Xce(file) {
return new Promise(function(resolve, reject) {
const reader = new FileReader();
reader.onload = function(e) {
const data = e.target.result;
this.wb = XLSX.read(data, {
type: "binary"
});
const result = [];
this.wb.SheetNames.forEach(sheetName => {
result.push({
sheetName: sheetName,
sheet: XLSX.utils.sheet_to_formulae(this.wb.Sheets[sheetName])
});
});
resolve(result);
};
reader.readAsBinaryString(file.raw);
// reader.readAsBinaryString(file) // 传统input方法
});
},