<template> <div class="app-content" style="height:75vh;overflow: auto;"> <a-spin :spinning="loading" style="width: 100%;height: 100%;"> <div style="width:100%; height: 40px;"> <up-load @beforeUpload="beforeUpload" :format="['xls', 'xlsx']" /> </div> <div style="width:100%;height: calc(100% - 80px);overflow: auto;"> <a-table :dataSource="tableData" :columns="columns" rowKey="index" :pagination="false" :loading="loading"> <template slot="msg" slot-scope="record"> <span v-if="!!record.msg " style="color: red;"> {{ record.msg }} </span> </template> <template slot="stateSwitch" slot-scope="record"> <a-switch checked-children="正常" un-checked-children="注销" :checked="checkedState(record)" @change="switchChange($event, record)" /> </template> <template slot="option" slot-scope="record"> <a-button type="primary" size="small" @click="recordClick(record, 'view')">查看</a-button> <a-button type="primary" size="small" @click="recordClick(record, 'edit')">修改</a-button> <a-button type="primary" size="small" @click="recordClick(record, 'reset')">重置密码</a-button> </template> </a-table> </div> <div style="text-align:center;width:100%; height: 36px;"> <a :href="'/downloadFile/expertTemplate.xlsx'" download="expertTemplate.xlsx" style="margin-right: 30px;"> <a-icon type="download"></a-icon> <span style="color:green;text-decoration:underline;">模板下载</span> </a> <a-button type="primary" @click="dataImport" :disabled="disabled">导入</a-button> </div> </a-spin> </div> </template> <script> import { isEmptyParams, readExcelFile, personGender, personBirthday, checkIdentitytionId, checkEmail, checkPhone } from "@/views/utils/common" import moment from "moment" import { checkCertId } from "@/views/utils/validate" export default { name: "expertImport", data () { return { columns: [ { title: "姓名", dataIndex: "personName", align: 'center' }, { title: "证件号", dataIndex: "certId", align: 'center' }, { title: "手机号", dataIndex: "mobile", align: 'center' }, { title: "邮箱", dataIndex: "email", align: 'center' }, { title: "职称", dataIndex: "titleName", align: 'center' }, { title: "学历", dataIndex: "educationName", align: 'center' }, { title: "专业", dataIndex: "specName", align: 'center' }, { title: '工作单位', dataIndex: 'unitName', align: 'center' }, { title: '是否财务专家', dataIndex: 'isFinance', align: 'center' }, { title: '验证结果', scopedSlots: { customRender: 'msg' }, align: 'center' }, ], tableData: [], disabled: true, errorState: false, loading: false, }; }, created () { }, methods: { beforeUpload (file) { this.errorState = false this.tableData = [] let list = readExcelFile(file, 0) let certList = [] let mobileList = [] let exportList = [] list.then((d) => { //读取文件数据 d.forEach(e => { let msg = '' let certId = e.证件号 let gender = null let birthday = null if (!!!e.姓名) { msg = ';姓名不能为空!' } if (!!!e.证件号) { msg += ';证件号不能为空!' } if (!!!e.手机号) { msg += ';手机号不能为空!' } if (!!!e.邮箱) { msg += ';邮箱不能为空!' } if (!!!e.专业) { msg += ';专业不能为空!' } if (!!!e.学历) { msg += ';学历不能为空!' } if (!!!e.职称) { msg += ';职称不能为空!' } if (!!!e.工作单位) { msg += ';工作单位不能为空!' } if (!!!e.是否财务专家) { msg += ';是否财务专家不能为空!' } if (!!msg) { this.errorState = true } if (checkCertId(certId)) { gender = personGender(certId) birthday = personBirthday(certId) + ' 00:00:00' } let expert = { personName: e.姓名, certId: certId, sex: gender, birthday: birthday, mobile: e.手机号, email: e.邮箱, specName: e.专业, educationName: e.学历, titleName: e.职称, unitName: e.工作单位, isFinance: e.是否财务专家 === '是' ? 1 : 0, msg: msg } exportList.push(expert) certList.push(e.证件号) mobileList.push(e.手机号) }) let uniqueMobileList = [...new Set(mobileList)] if (uniqueMobileList.length != exportList.length) { this.$message.error('手机号出现重复!') return false } let uniqueCertList = [...new Set(certList)] if (uniqueCertList.length != exportList.length) { this.$message.error('证件号出现重复!') return false } if (exportList.length > 0) { this.tableData = exportList this.disabled = this.errorState ? true : false } }) return false }, dataImport () { if (this.tableData.length == 0) { this.$message.error('请选择Excel!') return } let pars = isEmptyParams(this.tableData) let par = { ...pars } this.$api.expert.expertImport(this.tableData).then(({ data = {} }) => { if (data) { this.$message.info(data) this.tableData = [] this.$emit('save', true) } }) } }, }; </script> <style scoped lang="less"> ::v-deep .ant-spin-container { width: 100%; height: 100%; } </style>