From b924e4bd417a87f5e2a415172daf07ffa88034a2 Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Sat, 25 Oct 2025 21:45:13 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=B5=81=E7=A8=8B=E7=BC=96?=
 =?UTF-8?q?=E6=8E=92=E9=A1=B5=E9=9D=A2=E4=BE=A7=E8=BE=B9=E6=A0=8F=E4=B8=8D?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E8=8A=82=E7=82=B9=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../flows/components/Sidebar/NodePalette.vue  | 35 ++++++++++++++++---
 1 file changed, 30 insertions(+), 5 deletions(-)

diff --git a/apps/jingrow/frontend/src/core/features/flows/components/Sidebar/NodePalette.vue b/apps/jingrow/frontend/src/core/features/flows/components/Sidebar/NodePalette.vue
index f303fa8..e23783c 100644
--- a/apps/jingrow/frontend/src/core/features/flows/components/Sidebar/NodePalette.vue
+++ b/apps/jingrow/frontend/src/core/features/flows/components/Sidebar/NodePalette.vue
@@ -1,7 +1,7 @@
 <script setup>
-import { ref, computed, watch, nextTick } from 'vue';
+import { ref, computed, watch, nextTick, onMounted } from 'vue';
 import { useFlowStore } from '../../store/flowStore';
-import { NODE_GROUPS, getAllNodeTypes } from '../../utils/nodeMetadata';
+import { NODE_GROUPS, getAllNodeTypes, preloadNodeMetadata } from '../../utils/nodeMetadata';
 import { t } from '@/shared/i18n'
 
 // Props
@@ -9,7 +9,7 @@ const props = defineProps({
   class: { type: String, default: '' }
 })
 
-const ALL_NODE_TYPES = getAllNodeTypes();
+const ALL_NODE_TYPES = ref([]);
 const flowStore = useFlowStore();
 const draggedNode = ref(null);
 const searchText = ref('');
@@ -20,6 +20,12 @@ const tooltip = ref({ show: false, text: '', x: 0, y: 0, width: 200, direction:
 const isFullscreen = ref(false);
 let tooltipTimer = null;
 
+// 异步加载节点元数据
+onMounted(async () => {
+  await preloadNodeMetadata();
+  ALL_NODE_TYPES.value = getAllNodeTypes();
+});
+
 if (typeof window !== 'undefined') {
   window.addEventListener('recent-node-updated', () => { recent.value = JSON.parse(localStorage.getItem('ai-agent-node-recent') || '[]'); });
   window.addEventListener('fullscreenchange', () => { isFullscreen.value = !!(document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement || document.msFullscreenElement); });
@@ -50,9 +56,28 @@ function addRecent(type) { recent.value = [type, ...recent.value.filter(t => t !
 
 const nodeTypeCount = computed(() => { const counts = {}; flowStore.nodes.forEach(node => { counts[node.type] = (counts[node.type] || 0) + 1; }); return counts; });
 
-const allNodeTypes = computed(() => { let list = ALL_NODE_TYPES; if (searchText.value.trim()) { const kw = searchText.value.trim().toLowerCase(); list = list.filter(n => n.label.toLowerCase().includes(kw) || n.type.toLowerCase().includes(kw)); } return list; });
+const allNodeTypes = computed(() => { 
+  let list = ALL_NODE_TYPES.value; 
+  if (searchText.value.trim()) { 
+    const kw = searchText.value.trim().toLowerCase(); 
+    list = list.filter(n => n.label.toLowerCase().includes(kw) || n.type.toLowerCase().includes(kw)); 
+  } 
+  return list; 
+});
 
-const filteredNodeTypes = computed(() => { let list = ALL_NODE_TYPES; if (searchText.value.trim()) { const kw = searchText.value.trim().toLowerCase(); list = list.filter(n => n.label.toLowerCase().includes(kw) || n.type.toLowerCase().includes(kw)); } if (activeTab.value === 'favorite') { list = list.filter(n => favorites.value.includes(n.type)); } else if (activeTab.value === 'recent') { list = recent.value.map(type => list.find(n => n.type === type)).filter(Boolean); } return list; });
+const filteredNodeTypes = computed(() => { 
+  let list = ALL_NODE_TYPES.value; 
+  if (searchText.value.trim()) { 
+    const kw = searchText.value.trim().toLowerCase(); 
+    list = list.filter(n => n.label.toLowerCase().includes(kw) || n.type.toLowerCase().includes(kw)); 
+  } 
+  if (activeTab.value === 'favorite') { 
+    list = list.filter(n => favorites.value.includes(n.type)); 
+  } else if (activeTab.value === 'recent') { 
+    list = recent.value.map(type => list.find(n => n.type === type)).filter(Boolean); 
+  } 
+  return list; 
+});
 
 const groupedNodeTypes = computed(() => {
   const groups = [];