| | |
| | | v-for="(permission, index) in permissionList" |
| | | :key="index" |
| | | :label="permission.name" |
| | | :checked="permission.state === 1" |
| | | @change="updatePermissionState(permission.name, $event)" |
| | | >{{ permission.name }}</el-checkbox> |
| | | </el-checkbox-group> |
| | | |
| | | </el-form-item> |
| | | </el-form> |
| | | <span slot="footer" class="dialog-footer"> |
| | |
| | | // 添加角色的验证规则 |
| | | addRoleRules: { |
| | | name: [ |
| | | {required: true, message: '请输入名称', trigger: 'blur'}, |
| | | {min: 2, max: 15, message: '长度在 2 到 15 个字符', trigger: 'blur'} |
| | | {required: true, message: this.$t('请输入名称'), trigger: 'blur'}, |
| | | {min: 2, max: 15, message: this.$t('长度在 2 到 15 个字符'), trigger: 'blur'} |
| | | ], |
| | | state: [ |
| | | {required: true, message: '请输入状态', trigger: 'blur'} |
| | | {required: true, message: this.$t('请输入状态'), trigger: 'blur'} |
| | | ] |
| | | }, |
| | | options: [ |
| | | {label: '有效', value: 1}, |
| | | {label: '无效', value: 0} |
| | | {label: this.$t('有效'), value: 1}, |
| | | {label: this.$t('无效'), value: 0} |
| | | ] |
| | | } |
| | | }, |
| | |
| | | }, |
| | | |
| | | |
| | | // 在 showPermissionDialog 方法中,只将选中的权限名称添加到 selectedPermissions 数组中 |
| | | showPermissionDialog(role) { |
| | | this.selectedPermissions=[]; |
| | | this.permissionList=[]; |
| | | |
| | | getById2({ roleId: role.id }).then((res) => { |
| | | this.permissionList = res.data.permissionList; |
| | | |
| | | |
| | | this.selectedPermissions = this.permissionList.map(({ name, state }) => ({ |
| | | name, |
| | | state: state === 1, |
| | | })); |
| | | console.log(this.selectedPermissions); |
| | | // 只有状态为 1 的权限名称会被添加到 selectedPermissions 数组中 |
| | | this.selectedPermissions = this.permissionList |
| | | .filter(permission => permission.state === 1) |
| | | .map(permission => permission.name); |
| | | this.permissionDialogVisible = true; |
| | | }); |
| | | }, |
| | | |
| | | // 在 updatePermissionState 方法中,根据复选框的勾选状态更新 selectedPermissions 数组 |
| | | // updatePermissionState(name, isChecked) { |
| | | // if (isChecked) { |
| | | // // 如果复选框被勾选,将权限名称添加到数组中 |
| | | // if (!this.selectedPermissions.includes(name)) { |
| | | // this.selectedPermissions.push(name); |
| | | // } |
| | | // } else { |
| | | // // 如果复选框被取消勾选,将权限名称从数组中移除 |
| | | // const index = this.selectedPermissions.indexOf(name); |
| | | // if (index !== -1) { |
| | | // this.selectedPermissions.splice(index, 1); |
| | | // } |
| | | // } |
| | | // }, |
| | | |
| | | // 取消编辑权限弹出框 |
| | | cancelEditPermissions() { |
| | | this.permissionDialogVisible = false; |
| | |
| | | if (permission) { |
| | | permission.state = isChecked ? 1 : 0; |
| | | } |
| | | |
| | | }, |
| | | |
| | | |
| | |
| | | // 成功更新权限后执行的操作 |
| | | const 更新状态成功 = this.$t('更新状态成功'); |
| | | this.$message.success(更新状态成功); |
| | | this.permissionDialogVisible = false; |
| | | }); |
| | | }, |
| | | // 展示添加角色的对话框 |