feat: 添加rbac (#1322)

* stash

* perf: 修改切换

* perf: stash

* perf: 修改组件名称

* perf: 修改acl

* perf: 修改路由

* perf: 修改路由切换

* perf: 完成切换

* perf: 修改菜单

* perf: 优化布局

* perf: route rbac

* perf: 固定heading

* perf: 使用class控制header

* perf: 修改margin

* perf: stash 自动生成permissions

* perf: 暂存rbac

* stash

* perf: 优化rbac

* fix: 还原之前的hidden

* pref: 组件还原名称

* pref: 添加角色创建

* perf: 修改sidebar

* perf: 暂存一下

* feat: 添加 角色详情

* stash: 暂存一下

* feat: 添加首页路由及页面布局

* stash: 暂存一下

* feat: 获取切换视图数据

* feat: 获取切换视图数据

* feat: 调整首页页面布局及组件封装

* perf: 使用统一的 role list

* feat: 调整角色权限按钮

* feat: 主页添加会话模块

* feat: 主页添加会话模块

* feat: 设置table不显示多选

* feat: 调整首页模块展示字段

* fix: 修复菜单父级选中不高亮问题

* feat: 替换首页背景图

* perf: 修改一下

* feat: 更新首页卡片接口

* perf: 修改 rbac

* feat: 工单路由、系统设置路由单独拆分出来，并对系统设置路由进行权限判断

* perf: 修改权限

* feat: 系统设置相关页面更换布局组件

* fix: 修复 profile page

* perf: 修改xpack route

* perf: 优化角色详情

* perf: 优化 role user 处理

* perf: 权限位放到详情里

* perf: 修改role info 和 i18n

* feat: 系统设置相关页面修改布局组件；增加路由大标题

1、系统设置-认证设置：修改布局容器组件
2、系统设置-ldap：页面合并到认证设置里
3、左侧路由菜单顶部增加大标题
4、系统设置路由菜单设置新图标

* feat: 调整切换组织组件显示位置，替换组织icon

* feat: 调整切换组织组件显示位置，替换组织icon

* feat: 拆分个人信息页面相关路由，单独的view显示

* feat: 切换组织组件放到头像左边实现，web终端放到帮助左边图标显示

* style: 角色权限组件设置不可选中样式

* perf: add terminal svg

* feat: 替换邮箱svg

* perf: 修改触发方式

* perf: 完成角色搜索

* perf: 修改位置

* perf: 修改触发方式

* perf: 修复 user create 的role

* feat: 修改切换组织组件显示位置和ui样式
1、站内信、web终端图标添加hover效果提示
2、突出退出登录添加icon
3、修改切换组织组件显示位置和ui样式

* perf: 修改一些 权限

* perf: 修改菜单隐藏判断

* perf: 修改 org

* perf: 修改radius

* perf: 还原 radius

* feat: 调整终端管理文件，统一放到系统设置目录下
1、调整切换组织组件文件位置，放到header目录下
2、调整终端管理相关页面的文件位置放在系统设置目录下
3、终端管理部分页面为迁移完。。。

* perf: 修改了些 css

* perf: 修改分割线颜色

* perf: 修改分隔线样式

* perf: 修改是否显示组织

* perf: 优化继承

* perf: 还原 resource 的处理

* perf: 修改 app api url

* fix: 修复原来 detailApi 引起的问题

* perf: 修改一点 css

* perf: 修改 views

* perf: 修改视图切换

* perf: 修改位置

Co-authored-by: ibuler <ibuler@qq.com>
Co-authored-by: “怀磊” <2280131253@qq.com>

src/views/users/User/UserCreateUpdate.vue

@@ -5,7 +5,6 @@
 <script>
 import { GenericCreateUpdatePage } from '@/layout/components'
 import UserPassword from '@/components/FormFields/UserPassword'
-import RoleCheckbox from '@/views/users/User/components/RoleCheckbox'
 import rules from '@/components/DataForm/rules'
 import { mapGetters } from 'vuex'
 
@@ -15,8 +14,7 @@ export default {
   },
   data() {
     return {
-      initial: {
-      },
+      initial: {},
       user: {
         'can_public_key_auth': false
       },
@@ -26,7 +24,7 @@ export default {
           'password_strategy', 'update_password', 'password', 'need_update_password',
           'set_public_key', 'public_key', 'mfa_level', 'source'
         ]],
-        [this.$t('users.Secure'), ['role', 'org_roles', 'date_expired']],
+        [this.$t('users.Secure'), ['system_roles', 'org_roles', 'date_expired']],
         [this.$t('common.Other'), ['phone', 'wechat', 'comment']]
       ],
       url: '/api/v1/users/users/',
@@ -103,22 +101,38 @@ export default {
             return !formValue.set_public_key
           }
         },
-        role: {
-          label: this.$t('users.SuperRole'),
+        system_roles: {
+          label: this.$t('users.SystemRoles'),
+          el: {
+            multiple: true,
+            ajax: {
+              url: '/api/v1/rbac/roles/?scope=system',
+              transformOption: (item) => {
+                return { label: item.display_name, value: item.id }
+              }
+            }
+          },
           hidden: () => {
-            return !this.$store.getters.currentUserIsSuperAdmin
-          }
+            return !this.$hasPerm('rbac.change_systemrolebinding')
+          },
+          value: []
         },
         org_roles: {
           rules: [rules.RequiredChange],
-          label: this.$t('users.OrgRole'),
-          component: RoleCheckbox,
-          hidden: () => {
-            return !this.$store.getters.hasValidLicense
-          },
           el: {
+            multiple: true,
+            ajax: {
+              url: '/api/v1/rbac/roles/?scope=org',
+              transformOption: (item) => {
+                return { label: item.display_name, value: item.id }
+              }
+            },
             disabled: this.$store.getters.currentOrgIsRoot,
-            rule: []
+            value: []
+          },
+          hidden: () => {
+            return !this.$store.getters.hasValidLicense ||
+                !this.$hasPerm('rbac.change_orgrolebinding')
           },
           helpText: this.$t('users.HelpText.OrgRoleHelpText')
         },