diff --git a/packages/frontend/src/locales/en-US.json b/packages/frontend/src/locales/en-US.json index 075ae0a..5e4fcd5 100644 --- a/packages/frontend/src/locales/en-US.json +++ b/packages/frontend/src/locales/en-US.json @@ -1085,7 +1085,9 @@ "filterTags": { "all": "All Tags" }, - "noConnectionsWithTag": "No connections found with this tag" + "noConnectionsWithTag": "No connections found with this tag", + "noConnectionsMatchSearch": "No connections match your search.", + "searchConnectionsPlaceholder": "Search connections..." }, "terminalTabBar": { "selectServerTitle": "Select server to connect" diff --git a/packages/frontend/src/locales/ja-JP.json b/packages/frontend/src/locales/ja-JP.json index c7d9eb1..85acee1 100644 --- a/packages/frontend/src/locales/ja-JP.json +++ b/packages/frontend/src/locales/ja-JP.json @@ -199,6 +199,8 @@ "all": "すべてのタグ" }, "noConnectionsWithTag": "このタグには接続記録がありません", + "noConnectionsMatchSearch": "検索条件に一致する接続はありません。", + "searchConnectionsPlaceholder": "接続を検索...", "viewAllConnections": "すべての接続を表示", "viewFullAuditLog": "完全な監査ログを表示" }, diff --git a/packages/frontend/src/locales/zh-CN.json b/packages/frontend/src/locales/zh-CN.json index a68ddf2..7d506a9 100644 --- a/packages/frontend/src/locales/zh-CN.json +++ b/packages/frontend/src/locales/zh-CN.json @@ -1088,7 +1088,9 @@ "filterTags": { "all": "所有标签" }, - "noConnectionsWithTag": "该标签下没有连接记录" + "noConnectionsWithTag": "该标签下没有连接记录", + "noConnectionsMatchSearch": "没有连接匹配搜索条件", + "searchConnectionsPlaceholder": "搜索连接..." }, "terminalTabBar": { "selectServerTitle": "选择要连接的服务器" diff --git a/packages/frontend/src/views/DashboardView.vue b/packages/frontend/src/views/DashboardView.vue index f0d293e..c4e94d4 100644 --- a/packages/frontend/src/views/DashboardView.vue +++ b/packages/frontend/src/views/DashboardView.vue @@ -43,9 +43,10 @@ const getInitialSelectedTagId = (): number | null => { return storedValue && storedValue !== 'null' ? parseInt(storedValue, 10) : null; }; const selectedTagId = ref(getInitialSelectedTagId()); - +const searchQuery = ref(''); // +++ 新增搜索查询状态 +++ + const maxRecentLogs = 5; - + const sortOptions: { value: SortField; labelKey: string }[] = [ { value: 'last_connected_at', labelKey: 'dashboard.sortOptions.lastConnected' }, { value: 'name', labelKey: 'dashboard.sortOptions.name' }, @@ -60,14 +61,27 @@ const filteredAndSortedConnections = computed(() => { const sortOrderVal = localSortOrder.value; const factor = sortOrderVal === 'desc' ? -1 : 1; const filterTagId = selectedTagId.value; - + const query = searchQuery.value.toLowerCase().trim(); // +++ 获取搜索查询 +++ + // 1. Filter by selected tag - const filtered = filterTagId === null + let filteredByTag = filterTagId === null ? [...connections.value] // No tag selected, show all : connections.value.filter(conn => conn.tag_ids?.includes(filterTagId)); - - // 2. Sort the filtered connections - return filtered.sort((a, b) => { + + // 2. Filter by search query + let searchedConnections = filteredByTag; + if (query) { + searchedConnections = filteredByTag.filter(conn => { + const nameMatch = conn.name?.toLowerCase().includes(query); + const usernameMatch = conn.username?.toLowerCase().includes(query); + const hostMatch = conn.host?.toLowerCase().includes(query); + const portMatch = conn.port?.toString().includes(query); + return nameMatch || usernameMatch || hostMatch || portMatch; + }); + } + + // 3. Sort the searched connections + return searchedConnections.sort((a, b) => { let valA: any; let valB: any; @@ -247,9 +261,17 @@ const getTagNames = (tagIds: number[] | undefined): string[] => {
-
-

{{ t('dashboard.connectionList', '连接列表') }} ({{ filteredAndSortedConnections.length }})

-
+
+

{{ t('dashboard.connectionList', '连接列表') }} ({{ filteredAndSortedConnections.length }})

+
+ + +