| | |
| | | <div class="mainContent"> |
| | | <div class="my-tree"> |
| | | <div class="my-tree__wrap"> |
| | | <el-tree :data="roleList" :props="defaultProps" @node-click="handleNodeClick" show-checkbox |
| | | @check-change="handleCheckChange" default-expand-all node-key="id"> |
| | | <!-- @node-click="handleNodeClick" --> |
| | | <el-tree ref="tree" :data="roleList" :props="defaultProps" show-checkbox |
| | | @check="handleCheck" :default-checked-keys="checkedIds" default-expand-all node-key="id"> |
| | | </el-tree> |
| | | </div> |
| | | <div class="my-tree__bottom"></div> |
| | |
| | | }, |
| | | created() { |
| | | const that = this; |
| | | this.getRoleMenus(this.userInfo.id); |
| | | this.getMenuList(); |
| | | }, |
| | | methods: { |
| | |
| | | }) |
| | | .then(res => { |
| | | this.roleList = res.data; |
| | | console.log(res); |
| | | }) |
| | | }, |
| | | // 点击树节点 |
| | |
| | | this.treeId = id; |
| | | |
| | | }, |
| | | // 树形控件选中更改 |
| | | handleCheckChange(data, checked, indeterminate) { |
| | | // console.log(data,checked,indeterminate); |
| | | if (checked) { |
| | | this.checkedIds.push(data.id); |
| | | } else { |
| | | let index = 0; |
| | | this.checkedIds.forEach((item, idx) => { |
| | | if (item.id === data.id) { |
| | | index = idx; |
| | | } |
| | | }) |
| | | this.checkedIds.splice(index, 1); |
| | | } |
| | | // 树形控件复选框点击事件 |
| | | handleCheck(data, checked) { |
| | | console.log(checked.checkedKeys); |
| | | this.checkedIds = checked.checkedKeys; |
| | | console.log(this.checkedIds); |
| | | }, |
| | | // 保存role |
| | | saveRole() { |
| | | this.resCheckedIds = []; |
| | | const {userInfo} = this; |
| | | this.resCheckedIds = this.checkedIds; |
| | | this.$emit('changeDialog',{dialogUpdate:false}); |
| | | this.$axios({ |
| | | method:'post', |
| | | url:'sccg/role/allocMenu?roleId='+userInfo.id + '&menuIds=' + this.checkedIds, |
| | | }) |
| | | .then(res=>{ |
| | | if(res.code === 200){ |
| | | this.$message({ |
| | | type:'success', |
| | | message:'修改角色权限成功', |
| | | }) |
| | | this.getRoleMenus(userInfo.id); |
| | | }else{ |
| | | this.$message({ |
| | | type:'warning', |
| | | message:res.message |
| | | }) |
| | | } |
| | | }) |
| | | // this.$emit('changeDialog',{dialogUpdate:false}); |
| | | }, |
| | | // 消除role |
| | | resetRole() { |
| | | this.resCheckedIds = [] |
| | | this.resCheckedIds = []; |
| | | this.$emit('changeDialog',{dialogUpdate:false}); |
| | | }, |
| | | // 获取角色菜单 |
| | | getRoleMenus(roleId){ |
| | | this.$axios({ |
| | | method:'get', |
| | | url:`sccg/role/listMenu/${roleId}` |
| | | }) |
| | | .then(res=>{ |
| | | this.checkedIds = []; |
| | | res.data.forEach(item=>{ |
| | | this.checkedIds.push(item.id); |
| | | }) |
| | | }) |
| | | } |
| | | }, |
| | | props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog'] |