From 4aef0f9d2164e36d513ceae270d87f3f6f6924b1 Mon Sep 17 00:00:00 2001
From: teukkk <mengyuan.lv@fit2cloud.com>
Date: Mon, 7 Jul 2025 19:10:55 +0800
Subject: [PATCH] fix: workspaceDropdownSearch

---
 ui/src/components/tag-group/index.vue         |  4 +-
 .../components/workspace-dropdown/index.vue   | 48 ++++++++++++-------
 .../mobile/component/ChatHistoryDrawer.vue    |  2 +-
 ui/src/views/system/user-manage/index.vue     | 13 +++--
 .../workspace/component/AddMemberDrawer.vue   |  2 +-
 .../CreateOrUpdateWorkspaceDialog.vue         |  2 +-
 ui/src/views/tool/ToolFormDrawer.vue          |  2 +-
 7 files changed, 45 insertions(+), 28 deletions(-)

diff --git a/ui/src/components/tag-group/index.vue b/ui/src/components/tag-group/index.vue
index ef078b91..8873d87d 100644
--- a/ui/src/components/tag-group/index.vue
+++ b/ui/src/components/tag-group/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="tag-group" v-if="props.tags.length">
-    <el-tag :size="props.size" class="default-tag" style="max-width: 100%">
-      <span class="ellipsis" style="max-width: 100%">{{ props.tags[0] }}</span>
+    <el-tag :size="props.size" class="default-tag">
+      <span class="ellipsis">{{ props.tags[0] }}</span>
     </el-tag>
     <el-tooltip effect="light" :disabled="tooltipDisabled">
       <el-tag :size="props.size" class="info-tag ml-4 cursor" v-if="props.tags?.length > 1">
diff --git a/ui/src/components/workspace-dropdown/index.vue b/ui/src/components/workspace-dropdown/index.vue
index d04a9f23..90d740e7 100644
--- a/ui/src/components/workspace-dropdown/index.vue
+++ b/ui/src/components/workspace-dropdown/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-dropdown placement="bottom-start" class="workspace-dropdown">
+  <el-dropdown placement="bottom-start" class="workspace-dropdown" popper-class="workspace-dropdown-popper">
     <el-button text style="font-size: 14px" class="workspace-dropdown__button">
       <AppIcon iconName="app-workspace" style="font-size: 18px"></AppIcon>
       <span class="ellipsis" style="max-width: 155px">
@@ -10,22 +10,19 @@
       </el-icon>
     </el-button>
     <template #dropdown>
+      <div class="w-full p-8" style="box-sizing: border-box">
+        <el-input v-model="filterText" :placeholder="$t('common.search')" prefix-icon="Search" clearable />
+      </div>
       <el-dropdown-menu v-loading="loading">
-        <el-dropdown-item
-          v-for="item in data"
-          :key="item.id"
-          :class="item.id === currentWorkspace?.id ? 'active' : ''"
-          @click="changeWorkspace(item)"
-        >
-          <AppIcon class="mr-8" iconName="app-workspace" style="font-size: 16px"></AppIcon>
-          <span class="ellipsis" style="max-width: 230px">
-            {{ item.name }}
-          </span>
-          <el-icon
-            v-show="item.id === currentWorkspace?.id"
-            class="ml-8"
-            style="font-size: 16px; margin-right: 0"
-          >
+        <el-dropdown-item v-for="item in filterData" :key="item.id"
+          :class="`${item.id === currentWorkspace?.id ? 'active' : ''} flex-between`" @click="changeWorkspace(item)">
+          <div class="flex align-center">
+            <AppIcon class="mr-8" iconName="app-workspace" style="font-size: 16px"></AppIcon>
+            <span class="ellipsis">
+              {{ item.name }}
+            </span>
+          </div>
+          <el-icon v-show="item.id === currentWorkspace?.id" class="ml-8" style="font-size: 16px; margin-right: 0">
             <Check />
           </el-icon>
         </el-dropdown-item>
@@ -35,7 +32,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref } from 'vue'
+import { watch, ref } from 'vue'
 import type { WorkspaceItem } from '@/api/type/workspace'
 import useStore from '@/stores'
 const props = defineProps({
@@ -56,6 +53,18 @@ function changeWorkspace(item: WorkspaceItem) {
   folder.setCurrentFolder({})
   emit('changeWorkspace', item)
 }
+
+const filterText = ref('')
+const filterData = ref<any[]>([])
+
+watch([() => props.data, () => filterText.value], () => {
+  if (!filterText.value.length) {
+    filterData.value = props.data
+  }
+  filterData.value = props.data.filter((v: any) =>
+    v.name.toLowerCase().includes(filterText.value.toLowerCase()),
+  )
+}, { immediate: true })
 </script>
 <style lang="scss" scoped>
 .workspace-dropdown {
@@ -66,3 +75,8 @@ function changeWorkspace(item: WorkspaceItem) {
   }
 }
 </style>
+<style lang="scss">
+.workspace-dropdown-popper {
+  width: 280px;
+}
+</style>
diff --git a/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue b/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue
index 2b189e8b..8e6e612f 100644
--- a/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue
+++ b/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue
@@ -26,7 +26,7 @@
               @mouseenter="mouseenter" @mouseleave="mouseId = ''">
               <template #default="{ row }">
                 <div class="flex-between">
-                  <ReadWrite @change="val => updateChatName(val, row)" :data="row.abstract" trigger="manual"
+                  <ReadWrite @change="(val: string) => updateChatName(val, row)" :data="row.abstract" trigger="manual"
                     :write="row.writeStatus" @close="() => (row.writeStatus = false)" :maxlength="1024" />
                   <div @click.stop v-if="mouseId === row.id && row.id !== 'new' && !row.writeStatus" class="flex">
                     <el-button style="padding: 0" link @click.stop="() => (row.writeStatus = true)">
diff --git a/ui/src/views/system/user-manage/index.vue b/ui/src/views/system/user-manage/index.vue
index 1a638a24..3ddbc663 100644
--- a/ui/src/views/system/user-manage/index.vue
+++ b/ui/src/views/system/user-manage/index.vue
@@ -57,9 +57,11 @@
         <el-table-column
           prop="nick_name"
           :label="$t('views.userManage.userForm.nick_name.label')"
+          min-width="180" 
+          show-overflow-tooltip
         />
-        <el-table-column prop="username" :label="$t('views.login.loginForm.username.label')" />
-        <el-table-column prop="is_active" :label="$t('common.status.label')">
+        <el-table-column prop="username" min-width="180" show-overflow-tooltip :label="$t('views.login.loginForm.username.label')" />
+        <el-table-column width="100" prop="is_active" :label="$t('common.status.label')">
           <template #default="{ row }">
             <div v-if="row.is_active" class="flex align-center">
               <el-icon class="color-success mr-8" style="font-size: 16px">
@@ -82,12 +84,13 @@
           prop="email"
           :label="$t('views.login.loginForm.email.label')"
           show-overflow-tooltip
+          min-width="180"
         >
           <template #default="{ row }">
             {{ row.email || '-' }}
           </template>
         </el-table-column>
-        <el-table-column prop="phone" :label="$t('views.userManage.userForm.phone.label')">
+        <el-table-column prop="phone" width="120" :label="$t('views.userManage.userForm.phone.label')">
           <template #default="{ row }">
             {{ row.phone || '-' }}
           </template>
@@ -95,7 +98,7 @@
         <el-table-column
           prop="role_name"
           :label="$t('views.role.member.role')"
-          min-width="100"
+          width="210"
           v-if="user.isEE() || user.isPE()"
         >
           <template #default="{ row }">
@@ -119,7 +122,7 @@
             </el-popover>
           </template>
         </el-table-column>
-        <el-table-column prop="source" :label="$t('views.userManage.source.label')">
+        <el-table-column prop="source" width="100" :label="$t('views.userManage.source.label')">
           <template #default="{ row }">
             {{
               row.source === 'LOCAL'
diff --git a/ui/src/views/system/workspace/component/AddMemberDrawer.vue b/ui/src/views/system/workspace/component/AddMemberDrawer.vue
index efd426ce..32891f7b 100644
--- a/ui/src/views/system/workspace/component/AddMemberDrawer.vue
+++ b/ui/src/views/system/workspace/component/AddMemberDrawer.vue
@@ -5,7 +5,7 @@
     </template>
     <template #default>
       <MemberFormContent ref="memberFormContentRef" :models="formItemModel" v-model:form="list"
-        v-loading="memberFormContentLoading" />
+        v-loading="memberFormContentLoading" keepOneLine />
     </template>
     <template #footer>
       <div style="flex: auto">
diff --git a/ui/src/views/system/workspace/component/CreateOrUpdateWorkspaceDialog.vue b/ui/src/views/system/workspace/component/CreateOrUpdateWorkspaceDialog.vue
index c1836445..0ff02995 100644
--- a/ui/src/views/system/workspace/component/CreateOrUpdateWorkspaceDialog.vue
+++ b/ui/src/views/system/workspace/component/CreateOrUpdateWorkspaceDialog.vue
@@ -3,7 +3,7 @@
     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" @submit.prevent>
       <el-form-item :label="$t('views.workspace.name')" prop="name">
-        <el-input v-model="form.name" maxlength="64"
+        <el-input v-model="form.name" maxlength="64" show-word-limit
           :placeholder="`${$t('common.inputPlaceholder')}${$t('views.workspace.name')}`" />
       </el-form-item>
     </el-form>
diff --git a/ui/src/views/tool/ToolFormDrawer.vue b/ui/src/views/tool/ToolFormDrawer.vue
index bb02a801..fa0bb897 100644
--- a/ui/src/views/tool/ToolFormDrawer.vue
+++ b/ui/src/views/tool/ToolFormDrawer.vue
@@ -49,7 +49,7 @@
                 </el-icon>
               </el-Avatar>
             </div>
-            <el-avatar v-else class="avatar-green" shape="square" :size="32">
+            <el-avatar v-else class="avatar-green  mr-12" shape="square" :size="32">
               <img src="@/assets/node/icon_tool.svg" style="width: 58%" alt="" />
             </el-avatar>
             <el-input