fix: layout

Author: wangdan-fit2cloud

ui/src/api/API_README.md

@@ -69,6 +69,12 @@ src/api/
   `import WorkspaceApi from '@/api/admin/system/workspace'`；System 登录设置使用
   `import AuthSettingApi from '@/api/admin/system/settings/auth-setting'`。
 
+### 当前账号密码
+
+`admin/auth/current-user.ts` 的 `postCurrentUserPassword` 向 `/user/current/reset_password`
+提交 RSA 加密的 `{ encryptedData }`。头像菜单的 `layout/avatar-dropdown/ChangePasswordDialog.vue`
+负责新密码与确认密码校验、加密和提交，成功后清除本地登录凭据并跳转登录页。
+
 ### 四类特殊资源 API
 
 `application`、`knowledge`、`model`、`tool` 是需要同时考虑 Workspace、System 资源管理和

ui/src/api/admin/auth/current-user.ts

@@ -1,7 +1,8 @@
 /** 提供 Admin 登录后的当前用户接口。 */
 
-import { get } from '../core/request'
+import { get, post } from '../core/request'
 import type { ListItem } from '@/api/types'
+import type { PasswordRequest } from '../core/types'
 import type { CurrentUserInfo } from './types'
 
 /** 获取当前登录用户、权限、语言及可用工作空间。 */
@@ -19,4 +20,9 @@ const getCurrentUserRoleList = () => {
   return get<ListItem[]>('/role_list/current_user')
 }
 
-export default { getCurrentUserInfo, getCurrentUserRoleList, getCurrentUserWorkspaceList }
+/** 修改当前登录用户的密码，成功后当前登录凭据失效。 */
+const postCurrentUserPassword = (password: PasswordRequest) => {
+  return post<PasswordRequest, boolean>('/user/current/reset_password', password)
+}
+
+export default { postCurrentUserPassword, getCurrentUserInfo, getCurrentUserRoleList, getCurrentUserWorkspaceList }

ui/src/api/admin/auth/login.ts

@@ -23,4 +23,6 @@ const getCaptcha = (username?: string) => {
   return get<CaptchaResponse>('/user/captcha', { username })
 }
 
+
+
 export default { getCaptcha, postLdapLogin, postLogin, postLogout }

ui/src/api/admin/auth/types.ts

@@ -1,6 +1,6 @@
 /** Admin 认证 API 及其 Store 消费方共同使用的类型。 */
 
-import type { LoginMethod, QrCodeConfig, ListItem } from '@/api/types'
+import type { LoginMethod, QrCodeConfig, WorkspaceItem } from '@/api/types'
 
 export interface CurrentUserInfo {
   email: string
@@ -14,7 +14,7 @@ export interface CurrentUserInfo {
   role_name?: string[]
   source?: string
   username: string
-  workspace_list?: ListItem[]
+  workspace_list?: WorkspaceItem[]
 }
 
 export interface LoginRequest {

ui/src/api/types/system-workspace.ts

@@ -3,6 +3,8 @@ export interface WorkspaceItem {
   name: string
   id?: string
   user_count?: number
+  /** 当前用户在工作空间中的角色名称；普通工作空间列表可能不返回。 */
+  role_name?: string[]
 }
 
 export interface CreateWorkspaceMemberPayload {

ui/src/assets/iconfont.js

@@ -5,7 +5,14 @@ import MkFilterableDropdown from '@/components/mk-filterable-dropdown/index.vue'
 
 defineOptions({ name: 'WorkspaceDropdown' })
 
-const props = defineProps<{ options: WorkspaceItem[] }>()
+const props = withDefaults(
+  defineProps<{
+    options: WorkspaceItem[]
+    /** 是否显示工作空间角色标签 */
+    showRoleTags?: boolean
+  }>(),
+  { showRoleTags: false },
+)
 const selectedWorkspaceId = defineModel<string>({ required: true })
 const emit = defineEmits<{ select: [option: WorkspaceItem] }>()
 </script>
@@ -18,6 +25,7 @@ const emit = defineEmits<{ select: [option: WorkspaceItem] }>()
     @select="emit('select', $event)"
   >
     <template #default="{ text }">
+      <!-- 切换工作空间 -->
       <el-button text class="flex max-w-50 items-center gap-1 rounded-md px-2! py-[7px]! text-N900!">
         <MkIcon name="icon_moments-categories_outlined" class="mr-1" />
         <span class="min-w-0 flex-1 truncate" :title="text">{{ text }}</span>
@@ -26,10 +34,13 @@ const emit = defineEmits<{ select: [option: WorkspaceItem] }>()
     </template>
 
     <template #option="{ option }">
-      <div class="flex items-center gap-2">
-        <MkIcon name="icon_moments-categories_outlined" />
-        <span class="min-w-0 flex-1 truncate" :title="option.name">{{ option.name }}</span>
+      <div class="flex min-w-0 flex-1 items-center gap-2">
+        <MkIcon name="icon_moments-categories_outlined" class="shrink-0" />
+        <span class="min-w-0 truncate" :title="option.name">{{ option.name }}</span>
+        <MkTagGroup v-if="props.showRoleTags && option.role_name?.length" :tags="option.role_name" size="small" class="min-w-0 shrink-0" />
       </div>
     </template>
   </MkFilterableDropdown>
 </template>
+
+<style scoped lang="scss"></style>

ui/src/components/COMPONENT_README.md

@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { TagProps } from 'element-plus'
+
 defineOptions({ name: 'MkTagGroup' })
 
 withDefaults(
@@ -7,14 +9,18 @@ withDefaults(
     popoverDisabled?: boolean
     /** 标签文字 */
     tags?: string[]
+    /** 标签尺寸 */
+    size?: TagProps['size']
+    /** 首个标签的类型 */
+    type?: TagProps['type']
   }>(),
-  { popoverDisabled: false, tags: () => [] },
+  { popoverDisabled: false, tags: () => [], type: 'info' },
 )
 </script>
 
 <template>
   <span class="inline-flex items-center gap-1">
-    <el-tag type="info" :title="tags?.[0]">
+    <el-tag :type="type" :size="size" :title="tags?.[0]" :disable-transitions="true">
       {{ tags?.[0] }}
     </el-tag>
 
@@ -24,13 +30,14 @@ withDefaults(
       popper-class="mk-tag-group__popper"
       trigger="hover"
       :popper-style="{ maxWidth: '250px', width: 'auto' }"
+      :show-after="200"
       v-if="tags?.length > 1"
     >
       <template #reference>
-        <el-tag type="info" class="cursor-pointer">+{{ tags.length - 1 }}</el-tag>
+        <el-tag type="info" :size="size" class="cursor-pointer" :disable-transitions="true">+{{ tags.length - 1 }}</el-tag>
       </template>
       <div class="flex-wrap gap-2 px-4 py-3">
-        <el-tag v-for="tag in tags.slice(1)" :key="tag" type="info" :title="tag">
+        <el-tag v-for="tag in tags.slice(1)" :key="tag" type="info" :size="size" :title="tag" :disable-transitions="true">
           {{ tag }}
         </el-tag>
       </div>

ui/src/components/business/workspace-dropdown/index.vue

@@ -68,12 +68,12 @@ function handleItemClick(option: TOption) {
     <slot :selected-option="selectedOption" :text="selectedText" />
 
     <template #dropdown>
-      <div class="w-70 overflow-hidden rounded-md">
+      <div class="min-w-70 max-w-80 overflow-hidden rounded-md">
         <div class="p-2 pb-1" @click.stop @keydown.stop>
           <MkSearchInput v-model="searchKeyword" />
         </div>
 
-        <el-scrollbar max-height="200px">
+        <el-scrollbar max-height="220px">
           <div class="px-1">
             <MkDropdownMenu>
               <MkDropdownItem