From c4beda2ef106276627af1f2352bec1d755095da5 Mon Sep 17 00:00:00 2001
From: Wenjie Zhang <xerrors@163.com>
Date: Thu, 5 Mar 2026 02:29:01 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E5=9B=BE=E8=A1=A8?=
 =?UTF-8?q?=E5=B7=A5=E5=85=B7=E7=BB=84=E4=BB=B6=EF=BC=8C=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E5=9B=BE=E8=A1=A8=E7=BB=93=E6=9E=9C=E5=B1=95=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/agents/common/toolkits/debug/tools.py     |  1 -
 test/test_kb_minio_cleanup.py                 |  1 -
 .../ToolCallingResult/ToolCallRenderer.vue    | 14 ++++-
 .../ToolCallingResult/tools/ChartTool.vue     | 60 +++++++++++++++++++
 .../ToolCallingResult/tools/ImageTool.vue     | 26 +++++++-
 web/src/views/ExtensionsView.vue              | 10 ++--
 6 files changed, 102 insertions(+), 10 deletions(-)
 create mode 100644 web/src/components/ToolCallingResult/tools/ChartTool.vue

diff --git a/src/agents/common/toolkits/debug/tools.py b/src/agents/common/toolkits/debug/tools.py
index 52e6ab45..af5ae0b2 100644
--- a/src/agents/common/toolkits/debug/tools.py
+++ b/src/agents/common/toolkits/debug/tools.py
@@ -1,7 +1,6 @@
 from langgraph.types import interrupt
 
 from src.agents.common.toolkits.registry import tool
-from src.utils import logger
 
 
 @tool(category="debug", tags=["内置", "审批"], display_name="人工审批")
diff --git a/test/test_kb_minio_cleanup.py b/test/test_kb_minio_cleanup.py
index 7c02545a..2f260635 100644
--- a/test/test_kb_minio_cleanup.py
+++ b/test/test_kb_minio_cleanup.py
@@ -20,7 +20,6 @@ async def test_delete_knowledge_base_cleanup():
     """测试删除知识库时 MinIO 文件清理"""
     from src.storage.minio import get_minio_client
     from src.knowledge import knowledge_base
-    from src.knowledge.utils.kb_utils import is_minio_url
 
     # 初始化
     minio_client = get_minio_client()
diff --git a/web/src/components/ToolCallingResult/ToolCallRenderer.vue b/web/src/components/ToolCallingResult/ToolCallRenderer.vue
index 7bc0032a..f3e3d32d 100644
--- a/web/src/components/ToolCallingResult/ToolCallRenderer.vue
+++ b/web/src/components/ToolCallingResult/ToolCallRenderer.vue
@@ -5,6 +5,9 @@
   <!-- 网页搜索 -->
   <WebSearchTool v-else-if="isWebSearchResult" :tool-call="toolCall" />
 
+  <!-- Chart -->
+  <ChartTool v-else-if="isChartResult" :tool-call="toolCall" />
+
   <!-- 知识库列表 -->
   <ListKbsTool v-else-if="toolName === 'list_kbs'" :tool-call="toolCall" />
 
@@ -72,6 +75,7 @@ import ListKbsTool from './tools/ListKbsTool.vue'
 import GetMindmapTool from './tools/GetMindmapTool.vue'
 import QueryKbTool from './tools/QueryKbTool.vue'
 import KnowledgeGraphTool from './tools/KnowledgeGraphTool.vue'
+import ChartTool from './tools/ChartTool.vue'
 import CalculatorTool from './tools/CalculatorTool.vue'
 import TodoListTool from './tools/TodoListTool.vue'
 import ImageTool from './tools/ImageTool.vue'
@@ -141,10 +145,18 @@ const isCalculatorResult = computed(() => {
   return name.includes('calculator') || name.includes('calc') || name.includes('math')
 })
 
-const isImageResult = computed(() => {
+const isChartResult = computed(() => {
   const name = toolName.value.toLowerCase()
   if (!name.includes('chart')) return false
   const data = parseData(props.toolCall.tool_call_result?.content)
+  // chart 返回数组格式 [{ type: "text", text: "url", id: "..." }]
+  return Array.isArray(data) && data.length > 0 && data[0].type === 'text'
+})
+
+const isImageResult = computed(() => {
+  const name = toolName.value.toLowerCase()
+  if (!name.includes('text_to_img')) return false
+  const data = parseData(props.toolCall.tool_call_result?.content)
   return data && typeof data === 'string' && data.startsWith('http')
 })
 
diff --git a/web/src/components/ToolCallingResult/tools/ChartTool.vue b/web/src/components/ToolCallingResult/tools/ChartTool.vue
new file mode 100644
index 00000000..c7d4ff68
--- /dev/null
+++ b/web/src/components/ToolCallingResult/tools/ChartTool.vue
@@ -0,0 +1,60 @@
+<template>
+  <BaseToolCall :tool-call="toolCall">
+    <template #result="{ resultContent }">
+      <div class="chart-result">
+        <img :src="chartUrl" />
+      </div>
+    </template>
+  </BaseToolCall>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import BaseToolCall from '../BaseToolCall.vue'
+
+const props = defineProps({
+  toolCall: {
+    type: Object,
+    required: true
+  }
+})
+
+const parseData = (content) => {
+  if (typeof content === 'string') {
+    try {
+      return JSON.parse(content)
+    } catch (error) {
+      return content
+    }
+  }
+  return content
+}
+
+const parsedContent = computed(() => {
+  return parseData(props.toolCall.tool_call_result?.content)
+})
+
+const chartUrl = computed(() => {
+  const content = parsedContent.value
+  // chart 返回数组格式 [{ type: "text", text: "url", id: "..." }]
+  if (Array.isArray(content) && content.length > 0 && content[0].type === 'text') {
+    return content[0].text
+  }
+  return null
+})
+</script>
+
+<style lang="less" scoped>
+.chart-result {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 8px;
+
+  img {
+    max-width: 100%;
+    border-radius: 4px;
+  }
+}
+</style>
diff --git a/web/src/components/ToolCallingResult/tools/ImageTool.vue b/web/src/components/ToolCallingResult/tools/ImageTool.vue
index 7f648792..098d99c2 100644
--- a/web/src/components/ToolCallingResult/tools/ImageTool.vue
+++ b/web/src/components/ToolCallingResult/tools/ImageTool.vue
@@ -1,14 +1,18 @@
 <template>
   <BaseToolCall :tool-call="toolCall">
     <template #result="{ resultContent }">
-      <div class="image-result">
-        <img :src="parseData(resultContent)" />
+      <div v-if="imageUrl" class="image-result">
+        <img :src="imageUrl" />
+      </div>
+      <div v-else class="text-result">
+        {{ parsedContent }}
       </div>
     </template>
   </BaseToolCall>
 </template>
 
 <script setup>
+import { computed } from 'vue'
 import BaseToolCall from '../BaseToolCall.vue'
 
 const props = defineProps({
@@ -28,6 +32,19 @@ const parseData = (content) => {
   }
   return content
 }
+
+const parsedContent = computed(() => {
+  return parseData(props.toolCall.tool_call_result?.content)
+})
+
+const imageUrl = computed(() => {
+  const content = parsedContent.value
+  // text_to_img_qwen_image 返回 URL 字符串
+  if (content && typeof content === 'string' && content.startsWith('http')) {
+    return content
+  }
+  return null
+})
 </script>
 
 <style lang="less" scoped>
@@ -43,4 +60,9 @@ const parseData = (content) => {
     border-radius: 4px;
   }
 }
+
+.text-result {
+  padding: 8px;
+  color: var(--color-text);
+}
 </style>
diff --git a/web/src/views/ExtensionsView.vue b/web/src/views/ExtensionsView.vue
index 5eea0f0a..9d34496f 100644
--- a/web/src/views/ExtensionsView.vue
+++ b/web/src/views/ExtensionsView.vue
@@ -2,8 +2,8 @@
   <div class="extensions-view">
     <div class="extensions-header">
       <a-tabs v-model:activeKey="activeTab" class="extensions-tabs">
-        <a-tab-pane key="skills" tab="Skills 管理" />
         <a-tab-pane key="tools" tab="工具" />
+        <a-tab-pane key="skills" tab="Skills 管理" />
         <a-tab-pane key="mcp" tab="MCP 服务器" />
       </a-tabs>
       <div class="header-actions">
@@ -47,6 +47,9 @@
     </div>
 
     <div class="extensions-content">
+      <div v-show="activeTab === 'tools'" class="tab-panel">
+        <ToolsManagerComponent ref="toolsRef" @refresh="handleToolsRefresh" />
+      </div>
       <div v-show="activeTab === 'skills'" class="tab-panel">
         <SkillsManagerComponent
           ref="skillsRef"
@@ -54,9 +57,6 @@
           @refresh="handleSkillsRefresh"
         />
       </div>
-      <div v-show="activeTab === 'tools'" class="tab-panel">
-        <ToolsManagerComponent ref="toolsRef" @refresh="handleToolsRefresh" />
-      </div>
       <div v-show="activeTab === 'mcp'" class="tab-panel">
         <McpServersComponent ref="mcpRef" @add="handleMcpAdd" @refresh="handleMcpRefresh" />
       </div>
@@ -71,7 +71,7 @@ import SkillsManagerComponent from '@/components/SkillsManagerComponent.vue'
 import ToolsManagerComponent from '@/components/ToolsManagerComponent.vue'
 import McpServersComponent from '@/components/McpServersComponent.vue'
 
-const activeTab = ref('skills')
+const activeTab = ref('tools')
 const skillsRef = ref(null)
 const toolsRef = ref(null)
 const mcpRef = ref(null)