html
<el-upload
ref="upload"
:http-request="handleImport"
:show-file-list="false"
accept=".xlsx,.xls"
action="#"
class="upload-demo"
drag
multiple
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div slot="tip" class="el-upload__tip">只能上传xlsx、xls文件,且不超过500kb</div>
</el-upload>
javascript
handleImport(event) {
const file = event.file
if (file) {
this.readExcel(file)
this.dialogImport = false
}
},
readExcel(files) {
const fileReader = new FileReader()
fileReader.onload = (files) => {
try {
const data = files.target.result
const workbook = xlsx.read(data, {
type: 'binary'
})
const wsname = workbook.SheetNames[0] // 取第一张表
const ws = xlsx.utils.sheet_to_json(workbook.Sheets[wsname]) // 生成json表格内容
// console.log(ws, 'ws是表格里的数据,且是json格式')
this.$message.success('导入成功')
for (let i of ws) {
const { 姓名, 手机号, 欠薪金额, 身份证号, 欠薪开始时间, 欠薪结束时间, 开户银行, 银行卡号, 备注 } = i
this.queryParam.list.push({
name: 姓名,
cellPhone: 手机号,
times: [this.fileDate(欠薪开始时间), this.fileDate(欠薪结束时间)],
bankNo: 银行卡号,
idcardNumber: 身份证号,
money: 欠薪金额,
bank: 开户银行,
remark: 备注
})
}
} catch (e) {
console.log(e)
this.$message.warning('请重试')
return false
}
}
fileReader.readAsBinaryString(files)
},
fileDate(date) {
if (date) {
let year, month, day, HH, mm, ss
const time = new Date((date - 1) * 24 * 3600000 + 1 - 8 * 3600000)
time.setFullYear(time.getFullYear() - 70)
let timeDate
year = time.getFullYear() // 年
month = time.getMonth() < 9 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1 // 月
day = time.getDate() <= 9 ? '0' + time.getDate() : time.getDate() // 日
HH = time.getHours() // 时
mm = time.getMinutes() // 分
ss = time.getSeconds() // 秒
return (timeDate = year + '-' + month + '-' + day)
} else return ''
},
:http-request="handleImport" 个人习惯使用这个方法,当然也可以使用别的方法,比如 :on-change="handleImport" 只要是能获取到文件都可以。
fileDate方法是格式化时间的,excel读取的时间格式转成自己想要的格式。我这边格式是YYYY-MM-dd,当然也有其他格式的,自行百度。