From 5b6c4c659710814ea5f59dcab8ac64ddd8acfe6f Mon Sep 17 00:00:00 2001 From: zhouwx <1175765986@qq.com> Date: 星期四, 03 七月 2025 14:08:44 +0800 Subject: [PATCH] 模板导入 --- src/views/build/conpanyFunctionConsult/industryTemplate/index.vue | 158 ++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 144 insertions(+), 14 deletions(-) diff --git a/src/views/build/conpanyFunctionConsult/industryTemplate/index.vue b/src/views/build/conpanyFunctionConsult/industryTemplate/index.vue index 632ba9c..f53ebab 100644 --- a/src/views/build/conpanyFunctionConsult/industryTemplate/index.vue +++ b/src/views/build/conpanyFunctionConsult/industryTemplate/index.vue @@ -30,22 +30,29 @@ </el-option> </el-select> </el-form-item> + <el-form-item label="分类:" > + <el-input v-model.trim="data.queryParams.type" placeholder="请输入"></el-input> + </el-form-item> <el-form-item > - <el-button v-if="isAdmin" type="primary" @click="getList">查询</el-button> - <el-button v-if="isAdmin" type="primary" plain @click="reset">重置</el-button> + <el-button type="primary" @click="getList">查询</el-button> + <el-button type="primary" plain @click="reset">重置</el-button> + <el-button type="primary" @click="exportData">导入</el-button> </el-form-item> </el-form> </div> <!-- 表格数据 --> <el-table v-loading="loading" :data="dataList" :border="true"> <el-table-column label="序号" type="index" align="center" width="80"/> - <el-table-column label="模板名称" prop="templateName" align="center"/> + <el-table-column label="章节" prop="chapter" align="center"/> + <el-table-column label="文件记录" prop="templateName" align="center"/> <el-table-column label="行业" prop="industryName" align="center" /> - <el-table-column label="模板文件" prop="fileName" align="center"> + <el-table-column label="模板" prop="fileName" align="center"> <template #default="scope"> <el-link style="" type="primary" @click="downloadFile(scope.row)">{{scope.row.fileName}}</el-link> </template> </el-table-column> + + <el-table-column label="分类" prop="type" align="center" /> <el-table-column label="操作" align="center" class-name="small-padding fixed-width" > <template #default="scope"> <el-button link type="primary" @click="openDialog('edit',scope.row)">编辑</el-button> @@ -63,6 +70,39 @@ /> <edit-dialog ref="dialogRef" @getList=getList></edit-dialog> + <el-dialog + v-model="data.exportDialog" + title="导入模板" + width="550px" + :before-close="handleCloseExport" + :close-on-press-escape="false" + :close-on-click-modal="false" + > + <el-form :model="state.form" size="default" ref="superRef" :rules="state.formRules" label-width="110px" > + <el-form-item label="表格模板:" > + <el-button @click="downloadFileTable" size="default" :icon="Download" type="primary" plain>下载模板</el-button> + </el-form-item> + <el-form-item label="导入文件"> + <el-upload + accept=".xlsx,.xls" + :before-upload="beforeUpload" + v-model:file-list="state.exportFileList" + action="#" + :auto-upload="false" + :on-change="handleChange" + style="width: 100%" + > + <el-button :icon="Upload" size="default" type="primary">点击上传</el-button> + </el-upload> + </el-form-item> + </el-form> + <template #footer> + <span class="dialog-footer"> + <el-button @click="handleCloseExport" size="default">取 消</el-button> + <el-button type="primary" @click="onUpload" size="default">确定</el-button> + </span> + </template> + </el-dialog> </div> </template> @@ -70,12 +110,13 @@ import {getCurrentInstance, onMounted, onUnmounted, reactive, ref, toRefs} from "vue"; import {ElMessage, ElMessageBox} from "element-plus"; import {delCompany, getCompany} from "@/api/onlineEducation/company"; +import { Plus, Upload, Download} from '@element-plus/icons-vue'; import {delUser, getUser} from "@/api/onlineEducation/user"; import Cookies from "js-cookie"; import editDialog from './components/editDialog.vue' import { delIndustryTemp, - getIndustryTemp, + getIndustryTemp, uploadTemplate, } from "@/api/staffManage/staff"; import useUserStore from "@/store/modules/user"; import axios from "axios"; @@ -85,20 +126,42 @@ const { proxy } = getCurrentInstance(); const loading = ref(false); const dialogRef = ref(); +const checkFiles = (rule, value, callback) => { + if (state.exportFileList.length == 0) { + callback(new Error('请上传导入文件')) + } else { + callback() + } +} const data = reactive({ queryParams: { pageNum: 1, pageSize: 10, companyId: null, - industryType: null + industryType: null, + type: '' }, total: 0, dataList: [], companyList: [], industryList: [], isAdmin: false, - typeList: [] + typeList: [], + exportDialog: false, + }); +const state = reactive({ + form: { + id: null, + filePath: '', + companyId: null + }, + formRules:{ + companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }], + filePath: [{ required: true, validator: checkFiles, trigger: 'blur' }] + }, + exportFileList: [], +}) const { queryParams, total, dataList,companyList,industryList, isAdmin } = toRefs(data); const userInfo = ref() @@ -123,7 +186,7 @@ loading.value = true const res = await getIndustryTemp(data.queryParams) if(res.code == 200){ - data.dataList = res.data.list || [] + data.dataList = res.data.list data.total = res.data.total }else{ ElMessage.warning(res.message) @@ -177,15 +240,81 @@ dialogRef.value.openDialog(type, value, data.queryParams.companyId, data.isAdmin, data.companyList); } +const exportData = () => { + data.exportDialog = true + +} +const handleCloseExport = () => { + state.exportFileList = [] + data.exportDialog = false +} +const beforeUpload = (file) => { + state.exportFileList = [...state.exportFileList, file] + state.exportFileList = state.exportFileList.slice(-1) + return false; +} +const downloadFileTable = () => { + const filePath = '/example.xls'; + const link = document.createElement('a'); + link.href = filePath; + link.download = filePath.substr(filePath.lastIndexOf('/') + 1); + link.click(); +} +const fileBinaryList = ref([]) +const handleChange = (file, files) => { + fileBinaryList.value = files; +}; +const onUpload = async () => { + if(state.exportFileList.length == 0){ + ElMessage({ + type: 'warning', + message: '请先上传表格文件' + }); + return + }else{ + const formData = new FormData(); + fileBinaryList.value.forEach((file) => { + formData.append('file', file.raw) + }) + console.log('form',formData) + const res = await uploadTemplate(formData) + if(res.code == 200){ + ElMessage({ + type: 'success', + message: '导入成功' + }); + state.exportFileList = [] + data.exportDialog = false + await getList() + }else{ + ElMessage({ + type: 'error', + message: res.message + }); + } + } +} + /** 重置新增的表单以及其他数据 */ const reset= async()=> { - data.queryParams = { - pageNum: 1, - pageSize: 10, - companyId: null, - industryType: null + if(data.isAdmin){ + data.queryParams = { + pageNum: 1, + pageSize: 10, + companyId: null, + industryType: null, + type: '' + } + await getCompanyList() + }else { + data.queryParams = { + pageNum: 1, + pageSize: 10, + companyId: data.queryParams.companyId, + industryType: null, + type: '' + } } - await getCompanyList() await getList() } const handleDelete = (val) => { @@ -208,4 +337,5 @@ }) } + </script> -- Gitblit v1.9.2