<template> <!-- 公共导入组件 --> <upload-excel :on-success="success" /> </template> <script> import { importEmployee } from '@/api/employees' export default { data() { return { type: this.$route.query.type } }, methods: { // 声明一个函数 async success({ header, results }) { if (this.type === 'user') { // 中文转化为英文 const userRelations = { '入职日期': 'timeOfEntry', '手机号': 'mobile', '姓名': 'username', '转正日期': 'correctionTime', '工号': 'workNumber' } console.log(header, results) const arr = [] // 遍历所有的数组 results.forEach(item => { // 需要将每一个条数据里面的中文都换成英文 const userInfo = {} Object.keys(item).forEach(key => { // key是当前的中文名 找到对应的英文名 // `new Date()` 可以有参数,字符串日期转换成时间格式,如果没有参数获取的是当前的时间对象 if (userRelations[key] === 'timeOfEntry' || userRelations[key] === 'correctionTime') { userInfo[userRelations[key]] = new Date(this.formatDate(item[key], '/')) // 只有这样, 才能入库 } else { userInfo[userRelations[key]] = item[key] } }) // 最终userInfo变成了全是英文 arr.push(userInfo) }) console.log(arr) await importEmployee(arr) this.$message.success('导入成功') } this.$router.back() // 回到上一页 }, // 处理Excel时间 formatDate(numb, format) { const time = new Date((numb - 1) * 24 * 3600000 + 1) time.setYear(time.getFullYear() - 70) const year = time.getFullYear() + '' const month = time.getMonth() + 1 + '' const date = time.getDate() - 1 + '' if (format && format.length === 1) { return year + format + month + format + date } return year + (month < 10 ? '0' + month : month) + (date < 10 ? '0' + date : date) } } } </script> <style> </style>
时间: 2024-02-14 21:22:09 浏览: 53
vue-cli3.0+element-ui上传组件el-upload的使用
5星 · 资源好评率100%
这是一个使用了element-ui的upload组件,导入了一个名为upload-excel的自定义组件,该组件在上传成功后会调用success方法,将上传的数据进行处理后再调用importEmployee方法进行导入操作。在处理数据的过程中,使用了一个函数formatDate来处理Excel中的时间数据,并且将中文字段名转换为对应的英文字段名,最终将处理后的数据存储在一个数组中,传递给importEmployee方法进行导入操作。
阅读全文