fix: 增强知识图谱加载逻辑和错误处理

- 在 `KnowledgeGraphSection.vue` 中，更新 `loadGraph` 和 `scheduleGraphLoad` 函数，增加条件检查和日志输出，以确保图谱加载的稳定性。
- 在 `KnowledgeGraphViewer.vue` 中，优化数据库加载逻辑，确保在没有选中数据库时提供适当的警告信息，并添加日志以跟踪加载过程。
- 重置图谱统计信息以适应新的数据库选择逻辑，确保用户体验的一致性。

Author: xerrors

web/src/components/KnowledgeGraphSection.vue

@@ -133,9 +133,24 @@ const isGraphSupported = computed(() => {
 
 let pendingLoadTimer = null;
 
-const loadGraph = () => {
+const loadGraph = async () => {
+  console.log('loadGraph 调用:', {
+    hasRef: !!graphViewerRef.value,
+    hasLoadFullGraph: graphViewerRef.value && typeof graphViewerRef.value.loadFullGraph === 'function'
+  });
+
+  // 等待一小段时间确保子组件已经完全初始化
+  await nextTick();
+
   if (graphViewerRef.value && typeof graphViewerRef.value.loadFullGraph === 'function') {
+    console.log('调用 loadFullGraph');
     graphViewerRef.value.loadFullGraph();
+  } else {
+    console.warn('无法调用 loadFullGraph:', {
+      hasRef: !!graphViewerRef.value,
+      refValue: graphViewerRef.value,
+      hasMethod: graphViewerRef.value && typeof graphViewerRef.value.loadFullGraph
+    });
   }
 };
 
@@ -197,16 +212,45 @@ const applySettings = () => {
 // };
 
 const scheduleGraphLoad = (delay = 200) => {
-  if (!props.active || !isGraphSupported.value) {
+  console.log('scheduleGraphLoad 调用:', {
+    active: props.active,
+    supported: isGraphSupported.value,
+    databaseId: databaseId.value,
+    hasGraphViewer: !!graphViewerRef.value
+  });
+
+  // 确保组件激活且数据库支持图谱功能
+  if (!props.active) {
+    console.log('组件未激活，跳过图谱加载');
+    return;
+  }
+
+  if (!isGraphSupported.value) {
+    console.log('数据库不支持图谱功能，跳过加载');
+    return;
+  }
+
+  if (!databaseId.value) {
+    console.log('没有选中数据库，跳过图谱加载');
     return;
   }
+
   if (pendingLoadTimer) {
     clearTimeout(pendingLoadTimer);
   }
-  pendingLoadTimer = setTimeout(() => {
-    nextTick(() => {
-      loadGraph();
-    });
+  pendingLoadTimer = setTimeout(async () => {
+    await nextTick();
+    // 再次检查条件，防止在延迟期间状态发生变化
+    if (props.active && isGraphSupported.value && databaseId.value) {
+      console.log('执行图谱加载');
+      await loadGraph();
+    } else {
+      console.log('延迟检查时条件不满足:', {
+        active: props.active,
+        supported: isGraphSupported.value,
+        databaseId: databaseId.value
+      });
+    }
   }, delay);
 };
 
@@ -235,13 +279,31 @@ watch(
 );
 
 watch(databaseId, () => {
-  store.graphStats = defaultGraphStats();
-  scheduleGraphLoad(300);
+  // 重置统计信息
+  store.graphStats = {
+    total_nodes: 0,
+    total_edges: 0,
+    displayed_nodes: 0,
+    displayed_edges: 0,
+    is_truncated: false
+  };
+  clearGraph();
+
+  // 只有在新数据库支持图谱时才加载
+  if (isGraphSupported.value) {
+    scheduleGraphLoad(300);
+  }
 });
 
 watch(isGraphSupported, (supported) => {
   if (!supported) {
-    store.graphStats = defaultGraphStats();
+    store.graphStats = {
+      total_nodes: 0,
+      total_edges: 0,
+      displayed_nodes: 0,
+      displayed_edges: 0,
+      is_truncated: false
+    };
     clearGraph();
     return;
   }

web/src/components/KnowledgeGraphViewer.vue

@@ -357,24 +357,18 @@ const getEdgeDisplayName = (edge) => {
 
 // 加载可用数据库
 const loadAvailableDatabases = async () => {
-  // 如果隐藏数据库选择器且有初始数据库ID，直接使用
-  if (props.hideDbSelector && props.initialDatabaseId) {
-    selectedDatabase.value = props.initialDatabaseId
-    await loadGraphLabels(selectedDatabase.value)
-    return
-  }
-
   loadingDatabases.value = true
   try {
     const response = await lightragApi.getDatabases()
     if (response.success) {
       availableDatabases.value = response.data.databases || []
 
-      // 如果有初始数据库 ID，优先选择它
-      if (props.initialDatabaseId && availableDatabases.value.some(db => db.db_id === props.initialDatabaseId)) {
+      // 如果有初始数据库 ID，直接使用它（上层已经检查过类型）
+      if (props.initialDatabaseId) {
         selectedDatabase.value = props.initialDatabaseId
         await onDatabaseChange(selectedDatabase.value)
       } else if (availableDatabases.value.length > 0 && !selectedDatabase.value) {
+        // 没有初始数据库ID，选择第一个可用的数据库
         selectedDatabase.value = availableDatabases.value[0].db_id
         await onDatabaseChange(selectedDatabase.value)
       }
@@ -418,7 +412,7 @@ const onDatabaseChange = async (dbId) => {
   // 加载新数据库的标签
   await loadGraphLabels(dbId)
 
-  message.info(`已切换到数据库: ${availableDatabases.value.find(db => db.db_id === dbId)?.name || dbId}`)
+  // message.info(`已切换到数据库: ${availableDatabases.value.find(db => db.db_id === dbId)?.name || dbId}`)
 }
 
 // Sigma.js配置
@@ -673,7 +667,7 @@ const registerEvents = () => {
 // 加载图数据
 const loadGraphData = async () => {
   if (!selectedDatabase.value) {
-    message.warning('请先选择数据库')
+    console.warn('尝试加载图数据但没有选中数据库')
     return
   }
 
@@ -751,6 +745,25 @@ const loadGraphData = async () => {
 
 // 加载完整图数据
 const loadFullGraph = async () => {
+  console.log('loadFullGraph 调用:', {
+    selectedDatabase: selectedDatabase.value,
+    availableDatabases: availableDatabases.value.length,
+    initialDatabaseId: props.initialDatabaseId
+  });
+
+  // 如果还没有选中数据库，等待数据库加载完成
+  if (!selectedDatabase.value && props.initialDatabaseId) {
+    console.log('等待数据库加载完成...');
+    // 等待一小段时间让异步操作完成
+    await new Promise(resolve => setTimeout(resolve, 100));
+  }
+
+  // 再次检查是否有选中的数据库
+  if (!selectedDatabase.value) {
+    console.warn('loadFullGraph: 没有选中的数据库，无法加载图谱')
+    return
+  }
+
   selectedLabel.value = '*'
   await loadGraphData()
   emit('refresh-graph')
@@ -852,7 +865,7 @@ const applyLayout = async (graph) => {
 // 展开节点
 const expandNode = async (nodeId) => {
   if (!selectedDatabase.value) {
-    message.warning('请先选择数据库')
+    console.warn('尝试展开节点但没有选中数据库')
     return
   }