eladmin 批量导入实现方法

批量导入就几步就可以实现我们直接开始这是页面显示一个批量导入得按钮

 <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'--><crudOperation :permission="permission" /><el-buttonclass="filter-item"size="mini"type="primary"icon="el-icon-upload"@click="dialogVisible = true">批量导入</el-button><el-dialog title="导入表单" :visible.sync="dialogVisible"><div class="app-container"><div><el-buttonclass="filter-item"size="mini"type="primary"icon="el-icon-download"@click="downloadExceltoLocalFile()">下载模板</el-button></div><upload-excel-component:on-success="handleSuccess":before-upload="beforeUpload"/><el-tablemax-height="300":data="tableData"borderhighlight-current-rowstyle="width: 100%; margin-top: 20px"><el-table-columnv-for="item of tableHeader":key="item":prop="item":label="item"></el-table-column></el-table><el-divider /><el-buttonstyle="float: right"type="primary":loading="loading"@click="submitExcel()">确认并导入</el-button></div></el-dialog>

因为我是用的原有的组件在下面引入

import UploadExcelComponent from '@/components/UploadExcel/index.vue'
import { downloadFile } from '@/utils/index'

还有这个位置不要忘了哦

 data() {return {tableData: [],formdata: [],tableHeader: [],dialogVisible: false,loading: false,files: [],deptUsersAll: [],

这个位置是因为我们批量上传得时候需要与我们系统人员做对比所以下面这个可以看看就行了获取全部得人员

downloadExceltoLocalFile  是模板下载得方法

beforeUpload   是在上传是做一个简单得限制

submitExcel    就是上传来的数据了   因为上传过来的对象属性是汉字，所以要根据汉字去对应转换为数据库字段    具体得上传后   就是你可以再去优化一下

  downloadExceltoLocalFile() {crudCustomer.downloadExcel().then((res) => {downloadFile(res, '模板', 'xlsx')}).catch((err) => {this.$message.error = err.message})},// 导入功能beforeUpload(file) {this.files = fileconsole.log(this.files)const extension = file.name.substring(file.name.lastIndexOf('.') + 1)const isLt5M = file.size / 1024 / 1024 < 50if (extension !== 'xlsx' && extension !== 'xls') {this.$message({message: '只能上传Excel（即后缀是.xlsx或者.xls)的文件.',type: 'warning'})return false}if (isLt5M) {return true}this.$message({message: '请不要上传大于50MB的文件.',type: 'warning'})return false},handleSuccess({ header, results }) {this.tableData = resultsthis.tableHeader = header},submitExcel() {// 组装数据this.loading = trueconst nape = []// 遍历文件将对象得属性转换为数据库对应字段for (let i = 0; i < this.tableData.length; i++) {const res = JSON.parse(JSON.stringify(this.tableData[i]).replace(/客户姓名/g, 'username').replace(/意向等级/g, 'intentionLevel').replace(/客户状态/g, 'customerState').replace(/手机号/g, 'mobile').replace(/微信/g, 'emailAddress').replace(/QQ/g, 'qq').replace(/微信/g, 'wexin').replace(/感兴趣的项目/g, 'interestItem').replace(/客户等级/g, 'customerLevel').replace(/单位/g, 'companyName').replace(/科室/g, 'officeName').replace(/联系地址/g, 'contactAddress').replace(/职位/g, 'job').replace(/课题经费/g, 'projectFunds').replace(/业务人员/g, 'creatorId').replace(/跟进人/g, 'followerId').replace(/客户来源/g, 'customerSource').replace(/备注/g, 'remark'))nape.push(res)}// this.deptUsersAll 为公司全部用户，表中存放得是id    表格中上传得是名字  所以根据表格名字  查询用户，将名字转换为   idfor (let i = 0; i < nape.length; i++) {for (let j = 0; j < this.deptUsersAll.length; j++) {if (nape[i].creatorId === this.deptUsersAll[j].nickName) {nape[i].creatorId = this.deptUsersAll[j].id}if (nape[i].followerId === this.deptUsersAll[j].nickName) {nape[i].followerId = this.deptUsersAll[j].id}}}// 表格  意向等级  字典项for (let i = 0; i < nape.length; i++) {for (let j = 2; j < Object.keys(this.dict.label.intention_level).length; j++) {if (nape[i].intentionLevel === this.dict.label.intention_level[j]) {nape[i].intentionLevel = j}}}// 表格  客户状态  字典项for (let i = 0; i < nape.length; i++) {for (let j = 2; j < Object.keys(this.dict.label.customer_state).length; j++) {if (nape[i].customerState === this.dict.label.customer_state[j]) {nape[i].customerState = j}}}// 表格  感兴趣的项目  字典项for (let i = 0; i < nape.length; i++) {for (let j = 2; j < Object.keys(this.dict.label.interest_item).length; j++) {if (nape[i].interestItem === this.dict.label.interest_item[j]) {nape[i].interestItem = j}}}// 表格  客户等级  字典项for (let i = 0; i < nape.length; i++) {for (let j = 2; j < Object.keys(this.dict.label.customer_level).length; j++) {if (nape[i].customerLevel === this.dict.label.customer_level[j]) {nape[i].customerLevel = j}}}// 表格  职位  字典项for (let i = 0; i < nape.length; i++) {for (let j = 2; j < Object.keys(this.dict.label.job).length; j++) {if (nape[i].job === this.dict.label.job[j]) {nape[i].job = j}}}// 表格  课题经费  字典项for (let i = 0; i < nape.length; i++) {for (let j = 2; j < Object.keys(this.dict.label.project_funds).length; j++) {if (nape[i].projectFunds === this.dict.label.project_funds[j]) {nape[i].projectFunds = j}}}crudCustomer.importMaterial(nape).then(res => {if (res === 1) {this.$notify({title: '成功',message: '导入成功',type: 'success'})this.loading = falsethis.dialogVisible = false} else {this.$notify.error({title: '提示',message: '导入失败'})}})

crudCustomer.importMaterial（）这个就是你的api去请求你的后台将参数带过去

api

export function downloadExcel() {return request({url: 'customer/userAll',method: 'get'})
}export function importMaterial(data) {return request({url: 'customer/importExcel',method: 'post',data})
}export default { add, edit, del, get, getCustomers, downloadExcel, importMaterial }

后端接参因为是我传得是list 所以用postMaping最好后面得@RequestBody list<CustomerDTO> dto 这就是正常接参得方式也不用说啥下面我没有用单独得导入权限就是用了新增得权限 add么

  //客户信息导入@PostMapping("importExcel")@PreAuthorize("@el.check('customer:add')")public ResultWrapper<Long> importExcel( @RequestBody List<CustomerDTO> dto) {return ResultWrapper.ok(customerService.importExcel(dto));}

差不多就是这些了有什么其他问题也可以留言我们一起讨论一下

eladmin 批量导入实现方法相关推荐

php实现批量导入商品,destoon批量导入产品方法
在destoon b2b网站系统当中增加批量导入商品功能,将当当方便系统数据填充,新网站当中尤为必要 1.添加菜单\admin\data.inc.php和C:\wamp\www\dev_lebaixi ...
EndNote 毕业论文开题报告批量导入参考文献
目录序(可跳过) 参考链接一.下载与安装二.注意事项(很重要) 1.参考文献的国标格式 a.Chinese Std GBT7714 (numeric).ens b.geebinfmodified ...
CAD软件中怎么批量导入导出坐标数据？
在CAD软件中,每一个点,都有独一无二的坐标值.而成千上万的点,组成了更为具象化的CAD图形.尽管大部分的设计师了解如何使用CAD软件来绘制图形并保存为图纸,但对于如何将众多的个性化.精确化的CAD坐 ...
BS-Excel模板批量导入
批量导入应该是每款MIS系统必备的功能,这样可以减少很多重复性的工作,今天分享一下如何用数据库自带的BulkInsert进行批量导入(方法有很多,这算比较简便的一种),下面便从前台到后台走一遍: 第一 ...
SQL批量导入数据SqlBulkCopy的用法(适用于过万笔记录一次性插入数据库)
由于要插入数据库的数据量过大,所以用到批量导入的方法,这个和以前分享的批量插入在本质上是不同,我主要研究的是数据集即DataTable或DataSet等,如何批量插入数据库的,下面的方法可以维护数据源 ...
怎么接收layui上传的文件_layui 上传文件_批量导入数据UI的方法
使用layui的文件上传组件,可以方便的弹出文件上传界面. 效果如下: 点击[批量导入]按钮调用js脚本importData(config)就可以实现数据上传到服务器. 脚本: /*** * 批量导入 ...
手持gps坐标转换参数求解方法及在excel中的实现_怎么在GIS office 软件中批量导入坐标点位...
GIS office 软件可以批量导入的坐标点文件,并且可以导出为Kml文件,在google earth谷歌地球软件上显示,从而也解决了怎么在google earth谷歌地球软件中批量导入坐标数据的问 ...
win2008r2 AD用户账户的批量导入方法
win2008r2 AD用户账户的批量导入方法 http://www.jb51.net/article/38423.htm 转载于:https://www.cnblogs.com/cl1024cl/p ...
文本导入ORACLE快速,Oracle批量导入文本文件快速的方法(sqlldr实现)
前言最近做项目的时候需要导入一批3000多万条的POI数据到Oracle数据库,简单的插入导入速度太慢,使用sqlldr 批量导入3000多万条数据花了20分钟左右,速度还可以,现在分享给大家,具体 ...

eladmin 批量导入实现方法

eladmin 批量导入实现方法相关推荐

最新文章

热门文章