| | |
| | | <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> |
| | |
| | | <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="导入人员" @updata="getTableList"></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> |
| | |
| | | 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: '编号', |
| | |
| | | selectList: [], |
| | | leftRoleData: [], // 分配角色穿梭框左侧初始数据 |
| | | rightRoleData: [], // 分配角色穿梭框右侧初始数据 |
| | | transferTitle: ['现有角色', '拥有角色'] |
| | | transferTitle: ['现有角色', '拥有角色'], |
| | | tipList: ["导入模板中标明红色字体的为必输项", "部门列上下级关系必须按照反斜杠隔开(/)"], |
| | | lastIndex: null, |
| | | } |
| | | }, |
| | | created() { |
| | | }, |
| | | methods: { |
| | | // 新增或修改对话框打开前 |
| | | beforeOpen(done, type) { |
| | | if(type == 'add'){ |
| | | this.departObj = {}; |
| | | this.departValue = ""; |
| | | } |
| | | done(); |
| | | }, |
| | | // 表格请求 |
| | | getTableList() { |
| | | this.tableLoading = true; |
| | |
| | | this.tableData = data; |
| | | this.page.total = res.data.total; |
| | | this.tableLoading = false; |
| | | }).catch(err => { |
| | | this.$message.error(err) |
| | | }); |
| | | }) |
| | | 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(); |
| | | }, |
| | |
| | | |
| | | // 点击行 |
| | | rowClickHandler(row) { |
| | | this.$refs.userCrud.toggleRowSelection(row); |
| | | func.rowClickHandler( |
| | | row, |
| | | this.$refs.userCrud, |
| | | this.lastIndex, |
| | | (newIndex) => { |
| | | this.lastIndex = newIndex; |
| | | }, |
| | | () => { |
| | | this.selectList = []; |
| | | } |
| | | ); |
| | | }, |
| | | |
| | | // 分配角色 |
| | |
| | | }, |
| | | |
| | | // 新增 |
| | | rowSaveHandler(row, done,loading) { |
| | | 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() |
| | | done(); |
| | | } |
| | | }).catch(err => { |
| | | loading() |
| | | console.log(err); |
| | | }) |
| | | }, |
| | | |
| | | // 操作栏编辑 |
| | | 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,loading) { |
| | | 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); |
| | |
| | | } |
| | | }).catch(err => { |
| | | loading() |
| | | console.log(err); |
| | | }); |
| | | }, |
| | | |
| | |
| | | // 下载导入模板 |
| | | downloadHandler() { |
| | | download().then(res => { |
| | | console.log(res); |
| | | func.downloadFileByBlobHandler(res); |
| | | this.$message.success('下载成功') |
| | | }).catch(err => { |
| | | this.$message.error(err); |
| | | this.$message.success('下载成功'); |
| | | }) |
| | | }, |
| | | |
| | |
| | | // 分配部门 |
| | | 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; |
| | | this.option.column[7].dicData = [{ |
| | | oid: 'ALLDept', |
| | | name: '所有部门', |
| | | expand: true, |
| | | disabled: true, |
| | | children: this.departData |
| | | }] |
| | | this.option.column[7].defaultExpandedKeys = ['ALLDept']; |
| | | }).catch(err => { |
| | | this.$message.error(err); |
| | | }) |
| | |
| | | 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; |