9 Commits

Author SHA1 Message Date
5c2ea0f15c Merge branch 'feat/plugin-initialization' into feat/back-to-front 2025-12-17 10:07:08 +08:00
6c5d470bad fex:尝试修复流式显示工具调用不穿插显示的问题 2025-12-17 10:03:40 +08:00
c21ad95963 feat: 实现状态栏显示功能
- 在消息区域下方添加状态栏 UI(HTML、CSS、JS)
- 支持"思考中..."状态显示(蓝色脉冲动画)
- 支持"生成中..."状态显示(橙色脉冲动画)
- 支持工具执行时显示"正在执行 xxx..."
- 在 messageHandler 中添加状态栏消息发送逻辑
2025-12-16 19:20:14 +08:00
7c1f1fae07 feat: 集成后端通信和前端交互功能
- 重构消息处理器(src/utils/messageHandler.ts)
  - 集成 DialogService 实现后端对话管理
  - 添加流式消息处理和 SSE 事件监听
  - 实现工具执行状态的实时更新
  - 支持用户问题的交互处理
  - 添加对话中止和错误处理机制

- 更新 ICHelperPanel(src/panels/ICHelperPanel.ts)
  - 添加 submitAnswer 消息处理,支持用户答案提交
  - 添加 abortDialog 消息处理,支持对话中止
  - 与后端服务进行双向通信

- 更新 ICViewProvider(src/views/ICViewProvider.ts)
  - 同步更新消息处理逻辑
  - 添加 extensionPath 参数传递
  - 支持新的消息类型和事件处理

完成前后端通信的完整集成,实现:
- AI 对话的流式响应
- 工具调用的实时反馈
- 用户交互的双向通信
- 错误处理和状态管理
2025-12-16 19:09:46 +08:00
c61e29a41f feat: 实现 WebView 流式消息显示和状态管理
- 添加流式消息分段显示功能
  - 支持 AI 消息的实时流式渲染
  - 实现消息块(MessageChunk)的增量更新
  - 使用 marked 库进行 Markdown 渲染

- 新增加载状态指示器
  - 显示 AI 思考中的动画效果
  - 支持加载状态的显示和隐藏

- 实现工具执行状态展示
  - 显示工具调用的实时状态(执行中/成功/失败)
  - 展示工具名称、参数和执行结果
  - 提供折叠/展开功能查看详细信息

- 添加用户问题交互 UI
  - 支持 AI 向用户提问的界面展示
  - 显示问题内容和等待用户响应的提示
  - 集成答案提交和对话中止功能

- 优化消息渲染性能
  - 使用 DocumentFragment 批量更新 DOM
  - 避免频繁的页面重排和重绘
2025-12-16 19:09:35 +08:00
703912bb5f chore: 添加后端通信相关依赖
- 添加 eventsource-parser 依赖用于 SSE 事件解析
- 新增后端配置项(iccoder.backend.baseUrl 和 timeout)
- 更新 pnpm-lock.yaml 锁定依赖版本
2025-12-16 19:09:23 +08:00
8ad6a48e8f feat: 实现核心服务层
- 新增对话服务(src/services/dialogService.ts)
  - 封装完整的对话生命周期管理
  - 集成 SSE 流式响应处理
  - 支持对话创建、消息发送、对话中止
  - 提供统一的事件回调接口

- 新增工具执行器(src/services/toolExecutor.ts)
  - 实现前端工具调用框架
  - 支持 readFile、writeFile、listFiles、executeCommand 等工具
  - 提供工具执行结果的标准化返回
  - 集成 VSCode API 进行文件和终端操作

- 新增用户交互处理(src/services/userInteraction.ts)
  - 实现 AI 向用户提问功能(AskUser)
  - 支持 input、confirm、quickPick 等交互类型
  - 使用 VSCode 原生 UI 组件展示问题
  - 提供答案收集和提交机制
2025-12-16 19:09:16 +08:00
ba75541dd6 feat: 实现后端通信层
- 新增 HTTP 客户端(src/services/apiClient.ts)
  - 实现对话创建、消息发送、对话中止等 API 调用
  - 支持用户答案提交和对话历史查询
  - 统一的错误处理和超时控制

- 新增 SSE 事件处理器(src/services/sseHandler.ts)
  - 实现 Server-Sent Events 流式数据解析
  - 支持 MessageChunk、ToolExecution、AskUser、Error 等事件类型
  - 使用 eventsource-parser 库处理 SSE 数据流
  - 提供事件回调机制,支持实时 UI 更新
2025-12-16 19:09:04 +08:00
f87adab7be feat: 添加后端通信基础设施
- 新增 API 类型定义(src/types/api.ts)
  - 定义对话请求/响应接口
  - 定义 SSE 事件类型(MessageChunk、ToolExecution、AskUser 等)
  - 定义工具执行和用户交互相关类型

- 新增配置管理模块(src/config/settings.ts)
  - 实现后端服务器配置读取
  - 支持从 VSCode 配置中获取 baseUrl 和 timeout
  - 提供统一的配置访问接口
2025-12-16 19:08:54 +08:00
13 changed files with 2356 additions and 57 deletions

View File

@ -91,6 +91,26 @@
"type": "webview" "type": "webview"
} }
] ]
},
"configuration": {
"title": "IC Coder",
"properties": {
"icCoder.backendUrl": {
"type": "string",
"default": "http://localhost:2233",
"description": "后端服务地址"
},
"icCoder.timeout": {
"type": "number",
"default": 60000,
"description": "请求超时时间(毫秒)"
},
"icCoder.userId": {
"type": "string",
"default": "default-user",
"description": "用户ID临时配置"
}
}
} }
}, },
"scripts": { "scripts": {
@ -125,6 +145,7 @@
], ],
"dependencies": { "dependencies": {
"@wavedrom/doppler": "^1.14.0", "@wavedrom/doppler": "^1.14.0",
"eventsource-parser": "^3.0.6",
"iconv-lite": "^0.7.1", "iconv-lite": "^0.7.1",
"onml": "^2.1.0", "onml": "^2.1.0",
"style-mod": "^4.1.3", "style-mod": "^4.1.3",

9
pnpm-lock.yaml generated
View File

@ -11,6 +11,9 @@ importers:
'@wavedrom/doppler': '@wavedrom/doppler':
specifier: ^1.14.0 specifier: ^1.14.0
version: 1.14.0 version: 1.14.0
eventsource-parser:
specifier: ^3.0.6
version: 3.0.6
iconv-lite: iconv-lite:
specifier: ^0.7.1 specifier: ^0.7.1
version: 0.7.1 version: 0.7.1
@ -662,6 +665,10 @@ packages:
resolution: {integrity: sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==} resolution: {integrity: sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==}
engines: {node: '>=0.8.x'} engines: {node: '>=0.8.x'}
eventsource-parser@3.0.6:
resolution: {integrity: sha512-Vo1ab+QXPzZ4tCa8SwIHJFaSzy4R6SHf7BY79rFBDf0idraZWAkYrDjDj8uWaSm3S2TK+hJ7/t1CEmZ7jXw+pg==}
engines: {node: '>=18.0.0'}
fast-deep-equal@3.1.3: fast-deep-equal@3.1.3:
resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==} resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
@ -2119,6 +2126,8 @@ snapshots:
events@3.3.0: {} events@3.3.0: {}
eventsource-parser@3.0.6: {}
fast-deep-equal@3.1.3: {} fast-deep-equal@3.1.3: {}
fast-json-stable-stringify@2.1.0: {} fast-json-stable-stringify@2.1.0: {}

46
src/config/settings.ts Normal file
View File

@ -0,0 +1,46 @@
/**
* 配置管理
* 从 VSCode 设置读取配置项
*/
import * as vscode from 'vscode';
/** 配置项接口 */
export interface IccoderConfig {
/** 后端服务地址 */
backendUrl: string;
/** 请求超时时间(毫秒) */
timeout: number;
/** 用户ID临时使用后续对接认证 */
userId: string;
}
/** 默认配置 */
const DEFAULT_CONFIG: IccoderConfig = {
backendUrl: 'http://localhost:8080',
timeout: 60000,
userId: 'default-user'
};
/**
* 获取配置项
*/
export function getConfig(): IccoderConfig {
const config = vscode.workspace.getConfiguration('icCoder');
return {
backendUrl: config.get<string>('backendUrl', DEFAULT_CONFIG.backendUrl),
timeout: config.get<number>('timeout', DEFAULT_CONFIG.timeout),
userId: config.get<string>('userId', DEFAULT_CONFIG.userId)
};
}
/**
* 获取后端 API 地址
*/
export function getApiUrl(path: string): string {
const { backendUrl } = getConfig();
// 确保 URL 格式正确
const baseUrl = backendUrl.endsWith('/') ? backendUrl.slice(0, -1) : backendUrl;
const apiPath = path.startsWith('/') ? path : `/${path}`;
return `${baseUrl}${apiPath}`;
}

View File

@ -6,14 +6,19 @@ import {
handleReadFile, handleReadFile,
handleUpdateFile, handleUpdateFile,
handleRenameFile, handleRenameFile,
handleReplaceInFile handleReplaceInFile,
handleUserAnswer,
abortCurrentDialog,
} from "../utils/messageHandler"; } from "../utils/messageHandler";
import { VCDViewerPanel } from "./VCDViewerPanel"; import { VCDViewerPanel } from "./VCDViewerPanel";
/** /**
* 创建并显示 IC 助手面板 * 创建并显示 IC 助手面板
*/ */
export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?: vscode.ViewColumn) { export function showICHelperPanel(
context: vscode.ExtensionContext,
viewColumn?: vscode.ViewColumn
) {
// 创建WebView面板 // 创建WebView面板
const panel = vscode.window.createWebviewPanel( const panel = vscode.window.createWebviewPanel(
"icCoder", // 面板ID "icCoder", // 面板ID
@ -27,7 +32,11 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
); );
// 设置标签页图标 // 设置标签页图标
panel.iconPath = vscode.Uri.joinPath(context.extensionUri, "media", "图案(方底).png"); panel.iconPath = vscode.Uri.joinPath(
context.extensionUri,
"media",
"图案(方底).png"
);
// 获取页面内图标URI // 获取页面内图标URI
const iconUri = panel.webview.asWebviewUri( const iconUri = panel.webview.asWebviewUri(
@ -54,7 +63,12 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
handleRenameFile(panel, message.oldPath, message.newPath); handleRenameFile(panel, message.oldPath, message.newPath);
break; break;
case "replaceInFile": case "replaceInFile":
handleReplaceInFile(panel, message.filePath, message.searchText, message.replaceText); handleReplaceInFile(
panel,
message.filePath,
message.searchText,
message.replaceText
);
break; break;
case "insertCode": case "insertCode":
insertCodeToEditor(message.code); insertCodeToEditor(message.code);
@ -65,7 +79,10 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
case "openWaveformViewer": case "openWaveformViewer":
// 打开波形查看器 // 打开波形查看器
if (message.vcdFilePath) { if (message.vcdFilePath) {
VCDViewerPanel.createOrShow(context.extensionUri, message.vcdFilePath); VCDViewerPanel.createOrShow(
context.extensionUri,
message.vcdFilePath
);
} }
break; break;
case "getVCDInfo": case "getVCDInfo":
@ -81,13 +98,25 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
case "loadConversationHistory": case "loadConversationHistory":
// 加载会话历史(暂未实现) // 加载会话历史(暂未实现)
panel.webview.postMessage({ panel.webview.postMessage({
command: 'conversationHistory', command: "conversationHistory",
history: [] history: [],
}); });
break; break;
case "selectConversation": case "selectConversation":
// 选择会话(暂未实现) // 选择会话(暂未实现)
break; break;
// 新增:处理用户回答
case "submitAnswer":
handleUserAnswer(
message.askId,
message.selected,
message.customInput
);
break;
// 新增:中止对话
case "abortDialog":
abortCurrentDialog();
break;
} }
}, },
undefined, undefined,
@ -104,8 +133,8 @@ async function getVCDFileInfo(
containerId: string containerId: string
) { ) {
try { try {
const fs = require('fs'); const fs = require("fs");
const path = require('path'); const path = require("path");
// 检查文件是否存在 // 检查文件是否存在
if (!fs.existsSync(vcdFilePath)) { if (!fs.existsSync(vcdFilePath)) {
@ -113,11 +142,11 @@ async function getVCDFileInfo(
command: "vcdInfo", command: "vcdInfo",
containerId: containerId, containerId: containerId,
vcdInfo: { vcdInfo: {
signalCount: 'N/A', signalCount: "N/A",
timeRange: 'N/A', timeRange: "N/A",
fileSize: 'N/A', fileSize: "N/A",
error: '文件不存在' error: "文件不存在",
} },
}); });
return; return;
} }
@ -125,19 +154,20 @@ async function getVCDFileInfo(
// 获取文件大小 // 获取文件大小
const stats = fs.statSync(vcdFilePath); const stats = fs.statSync(vcdFilePath);
const fileSizeKB = stats.size / 1024; const fileSizeKB = stats.size / 1024;
const fileSize = fileSizeKB < 1024 const fileSize =
? `${fileSizeKB.toFixed(2)} KB` fileSizeKB < 1024
: `${(fileSizeKB / 1024).toFixed(2)} MB`; ? `${fileSizeKB.toFixed(2)} KB`
: `${(fileSizeKB / 1024).toFixed(2)} MB`;
// 读取 VCD 文件内容 // 读取 VCD 文件内容
const content = fs.readFileSync(vcdFilePath, 'utf-8'); const content = fs.readFileSync(vcdFilePath, "utf-8");
// 解析信号数量 // 解析信号数量
const varMatches = content.match(/\$var/g); const varMatches = content.match(/\$var/g);
const signalCount = varMatches ? varMatches.length : 0; const signalCount = varMatches ? varMatches.length : 0;
// 解析时间范围 // 解析时间范围
let timeRange = 'N/A'; let timeRange = "N/A";
const timeMatch = content.match(/#(\d+)/g); const timeMatch = content.match(/#(\d+)/g);
if (timeMatch && timeMatch.length > 0) { if (timeMatch && timeMatch.length > 0) {
const times = timeMatch.map((t: string) => parseInt(t.substring(1))); const times = timeMatch.map((t: string) => parseInt(t.substring(1)));
@ -157,21 +187,20 @@ async function getVCDFileInfo(
signalCount: signalCount.toString(), signalCount: signalCount.toString(),
timeRange: timeRange, timeRange: timeRange,
fileSize: fileSize, fileSize: fileSize,
signals: signals // 添加真实信号数据 signals: signals, // 添加真实信号数据
} },
}); });
} catch (error) { } catch (error) {
console.error('获取 VCD 文件信息失败:', error); console.error("获取 VCD 文件信息失败:", error);
panel.webview.postMessage({ panel.webview.postMessage({
command: "vcdInfo", command: "vcdInfo",
containerId: containerId, containerId: containerId,
vcdInfo: { vcdInfo: {
signalCount: 'N/A', signalCount: "N/A",
timeRange: 'N/A', timeRange: "N/A",
fileSize: 'N/A', fileSize: "N/A",
error: error instanceof Error ? error.message : '未知错误' error: error instanceof Error ? error.message : "未知错误",
} },
}); });
} }
} }
@ -191,9 +220,16 @@ function parseVCDSignals(content: string, maxSignals: number = 3) {
// 1. 解析信号定义部分 // 1. 解析信号定义部分
const varRegex = /\$var\s+(\w+)\s+(\d+)\s+(\S+)\s+([^\$]+?)\s+\$end/g; const varRegex = /\$var\s+(\w+)\s+(\d+)\s+(\S+)\s+([^\$]+?)\s+\$end/g;
let match; let match;
const signalDefs: Array<{ name: string; identifier: string; width: number }> = []; const signalDefs: Array<{
name: string;
identifier: string;
width: number;
}> = [];
while ((match = varRegex.exec(content)) !== null && signalDefs.length < maxSignals) { while (
(match = varRegex.exec(content)) !== null &&
signalDefs.length < maxSignals
) {
const width = parseInt(match[2]); const width = parseInt(match[2]);
const identifier = match[3]; const identifier = match[3];
const name = match[4].trim(); const name = match[4].trim();
@ -202,7 +238,7 @@ function parseVCDSignals(content: string, maxSignals: number = 3) {
} }
// 2. 找到数据变化部分的起始位置 // 2. 找到数据变化部分的起始位置
const dumpvarsIndex = content.indexOf('$dumpvars'); const dumpvarsIndex = content.indexOf("$dumpvars");
if (dumpvarsIndex === -1) { if (dumpvarsIndex === -1) {
return signals; return signals;
} }
@ -215,13 +251,13 @@ function parseVCDSignals(content: string, maxSignals: number = 3) {
let currentTime = 0; let currentTime = 0;
// 分行处理数据 // 分行处理数据
const lines = dataSection.split('\n'); const lines = dataSection.split("\n");
for (const line of lines) { for (const line of lines) {
const trimmedLine = line.trim(); const trimmedLine = line.trim();
// 解析时间戳 // 解析时间戳
if (trimmedLine.startsWith('#')) { if (trimmedLine.startsWith("#")) {
currentTime = parseInt(trimmedLine.substring(1)); currentTime = parseInt(trimmedLine.substring(1));
continue; continue;
} }
@ -231,13 +267,17 @@ function parseVCDSignals(content: string, maxSignals: number = 3) {
// 格式2: 多比特信号 "b1010 !" // 格式2: 多比特信号 "b1010 !"
if (signalDef.width === 1) { if (signalDef.width === 1) {
// 单比特信号 // 单比特信号
const singleBitMatch = trimmedLine.match(new RegExp(`^([01xz])${signalDef.identifier}$`)); const singleBitMatch = trimmedLine.match(
new RegExp(`^([01xz])${signalDef.identifier}$`)
);
if (singleBitMatch) { if (singleBitMatch) {
values.push({ time: currentTime, value: singleBitMatch[1] }); values.push({ time: currentTime, value: singleBitMatch[1] });
} }
} else { } else {
// 多比特信号 // 多比特信号
const multiBitMatch = trimmedLine.match(new RegExp(`^b([01xz]+)\\s+${signalDef.identifier}$`)); const multiBitMatch = trimmedLine.match(
new RegExp(`^b([01xz]+)\\s+${signalDef.identifier}$`)
);
if (multiBitMatch) { if (multiBitMatch) {
values.push({ time: currentTime, value: multiBitMatch[1] }); values.push({ time: currentTime, value: multiBitMatch[1] });
} }
@ -253,12 +293,11 @@ function parseVCDSignals(content: string, maxSignals: number = 3) {
name: signalDef.name, name: signalDef.name,
identifier: signalDef.identifier, identifier: signalDef.identifier,
width: signalDef.width, width: signalDef.width,
values: values values: values,
}); });
} }
} catch (error) { } catch (error) {
console.error('解析 VCD 信号数据失败:', error); console.error("解析 VCD 信号数据失败:", error);
} }
return signals; return signals;

154
src/services/apiClient.ts Normal file
View File

@ -0,0 +1,154 @@
/**
* API 客户端
* 封装与后端的 HTTP 通信
*/
import * as https from 'https';
import * as http from 'http';
import { URL } from 'url';
import { getApiUrl, getConfig } from '../config/settings';
import type { ToolCallResult, AnswerRequest, ToolResultResponse, AnswerResponse } from '../types/api';
/**
* HTTP 请求选项
*/
interface RequestOptions {
method: 'GET' | 'POST' | 'PUT' | 'DELETE';
headers?: Record<string, string>;
body?: unknown;
timeout?: number;
}
/**
* 发送 HTTP 请求
*/
async function request<T>(path: string, options: RequestOptions): Promise<T> {
const url = new URL(getApiUrl(path));
const { timeout } = getConfig();
const isHttps = url.protocol === 'https:';
const httpModule = isHttps ? https : http;
const requestOptions: http.RequestOptions = {
hostname: url.hostname,
port: url.port || (isHttps ? 443 : 80),
path: url.pathname + url.search,
method: options.method,
headers: {
'Content-Type': 'application/json',
...options.headers
},
timeout: options.timeout || timeout
};
return new Promise((resolve, reject) => {
const req = httpModule.request(requestOptions, (res) => {
let data = '';
res.on('data', (chunk) => {
data += chunk;
});
res.on('end', () => {
try {
const json = JSON.parse(data);
if (res.statusCode && res.statusCode >= 200 && res.statusCode < 300) {
resolve(json as T);
} else {
reject(new Error(json.error || json.message || `HTTP ${res.statusCode}`));
}
} catch (e) {
reject(new Error(`解析响应失败: ${data}`));
}
});
});
req.on('error', (error) => {
reject(error);
});
req.on('timeout', () => {
req.destroy();
reject(new Error('请求超时'));
});
if (options.body) {
req.write(JSON.stringify(options.body));
}
req.end();
});
}
/**
* 提交工具执行结果
* POST /api/tool/result
*/
export async function submitToolResult(result: ToolCallResult): Promise<ToolResultResponse> {
console.log(`[API] 提交工具结果: callId=${result.id}`);
return request<ToolResultResponse>('/api/tool/result', {
method: 'POST',
body: result
});
}
/**
* 提交用户回答
* POST /api/task/answer
*/
export async function submitAnswer(answer: AnswerRequest): Promise<AnswerResponse> {
console.log(`[API] 提交用户回答: askId=${answer.askId}`);
return request<AnswerResponse>('/api/task/answer', {
method: 'POST',
body: answer
});
}
/**
* 健康检查
* GET /api/dialog/health
*/
export async function healthCheck(): Promise<{ status: string }> {
return request<{ status: string }>('/api/dialog/health', {
method: 'GET',
timeout: 5000
});
}
/**
* 创建成功的工具结果
*/
export function createSuccessResult(id: number, text: string): ToolCallResult {
return {
jsonrpc: '2.0',
id,
result: {
content: [{ type: 'text', text }],
isError: false
}
};
}
/**
* 创建业务错误的工具结果(如编译失败)
*/
export function createBusinessErrorResult(id: number, errorMessage: string): ToolCallResult {
return {
jsonrpc: '2.0',
id,
result: {
content: [{ type: 'text', text: errorMessage }],
isError: true
}
};
}
/**
* 创建系统错误的工具结果
*/
export function createSystemErrorResult(id: number, code: number, message: string): ToolCallResult {
return {
jsonrpc: '2.0',
id,
error: { code, message }
};
}

View File

@ -0,0 +1,318 @@
/**
* 对话服务
* 整合 SSE 通信、工具执行、用户交互
*/
import * as vscode from 'vscode';
import { startStreamDialog, generateTaskId, SSEController, SSECallbacks } from './sseHandler';
import { executeToolCall, createToolExecutorContext, ToolExecutorContext } from './toolExecutor';
import { userInteractionManager } from './userInteraction';
import { getConfig } from '../config/settings';
import type { DialogRequest, ToolCallRequest, AskUserEvent } from '../types/api';
/**
* 消息段落类型
*/
export interface MessageSegment {
type: 'text' | 'tool' | 'question';
content?: string;
toolName?: string;
toolStatus?: 'running' | 'success' | 'error';
toolResult?: string;
askId?: string;
question?: string;
options?: string[];
}
/**
* 对话回调接口
*/
export interface DialogCallbacks {
/** 收到文本(可能多次调用,流式) */
onText?: (text: string, isStreaming: boolean) => void;
/** 工具开始执行 */
onToolStart?: (toolName: string) => void;
/** 工具执行完成 */
onToolComplete?: (toolName: string, result: string) => void;
/** 工具执行错误 */
onToolError?: (toolName: string, error: string) => void;
/** 显示问题ask_user */
onQuestion?: (askId: string, question: string, options: string[]) => void;
/** 对话完成,返回所有段落 */
onComplete?: (segments: MessageSegment[]) => void;
/** 错误 */
onError?: (message: string) => void;
/** 通知消息 */
onNotification?: (message: string) => void;
}
/**
* 对话会话
*/
export class DialogSession {
private taskId: string;
private sseController: SSEController | null = null;
private toolContext: ToolExecutorContext;
private accumulatedText = '';
private isActive = false;
private segments: MessageSegment[] = [];
private currentTextSegment: MessageSegment | null = null;
constructor(extensionPath: string) {
this.taskId = generateTaskId();
this.toolContext = createToolExecutorContext(extensionPath);
}
/**
* 添加文本到当前文本段落
*/
private appendText(text: string): void {
if (!this.currentTextSegment) {
this.currentTextSegment = { type: 'text', content: '' };
this.segments.push(this.currentTextSegment);
}
this.currentTextSegment.content = (this.currentTextSegment.content || '') + text;
}
/**
* 结束当前文本段落
*/
private finalizeTextSegment(): void {
this.currentTextSegment = null;
}
/**
* 添加工具段落
*/
private addToolSegment(toolName: string, status: 'running' | 'success' | 'error', result?: string): MessageSegment {
this.finalizeTextSegment();
const segment: MessageSegment = {
type: 'tool',
toolName,
toolStatus: status,
toolResult: result
};
this.segments.push(segment);
return segment;
}
/**
* 更新工具段落状态
*/
private updateToolSegment(toolName: string, status: 'success' | 'error', result?: string): void {
// 找到最后一个匹配的工具段落
for (let i = this.segments.length - 1; i >= 0; i--) {
const seg = this.segments[i];
if (seg.type === 'tool' && seg.toolName === toolName && seg.toolStatus === 'running') {
seg.toolStatus = status;
seg.toolResult = result;
break;
}
}
}
/**
* 获取任务ID
*/
getTaskId(): string {
return this.taskId;
}
/**
* 是否活跃
*/
get active(): boolean {
return this.isActive;
}
/**
* 发送消息并开始流式对话
*/
async sendMessage(
message: string,
callbacks: DialogCallbacks
): Promise<void> {
if (this.isActive) {
callbacks.onError?.('当前有对话正在进行中');
return;
}
this.isActive = true;
this.accumulatedText = '';
this.segments = [];
this.currentTextSegment = null;
const config = getConfig();
const request: DialogRequest = {
taskId: this.taskId,
message,
userId: config.userId,
toolMode: 'AGENT'
};
const sseCallbacks: SSECallbacks = {
onTextDelta: (data) => {
this.accumulatedText += data.text;
this.appendText(data.text);
console.log('[DialogSession] onTextDelta, 累积文本长度:', this.accumulatedText.length);
callbacks.onText?.(this.accumulatedText, true);
},
onToolCall: async (data: ToolCallRequest) => {
const toolName = data.params.name;
console.log('[DialogSession] onToolCall:', toolName);
// 检查是否已经有相同的工具段落(可能由 onToolStart 添加)
const lastToolSegment = this.segments.filter(s => s.type === 'tool').pop();
if (lastToolSegment && lastToolSegment.toolName === toolName && lastToolSegment.toolStatus === 'running') {
console.log('[DialogSession] onToolCall: 跳过重复的工具段落:', toolName);
} else {
this.addToolSegment(toolName, 'running');
}
// 注意:不在这里调用 callbacks.onToolStart避免与 onToolStart 事件重复
try {
await executeToolCall(data, this.toolContext);
this.updateToolSegment(toolName, 'success', '执行完成');
// 也不调用 callbacks.onToolComplete避免重复
} catch (error) {
const errorMsg = error instanceof Error ? error.message : '未知错误';
this.updateToolSegment(toolName, 'error', errorMsg);
callbacks.onToolError?.(toolName, errorMsg);
}
},
onToolStart: (data) => {
console.log('[DialogSession] onToolStart:', data.tool_name);
// 检查是否已经有相同的工具段落(可能由 onToolCall 添加)
const lastToolSegment = this.segments.filter(s => s.type === 'tool').pop();
if (lastToolSegment && lastToolSegment.toolName === data.tool_name && lastToolSegment.toolStatus === 'running') {
console.log('[DialogSession] 跳过重复的工具段落:', data.tool_name);
} else {
this.addToolSegment(data.tool_name, 'running');
}
console.log('[DialogSession] segments 数量:', this.segments.length);
callbacks.onToolStart?.(data.tool_name);
},
onToolComplete: (data) => {
this.updateToolSegment(data.tool_name, 'success', data.result);
callbacks.onToolComplete?.(data.tool_name, data.result);
},
onToolError: (data) => {
this.updateToolSegment(data.tool_name, 'error', data.error);
callbacks.onToolError?.(data.tool_name, data.error);
},
onAskUser: async (data: AskUserEvent) => {
this.finalizeTextSegment();
this.segments.push({
type: 'question',
askId: data.askId,
question: data.question,
options: data.options
});
callbacks.onQuestion?.(data.askId, data.question, data.options);
try {
await userInteractionManager.handleAskUser(data, this.taskId);
} catch (error) {
console.error('[DialogSession] 处理用户问题失败:', error);
}
},
onComplete: (data) => {
this.isActive = false;
this.finalizeTextSegment();
// 发送所有段落
callbacks.onComplete?.(this.segments);
},
onError: (data) => {
this.isActive = false;
callbacks.onError?.(data.message);
},
onWarning: (data) => {
callbacks.onNotification?.(`⚠️ ${data.message}`);
},
onNotification: (data) => {
callbacks.onNotification?.(data.message);
},
onOpen: () => {
console.log('[DialogSession] SSE 连接已建立');
},
onClose: () => {
console.log('[DialogSession] SSE 连接已关闭');
this.isActive = false;
}
};
try {
this.sseController = await startStreamDialog(request, sseCallbacks);
} catch (error) {
this.isActive = false;
const errorMsg = error instanceof Error ? error.message : '连接失败';
callbacks.onError?.(errorMsg);
throw error;
}
}
/**
* 中止当前对话
*/
abort(): void {
if (this.sseController) {
this.sseController.abort();
this.sseController = null;
}
this.isActive = false;
userInteractionManager.cancelAll();
}
/**
* 提交用户回答
*/
async submitAnswer(
askId: string,
selected?: string[],
customInput?: string
): Promise<void> {
await userInteractionManager.receiveAnswer(askId, selected, customInput);
}
}
/**
* 全局对话会话管理
*/
class DialogManager {
private currentSession: DialogSession | null = null;
/**
* 创建新会话
*/
createSession(extensionPath: string): DialogSession {
// 如果有活跃会话,先中止
if (this.currentSession?.active) {
this.currentSession.abort();
}
this.currentSession = new DialogSession(extensionPath);
return this.currentSession;
}
/**
* 获取当前会话
*/
getCurrentSession(): DialogSession | null {
return this.currentSession;
}
/**
* 中止当前会话
*/
abortCurrentSession(): void {
this.currentSession?.abort();
}
}
export const dialogManager = new DialogManager();

296
src/services/sseHandler.ts Normal file
View File

@ -0,0 +1,296 @@
/**
* SSE 事件处理器
* 处理与后端的流式通信
* 使用 eventsource-parser + Node.js 原生 http 模块
*/
import * as http from 'http';
import * as https from 'https';
import { URL } from 'url';
import { createParser, type EventSourceParser } from 'eventsource-parser';
import { getApiUrl, getConfig } from '../config/settings';
import type {
DialogRequest,
SSEEventType,
TextDeltaEvent,
ToolCallRequest,
AskUserEvent,
CompleteEvent,
ErrorEvent,
ToolStartEvent,
ToolCompleteEvent,
ToolErrorEvent,
WarningEvent,
NotificationEvent,
DepthUpdateEvent
} from '../types/api';
/**
* SSE 事件回调接口
*/
export interface SSECallbacks {
/** 收到文本增量 */
onTextDelta?: (data: TextDeltaEvent) => void;
/** 收到工具调用请求 */
onToolCall?: (data: ToolCallRequest) => void;
/** 工具开始执行 */
onToolStart?: (data: ToolStartEvent) => void;
/** 工具执行完成 */
onToolComplete?: (data: ToolCompleteEvent) => void;
/** 工具执行错误 */
onToolError?: (data: ToolErrorEvent) => void;
/** 收到用户提问 */
onAskUser?: (data: AskUserEvent) => void;
/** 对话完成 */
onComplete?: (data: CompleteEvent) => void;
/** 错误 */
onError?: (data: ErrorEvent) => void;
/** 警告 */
onWarning?: (data: WarningEvent) => void;
/** 通知 */
onNotification?: (data: NotificationEvent) => void;
/** 深度更新 */
onDepthUpdate?: (data: DepthUpdateEvent) => void;
/** 连接打开 */
onOpen?: () => void;
/** 连接关闭 */
onClose?: () => void;
}
/**
* SSE 会话控制器
*/
export class SSEController {
private request: http.ClientRequest | null = null;
private isConnected = false;
private isAborted = false;
/**
* 是否已连接
*/
get connected(): boolean {
return this.isConnected;
}
/**
* 设置请求对象
*/
setRequest(req: http.ClientRequest): void {
this.request = req;
}
/**
* 设置连接状态
*/
setConnected(connected: boolean): void {
this.isConnected = connected;
}
/**
* 是否已中止
*/
get aborted(): boolean {
return this.isAborted;
}
/**
* 中止当前连接
*/
abort(): void {
if (this.request && !this.isAborted) {
this.isAborted = true;
this.request.destroy();
this.request = null;
this.isConnected = false;
}
}
}
/**
* 发起流式对话
* @param request 对话请求
* @param callbacks 事件回调
* @returns SSE 控制器(用于中止连接)
*/
export async function startStreamDialog(
request: DialogRequest,
callbacks: SSECallbacks
): Promise<SSEController> {
const controller = new SSEController();
const urlString = getApiUrl('/api/dialog/stream');
const url = new URL(urlString);
const isHttps = url.protocol === 'https:';
const httpModule = isHttps ? https : http;
const body = JSON.stringify(request);
console.log(`[SSE] 开始流式对话: taskId=${request.taskId}, url=${urlString}`);
return new Promise((resolve, reject) => {
const options: http.RequestOptions = {
hostname: url.hostname,
port: url.port || (isHttps ? 443 : 80),
path: url.pathname + url.search,
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'text/event-stream',
'Cache-Control': 'no-cache',
'Content-Length': Buffer.byteLength(body)
}
};
const req = httpModule.request(options, (res) => {
// 检查响应状态
if (res.statusCode !== 200) {
let errorBody = '';
res.on('data', chunk => errorBody += chunk);
res.on('end', () => {
const error = new Error(`SSE 连接失败: ${res.statusCode} ${errorBody}`);
callbacks.onError?.({ message: error.message });
reject(error);
});
return;
}
// 连接成功
console.log('[SSE] 连接已建立');
controller.setConnected(true);
callbacks.onOpen?.();
resolve(controller);
// 创建 SSE 解析器
const parser = createParser({
onEvent: (event) => {
const eventType = event.event as SSEEventType;
const eventData = event.data;
if (!eventData) {
console.log(`[SSE] 收到空事件: ${eventType}`);
return;
}
try {
const data = JSON.parse(eventData);
console.log(`[SSE] 收到事件: ${eventType}`, data);
// 分发事件到对应回调
dispatchEvent(eventType, data, callbacks);
} catch (e) {
console.error(`[SSE] 解析事件数据失败: ${eventData}`, e);
}
}
});
// 设置编码
res.setEncoding('utf8');
// 处理数据流
res.on('data', (chunk: string) => {
if (!controller.aborted) {
console.log('[SSE] 收到原始数据块:', chunk.substring(0, 200));
parser.feed(chunk);
}
});
// 处理连接关闭
res.on('end', () => {
console.log('[SSE] 连接已关闭');
controller.setConnected(false);
callbacks.onClose?.();
});
// 处理错误
res.on('error', (err) => {
if (!controller.aborted) {
console.error('[SSE] 响应错误:', err);
controller.setConnected(false);
callbacks.onError?.({ message: err.message });
}
});
});
// 保存请求引用用于中止
controller.setRequest(req);
// 处理请求错误
req.on('error', (err) => {
if (!controller.aborted) {
console.error('[SSE] 请求错误:', err);
controller.setConnected(false);
callbacks.onError?.({ message: err.message });
reject(err);
}
});
// 处理超时
const { timeout } = getConfig();
req.setTimeout(timeout, () => {
if (!controller.aborted) {
console.error('[SSE] 请求超时');
controller.abort();
const error = new Error('请求超时');
callbacks.onError?.({ message: error.message });
reject(error);
}
});
// 发送请求体
req.write(body);
req.end();
});
}
/**
* 分发 SSE 事件到对应回调
*/
function dispatchEvent(
eventType: SSEEventType,
data: unknown,
callbacks: SSECallbacks
): void {
switch (eventType) {
case 'text_delta':
callbacks.onTextDelta?.(data as TextDeltaEvent);
break;
case 'tool_call':
callbacks.onToolCall?.(data as ToolCallRequest);
break;
case 'tool_start':
callbacks.onToolStart?.(data as ToolStartEvent);
break;
case 'tool_complete':
callbacks.onToolComplete?.(data as ToolCompleteEvent);
break;
case 'tool_error':
callbacks.onToolError?.(data as ToolErrorEvent);
break;
case 'ask_user':
callbacks.onAskUser?.(data as AskUserEvent);
break;
case 'complete':
callbacks.onComplete?.(data as CompleteEvent);
break;
case 'error':
callbacks.onError?.(data as ErrorEvent);
break;
case 'warning':
callbacks.onWarning?.(data as WarningEvent);
break;
case 'notification':
callbacks.onNotification?.(data as NotificationEvent);
break;
case 'depth_update':
callbacks.onDepthUpdate?.(data as DepthUpdateEvent);
break;
default:
console.log(`[SSE] 未知事件类型: ${eventType}`, data);
}
}
/**
* 生成任务ID
*/
export function generateTaskId(): string {
return `task-${Date.now()}-${Math.random().toString(36).substring(2, 8)}`;
}

View File

@ -0,0 +1,272 @@
/**
* 工具执行器
* 接收后端的 tool_call 事件,执行本地工具,返回结果
*/
import * as vscode from 'vscode';
import * as path from 'path';
import * as os from 'os';
import * as fs from 'fs';
import { readFileContent, readDirectory } from '../utils/readFiles';
import { createOrOverwriteFile } from '../utils/createFiles';
import { generateVCD, checkIverilogAvailable } from '../utils/iverilogRunner';
import {
submitToolResult,
createSuccessResult,
createBusinessErrorResult,
createSystemErrorResult
} from './apiClient';
import type {
ToolCallRequest,
ToolName,
FileReadArgs,
FileWriteArgs,
FileListArgs,
SyntaxCheckArgs,
SimulationArgs,
WaveformSummaryArgs
} from '../types/api';
/**
* 工具执行器上下文
*/
export interface ToolExecutorContext {
/** 扩展路径(用于 iverilog */
extensionPath: string;
/** 工作区路径 */
workspacePath: string;
}
/**
* 执行工具调用
* @param request 工具调用请求
* @param context 执行上下文
*/
export async function executeToolCall(
request: ToolCallRequest,
context: ToolExecutorContext
): Promise<void> {
const toolName = request.params.name as ToolName;
const args = request.params.arguments;
const callId = request.id;
console.log(`[ToolExecutor] 执行工具: ${toolName}, callId=${callId}`, args);
try {
let resultText: string;
switch (toolName) {
case 'file_read':
resultText = await executeFileRead(args as unknown as FileReadArgs);
break;
case 'file_write':
resultText = await executeFileWrite(args as unknown as FileWriteArgs);
break;
case 'file_list':
resultText = await executeFileList(args as unknown as FileListArgs);
break;
case 'syntax_check':
resultText = await executeSyntaxCheck(args as unknown as SyntaxCheckArgs, context);
break;
case 'simulation':
resultText = await executeSimulation(args as unknown as SimulationArgs, context);
break;
case 'waveform_summary':
resultText = await executeWaveformSummary(args as unknown as WaveformSummaryArgs);
break;
default:
throw new Error(`未知工具: ${toolName}`);
}
// 提交成功结果
const result = createSuccessResult(callId, resultText);
await submitToolResult(result);
console.log(`[ToolExecutor] 工具执行成功: ${toolName}, callId=${callId}`);
} catch (error) {
const errorMessage = error instanceof Error ? error.message : '未知错误';
console.error(`[ToolExecutor] 工具执行失败: ${toolName}, callId=${callId}`, error);
// 提交错误结果
const result = createBusinessErrorResult(callId, errorMessage);
await submitToolResult(result);
}
}
/**
* 执行 file_read 工具
*/
async function executeFileRead(args: FileReadArgs): Promise<string> {
const content = await readFileContent(args.path);
return content;
}
/**
* 执行 file_write 工具
*/
async function executeFileWrite(args: FileWriteArgs): Promise<string> {
await createOrOverwriteFile(args.path, args.content);
return `文件已写入: ${args.path}`;
}
/**
* 执行 file_list 工具
*/
async function executeFileList(args: FileListArgs): Promise<string> {
const dirPath = args.path || '.';
const extensions = args.extension ? [args.extension] : undefined;
const files = await readDirectory(dirPath, extensions);
const fileList = files.map(f => f.path).join('\n');
return fileList || '(目录为空)';
}
/**
* 执行 syntax_check 工具
* 将代码写入临时文件,调用 iverilog 检查语法
*/
async function executeSyntaxCheck(
args: SyntaxCheckArgs,
context: ToolExecutorContext
): Promise<string> {
// 检查 iverilog 是否可用
const iverilogCheck = await checkIverilogAvailable(context.extensionPath);
if (!iverilogCheck.available) {
throw new Error(`iverilog 不可用: ${iverilogCheck.message}`);
}
// 创建临时文件
const tempDir = os.tmpdir();
const tempFile = path.join(tempDir, `iccoder_syntax_${Date.now()}.v`);
try {
// 写入代码到临时文件
fs.writeFileSync(tempFile, args.code, 'utf-8');
// 调用 iverilog 进行语法检查
const { spawn } = require('child_process');
const iverilogPath = getIverilogPath(context.extensionPath);
return new Promise((resolve, reject) => {
const child = spawn(iverilogPath, ['-t', 'null', tempFile], {
cwd: tempDir,
env: {
...process.env,
IVERILOG_ROOT: path.join(context.extensionPath, 'tools', 'iverilog')
}
});
let stdout = '';
let stderr = '';
child.stdout.on('data', (data: Buffer) => {
stdout += data.toString();
});
child.stderr.on('data', (data: Buffer) => {
stderr += data.toString();
});
child.on('close', (code: number) => {
// 清理临时文件
try {
fs.unlinkSync(tempFile);
} catch (e) {
// 忽略清理错误
}
if (code === 0) {
resolve('语法检查通过,无错误。');
} else {
resolve(`语法检查发现错误:\n${stderr || stdout}`);
}
});
child.on('error', (error: Error) => {
try {
fs.unlinkSync(tempFile);
} catch (e) {
// 忽略清理错误
}
reject(error);
});
});
} catch (error) {
// 确保清理临时文件
try {
fs.unlinkSync(tempFile);
} catch (e) {
// 忽略
}
throw error;
}
}
/**
* 执行 simulation 工具
*/
async function executeSimulation(
args: SimulationArgs,
context: ToolExecutorContext
): Promise<string> {
// 获取工作区路径
const workspaceFolders = vscode.workspace.workspaceFolders;
if (!workspaceFolders || workspaceFolders.length === 0) {
throw new Error('请先打开一个工作区');
}
const projectPath = workspaceFolders[0].uri.fsPath;
// 调用现有的 generateVCD 函数
const result = await generateVCD(projectPath, context.extensionPath);
if (result.success) {
let message = result.message;
if (result.stdout) {
message += `\n\n仿真输出:\n${result.stdout}`;
}
return message;
} else {
let errorMessage = result.message;
if (result.stderr) {
errorMessage += `\n\n错误输出:\n${result.stderr}`;
}
throw new Error(errorMessage);
}
}
/**
* 执行 waveform_summary 工具
* TODO: 实现 VCD 波形分析
*/
async function executeWaveformSummary(args: WaveformSummaryArgs): Promise<string> {
// TODO: 使用 vcdrom/vcd-stream 解析 VCD 文件
// 目前返回一个占位响应
return `波形分析功能暂未实现。\n请求参数:\n- VCD文件: ${args.vcdPath}\n- 信号: ${args.signals}\n- 检查点: ${args.checkpoints || '无'}`;
}
/**
* 获取 iverilog 路径
*/
function getIverilogPath(extensionPath: string): string {
const platform = process.platform;
if (platform === 'win32') {
return path.join(extensionPath, 'tools', 'iverilog', 'bin', 'iverilog.exe');
} else {
return path.join(extensionPath, 'tools', 'iverilog', 'bin', 'iverilog');
}
}
/**
* 创建工具执行器上下文
*/
export function createToolExecutorContext(extensionPath: string): ToolExecutorContext {
const workspaceFolders = vscode.workspace.workspaceFolders;
const workspacePath = workspaceFolders?.[0]?.uri.fsPath || '';
return {
extensionPath,
workspacePath
};
}

View File

@ -0,0 +1,154 @@
/**
* 用户交互处理器
* 处理 ask_user 事件,通过 WebView 显示问题并收集用户回答
*/
import * as vscode from 'vscode';
import { submitAnswer } from './apiClient';
import type { AskUserEvent, AnswerRequest } from '../types/api';
/**
* 待处理的用户问题
*/
interface PendingQuestion {
askId: string;
taskId: string;
question: string;
options: string[];
resolve: (answer: string) => void;
reject: (error: Error) => void;
}
/**
* 用户交互管理器
*/
export class UserInteractionManager {
private pendingQuestions = new Map<string, PendingQuestion>();
private webviewPanel: vscode.WebviewPanel | null = null;
/**
* 设置 WebView 面板(用于发送消息)
*/
setWebviewPanel(panel: vscode.WebviewPanel): void {
this.webviewPanel = panel;
}
/**
* 处理 ask_user 事件
* @param event ask_user 事件数据
* @param taskId 当前任务ID
*/
async handleAskUser(event: AskUserEvent, taskId: string): Promise<void> {
const { askId, question, options } = event;
console.log(`[UserInteraction] 收到问题: askId=${askId}, question=${question}`);
// 通过 WebView 显示问题
if (this.webviewPanel) {
this.webviewPanel.webview.postMessage({
command: 'showQuestion',
askId,
question,
options
});
}
// 创建 Promise 等待用户回答
return new Promise((resolve, reject) => {
this.pendingQuestions.set(askId, {
askId,
taskId,
question,
options,
resolve: (answer: string) => {
this.submitUserAnswer(askId, taskId, answer)
.then(() => resolve())
.catch(reject);
},
reject
});
// 设置超时5分钟
setTimeout(() => {
if (this.pendingQuestions.has(askId)) {
this.pendingQuestions.delete(askId);
reject(new Error('用户回答超时'));
}
}, 300000);
});
}
/**
* 处理用户提交的回答(从 WebView 调用)
* @param askId 问题ID
* @param selected 选中的选项
* @param customInput 自定义输入
*/
async receiveAnswer(
askId: string,
selected?: string[],
customInput?: string
): Promise<void> {
const pending = this.pendingQuestions.get(askId);
if (!pending) {
console.warn(`[UserInteraction] 问题不存在或已超时: askId=${askId}`);
return;
}
// 构建答案
const answer = customInput || selected?.join(', ') || '';
console.log(`[UserInteraction] 收到用户回答: askId=${askId}, answer=${answer}`);
// 移除待处理问题
this.pendingQuestions.delete(askId);
// 触发 resolve
pending.resolve(answer);
}
/**
* 提交用户回答到后端
*/
private async submitUserAnswer(
askId: string,
taskId: string,
answer: string
): Promise<void> {
const request: AnswerRequest = {
askId,
taskId,
customInput: answer
};
try {
const response = await submitAnswer(request);
if (!response.success) {
throw new Error(response.error || '提交回答失败');
}
console.log(`[UserInteraction] 回答已提交: askId=${askId}`);
} catch (error) {
console.error(`[UserInteraction] 提交回答失败: askId=${askId}`, error);
throw error;
}
}
/**
* 取消所有待处理的问题
*/
cancelAll(): void {
for (const [askId, pending] of this.pendingQuestions) {
pending.reject(new Error('用户交互已取消'));
}
this.pendingQuestions.clear();
}
/**
* 检查是否有待处理的问题
*/
hasPendingQuestions(): boolean {
return this.pendingQuestions.size > 0;
}
}
// 全局实例
export const userInteractionManager = new UserInteractionManager();

243
src/types/api.ts Normal file
View File

@ -0,0 +1,243 @@
/**
* 后端 API 类型定义
* 对应后端 IC Coder Backend 的接口格式
*/
// ============== 对话请求/响应 ==============
/**
* 对话请求
* POST /api/dialog/stream
*/
export interface DialogRequest {
/** 任务ID用于记忆隔离 */
taskId: string;
/** 用户消息 */
message: string;
/** 用户ID */
userId: string;
/** 工具模式 */
toolMode: 'ASK' | 'AGENT';
}
// ============== SSE 事件类型 ==============
/** SSE 事件类型枚举 */
export type SSEEventType =
| 'text_delta' // 文本增量
| 'tool_call' // 客户端工具调用请求
| 'tool_start' // 工具开始执行
| 'tool_complete' // 工具执行完成
| 'tool_error' // 工具执行错误
| 'ask_user' // 向用户提问
| 'complete' // 对话完成
| 'error' // 错误
| 'warning' // 警告
| 'notification' // 通知
| 'depth_update'; // 深度更新
/** text_delta 事件数据 */
export interface TextDeltaEvent {
text: string;
}
/** tool_start 事件数据 */
export interface ToolStartEvent {
tool_name: string;
tool_input: unknown;
}
/** tool_complete 事件数据 */
export interface ToolCompleteEvent {
tool_name: string;
result: string;
}
/** tool_error 事件数据 */
export interface ToolErrorEvent {
tool_name: string;
error: string;
}
/** ask_user 事件数据 */
export interface AskUserEvent {
askId: string;
question: string;
options: string[];
}
/** complete 事件数据 */
export interface CompleteEvent {
status: string;
finish_reason: string;
}
/** error 事件数据 */
export interface ErrorEvent {
message: string;
}
/** warning 事件数据 */
export interface WarningEvent {
message: string;
}
/** notification 事件数据 */
export interface NotificationEvent {
message: string;
}
/** depth_update 事件数据 */
export interface DepthUpdateEvent {
depth: number;
}
// ============== 工具调用协议 (MCP 格式) ==============
/**
* 工具调用请求MCP格式
* 后端通过 SSE tool_call 事件推送
*/
export interface ToolCallRequest {
/** JSON-RPC版本固定为"2.0" */
jsonrpc: '2.0';
/** 请求ID用于匹配响应 */
id: number;
/** 方法名,固定为"tools/call" */
method: 'tools/call';
/** 调用参数 */
params: {
/** 工具名称 */
name: string;
/** 工具参数 */
arguments: Record<string, unknown>;
};
}
/**
* 工具执行结果MCP格式
* POST /api/tool/result
*/
export interface ToolCallResult {
/** JSON-RPC版本 */
jsonrpc: '2.0';
/** 请求ID与ToolCallRequest.id对应 */
id: number;
/** 执行结果与error互斥 */
result?: ToolResultContent;
/** 错误信息与result互斥 */
error?: ToolResultError;
}
/** 工具执行结果内容 */
export interface ToolResultContent {
/** 内容列表 */
content: ContentItem[];
/** 是否为错误结果(业务错误,如编译失败) */
isError: boolean;
}
/** 内容项 */
export interface ContentItem {
/** 内容类型text, image, resource */
type: string;
/** 文本内容 */
text: string;
}
/** 工具系统错误 */
export interface ToolResultError {
/** 错误码 */
code: number;
/** 错误消息 */
message: string;
}
// ============== 用户回答 ==============
/**
* 用户回答请求
* POST /api/task/answer
*/
export interface AnswerRequest {
/** 问题ID */
askId: string;
/** 任务ID */
taskId: string;
/** 选中的选项列表 */
selected?: string[];
/** 自定义输入内容 */
customInput?: string;
}
/** 用户回答响应 */
export interface AnswerResponse {
success: boolean;
message?: string;
error?: string;
}
// ============== 工具结果响应 ==============
/** 工具结果响应 */
export interface ToolResultResponse {
success: boolean;
message?: string;
error?: string;
}
// ============== 辅助类型 ==============
/** 后端工具名称 */
export type ToolName =
| 'file_read'
| 'file_write'
| 'file_list'
| 'syntax_check'
| 'simulation'
| 'waveform_summary';
/** file_read 工具参数 */
export interface FileReadArgs {
path: string;
}
/** file_write 工具参数 */
export interface FileWriteArgs {
path: string;
content: string;
}
/** file_list 工具参数 */
export interface FileListArgs {
path?: string;
extension?: string;
}
/** syntax_check 工具参数 */
export interface SyntaxCheckArgs {
code: string;
}
/** simulation 工具参数 */
export interface SimulationArgs {
rtlPath: string;
tbPath: string;
duration?: string;
}
/** waveform_summary 工具参数 */
export interface WaveformSummaryArgs {
vcdPath: string;
signals: string;
checkpoints?: string;
}
/** 工具参数联合类型 */
export type ToolArgs =
| FileReadArgs
| FileWriteArgs
| FileListArgs
| SyntaxCheckArgs
| SimulationArgs
| WaveformSummaryArgs;

View File

@ -15,6 +15,15 @@ import {
checkIverilogAvailable, checkIverilogAvailable,
} from "./iverilogRunner"; } from "./iverilogRunner";
import { ChatHistoryManager } from "./chatHistoryManager"; import { ChatHistoryManager } from "./chatHistoryManager";
import { dialogManager, DialogSession } from "../services/dialogService";
import { userInteractionManager } from "../services/userInteraction";
import { healthCheck } from "../services/apiClient";
/** 是否使用后端服务(可通过配置控制) */
let useBackendService = true;
/** 当前对话会话 */
let currentSession: DialogSession | null = null;
/** /**
* 处理用户消息 * 处理用户消息
@ -26,33 +35,53 @@ export async function handleUserMessage(
) { ) {
console.log("收到用户消息:", text); console.log("收到用户消息:", text);
// 记录用户消息到历史 // 记录用户消息到历史(允许失败,不阻塞主流程)
const historyManager = ChatHistoryManager.getInstance(); try {
await historyManager.addUserMessage(text); const historyManager = ChatHistoryManager.getInstance();
await historyManager.addUserMessage(text);
} catch (error) {
console.warn("记录消息历史失败(可能没有打开工作区):", error);
}
// 检查是否是 VCD 生成命令 // 设置 WebView 面板用于用户交互
userInteractionManager.setWebviewPanel(panel);
// 检查是否是 VCD 生成命令(本地处理)
if (isVCDGenerationCommand(text)) { if (isVCDGenerationCommand(text)) {
await handleVCDGeneration(panel, extensionPath || ""); await handleVCDGeneration(panel, extensionPath || "");
return; return;
} }
// 检查是否是文件操作命令 // 检查是否是文件操作命令(本地处理)
const fileOperation = parseFileOperation(text); const fileOperation = parseFileOperation(text);
console.log("解析结果:", fileOperation);
if (fileOperation) { if (fileOperation) {
console.log("执行文件操作:", fileOperation.type, fileOperation.filePath); console.log("执行文件操作:", fileOperation.type, fileOperation.filePath);
await handleFileOperation(panel, fileOperation); await handleFileOperation(panel, fileOperation);
return; return;
} }
// 普通消息处理 // 尝试使用后端服务
console.log("作为普通消息处理"); if (useBackendService && extensionPath) {
try {
await handleUserMessageWithBackend(panel, text, extensionPath);
return;
} catch (error) {
console.error("后端服务不可用,回退到本地模式:", error);
// 后端不可用时,使用本地模拟回复
}
}
// 本地模拟回复(后端不可用时的 fallback
console.log("使用本地模拟回复");
const reply = getMockReply(text); const reply = getMockReply(text);
// 记录助手回复到历史 // 记录AI回复到历史(允许失败)
await historyManager.addAiMessage(reply); try {
const historyManager = ChatHistoryManager.getInstance();
await historyManager.addAiMessage(reply);
} catch (error) {
console.warn("记录AI回复历史失败:", error);
}
setTimeout(() => { setTimeout(() => {
panel.webview.postMessage({ panel.webview.postMessage({
@ -62,6 +91,140 @@ export async function handleUserMessage(
}, 500); }, 500);
} }
/**
* 使用后端服务处理用户消息
*/
async function handleUserMessageWithBackend(
panel: vscode.WebviewPanel,
text: string,
extensionPath: string
): Promise<void> {
// 创建或复用会话
if (!currentSession || !currentSession.active) {
currentSession = dialogManager.createSession(extensionPath);
}
const historyManager = ChatHistoryManager.getInstance();
// 显示状态栏
panel.webview.postMessage({
command: "updateStatus",
text: "思考中...",
type: "thinking",
});
return new Promise((resolve, reject) => {
currentSession!.sendMessage(text, {
onText: (fullText, isStreaming) => {
if (isStreaming) {
// 流式更新消息
panel.webview.postMessage({
command: "updateStreamingMessage",
text: fullText,
});
}
// 注意:完成时通过 onComplete 发送分段消息
},
onToolStart: (toolName) => {
// 实时显示工具状态
panel.webview.postMessage({
command: "toolStart",
toolName,
});
// 同时更新状态栏
panel.webview.postMessage({
command: "updateStatus",
text: `正在执行 ${toolName}...`,
type: "working",
});
},
onToolComplete: (toolName, result) => {
// 实时更新工具状态
panel.webview.postMessage({
command: "toolComplete",
toolName,
result,
});
},
onToolError: (toolName, error) => {
// 实时显示工具错误
panel.webview.postMessage({
command: "toolError",
toolName,
error,
});
},
onQuestion: (askId, question, options) => {
// 问题会在分段消息中显示,这里只更新状态栏
panel.webview.postMessage({
command: "updateStatus",
text: "等待用户回答...",
type: "working",
});
},
onComplete: async (segments) => {
// 隐藏状态栏
panel.webview.postMessage({
command: "hideStatus",
});
// 发送分段消息
console.log('[MessageHandler] 发送分段消息, 段落数:', segments.length);
console.log('[MessageHandler] segments 内容:', JSON.stringify(segments));
const result = await panel.webview.postMessage({
command: "receiveSegments",
segments: segments,
});
console.log('[MessageHandler] postMessage 返回值:', result);
resolve();
},
onError: (message) => {
panel.webview.postMessage({
command: "hideLoading",
});
panel.webview.postMessage({
command: "receiveMessage",
text: `❌ 错误: ${message}`,
});
reject(new Error(message));
},
onNotification: (message) => {
vscode.window.showInformationMessage(message);
},
});
});
}
/**
* 处理用户回答(从 WebView 调用)
*/
export async function handleUserAnswer(
askId: string,
selected?: string[],
customInput?: string
): Promise<void> {
if (currentSession) {
await currentSession.submitAnswer(askId, selected, customInput);
}
}
/**
* 中止当前对话
*/
export function abortCurrentDialog(): void {
dialogManager.abortCurrentSession();
currentSession = null;
}
/** /**
* 解析文件操作命令 * 解析文件操作命令
*/ */

View File

@ -5,12 +5,17 @@ import {
insertCodeToEditor, insertCodeToEditor,
handleReadFile, handleReadFile,
handleCreateFile, handleCreateFile,
handleUpdateFile,
handleRenameFile,
handleReplaceInFile,
handleUserAnswer,
abortCurrentDialog,
} from "../utils/messageHandler"; } from "../utils/messageHandler";
/** /**
* 创建并显示IC 侧边栏视图 * 创建并显示IC 侧边栏视图
*/ */
export function showICHelperPanel(content: vscode.ExtensionContext) { export function showICHelperPanel(context: vscode.ExtensionContext) {
// 创建WebView面板 // 创建WebView面板
const panel = vscode.window.createWebviewPanel( const panel = vscode.window.createWebviewPanel(
"icCoder", // 面板ID "icCoder", // 面板ID
@ -19,20 +24,20 @@ export function showICHelperPanel(content: vscode.ExtensionContext) {
{ {
enableScripts: true, enableScripts: true,
retainContextWhenHidden: true, retainContextWhenHidden: true,
localResourceRoots: [vscode.Uri.joinPath(content.extensionUri, "media")], localResourceRoots: [vscode.Uri.joinPath(context.extensionUri, "media")],
} }
); );
// 设置标签页图标 // 设置标签页图标
panel.iconPath = vscode.Uri.joinPath( panel.iconPath = vscode.Uri.joinPath(
content.extensionUri, context.extensionUri,
"media", "media",
"图案(方底).png" "图案(方底).png"
); );
// 获取页面内图标URI // 获取页面内图标URI
const iconUri = panel.webview.asWebviewUri( const iconUri = panel.webview.asWebviewUri(
vscode.Uri.joinPath(content.extensionUri, "media", "图案(方底).png") vscode.Uri.joinPath(context.extensionUri, "media", "图案(方底).png")
); );
// 设置HTML内容 // 设置HTML内容
panel.webview.html = getWebviewContent(iconUri.toString()); panel.webview.html = getWebviewContent(iconUri.toString());
@ -42,11 +47,20 @@ export function showICHelperPanel(content: vscode.ExtensionContext) {
(message) => { (message) => {
switch (message.command) { switch (message.command) {
case "sendMessage": case "sendMessage":
handleUserMessage(panel, message.text); handleUserMessage(panel, message.text, context.extensionPath);
break; break;
case "readFile": case "readFile":
handleReadFile(panel, message.filePath); handleReadFile(panel, message.filePath);
break; break;
case "updateFile":
handleUpdateFile(panel, message.filePath, message.content);
break;
case "renameFile":
handleRenameFile(panel, message.oldPath, message.newPath);
break;
case "replaceInFile":
handleReplaceInFile(panel, message.filePath, message.searchText, message.replaceText);
break;
case "insertCode": case "insertCode":
insertCodeToEditor(message.code); insertCodeToEditor(message.code);
break; break;
@ -61,10 +75,18 @@ export function showICHelperPanel(content: vscode.ExtensionContext) {
case "showInfo": case "showInfo":
vscode.window.showInformationMessage(message.text); vscode.window.showInformationMessage(message.text);
break; break;
// 新增:处理用户回答
case "submitAnswer":
handleUserAnswer(message.askId, message.selected, message.customInput);
break;
// 新增:中止对话
case "abortDialog":
abortCurrentDialog();
break;
} }
}, },
undefined, undefined,
content.subscriptions context.subscriptions
); );
} }

View File

@ -560,6 +560,251 @@ export function getWebviewContent(iconUri?: string): string {
transform: translateX(-50%) translateY(0); transform: translateX(-50%) translateY(0);
} }
} }
/* 流式消息样式 */
.streaming .message-content {
border-right: 2px solid var(--vscode-focusBorder);
animation: blink 1s infinite;
}
@keyframes blink {
0%, 50% { border-color: var(--vscode-focusBorder); }
51%, 100% { border-color: transparent; }
}
/* 加载指示器样式 */
.loading-message {
display: flex;
align-items: center;
gap: 10px;
padding: 12px 16px;
color: var(--vscode-descriptionForeground);
}
.loading-dots {
display: flex;
gap: 4px;
}
.loading-dots span {
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--vscode-focusBorder);
animation: loadingDot 1.4s infinite ease-in-out;
}
.loading-dots span:nth-child(1) { animation-delay: 0s; }
.loading-dots span:nth-child(2) { animation-delay: 0.2s; }
.loading-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes loadingDot {
0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }
40% { transform: scale(1); opacity: 1; }
}
.loading-text {
font-size: 13px;
}
/* 工具状态样式 */
.tool-status {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
margin: 4px 0;
font-size: 12px;
border-radius: 6px;
background: var(--vscode-textBlockQuote-background);
}
.tool-status.tool-start {
border-left: 3px solid var(--vscode-charts-blue);
}
.tool-status.tool-complete {
border-left: 3px solid var(--vscode-charts-green);
}
.tool-status.tool-error {
border-left: 3px solid var(--vscode-charts-red);
}
.tool-icon {
font-size: 14px;
}
.tool-name {
font-weight: 500;
color: var(--vscode-foreground);
}
.tool-status-text {
color: var(--vscode-descriptionForeground);
}
.tool-detail {
margin-top: 4px;
font-size: 11px;
color: var(--vscode-descriptionForeground);
white-space: pre-wrap;
max-height: 100px;
overflow-y: auto;
}
/* 用户问题样式 */
.question-message {
padding: 16px;
}
.question-text {
margin-bottom: 12px;
font-weight: 500;
}
.question-options {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.question-option {
padding: 8px 16px;
background: var(--vscode-button-secondaryBackground);
color: var(--vscode-button-secondaryForeground);
border: 1px solid var(--vscode-button-border);
border-radius: 6px;
cursor: pointer;
transition: all 0.2s;
}
.question-option:hover {
background: var(--vscode-button-secondaryHoverBackground);
}
.question-option.selected {
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
}
.question-message.answered .question-option:not(.selected) {
opacity: 0.5;
pointer-events: none;
}
.custom-input-container {
display: flex;
gap: 8px;
width: 100%;
margin-top: 8px;
}
.custom-input {
flex: 1;
padding: 8px 12px;
background: var(--vscode-input-background);
color: var(--vscode-input-foreground);
border: 1px solid var(--vscode-input-border);
border-radius: 6px;
font-size: 13px;
}
.custom-submit {
padding: 8px 16px;
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
border: none;
border-radius: 6px;
cursor: pointer;
}
.custom-submit:hover {
background: var(--vscode-button-hoverBackground);
}
.question-message.answered .custom-input-container {
display: none;
}
/* 分段消息样式 */
.segmented-message {
padding: 0;
}
.message-segment {
padding: 10px 14px;
}
.segment-text {
line-height: 1.6;
}
.segment-tool {
background: var(--vscode-textBlockQuote-background);
border-radius: 6px;
margin: 8px 0;
padding: 10px 14px;
}
.tool-segment-header {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
}
.tool-segment-icon {
font-size: 14px;
}
.tool-segment-name {
font-weight: 500;
color: var(--vscode-foreground);
}
.tool-segment-result {
margin-top: 6px;
font-size: 12px;
color: var(--vscode-descriptionForeground);
padding-left: 22px;
}
.segment-tool.tool-success {
border-left: 3px solid var(--vscode-charts-green);
}
.segment-tool.tool-error {
border-left: 3px solid var(--vscode-charts-red);
}
.segment-tool.tool-running {
border-left: 3px solid var(--vscode-charts-blue);
}
.segment-question {
background: var(--vscode-textBlockQuote-background);
border-radius: 6px;
margin: 8px 0;
padding: 12px 14px;
border-left: 3px solid var(--vscode-charts-orange);
}
.question-segment .question-text {
margin-bottom: 8px;
font-weight: 500;
}
.question-segment .question-options {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.question-opt {
padding: 4px 10px;
background: var(--vscode-button-secondaryBackground);
color: var(--vscode-button-secondaryForeground);
border-radius: 4px;
font-size: 12px;
}
/* 状态栏样式 */
.status-bar {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 16px;
background: var(--vscode-textBlockQuote-background);
border-radius: 6px;
margin: 8px 0;
font-size: 13px;
color: var(--vscode-descriptionForeground);
}
.status-indicator {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--vscode-charts-blue);
animation: statusPulse 1.5s ease-in-out infinite;
}
@keyframes statusPulse {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.5; transform: scale(0.8); }
}
.status-bar.working .status-indicator {
background: var(--vscode-charts-orange);
}
.status-bar.success .status-indicator {
background: var(--vscode-charts-green);
animation: none;
}
.status-bar.error .status-indicator {
background: var(--vscode-charts-red);
animation: none;
}
</style> </style>
</head> </head>
<body> <body>
@ -575,6 +820,12 @@ export function getWebviewContent(iconUri?: string): string {
<div class="chat-container"> <div class="chat-container">
<div id="messages" class="messages"></div> <div id="messages" class="messages"></div>
<!-- 状态栏 -->
<div id="statusBar" class="status-bar" style="display: none;">
<div class="status-indicator"></div>
<span id="statusText">思考中...</span>
</div>
<div class="quick-actions"> <div class="quick-actions">
<button class="quick-btn" onclick="quickAction('counter')">生成计数器</button> <button class="quick-btn" onclick="quickAction('counter')">生成计数器</button>
<button class="quick-btn" onclick="quickAction('fsm')">生成状态机</button> <button class="quick-btn" onclick="quickAction('fsm')">生成状态机</button>
@ -654,12 +905,15 @@ export function getWebviewContent(iconUri?: string): string {
</div> </div>
<script> <script>
console.log('[WebView] 脚本开始执行');
const vscode = acquireVsCodeApi(); const vscode = acquireVsCodeApi();
console.log('[WebView] vscode API 已获取');
const messagesEl = document.getElementById('messages'); const messagesEl = document.getElementById('messages');
const messageInput = document.getElementById('messageInput'); const messageInput = document.getElementById('messageInput');
const modeSelect = document.getElementById('modeSelect'); const modeSelect = document.getElementById('modeSelect');
const filePathInput = document.getElementById('filePathInput'); const filePathInput = document.getElementById('filePathInput');
const fileContentEl = document.getElementById('fileContent'); const fileContentEl = document.getElementById('fileContent');
console.log('[WebView] DOM 元素已获取, messagesEl:', !!messagesEl);
const errorMessageEl = document.getElementById('errorMessage'); const errorMessageEl = document.getElementById('errorMessage');
const fileEditorSection = document.getElementById('fileEditorSection'); const fileEditorSection = document.getElementById('fileEditorSection');
const fileEditorTextarea = document.getElementById('fileEditorTextarea'); const fileEditorTextarea = document.getElementById('fileEditorTextarea');
@ -952,12 +1206,56 @@ export function getWebviewContent(iconUri?: string): string {
} }
}); });
// 流式消息相关状态
let currentStreamingMessage = null;
let loadingIndicator = null;
window.addEventListener('message', event => { window.addEventListener('message', event => {
const message = event.data; const message = event.data;
console.log('[WebView] 收到消息:', message.command, message);
switch (message.command) { switch (message.command) {
case 'receiveMessage': case 'receiveMessage':
addMessage(message.text, 'bot'); // 完成流式消息或普通消息
if (currentStreamingMessage) {
finalizeStreamingMessage(message.text);
} else {
addMessage(message.text, 'bot');
}
break;
case 'receiveSegments':
// 渲染分段消息
renderSegments(message.segments);
break;
case 'updateStreamingMessage':
// 流式更新消息
updateOrCreateStreamingMessage(message.text);
break;
case 'showLoading':
showLoadingIndicator(message.text || '正在思考...');
break;
case 'hideLoading':
hideLoadingIndicator();
break;
case 'updateStatus':
updateStatusBar(message.text, message.type || 'thinking');
break;
case 'hideStatus':
hideStatusBar();
break;
case 'toolStart':
addToolStatus(message.toolName, 'start');
updateStatusBar('正在执行 ' + message.toolName + '...', 'working');
break;
case 'toolComplete':
addToolStatus(message.toolName, 'complete', message.result);
hideStatusBar();
break;
case 'toolError':
addToolStatus(message.toolName, 'error', message.error);
break;
case 'showQuestion':
showUserQuestion(message.askId, message.question, message.options);
break; break;
case 'vcdGenerated': case 'vcdGenerated':
// VCD 文件生成成功,显示带波形预览的消息 // VCD 文件生成成功,显示带波形预览的消息
@ -1026,6 +1324,270 @@ export function getWebviewContent(iconUri?: string): string {
} }
}); });
// 更新或创建流式消息
function updateOrCreateStreamingMessage(text) {
hideLoadingIndicator();
if (!currentStreamingMessage) {
// 创建新的流式消息元素
const div = document.createElement('div');
div.className = 'message bot-message streaming';
const messageContent = document.createElement('div');
messageContent.className = 'message-content';
messageContent.textContent = text;
div.appendChild(messageContent);
messagesEl.appendChild(div);
currentStreamingMessage = div;
} else {
// 更新现有消息内容
const messageContent = currentStreamingMessage.querySelector('.message-content');
if (messageContent) {
messageContent.textContent = text;
}
}
// 滚动到底部
messagesEl.scrollTop = messagesEl.scrollHeight;
}
// 完成流式消息
function finalizeStreamingMessage(finalText) {
if (currentStreamingMessage) {
const messageContent = currentStreamingMessage.querySelector('.message-content');
if (messageContent) {
messageContent.textContent = finalText;
}
currentStreamingMessage.classList.remove('streaming');
// 添加操作按钮
const actionsDiv = document.createElement('div');
actionsDiv.className = 'message-actions';
const copyBtn = document.createElement('button');
copyBtn.className = 'action-btn';
copyBtn.innerHTML = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>';
copyBtn.onclick = () => copyMessage(finalText, copyBtn);
actionsDiv.appendChild(copyBtn);
currentStreamingMessage.appendChild(actionsDiv);
currentStreamingMessage = null;
}
messagesEl.scrollTop = messagesEl.scrollHeight;
}
// 显示加载指示器
function showLoadingIndicator(text) {
hideLoadingIndicator();
loadingIndicator = document.createElement('div');
loadingIndicator.className = 'message bot-message loading-message';
loadingIndicator.innerHTML = \`
<div class="loading-dots">
<span></span><span></span><span></span>
</div>
<span class="loading-text">\${text}</span>
\`;
messagesEl.appendChild(loadingIndicator);
messagesEl.scrollTop = messagesEl.scrollHeight;
}
// 隐藏加载指示器
function hideLoadingIndicator() {
if (loadingIndicator) {
loadingIndicator.remove();
loadingIndicator = null;
}
}
// 更新状态栏
function updateStatusBar(text, type) {
const statusBar = document.getElementById('statusBar');
const statusText = document.getElementById('statusText');
if (statusBar && statusText) {
statusText.textContent = text;
statusBar.className = 'status-bar ' + (type || 'thinking');
statusBar.style.display = 'flex';
}
}
// 隐藏状态栏
function hideStatusBar() {
const statusBar = document.getElementById('statusBar');
if (statusBar) {
statusBar.style.display = 'none';
}
}
// 渲染分段消息
function renderSegments(segments) {
console.log('[WebView] renderSegments 被调用, segments:', segments);
if (!segments || segments.length === 0) {
console.log('[WebView] segments 为空,跳过渲染');
return;
}
// 移除流式消息(如果有)
if (currentStreamingMessage) {
console.log('[WebView] 移除流式消息');
currentStreamingMessage.remove();
currentStreamingMessage = null;
}
// 移除所有工具状态消息(因为会在分段中显示)
const toolStatuses = messagesEl.querySelectorAll('.tool-status');
console.log('[WebView] 找到工具状态消息数量:', toolStatuses.length);
toolStatuses.forEach(el => {
console.log('[WebView] 移除工具状态消息:', el.className);
el.remove();
});
// 创建消息容器
const container = document.createElement('div');
container.className = 'message bot-message segmented-message';
segments.forEach((segment, index) => {
const segmentDiv = document.createElement('div');
segmentDiv.className = 'message-segment segment-' + segment.type;
if (segment.type === 'text' && segment.content) {
segmentDiv.innerHTML = formatText(segment.content);
} else if (segment.type === 'tool') {
const statusIcon = segment.toolStatus === 'success' ? '✅' :
segment.toolStatus === 'error' ? '❌' : '🔧';
const statusClass = 'tool-' + (segment.toolStatus || 'running');
segmentDiv.className += ' ' + statusClass;
segmentDiv.innerHTML = \`
<div class="tool-segment-header">
<span class="tool-segment-icon">\${statusIcon}</span>
<span class="tool-segment-name">\${segment.toolName || '工具'}</span>
</div>
\${segment.toolResult ? \`<div class="tool-segment-result">\${segment.toolResult}</div>\` : ''}
\`;
} else if (segment.type === 'question') {
segmentDiv.innerHTML = \`
<div class="question-segment">
<div class="question-text">\${segment.question || ''}</div>
<div class="question-options">
\${(segment.options || []).map(opt => \`<span class="question-opt">\${opt}</span>\`).join('')}
</div>
</div>
\`;
}
container.appendChild(segmentDiv);
});
// 添加操作按钮
const actionsDiv = document.createElement('div');
actionsDiv.className = 'message-actions';
const copyBtn = document.createElement('button');
copyBtn.className = 'action-btn';
copyBtn.innerHTML = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>';
copyBtn.onclick = () => {
const textContent = segments
.filter(s => s.type === 'text' && s.content)
.map(s => s.content)
.join('\\n');
copyMessage(textContent, copyBtn);
};
actionsDiv.appendChild(copyBtn);
container.appendChild(actionsDiv);
messagesEl.appendChild(container);
messagesEl.scrollTop = messagesEl.scrollHeight;
}
// 格式化文本(简单的换行处理)
function formatText(text) {
return text
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/\\n/g, '<br>');
}
// 添加工具状态消息
function addToolStatus(toolName, status, detail) {
const statusIcons = {
start: '🔧',
complete: '✅',
error: '❌'
};
const statusTexts = {
start: '正在执行',
complete: '执行完成',
error: '执行失败'
};
const div = document.createElement('div');
div.className = \`message tool-status tool-\${status}\`;
div.innerHTML = \`
<span class="tool-icon">\${statusIcons[status]}</span>
<span class="tool-name">\${toolName}</span>
<span class="tool-status-text">\${statusTexts[status]}</span>
\${detail ? \`<div class="tool-detail">\${detail}</div>\` : ''}
\`;
messagesEl.appendChild(div);
messagesEl.scrollTop = messagesEl.scrollHeight;
}
// 显示用户问题
function showUserQuestion(askId, question, options) {
const div = document.createElement('div');
div.className = 'message bot-message question-message';
div.innerHTML = \`
<div class="question-text">\${question}</div>
<div class="question-options">
\${options.map((opt, i) => \`
<button class="question-option" data-ask-id="\${askId}" data-option="\${opt}">
\${opt}
</button>
\`).join('')}
<div class="custom-input-container">
<input type="text" class="custom-input" placeholder="或输入自定义回答..." />
<button class="custom-submit" data-ask-id="\${askId}">发送</button>
</div>
</div>
\`;
// 绑定选项点击事件
div.querySelectorAll('.question-option').forEach(btn => {
btn.onclick = () => {
const selected = btn.dataset.option;
submitAnswer(askId, [selected]);
div.classList.add('answered');
btn.classList.add('selected');
};
});
// 绑定自定义输入提交
const customInput = div.querySelector('.custom-input');
const customSubmit = div.querySelector('.custom-submit');
customSubmit.onclick = () => {
const value = customInput.value.trim();
if (value) {
submitAnswer(askId, null, value);
div.classList.add('answered');
}
};
messagesEl.appendChild(div);
messagesEl.scrollTop = messagesEl.scrollHeight;
}
// 提交用户回答
function submitAnswer(askId, selected, customInput) {
vscode.postMessage({
command: 'submitAnswer',
askId: askId,
selected: selected,
customInput: customInput
});
}
// 支持回车键读取文件 // 支持回车键读取文件
filePathInput.addEventListener('keydown', (event) => { filePathInput.addEventListener('keydown', (event) => {
if (event.key === 'Enter') { if (event.key === 'Enter') {