feat: role

ui/src/api/type/role.ts

@@ -0,0 +1,43 @@
+import { RoleTypeEnum } from '@/enums/system'
+
+interface RoleItem {
+  id: string,
+  role_name: string,
+  type: RoleTypeEnum,
+  create_user: string,
+  internal: boolean,
+}
+
+interface ChildrenPermissionItem {
+  id: string
+  name: string
+  enable: boolean
+}
+
+interface RolePermissionItem {
+  id: string,
+  name: string,
+  children: {
+    id: string,
+    name: string,
+    permission: ChildrenPermissionItem[],
+    enable: boolean,
+  }[]
+}
+
+interface RoleTableDataItem {
+  module: string
+  name: string
+  permission: ChildrenPermissionItem[]
+  enable: boolean
+  perChecked: string[]
+  indeterminate: boolean
+}
+
+interface CreateOrUpdateParams {
+  role_id?: string,
+  role_name: string,
+  role_type?: RoleTypeEnum,
+}
+
+export type { RoleItem, RolePermissionItem, RoleTableDataItem, CreateOrUpdateParams, ChildrenPermissionItem }

ui/src/api/user/role.ts

@@ -0,0 +1,67 @@
+import { get, post, del } from '@/request/index'
+import type { Ref } from 'vue'
+import { Result } from '@/request/Result'
+import type { RoleItem, RolePermissionItem, CreateOrUpdateParams } from '@/api/type/role'
+import { RoleTypeEnum } from '@/enums/system'
+
+const prefix = '/system/role'
+/**
+ * 获取角色列表
+ */
+const getRoleList: (loading?: Ref<boolean>) => Promise<Result<{ internal_role: RoleItem[], custom_role: RoleItem[] }>> = (loading) => {
+  return get(`${prefix}`, undefined, loading)
+}
+
+/**
+ * 根据类型获取角色权限模版列表
+ */
+const getRoleTemplate: (role_type: RoleTypeEnum, loading?: Ref<boolean>) => Promise<Result<RolePermissionItem[]>> = (role_type, loading) => {
+  return get(`${prefix}/template/${role_type}`, undefined, loading)
+}
+
+/**
+ * 获取角色权限选中
+ */
+const getRolePermissionList: (role_id: string, loading?: Ref<boolean>) => Promise<Result<RolePermissionItem[]>> = (role_id, loading) => {
+  return get(`${prefix}/${role_id}/permission`, undefined, loading)
+}
+
+/**
+ * 新建或更新角色
+ */
+const CreateOrUpdateRole: (
+  data: CreateOrUpdateParams,
+  loading?: Ref<boolean>,
+) => Promise<Result<any>> = (data, loading) => {
+  return post(`${prefix}`, data, undefined, loading)
+}
+
+/**
+ * 删除角色
+ */
+const deleteRole: (role_id: string, loading?: Ref<boolean>) => Promise<Result<boolean>> = (
+  role_id,
+  loading,
+) => {
+  return del(`${prefix}/${role_id}`, undefined, {}, loading)
+}
+
+/**
+ * 保存角色权限
+ */
+const saveRolePermission: (
+  role_id: string,
+  data: { id: string, enable: boolean }[],
+  loading?: Ref<boolean>,
+) => Promise<Result<any>> = (role_id, data, loading) => {
+  return post(`${prefix}/${role_id}/permission`, data, undefined, loading)
+}
+
+export default {
+  getRoleList,
+  getRolePermissionList,
+  getRoleTemplate,
+  CreateOrUpdateRole,
+  deleteRole,
+  saveRolePermission
+}

ui/src/enums/system.ts

@@ -5,3 +5,9 @@ export enum AuthorizationEnum {
   KNOWLEDGE = 'KNOWLEDGE',
   APPLICATION = 'APPLICATION',
 }
+
+export enum RoleTypeEnum {
+  ADMIN = 'ADMIN',
+  USER = 'USER',
+  WORKSPACE_MANAGE = 'WORKSPACE_MANAGE',
+}

ui/src/locales/lang/en-US/common.ts

@@ -66,9 +66,11 @@ export default {
     addParam: 'Add Parameter',
   },
   inputPlaceholder: 'Please input',
+  selectPlaceholder: 'Please select',
   title: 'Title',
   content: 'Content',
   rename: 'Rename',
+  renameSuccess: 'Successful',
   EditAvatarDialog: {
     title: 'App Logo',
     customizeUpload: 'Custom Upload',

ui/src/locales/lang/en-US/views/index.ts

@@ -1,5 +1,6 @@
 import notFound from './404'
 import application from './application'
+import role from './role'
 import applicationOverview from './application-overview'
 import knowledge from './knowledge'
 import system from './system'
@@ -32,5 +33,6 @@ export default {
   problem,
   log,
   login,
-  operateLog
+  operateLog,
+  role
 }

ui/src/locales/lang/en-US/views/role.ts

@@ -0,0 +1,22 @@
+export default {
+  title: 'Role management',
+  internalRole: 'System built-in roles',
+  customRole: 'Custom roles',
+  systemAdmin: 'System admin',
+  workspaceAdmin: 'Workspace admin',
+  user: 'Regular user',
+  roleName: 'Role name',
+  inheritingRole: 'Inherited role',
+  delete: {
+    confirmTitle: 'Confirm to delete role:',
+    confirmMessage: 'After deletion, all members under this role will be removed. Please proceed with caution.',
+  },
+  permission: {
+    title: 'Permission configuration',
+    operationTarget: 'Operation target',
+    moduleName: 'Module name'
+  },
+  member: {
+    title: 'Members'
+  }
+};

ui/src/locales/lang/zh-CN/common.ts

@@ -70,9 +70,11 @@ export default {
     addParam: '添加参数',
   },
   inputPlaceholder: '请输入',
+  selectPlaceholder: '请选择',
   title: '标题',
   content: '内容',
   rename: '重命名',
+  renameSuccess: '重命名成功',
   EditAvatarDialog: {
     title: '应用头像',
     customizeUpload: '自定义上传',

ui/src/locales/lang/zh-CN/views/index.ts

@@ -6,6 +6,7 @@ import document from './document'
 import system from './system'
 import userManage from './user-manage'
 import resourceAuthorization from './resource-authorization'
+import role from './role'
 import application from './application'
 import problem from './problem'
 import applicationOverview from './application-overview'
@@ -24,6 +25,7 @@ export default {
   system,
   userManage,
   resourceAuthorization,
+  role,
   application,
   problem,
   applicationOverview,

ui/src/locales/lang/zh-CN/views/role.ts

@@ -0,0 +1,22 @@
+export default {
+  title: '角色管理',
+  internalRole: '系统内置角色',
+  customRole: '自定义角色',
+  systemAdmin: '系统管理员',
+  workspaceAdmin: '工作空间管理员',
+  user: '普通用户',
+  roleName: '角色名称',
+  inheritingRole: '继承角色',
+  delete: {
+    confirmTitle: '是否删除角色：',
+    confirmMessage: '删除后，该角色下的成员都会被移除，请谨慎操作。',
+  },
+  permission: {
+    title: '权限配置',
+    operationTarget: '操作对象',
+    moduleName: '模块名称'
+  },
+  member: {
+    title: '成员'
+  }
+}

ui/src/locales/lang/zh-Hant/common.ts

@@ -66,9 +66,11 @@ export default {
     addParam: '新增參數',
   },
   inputPlaceholder: '請輸入',
+  selectPlaceholder: '請選擇',
   title: '標題',
   content: '内容',
   rename: '重命名',
+  renameSuccess: '重命名成功',
   EditAvatarDialog: {
     title: '應用頭像',
     customizeUpload: '自訂上傳',

ui/src/locales/lang/zh-Hant/views/index.ts

@@ -1,5 +1,6 @@
 import notFound from './404'
 import application from './application'
+import role from './role'
 import applicationOverview from './application-overview'
 import knowledge from './knowledge'
 import system from './system'
@@ -32,5 +33,6 @@ export default {
   problem,
   log,
   login,
-  operateLog
+  operateLog,
+  role
 }

ui/src/locales/lang/zh-Hant/views/role.ts

@@ -0,0 +1,22 @@
+export default {
+  title: '角色管理',
+  internalRole: '系統內置角色',
+  customRole: '自定義角色',
+  systemAdmin: '系統管理員',
+  workspaceAdmin: '工作空間管理員',
+  user: '普通用戶',
+  roleName: '角色名稱',
+  inheritingRole: '繼承角色',
+  delete: {
+    confirmTitle: '是否刪除角色：',
+    confirmMessage: '刪除後，該角色下的成員都會被移除，請謹慎操作。',
+  },
+  permission: {
+    title: '權限配置',
+    operationTarget: '操作對象',
+    moduleName: '模塊名稱'
+  },
+  member: {
+    title: '成員'
+  }
+};

ui/src/router/modules/system.ts

@@ -32,6 +32,19 @@ const systemRouter = {
       },
       component: () => import('@/views/resource-authorization/index.vue'),
     },
+    {
+      path: '/system/role',
+      name: 'role',
+      meta: {
+        icon: 'app-resource-authorization', // TODO
+        iconActive: 'app-resource-authorization-active', // TODO
+        title: 'views.role.title',
+        activeMenu: '/system',
+        parentPath: '/system',
+        parentName: 'system',
+      },
+      component: () => import('@/views/role/index.vue'),
+    },
     {
       path:'/system/setting',
       name: 'setting',

ui/src/styles/app.scss

@@ -385,6 +385,9 @@ h5 {
 .color-success {
   color: var(--el-color-success);
 }
+.color-input-placeholder {
+  color: var(--app-input-color-placeholder);
+}
 .avatar-purple {
   background: #7f3bf5;
 }

ui/src/views/role/component/CreateOrUpdateRoleDialog.vue

@@ -0,0 +1,82 @@
+<template>
+  <el-dialog :title="`${!form.role_id ? $t('common.create') : $t('common.rename')}${$t('views.role.customRole')}`"
+    v-model="dialogVisible" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true">
+    <el-form label-position="top" ref="formRef" :rules="rules" :model="form" require-asterisk-position="right">
+      <el-form-item :label="$t('views.role.roleName')" prop="role_name">
+        <el-input v-model="form.role_name" maxlength="64"
+          :placeholder="`${$t('common.inputPlaceholder')}${$t('views.role.roleName')}`" />
+      </el-form-item>
+      <el-form-item v-if="!form.role_id" :label="$t('views.role.inheritingRole')" prop="role_type">
+        <el-select v-model="form.role_type"
+          :placeholder="`${$t('common.selectPlaceholder')}${$t('views.role.inheritingRole')}`">
+          <el-option v-for="(label, value) in roleTypeMap" :key="value" :label="label" :value="value" />
+        </el-select>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click.prevent="dialogVisible = false"> {{ $t('common.cancel') }} </el-button>
+        <el-button type="primary" @click="submit(formRef)" :loading="loading">
+          {{ !form.role_id ? $t('common.create') : $t('common.save') }}
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import type { FormInstance } from 'element-plus'
+import { MsgSuccess } from '@/utils/message'
+import { t } from '@/locales'
+import type { RoleItem, CreateOrUpdateParams } from '@/api/type/role'
+import RoleApi from '@/api/user/role'
+import { roleTypeMap } from '../index'
+
+const emit = defineEmits<{
+  (e: 'refresh', currentRole: RoleItem): void;
+}>();
+
+const dialogVisible = ref<boolean>(false)
+const defaultForm = {
+  role_name: ''
+}
+const form = ref<CreateOrUpdateParams>({
+  ...defaultForm,
+})
+function open(item?: RoleItem) {
+  if (item) {
+    form.value = {
+      role_name: item.role_name,
+      role_type: item.type,
+      role_id: item.id,
+    }
+  } else {
+    form.value = { ...defaultForm }
+  }
+  dialogVisible.value = true
+}
+
+const formRef = ref<FormInstance>();
+
+const rules = reactive({
+  role_name: [{ required: true, message: `${t('common.inputPlaceholder')}${t('views.role.roleName')}`, trigger: 'blur' }],
+  role_type: [{ required: true, message: `${t('common.selectPlaceholder')}${t('views.role.inheritingRole')}`, trigger: 'blur' }]
+})
+
+const loading = ref<boolean>(false)
+const submit = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  await formEl.validate((valid) => {
+    if (valid) {
+      RoleApi.CreateOrUpdateRole(form.value, loading).then((res: any) => {
+        MsgSuccess(!form.value.role_id ? t('common.createSuccess') : t('common.renameSuccess'))
+        emit('refresh', res.data)
+        dialogVisible.value = false
+      })
+    }
+  })
+}
+
+defineExpose({ open })
+</script>

ui/src/views/role/component/Member.vue

@@ -0,0 +1,5 @@
+<template>
+  <div></div>
+</template>
+
+<script setup lang="ts"></script>