| | |
| | | <basic-container> |
| | | <avue-crud |
| | | ref="userCrud" |
| | | :before-open="beforeOpen" |
| | | :data="tableData" |
| | | :option="option" |
| | | :page.sync="page" |
| | |
| | | @row-save="rowSaveHandler" |
| | | @row-update="rowUpdateHandler" |
| | | > |
| | | <!-- 部门头部搜索插槽 --> |
| | | <template slot-scope="{disabled,size}" slot="pkDepartmentNameSearch"> |
| | | <div style="display: flex;gap: 5px"> |
| | | <el-select v-model="departSearchValue" clearable placeholder="请选择部门"> |
| | | <el-option :label="departSearchObj.name" :value="departSearchObj.oid"></el-option> |
| | | </el-select> |
| | | <el-button size="small" type="success" @click="dialogDepartSearchHandler">选择部门</el-button> |
| | | </div> |
| | | </template> |
| | | |
| | | <!-- 对话框部门插槽 --> |
| | | <template slot="pkDepartmentNameForm" slot-scope="scope"> |
| | | <div style="display: flex;gap: 5px"> |
| | | <el-select v-model="departValue" clearable placeholder="请选择部门"> |
| | | <el-option :label="departObj.name" :value="departObj.oid"></el-option> |
| | | </el-select> |
| | | <el-button size="small" type="success" @click="dialogDepartHandler">选择部门</el-button> |
| | | </div> |
| | | </template> |
| | | |
| | | <template slot="status" slot-scope="{row}"> |
| | | <el-tag v-if="row.status === 0" type="success">启用</el-tag> |
| | | <el-tag v-if="row.status === 1" type="danger">停用</el-tag> |
| | |
| | | </template> |
| | | |
| | | <template #menu="{row,index,size}"> |
| | | <el-button icon="el-icon-edit" size="small" type="text" @click.stop="rowEditHandler(row,index)">编辑</el-button> |
| | | <el-button icon="el-icon-delete" size="small" type="text" @click.stop="rowDeleteHandler(row)">删除</el-button> |
| | | <el-button v-if="permissionList.editBtn" size="small" type="text" |
| | | @click.stop="rowEditHandler(row,index)"> |
| | | <icon-show :name="permissionList.editBtn.source"></icon-show> |
| | | 编辑 |
| | | </el-button> |
| | | <el-button v-if="permissionList.delBtn" size="small" type="text" |
| | | @click.stop="rowDeleteHandler(row)"> |
| | | <icon-show :name="permissionList.delBtn.source"></icon-show> |
| | | 删除 |
| | | </el-button> |
| | | <el-button size="small" type="text" @click.stop="stopUserHandler(row)"> |
| | | <span v-if="row.status === 0" style="color: #fa3434"><i class="el-icon-video-pause"></i> 停用</span> |
| | | <span v-if="row.status === 1" style="color: #55b61d"><i class="el-icon-video-pause"></i> 启用</span> |
| | | <span v-if="row.status === 0 && permissionList.stopBtn" style="color: #fa3434;display: flex"> |
| | | <icon-show :name="permissionList.stopBtn.source"></icon-show> |
| | | 停用 |
| | | </span> |
| | | <span v-if="row.status === 1 && permissionList.actionBtn" style="color: #55b61d;display: flex"> |
| | | <icon-show :name="permissionList.actionBtn.source"></icon-show> |
| | | 启用 |
| | | </span> |
| | | </el-button> |
| | | </template> |
| | | |
| | | <template slot="menuLeft" slot-scope="scope"> |
| | | <el-button icon="el-icon-delete" plain size="small" type="danger" @click="allDelHandler">删除</el-button> |
| | | <el-button icon="el-icon-user" plain size="small" type="primary" @click="roleHandler">分配角色</el-button> |
| | | <el-button icon="el-icon-school" plain size="small" type="primary" @click="departmentHandler">分配部门</el-button> |
| | | <el-button icon="el-icon-key" plain size="small" type="success" @click="setPwsHandler">设置密码策略</el-button> |
| | | <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadRole">导入人员</el-button> |
| | | <el-button icon="el-icon-download" plain size="small" type="primary" @click="downloadHandler">下载导入模板</el-button> |
| | | <el-button v-if="permissionList.addBtn" class="button-custom-icon" size="small" type="primary" |
| | | @click="$refs.userCrud.rowAdd()"> |
| | | <icon-show :name="permissionList.addBtn.source"></icon-show> |
| | | 新 增 |
| | | </el-button> |
| | | <el-button v-if="permissionList.delBtn" class="button-custom-icon" plain size="small" type="danger" |
| | | @click="allDelHandler"> |
| | | <icon-show :name="permissionList.delBtn.source"></icon-show> |
| | | 删除 |
| | | </el-button> |
| | | <el-button v-if="permissionList.assigningRolesBtn" class="button-custom-icon" plain size="small" type="primary" |
| | | @click="roleHandler"> |
| | | <icon-show :name="permissionList.assigningRolesBtn.source"></icon-show> |
| | | 分配角色 |
| | | </el-button> |
| | | <el-button v-if="permissionList.distributionDepartmentBtn" class="button-custom-icon" plain size="small" |
| | | type="primary" @click="departmentHandler"> |
| | | <icon-show :name="permissionList.distributionDepartmentBtn.source"></icon-show> |
| | | 分配部门 |
| | | </el-button> |
| | | <el-button v-if="permissionList.setPasswordPolicyBtn" class="button-custom-icon" plain size="small" |
| | | type="success" |
| | | @click="setPwsHandler"> |
| | | <icon-show :name="permissionList.setPasswordPolicyBtn.source"></icon-show> |
| | | 设置密码策略 |
| | | </el-button> |
| | | <el-button v-if="permissionList.importPersonnelBtn" class="button-custom-icon" plain size="small" type="primary" |
| | | @click="uploadUser"> |
| | | <icon-show :name="permissionList.importPersonnelBtn.source"></icon-show> |
| | | 导入人员 |
| | | </el-button> |
| | | <el-button v-if="permissionList.downloadImportTemplateBtn" class="button-custom-icon" plain size="small" |
| | | type="primary" @click="downloadHandler"> |
| | | <icon-show :name="permissionList.downloadImportTemplateBtn.source"></icon-show> |
| | | 下载导入模板 |
| | | </el-button> |
| | | </template> |
| | | </avue-crud> |
| | | |
| | |
| | | <el-dialog |
| | | v-dialogDrag |
| | | v-loading="pwdLoading" |
| | | :destroy-on-close="true" |
| | | :visible.sync="pwdVisible" |
| | | append-to-body="true" |
| | | class="avue-dialog" |
| | | style="margin-top: -15vh !important;" |
| | | title="设置密码策略" |
| | | width="30%" |
| | | width="500px" |
| | | > |
| | | |
| | | <div class="password-strategy-container"> |
| | | <div><i class="el-icon-setting"/>设置密码策略:</div> |
| | | <el-select v-model="pwdValue" placeholder="请选择密码策略"> |
| | | <div style="width:115px;"><i class="el-icon-setting"/>设置密码策略:</div> |
| | | <el-select v-model="pwdValue" placeholder="请选择密码策略" style="width: 330px;"> |
| | | <el-option v-for="(item,index) in pwdList" :key="index" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button size="small" @click="pwdVisible = false">取 消</el-button> |
| | | <el-button size="small" type="primary" @click="savePwdHandler">确 定</el-button> |
| | | <el-button size="small" @click="pwdVisible = false">取 消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <!-- 导入人员 --> |
| | | <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" title="导入人员"></upload-file> |
| | | <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="导入人员" |
| | | @updata="getTableList"></upload-file> |
| | | |
| | | <!-- 分配部门对话框 --> |
| | | <el-dialog |
| | | v-dialogDrag |
| | | v-loading="departLoading" |
| | | :destroy-on-close="true" |
| | | :visible.sync="departVisible" |
| | | append-to-body="true" |
| | | class="avue-dialog" |
| | |
| | | > |
| | | </avue-crud> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button size="small" @click="departVisible = false">取 消</el-button> |
| | | <el-button size="small" type="primary" @click="saveDepartHandler">确 定</el-button> |
| | | <el-button size="small" @click="departVisible = false">取 消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </basic-container> |
| | |
| | | } from '@/api/system/user/api' |
| | | import {column} from "./option" |
| | | import func from '@/util/func' |
| | | import {mapGetters} from "vuex"; |
| | | |
| | | export default { |
| | | name: "userManage", |
| | | data: function () { |
| | | return { |
| | | departSearchObj:{}, |
| | | departSearchValue:'', |
| | | departSearchObj: {}, |
| | | departSearchValue: '', |
| | | loadKey: 0, |
| | | departStatus: '', // 区分不同方式打开部门对话框 |
| | | departValue: '', // 部门对话框下拉框绑定值 |
| | | departObj: {}, // 部门对话框下拉框选项绑定值 |
| | | departCurrenRow: {}, |
| | | departOption: { |
| | | ...basicOption, |
| | | addBtn: false, |
| | | rowKey: 'oid', |
| | | rowParentKey: 'parentId', |
| | | selection: false, |
| | |
| | | menu: false, |
| | | refreshBtn: false, |
| | | gridBtn: false, |
| | | header: false, |
| | | column: [ |
| | | { |
| | | label: '名称', |
| | | prop: 'name', |
| | | align: 'left' |
| | | }, |
| | | { |
| | | label: '编号', |
| | |
| | | pwdList: [], |
| | | tableLoading: false, |
| | | tableData: [], |
| | | option: { |
| | | ...basicOption, |
| | | editBtn: false, |
| | | delBtn: false, |
| | | dialogWidth: '50%', |
| | | calcHeight: -60, |
| | | column: column |
| | | }, |
| | | page: { |
| | | currentPage: 1, |
| | | pageSize: 10, |
| | |
| | | selectList: [], |
| | | leftRoleData: [], // 分配角色穿梭框左侧初始数据 |
| | | rightRoleData: [], // 分配角色穿梭框右侧初始数据 |
| | | transferTitle: ['现有角色', '拥有角色'] |
| | | transferTitle: ['现有角色', '拥有角色'], |
| | | tipList: ["导入模板中标明红色字体的为必输项", "部门列上下级关系必须按照反斜杠隔开(/)"], |
| | | lastIndex: null, |
| | | } |
| | | }, |
| | | created() { |
| | | computed: { |
| | | ...mapGetters(["permission"]), |
| | | permissionList() { |
| | | return { |
| | | addBtn: this.vaildData(this.permission[this.$route.query.id].ADD, false), |
| | | delBtn: this.vaildData(this.permission[this.$route.query.id].DELETE, false), |
| | | editBtn: this.vaildData(this.permission[this.$route.query.id].EDIT, false), |
| | | distributionDepartmentBtn: this.vaildData(this.permission[this.$route.query.id].ASSIGN, false), |
| | | assigningRolesBtn: this.vaildData(this.permission[this.$route.query.id].ASSIGN1, false), |
| | | downloadImportTemplateBtn: this.vaildData(this.permission[this.$route.query.id].DOWNLOADFILE, false), |
| | | importPersonnelBtn: this.vaildData(this.permission[this.$route.query.id].IMPORT, false), |
| | | setPasswordPolicyBtn: this.vaildData(this.permission[this.$route.query.id].RIGHT, false), |
| | | stopBtn: this.vaildData(this.permission[this.$route.query.id].FREEZE, false), |
| | | actionBtn: this.vaildData(this.permission[this.$route.query.id].UNFREZE, false), |
| | | }; |
| | | }, |
| | | option() { |
| | | return { |
| | | ...basicOption, |
| | | addBtn: false, |
| | | editBtn: false, |
| | | delBtn: false, |
| | | dialogWidth: '50%', |
| | | calcHeight: -60, |
| | | column: column |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | // 新增或修改对话框打开前 |
| | | beforeOpen(done, type) { |
| | | if(type == 'add'){ |
| | | this.departObj = {}; |
| | | this.departValue = ""; |
| | | } |
| | | done(); |
| | | }, |
| | | // 表格请求 |
| | | getTableList() { |
| | | this.tableLoading = true; |
| | | getDataUsers(this.page.currentPage, this.page.pageSize, this.searchParams).then(res => { |
| | | const data = res.data.data; |
| | | data.map(item => { |
| | | item.secretGrade = item.secretGrade.toString() |
| | | }) |
| | | this.tableData = data; |
| | | this.page.total = res.data.total; |
| | | this.tableLoading = false; |
| | | }).catch(err => { |
| | | this.$message.error(err) |
| | | }); |
| | | s |
| | | }) |
| | | this.departmentQueryOnLoad() |
| | | }, |
| | | |
| | | // 表格右侧刷新图标 |
| | |
| | | // 搜索查询 |
| | | handleSearch(params, done) { |
| | | this.searchParams = {}; |
| | | if(this.departSearchObj && this.departSearchValue){ |
| | | this.searchParams['conditionMap["pkDepartment"]'] = this.departSearchValue; |
| | | } |
| | | |
| | | if (!func.isEmptyObject(params)) { |
| | | for (let key in params) { |
| | | if (params.hasOwnProperty(key)) { |
| | |
| | | } |
| | | } |
| | | |
| | | if (func.isEmptyObject(params) && !this.departSearchValue) { |
| | | if (func.isEmptyObject(params)) { |
| | | this.searchParams = {}; |
| | | } |
| | | |
| | |
| | | |
| | | // 重置搜索条件 |
| | | handleReset() { |
| | | this.departSearchObj = {}; |
| | | this.departSearchValue = ""; |
| | | this.searchParams = {}; |
| | | this.getTableList(); |
| | | }, |
| | |
| | | stopUser(params).then(res => { |
| | | this.$message.success(res.data.obj); |
| | | this.getTableList(); |
| | | }).catch(err => { |
| | | this.$message.error(err) |
| | | }) |
| | | }); |
| | | }, |
| | | |
| | | // 选择框 |
| | |
| | | |
| | | // 点击行 |
| | | rowClickHandler(row) { |
| | | this.$refs.userCrud.toggleRowSelection(row); |
| | | func.rowClickHandler( |
| | | row, |
| | | this.$refs.userCrud, |
| | | this.lastIndex, |
| | | (newIndex) => { |
| | | this.lastIndex = newIndex; |
| | | }, |
| | | () => { |
| | | this.selectList = [row]; |
| | | } |
| | | ); |
| | | }, |
| | | |
| | | // 分配角色 |
| | |
| | | listRoleByUserOid(userOid).then(res => { |
| | | this.rightRoleData = res.data.data.map(item => item.oid); |
| | | }) |
| | | }).catch(err => { |
| | | this.$message.error(err) |
| | | }) |
| | | }); |
| | | this.$refs.transfer.visible = true; |
| | | }, |
| | | |
| | |
| | | saveRights(params).then(res => { |
| | | this.$message.success(res.data.obj); |
| | | this.getTableList(); |
| | | }).catch(err => { |
| | | this.$message.error(err) |
| | | }) |
| | | }); |
| | | }, |
| | | |
| | | // 设置密码策略 |
| | |
| | | saveUserPasswordStrateg(params).then(res => { |
| | | this.pwdVisible = false; |
| | | this.$message.success(res.data.obj) |
| | | }).catch(err => { |
| | | this.$message.error(err) |
| | | }) |
| | | }); |
| | | }, |
| | | |
| | | // 新增 |
| | | rowSaveHandler(row, done) { |
| | | rowSaveHandler(row, done, loading) { |
| | | if (row.password != row.confirmPassword) { |
| | | this.$message.error('请检查两次密码是否输入一致!') |
| | | return this.$refs.userCrud.$refs.dialogForm.$refs.tableForm.allDisabled = false; |
| | | } |
| | | row.pkDepartment = this.departValue; // 将当前行的部门参数pkDepartment 赋值为下拉框绑定的值 |
| | | addUser(row).then(res => { |
| | | if (res.data.code === 200) { |
| | | this.$message.success(res.data.obj); |
| | | this.getTableList(); |
| | | done(); |
| | | } |
| | | }).catch(err => { |
| | | console.log(err); |
| | | loading() |
| | | }) |
| | | done() |
| | | }, |
| | | |
| | | // 操作栏编辑 |
| | | rowEditHandler(row, index) { |
| | | let obj = { name: row.pkDepartmentName, oid: row.pkDepartment, rowOid: row.oid }; |
| | | this.departValue = row.pkDepartment; |
| | | this.departObj = obj; |
| | | |
| | | if (this.departObj.rowOid) { |
| | | this.$refs.userCrud.rowEdit(row, index); |
| | | } |
| | | |
| | | this.$refs.userCrud.rowEdit(row, index); |
| | | }, |
| | | |
| | | // 编辑 |
| | | rowUpdateHandler(row, index, done) { |
| | | rowUpdateHandler(row, index, done, loading) { |
| | | if (row.password != row.confirmPassword) { |
| | | this.$message.error('请检查两次密码是否输入一致!') |
| | | return this.$refs.userCrud.$refs.dialogForm.$refs.tableForm.allDisabled = false; |
| | | } |
| | | row.pkDepartment = this.departValue; // 将当前行的部门参数pkDepartment 赋值为下拉框绑定的值 |
| | | updateUser(row).then(res => { |
| | | if (res.data.code === 200) { |
| | | this.$message.success(res.data.obj); |
| | | this.getTableList(); |
| | | done() |
| | | } |
| | | }).catch(err => { |
| | | console.log(err); |
| | | loading() |
| | | }); |
| | | done() |
| | | }, |
| | | |
| | | // 删除 |
| | |
| | | let params = { |
| | | ids: row.oid |
| | | } |
| | | deleteUser(params).then(res => { |
| | | if (res.data.code === 200) { |
| | | this.$message.success(res.data.obj); |
| | | this.getTableList(); |
| | | } |
| | | }).catch(err => { |
| | | console.log(err); |
| | | }) |
| | | |
| | | this.$confirm('您确定要删除当前的成员吗?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | deleteUser(params).then(res => { |
| | | if (res.data.code === 200) { |
| | | this.$message.success(res.data.obj); |
| | | this.getTableList(); |
| | | } |
| | | }); |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已取消删除' |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | // 多选删除 |
| | |
| | | // 下载导入模板 |
| | | downloadHandler() { |
| | | download().then(res => { |
| | | console.log(res); |
| | | func.downloadFileByBlobHandler(res); |
| | | this.$message.success('下载成功') |
| | | }).catch(err => { |
| | | this.$message.error(err); |
| | | this.$message.success('下载成功'); |
| | | }) |
| | | }, |
| | | |
| | | // 导入人员 |
| | | uploadRole() { |
| | | uploadUser() { |
| | | this.$refs.upload.visible = true; |
| | | }, |
| | | |
| | | // 分配部门 |
| | | departmentHandler() { |
| | | if (this.selectList.length <= 0) { |
| | | this.$message.warning('清先选择人员再进行操作!') |
| | | this.$message.warning('清先选择人员再进行操作!'); |
| | | return; |
| | | } |
| | | this.departStatus = 'default'; // 区分不同方式打开部门对话框 |
| | | this.departmentQueryOnLoad(); |
| | | this.departVisible = true; |
| | | }, |
| | | |
| | | // 分配部门表格初始化请求 |
| | |
| | | departmentQueryController({queryAllLevel: true}).then(res => { |
| | | const data = res.data.treeData; |
| | | this.departData = this.departDtaFormAtter(data); |
| | | this.departVisible = true; |
| | | }).catch(err => { |
| | | this.$message.error(err); |
| | | }) |
| | | this.option.column[7].dicData = [{ |
| | | oid: 'ALLDept', |
| | | name: '所有部门', |
| | | expand: true, |
| | | disabled: true, |
| | | children: this.departData |
| | | }] |
| | | this.option.column[7].defaultExpandedKeys = ['ALLDept']; |
| | | }); |
| | | }, |
| | | |
| | | // 分配部门数据转换 |
| | |
| | | return; |
| | | } |
| | | |
| | | //分配部门 |
| | | if (this.departStatus == 'default') { |
| | | let params = { |
| | | userOIds: this.selectList.map(item => item.oid).join(','), |
| | |
| | | this.getTableList(); |
| | | this.$message.success('分配成功!') |
| | | } |
| | | }).catch(err => { |
| | | console.log(err); |
| | | }) |
| | | return; |
| | | } |
| | | |
| | | if (this.departStatus == 'handle') { |
| | | this.departObj = this.departCurrenRow; |
| | | this.departValue = this.departCurrenRow.oid; |
| | | this.departVisible = false; |
| | | return;; |
| | | } |
| | | |
| | | if(this.departStatus == 'search'){ |
| | | this.departSearchObj = this.departCurrenRow; |
| | | this.departSearchValue = this.departCurrenRow.oid; |
| | | this.departVisible = false; |
| | | return; |
| | | } |
| | | }, |
| | | |
| | | // 对话框分配部门按钮 |
| | | dialogDepartHandler() { |
| | | this.departmentQueryOnLoad(); |
| | | this.departStatus = 'handle'; // 区分不同方式打开部门对话框 |
| | | }, |
| | | |
| | | // 搜索对话框分配部门按钮 |
| | | dialogDepartSearchHandler(){ |
| | | this.departmentQueryOnLoad(); |
| | | this.departStatus = 'search'; // 区分不同方式打开部门对话框 |
| | | }, |
| | | } |
| | | |
| | |
| | | |
| | | <style lang="scss" scoped> |
| | | .password-strategy-container { |
| | | padding-left: 20px; |
| | | margin-bottom: 20px; |
| | | display: flex; |
| | | //justify-content: center; |
| | | align-items: center; |