diff --git a/src/constants/toolIcons.ts b/src/constants/toolIcons.ts
new file mode 100644
index 0000000..ca881be
--- /dev/null
+++ b/src/constants/toolIcons.ts
@@ -0,0 +1,52 @@
+/**
+ * 工具图标定义
+ * 包含各种工具的 SVG 图标
+ */
+
+/**
+ * 折叠图标 SVG（用于可折叠的工具结果）
+ */
+export const collapseIconSvg = `
+
+
+
+
+`;
+
+/**
+ * 文件写入完成图标 SVG
+ */
+export const fileWriteIconSvg = `
+
+
+
+`;
+
+/**
+ * 语法检查图标 SVG
+ */
+export const syntaxCheckIconSvg = `
+
+
+
+`;
+
+/**
+ * 已检索代码图标 SVG
+ */
+export const SearchCode = `
+
+
+
+`;
diff --git a/src/views/messageArea.ts b/src/views/messageArea.ts
index fc6fb46..3c5f4f2 100644
--- a/src/views/messageArea.ts
+++ b/src/views/messageArea.ts
@@ -10,6 +10,13 @@
* - 显示工具执行状态和加载指示器
*/
+import {
+ collapseIconSvg,
+ fileWriteIconSvg,
+ syntaxCheckIconSvg,
+ SearchCode,
+} from "../constants/toolIcons";
+
/**
* 获取消息区域的 HTML 内容
*/
@@ -394,6 +401,39 @@ export function getMessageAreaStyles(): string {
.tool-segment-header:not(.collapsed) .tool-collapse-icon {
transform: rotate(0deg);
}
+ .tool-file-write-icon {
+ width: 16px;
+ height: 16px;
+ flex-shrink: 0;
+ margin-right: 6px;
+ }
+ .tool-file-write-icon svg {
+ width: 100%;
+ height: 100%;
+ display: block;
+ }
+ .tool-syntax-check-icon {
+ width: 16px;
+ height: 16px;
+ flex-shrink: 0;
+ margin-right: 6px;
+ }
+ .tool-syntax-check-icon svg {
+ width: 100%;
+ height: 100%;
+ display: block;
+ }
+ .tool-search-code-icon {
+ width: 16px;
+ height: 16px;
+ flex-shrink: 0;
+ margin-right: 6px;
+ }
+ .tool-search-code-icon svg {
+ width: 100%;
+ height: 100%;
+ display: block;
+ }
.tool-segment-content {
overflow: hidden;
transition: max-height 0.3s ease;
@@ -491,15 +531,21 @@ export function getMessageAreaStyles(): string {
*/
export function getMessageAreaScript(): string {
return `
+ // 工具图标定义
+ const collapseIconSvg = \`${collapseIconSvg}\`;
+ const fileWriteIconSvg = \`${fileWriteIconSvg}\`;
+ const syntaxCheckIconSvg = \`${syntaxCheckIconSvg}\`;
+ const searchCodeIconSvg = \`${SearchCode}\`;
+
// 工具名称映射
function getToolDisplayName(toolName) {
const toolNameMap = {
'file_read': '已完成文件读取',
'file_write': '已完成文件写入',
- 'file_list': '已读取目录',
- 'syntax_check': '语法检查',
- 'simulation': '仿真',
- 'waveform_summary': '波形分析'
+ 'file_list': '已检索代码文件',
+ 'syntax_check': '已完成语法检查',
+ 'simulation': '已完成仿真',
+ 'waveform_summary': '已完成波形分析'
};
return toolNameMap[toolName] || toolName;
}
@@ -719,29 +765,18 @@ export function getMessageAreaScript(): string {
segmentDiv.className += ' segment-text';
segmentDiv.innerHTML = formatText(segment.content);
} else if (segment.type === 'tool') {
- const statusIcon = segment.toolStatus === 'success' ? '✅' :
- segment.toolStatus === 'error' ? '❌' : '🔧';
+ const statusIcon = segment.toolStatus === 'error' ? '❌' : '🔧';
const toolResult = segment.toolResult || '';
// 检查工具结果是否过长(超过一行显示不下)
const shouldCollapse = toolResult && toolResult.length > 60;
- // 折叠图标 SVG
- const collapseIconSvg = \`
-
-
-
-
- \`;
-
segmentDiv.innerHTML = \`
@@ -910,29 +945,18 @@ export function getMessageAreaScript(): string {
segmentDiv.className += ' segment-text';
segmentDiv.innerHTML = formatText(segment.content);
} else if (segment.type === 'tool') {
- const statusIcon = segment.toolStatus === 'success' ? '✅' :
- segment.toolStatus === 'error' ? '❌' : '🔧';
+ const statusIcon = segment.toolStatus === 'error' ? '❌' : '🔧';
const toolResult = segment.toolResult || '';
// 检查工具结果是否过长(超过一行显示不下)
const shouldCollapse = toolResult && toolResult.length > 60;
- // 折叠图标 SVG
- const collapseIconSvg = \`
-
-
-
-
- \`;
-
segmentDiv.innerHTML = \`