refactor: role add user count

ui/src/api/type/role.ts

@@ -6,6 +6,7 @@ interface RoleItem {
   type: RoleTypeEnum,
   create_user: string,
   internal: boolean,
+  user_count?: number,
 }
 
 interface ChildrenPermissionItem {

ui/src/api/type/workspace.ts

@@ -1,6 +1,7 @@
 interface WorkspaceItem {
   name: string,
-  id?: string
+  id?: string,
+  user_count?: number,
 }
 
 interface CreateWorkspaceMemberParamsItem {

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

@@ -12,17 +12,20 @@
                   :placeholder="$t('common.inputPlaceholder')" style="width: 220px" clearable/>
       </div>
     </div>
-    <app-table class="mt-16" :data="tableData" :pagination-config="paginationConfig" @sizeChange="handleSizeChange"
+    <app-table class="mt-16" :data="tableData" :pagination-config="paginationConfig"
+               @sizeChange="handleSizeChange"
                @changePage="getList" v-loading="loading">
       <el-table-column prop="nick_name" :label="$t('views.userManage.form.nick_name.label')"/>
       <el-table-column prop="username" :label="$t('views.userManage.form.username.label')"/>
-      <el-table-column prop="workspace_name" :label="$t('views.role.member.workspace')" />
+      <el-table-column prop="workspace_name" :label="$t('views.role.member.workspace')"
+                       v-if="currentRole?.type !==RoleTypeEnum.ADMIN"/>
       <el-table-column :label="$t('common.operation')" width="100" fixed="right">
         <template #default="{ row }">
-          <el-tooltip effect="dark" :content="`${$t('views.role.member.delete.button')}`" placement="top">
+          <el-tooltip effect="dark" :content="`${$t('views.role.member.delete.button')}`"
+                      placement="top">
             <el-button type="primary" text @click.stop="handleDelete(row)">
               <el-icon>
-                <EditPen />
+                <Delete/>
               </el-icon>
             </el-button>
           </el-tooltip>
@@ -40,6 +43,7 @@ import type { RoleItem, RoleMemberItem } from '@/api/type/role'
 import {MsgSuccess, MsgConfirm} from '@/utils/message'
 import {t} from '@/locales'
 import AddMemberDrawer from './AddMemberDrawer.vue'
+import {RoleTypeEnum} from "@/enums/system.ts";
 
 const props = defineProps<{
   currentRole?: RoleItem
@@ -86,6 +90,7 @@ watch(() => props.currentRole?.id, () => {
 })
 
 const addMemberDrawerRef = ref<InstanceType<typeof AddMemberDrawer>>()
+
 function handleAdd() {
   addMemberDrawerRef.value?.open();
 }
@@ -105,6 +110,7 @@ function handleDelete(row: RoleMemberItem) {
         getList()
       })
     })
-    .catch(() => { })
+    .catch(() => {
+    })
 }
 </script>

ui/src/views/role/index.vue

@@ -5,14 +5,16 @@
       <div class="flex h-full">
         <div class="role-left border-r p-16">
           <div class="p-8 pb-0">
-            <el-input v-model="filterText" :placeholder="$t('common.search')" prefix-icon="Search" clearable />
+            <el-input v-model="filterText" :placeholder="$t('common.search')" prefix-icon="Search"
+                      clearable/>
           </div>
           <div class="list-height-left mt-8">
             <el-scrollbar v-loading="loading">
               <div class="role-left_title color-secondary lighter">
                 <span>{{ $t('views.role.internalRole') }}</span>
               </div>
-              <common-list :data="filterInternalRole" @click="clickRole" :default-active="currentRole?.id">
+              <common-list :data="filterInternalRole" @click="clickRole"
+                           :default-active="currentRole?.id">
                 <template #default="{ row }">
                   <div class="flex-between">
                     <span class="mr-8">{{ row.role_name }}</span>
@@ -46,19 +48,23 @@
               </div>
               <div class="role-left_title">
                 <span class="color-secondary lighter">{{ $t('views.role.customRole') }}</span>
-                <el-tooltip effect="dark" :content="`${$t('common.create')}${$t('views.role.customRole')}`"
+                <el-tooltip effect="dark"
+                            :content="`${$t('common.create')}${$t('views.role.customRole')}`"
                             placement="top">
                   <el-button type="primary" text @click="createOrUpdateRole()">
                     <AppIcon iconName="app-copy"></AppIcon>
                   </el-button>
                 </el-tooltip>
               </div>
-              <common-list :data="filterCustomRole" @click="clickRole" :default-active="currentRole?.id">
+              <common-list :data="filterCustomRole" @click="clickRole"
+                           :default-active="currentRole?.id">
                 <template #default="{ row }">
                   <div class="flex-between">
                     <span>
                       {{ row.role_name }}
-                      <span class="color-input-placeholder ml-4">({{ roleTypeMap[row.type as RoleTypeEnum] }})</span>
+                      <span class="color-input-placeholder ml-4">({{
+                          roleTypeMap[row.type as RoleTypeEnum]
+                        }})</span>
                     </span>
                     <el-dropdown :teleported="false">
                       <el-button text>
@@ -95,19 +101,23 @@
             <div class="flex align-center">
               <span>
                 {{ currentRole?.role_name }}
-                <span v-if="currentRole?.type && !currentRole.internal" class="color-input-placeholder ml-4">({{
+                <span v-if="currentRole?.type && !currentRole.internal"
+                      class="color-input-placeholder ml-4">({{
                     roleTypeMap[currentRole?.type as
-                  RoleTypeEnum] }})
+                      RoleTypeEnum]
+                  }})
                 </span>
               </span>
               <el-divider direction="vertical" class="mr-8 ml-8"/>
-              <AppIcon iconName="app-wordspace" style="font-size: 16px" class="color-input-placeholder"></AppIcon>
+              <AppIcon iconName="app-wordspace" style="font-size: 16px"
+                       class="color-input-placeholder"></AppIcon>
               <span class="color-input-placeholder ml-4">
-                数字
+                {{ currentRole?.user_count }}
               </span>
             </div>
             <el-radio-group v-model="currentTab">
-              <el-radio-button v-for="item in tabList" :key="item.value" :label="item.label" :value="item.value" />
+              <el-radio-button v-for="item in tabList" :key="item.value" :label="item.label"
+                               :value="item.value"/>
             </el-radio-group>
           </div>
           <PermissionConfiguration v-if="currentTab === 'permission'" :currentRole="currentRole"/>
@@ -182,6 +192,7 @@ function clickRole(item: RoleItem) {
 }
 
 const createOrUpdateRoleDialogRef = ref<InstanceType<typeof CreateOrUpdateRoleDialog>>()
+
 function createOrUpdateRole(item?: RoleItem) {
   createOrUpdateRoleDialogRef.value?.open(item);
 }
@@ -202,7 +213,8 @@ function deleteRole(item: RoleItem) {
         currentRole.value = item.id === currentRole.value?.id ? internalRoleList.value[0] : currentRole.value
       })
     })
-    .catch(() => { })
+    .catch(() => {
+    })
 }
 
 

ui/src/views/workspace/index.vue

@@ -6,18 +6,22 @@
         <div class="workspace-left border-r p-16">
           <div class="workspace-left_title">
             <h4 class="medium">{{ $t('views.workspace.list') }}</h4>
-            <el-tooltip effect="dark" :content="`${$t('common.create')}${$t('views.workspace.title')}`" placement="top">
+            <el-tooltip effect="dark"
+                        :content="`${$t('common.create')}${$t('views.workspace.title')}`"
+                        placement="top">
               <el-button type="primary" text @click="createOrUpdateWorkspace()">
                 <AppIcon iconName="app-copy"></AppIcon>
               </el-button>
             </el-tooltip>
           </div>
           <div class="p-8">
-            <el-input v-model="filterText" :placeholder="$t('common.search')" prefix-icon="Search" clearable />
+            <el-input v-model="filterText" :placeholder="$t('common.search')" prefix-icon="Search"
+                      clearable/>
           </div>
           <div class="list-height-left">
             <el-scrollbar v-loading="loading">
-              <common-list :data="filterList" @click="clickWorkspace" :default-active="currentWorkspace?.id">
+              <common-list :data="filterList" @click="clickWorkspace"
+                           :default-active="currentWorkspace?.id">
                 <template #default="{ row }">
                   <div class="flex-between">
                     <span>{{ row.name }}</span>
@@ -32,7 +36,8 @@
                           <el-dropdown-item @click.stop="createOrUpdateWorkspace(row)" class="p-8">
                             <AppIcon iconName="app-copy"></AppIcon>
                             {{
-                              $t('common.rename') }}
+                              $t('common.rename')
+                            }}
                           </el-dropdown-item>
                           <el-dropdown-item @click.stop="deleteWorkspace(row)" class="border-t p-8">
                             <AppIcon iconName="app-copy"></AppIcon>
@@ -58,9 +63,10 @@
           <div class="flex align-center" style="margin-bottom: 20px;">
             <h4 class="medium">{{ currentWorkspace?.name }}</h4>
             <el-divider direction="vertical" class="mr-8 ml-8"/>
-            <AppIcon iconName="app-wordspace" style="font-size: 16px" class="color-input-placeholder"></AppIcon>
+            <AppIcon iconName="app-wordspace" style="font-size: 16px"
+                     class="color-input-placeholder"></AppIcon>
             <span class="color-input-placeholder ml-4">
-              数字
+              {{ currentWorkspace?.user_count }}
             </span>
           </div>
           <Member :currentWorkspace="currentWorkspace"/>
@@ -126,6 +132,7 @@ function clickWorkspace(item: WorkspaceItem) {
 }
 
 const createOrUpdateWorkspaceDialogRef = ref<InstanceType<typeof CreateOrUpdateWorkspaceDialog>>()
+
 function createOrUpdateWorkspace(item?: WorkspaceItem) {
   createOrUpdateWorkspaceDialogRef.value?.open(item);
 }
@@ -147,7 +154,8 @@ function deleteWorkspace(item: WorkspaceItem) {
         currentWorkspace.value = item.id === currentWorkspace.value?.id ? list.value[0] : currentWorkspace.value
       })
     })
-    .catch(() => { })
+    .catch(() => {
+    })
 }
 </script>