From b508e6f20238caf6f000a2ac617bb6a4ca37d56b Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期三, 11 十二月 2019 18:12:00 +0800 Subject: [PATCH] 新增用户导入 --- ruoyi-ui/src/views/system/user/index.vue | 93 ++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 88 insertions(+), 5 deletions(-) diff --git a/ruoyi-ui/src/views/system/user/index.vue b/ruoyi-ui/src/views/system/user/index.vue index 00c3645..aae3e82 100644 --- a/ruoyi-ui/src/views/system/user/index.vue +++ b/ruoyi-ui/src/views/system/user/index.vue @@ -114,6 +114,15 @@ </el-col> <el-col :span="1.5"> <el-button + type="info" + icon="el-icon-upload2" + size="mini" + @click="handleImport" + v-hasPermi="['system:user:import']" + >导入</el-button> + </el-col> + <el-col :span="1.5"> + <el-button type="warning" icon="el-icon-download" size="mini" @@ -284,11 +293,43 @@ <el-button @click="cancel">取 消</el-button> </div> </el-dialog> + + <!-- 用户导入对话框 --> + <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px"> + <el-upload + ref="upload" + :limit="1" + accept=".xlsx, .xls" + :headers="upload.headers" + :action="upload.url + '?updateSupport=' + upload.updateSupport" + :disabled="upload.isUploading" + :on-progress="handleFileUploadProgress" + :on-success="handleFileSuccess" + :auto-upload="false" + drag + > + <i class="el-icon-upload"></i> + <div class="el-upload__text"> + 将文件拖到此处,或 + <em>点击上传</em> + </div> + <div class="el-upload__tip" slot="tip"> + <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据 + <el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link> + </div> + <div class="el-upload__tip" style="color:red" slot="tip">提示:仅允许导入“xls”或“xlsx”格式文件!</div> + </el-upload> + <div slot="footer" class="dialog-footer"> + <el-button type="primary" @click="submitFileForm">确 定</el-button> + <el-button @click="upload.open = false">取 消</el-button> + </div> + </el-dialog> </div> </template> <script> -import { listUser, getUser, delUser, addUser, updateUser, exportUser, resetUserPwd, changeUserStatus } from "@/api/system/user"; +import { listUser, getUser, delUser, addUser, updateUser, exportUser, resetUserPwd, changeUserStatus, importTemplate } from "@/api/system/user"; +import { getToken } from "@/utils/auth"; import { treeselect } from "@/api/system/dept"; import Treeselect from "@riophae/vue-treeselect"; import "@riophae/vue-treeselect/dist/vue-treeselect.css"; @@ -335,6 +376,21 @@ defaultProps: { children: "children", label: "label" + }, + // 用户导入参数 + upload: { + // 是否显示弹出层(用户导入) + open: false, + // 弹出层标题(用户导入) + title: "", + // 是否禁用上传 + isUploading: false, + // 是否更新已经存在的用户数据 + updateSupport: 0, + // 设置上传的请求头部 + headers: { Authorization: "Bearer " + getToken() }, + // 上传的地址 + url: process.env.VUE_APP_BASE_API + "/system/user/importData" }, // 查询参数 queryParams: { @@ -473,9 +529,9 @@ }, // 多选框选中数据 handleSelectionChange(selection) { - this.ids = selection.map(item => item.userId) - this.single = selection.length!=1 - this.multiple = !selection.length + this.ids = selection.map(item => item.userId); + this.single = selection.length != 1; + this.multiple = !selection.length; }, /** 新增按钮操作 */ handleAdd() { @@ -493,7 +549,7 @@ handleUpdate(row) { this.reset(); this.getTreeselect(); - const userId = row.userId || this.ids + const userId = row.userId || this.ids; getUser(userId).then(response => { this.form = response.data; this.postOptions = response.posts; @@ -574,6 +630,33 @@ }).then(response => { this.download(response.msg); }).catch(function() {}); + }, + /** 导入按钮操作 */ + handleImport() { + this.upload.title = "用户导入"; + this.upload.open = true; + }, + /** 下载模板操作 */ + importTemplate() { + importTemplate().then(response => { + this.download(response.msg); + }); + }, + // 文件上传中处理 + handleFileUploadProgress(event, file, fileList) { + this.upload.isUploading = true; + }, + // 文件上传成功处理 + handleFileSuccess(response, file, fileList) { + this.upload.open = false; + this.upload.isUploading = false; + this.$refs.upload.clearFiles(); + this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true }); + this.getList(); + }, + // 提交上传文件 + submitFileForm() { + this.$refs.upload.submit(); } } }; -- Gitblit v1.9.2