25 Commits

Author SHA1 Message Date
94d41c3da9 feat(modeSelector): 添加模式选择器组件并集成到输入区域 2025-12-29 11:53:59 +08:00
83f9e2f005 feat(contextCompress): 添加上下文压缩组件及其集成到输入区域 2025-12-29 11:32:39 +08:00
318d3964bd feat(contextButton): 添加上下文按钮组件及相关集成
- 新增上下文按钮组件及其 HTML 内容、样式和脚本代码
- 在输入区域中集成上下文按钮组件,替换原内联代码
- 将上下文按钮样式从输入区域样式中移除并统一管理
- 将上下文按钮事件处理函数移入独立脚本并集成至输入区域脚本
- 保持输入区域功能完整性,简化代码结构,提高可维护性
2025-12-29 11:26:15 +08:00
770da72ce3 feat: 添加模型选择器组件,整合模型选择功能到输入区域 2025-12-29 11:17:10 +08:00
c050f0e167 feat: 添加上下文按钮和自定义下拉框,优化输入区域样式 2025-12-28 19:39:49 +08:00
3daa66ea01 feat:修复多面板任务管理和历史会话加载问题
主要改进:
1. 修复面板ID唯一性问题,为每个面板生成唯一ID
2. 修改任务创建时机,改为首次发送消息时创建
3. 修复面板任务映射,同时存储taskId和projectPath
4. 修复历史会话加载后继续对话的保存问题
5. 移除ensureCurrentTask的自动创建逻辑,避免创建多余任务

技术细节:
- 为面板添加__uniqueId属性,确保多窗口独立性
- 修改panelTaskMap数据结构,存储完整任务信息
- 在selectConversation中更新面板任务映射
- 优化任务创建流程,避免空任务目录
2025-12-28 11:31:28 +08:00
9bdaf34471 feat:实现任务历史加载功能 - 完整还原对话样式
主要改进:
1. 实现selectConversation功能,支持点击任务历史列表加载会话
2. 优化会话存储格式,保存完整的segments信息(包括工具调用)
3. 添加旧格式到新格式的自动转换,兼容历史数据
4. 改进错误处理,自动清理无效的空任务目录
5. 优化路径编码逻辑,确保跨平台一致性
6. 前端支持clearChat、addUserMessage、addAiMessage命令

技术细节:
- 扩展AiMessage数据结构,添加segments字段
- 修改messageHandler保存逻辑,将完整segments保存到一条消息
- 实现loadTaskSession方法,加载指定任务的完整会话
- 添加自动清理机制,删除无效的空任务目录
2025-12-28 10:38:54 +08:00
25a8ea5aa4 feat:记录会话,按顺序记录AI和用户的会话
- 包含工具调用等
2025-12-25 15:13:15 +08:00
ef83016b7f feat:解决强制滚动的问题 2025-12-25 11:00:23 +08:00
2e6812d00d feat:vscode的版本要求从1.8改为1.07 2025-12-25 10:31:35 +08:00
b676846b2f feat:实现plan的开关的前端展示效果 2025-12-25 09:23:53 +08:00
9c787627a9 feat:实现已完成仿真之后直接调用波形预览组件展示波形预览图 2025-12-24 12:00:03 +08:00
463eedf1dd feat:实现了工具调用的icon替换
- 还将icon抽取出来成为独立的组件,方便统一管理
2025-12-24 11:26:25 +08:00
fb1156d24f feat:将英文的工具名称映射为中文展示 2025-12-24 10:43:55 +08:00
0b4ec2ca6e feat:修改了工具调用的样式 + 实现工具调用内容太长可以折叠的功能 2025-12-24 10:25:12 +08:00
10f0877a5e fix: 修复AI询问时选项点击后选中状态丢失的问题
- 添加 answeredQuestions Map 存储已回答问题的状态
- 在重新渲染时恢复选中状态和 answered 类
- 已回答的问题自动隐藏输入框并禁用点击事件
- 确保用户选择在页面更新时保持显示
2025-12-24 10:01:53 +08:00
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
26 changed files with 7985 additions and 1004 deletions

View File

@ -9,5 +9,7 @@
"dist": true // set this to false to include "dist" folder in search results "dist": true // set this to false to include "dist" folder in search results
}, },
// Turn off tsc task auto detection since we have the necessary tasks as npm scripts // Turn off tsc task auto detection since we have the necessary tasks as npm scripts
"typescript.tsc.autoDetect": "off" "typescript.tsc.autoDetect": "off",
// IC Coder 后端服务地址
"icCoder.backendUrl": "http://192.168.1.108:2233"
} }

View File

@ -0,0 +1,751 @@
# IC Coder 会话存储技术文档
## 1. 概述
IC Coder 的会话存储系统负责持久化保存用户与 AI 的对话历史,支持多项目、多任务的会话管理。系统采用文件系统存储方案,将会话数据按项目和任务组织,便于管理和检索。
### 1.1 核心特性
- **多项目支持**:不同项目的会话数据独立存储
- **任务级管理**:每个会话作为独立任务进行管理
- **分页加载**:支持历史会话的分页查询,提升性能
- **实时更新**:会话数据实时保存,防止数据丢失
- **统计信息**:记录 Token 使用量、对话轮次等统计数据
### 1.2 技术栈
- **存储方式**文件系统JSON/JSONL 格式)
- **存储位置**`~/.iccoder/projects/{项目路径编码}/{taskId}/`
- **数据格式**
- `meta.json`:任务元数据
- `conversation.json`:完整对话历史
- `conversation_meta.jsonl`对话轮次元数据JSONL 格式)
---
## 2. 架构设计
### 2.1 目录结构
```
~/.iccoder/
└── projects/
└── {项目路径编码}/
└── {taskId}/
├── meta.json # 任务元数据
├── conversation.json # 对话历史
└── conversation_meta.jsonl # 对话元数据
```
**项目路径编码规则**
- 移除冒号 `:`
- 将斜杠 `/` 和反斜杠 `\` 替换为 `--`
- 示例:`C:\Users\admin\Documents\Project``C--Users--admin--Documents--Project`
**任务 ID 格式**
- 格式:`task_{date}_{sequence}`
- 示例:`task_20231226_a3f9k2`
- `date`8 位日期YYYYMMDD
- `sequence`6 位随机字符串
### 2.2 核心类ChatHistoryManager
`ChatHistoryManager` 是会话存储的核心管理类,采用单例模式设计。
**主要职责**
1. 管理会话存储目录
2. 创建和切换任务
3. 保存和加载对话历史
4. 记录统计信息
5. 提供会话历史查询接口
**关键属性**
```typescript
private static instance: ChatHistoryManager;
private baseDir: string; // ~/.iccoder
private currentTaskId: string | null; // 当前任务 ID
private currentProjectPath: string | null; // 当前项目路径
```
---
## 3. 数据模型
### 3.1 TaskMeta任务元数据
存储在 `meta.json` 文件中,记录任务的基本信息和统计数据。
```typescript
interface TaskMeta {
taskId: string; // 任务 ID
taskName: string; // 任务名称
projectPath: string; // 项目路径
createdAt: string; // 创建时间ISO 8601
updatedAt: string; // 更新时间ISO 8601
stats: {
credits: number; // 消耗的积分
totalTokens: number; // 总 Token 数
inputTokens: number; // 输入 Token 数
outputTokens: number; // 输出 Token 数
};
}
```
**示例**
```json
{
"taskId": "task_20231226_a3f9k2",
"taskName": "实现计数器功能",
"projectPath": "C:\\Users\\admin\\Documents\\Project",
"createdAt": "2023-12-26T10:30:00.000Z",
"updatedAt": "2023-12-26T11:45:00.000Z",
"stats": {
"credits": 0,
"totalTokens": 15420,
"inputTokens": 8200,
"outputTokens": 7220
}
}
```
### 3.2 ChatMessage对话消息
存储在 `conversation.json` 文件中,记录完整的对话历史。
**消息类型枚举**
```typescript
enum MessageType {
USER = "USER", // 用户消息
AI = "AI", // AI 消息
SYSTEM = "SYSTEM", // 系统消息
TOOL_EXECUTION_RESULT = "TOOL_EXECUTION_RESULT" // 工具执行结果
}
```
**用户消息**
```typescript
interface UserMessage {
type: MessageType.USER;
contents: Array<{
type: "TEXT";
text: string;
}>;
}
```
**AI 消息**
```typescript
interface AiMessage {
type: MessageType.AI;
text: string;
toolExecutionRequests?: Array<{
id: string;
toolName: string;
parameters: any;
}>;
}
```
**系统消息**
```typescript
interface SystemMessage {
type: MessageType.SYSTEM;
text: string;
}
```
**工具执行结果消息**
```typescript
interface ToolExecutionResultMessage {
type: MessageType.TOOL_EXECUTION_RESULT;
id: string;
toolName: string;
text: string;
}
```
### 3.3 ConversationMeta对话轮次元数据
存储在 `conversation_meta.jsonl` 文件中每行一条记录JSONL 格式)。
```typescript
interface ConversationMeta {
turnId: number; // 对话轮次 ID
timestamp: string; // 时间戳ISO 8601
usage?: {
inputTokens?: number;
outputTokens?: number;
totalTokens?: number;
};
model?: string; // 使用的模型
duration?: number; // 耗时(毫秒)
}
```
**示例**
```jsonl
{"turnId":1,"timestamp":"2023-12-26T10:30:15.000Z","usage":{"inputTokens":120,"outputTokens":350,"totalTokens":470},"model":"gpt-4","duration":2500}
{"turnId":2,"timestamp":"2023-12-26T10:32:30.000Z","usage":{"inputTokens":200,"outputTokens":450,"totalTokens":650},"model":"gpt-4","duration":3200}
```
---
## 4. 核心功能实现
### 4.1 任务创建
**方法**`createTask(projectPath: string, taskName: string): Promise<TaskMeta>`
**流程**
1. 生成唯一的任务 ID
2. 创建任务元数据对象
3. 创建任务目录
4. 保存 `meta.json`
5. 初始化空的 `conversation.json`
6. 设置为当前任务
**代码位置**`chatHistoryManager.ts:114-146`
```typescript
public async createTask(projectPath: string, taskName: string): Promise<TaskMeta> {
const taskId = this.generateTaskId();
const now = new Date().toISOString();
const meta: TaskMeta = {
taskId,
taskName,
projectPath,
createdAt: now,
updatedAt: now,
stats: {
credits: 0,
totalTokens: 0,
inputTokens: 0,
outputTokens: 0
}
};
this.currentTaskId = taskId;
this.currentProjectPath = projectPath;
// 创建任务目录
const taskDir = this.getTaskDir(projectPath, taskId);
await this.ensureTaskDir(taskDir);
// 保存 meta.json
await this.saveTaskMeta(meta);
// 初始化空的 conversation.json
await this.saveConversation([]);
return meta;
}
```
### 4.2 消息保存
系统提供了四种消息保存方法:
#### 4.2.1 添加用户消息
**方法**`addUserMessage(text: string): Promise<void>`
**代码位置**`chatHistoryManager.ts:285-299`
```typescript
public async addUserMessage(text: string): Promise<void> {
await this.ensureCurrentTask();
const messages = await this.loadConversation();
const userMessage: UserMessage = {
type: MessageType.USER,
contents: [{ type: "TEXT", text }]
};
messages.push(userMessage);
await this.saveConversation(messages);
// 更新任务元数据
await this.updateTaskTimestamp();
}
```
#### 4.2.2 添加 AI 消息
**方法**`addAiMessage(text: string, toolRequests?: any[]): Promise<void>`
**代码位置**`chatHistoryManager.ts:304-319`
#### 4.2.3 添加系统消息
**方法**`addSystemMessage(text: string): Promise<void>`
**代码位置**`chatHistoryManager.ts:324-335`
#### 4.2.4 添加工具执行结果
**方法**`addToolExecutionResult(id: string, toolName: string, result: string): Promise<void>`
**代码位置**`chatHistoryManager.ts:340-353`
### 4.3 对话元数据记录
**方法**`recordTurnMeta(turnId, usage?, model?, duration?): Promise<void>`
**功能**:记录每轮对话的元数据,包括 Token 使用量、模型信息、耗时等。
**代码位置**`chatHistoryManager.ts:358-378`
```typescript
public async recordTurnMeta(
turnId: number,
usage?: { inputTokens?: number; outputTokens?: number; totalTokens?: number },
model?: string,
duration?: number
): Promise<void> {
const meta: ConversationMeta = {
turnId,
timestamp: new Date().toISOString(),
usage,
model,
duration
};
await this.appendConversationMeta(meta);
// 更新任务统计
if (usage) {
await this.updateTaskStats(usage);
}
}
```
### 4.4 会话历史查询
**方法**`getConversationHistoryList(projectPath, offset, limit): Promise<{items, total, hasMore}>`
**功能**:分页查询项目的会话历史列表。
**参数**
- `projectPath`:项目路径
- `offset`:偏移量(从第几条开始,默认 0
- `limit`:每页数量(默认 10
**返回值**
```typescript
{
items: Array<{
id: string; // 任务 ID
title: string; // 会话标题(第一句用户消息)
timestamp: string; // 创建时间
}>;
total: number; // 总数
hasMore: boolean; // 是否还有更多
}
```
**代码位置**`chatHistoryManager.ts:525-590`
**实现逻辑**
1. 获取项目的所有任务列表(按更新时间倒序)
2. 根据 offset 和 limit 进行分页
3. 读取每个任务的 `conversation.json`
4. 提取第一条用户消息作为标题(截取前 50 个字符)
5. 返回分页结果
---
## 5. 前端集成
### 5.1 会话历史栏组件
**文件**`conversationHistoryBar.ts`
**组件结构**
- 下拉按钮:显示 "Past Conversations"
- 下拉菜单:显示会话历史列表
- 新建按钮:创建新会话
**关键功能**
#### 5.1.1 加载会话历史
```javascript
function loadMoreHistory() {
if (isLoadingHistory || (currentOffset > 0 && !hasMoreHistory)) {
return;
}
// 检查是否已达到最大数量100 条)
if (currentOffset >= MAX_HISTORY_ITEMS) {
return;
}
isLoadingHistory = true;
vscode.postMessage({
command: 'loadConversationHistory',
offset: currentOffset,
limit: HISTORY_PAGE_SIZE
});
}
```
#### 5.1.2 渲染会话列表
```javascript
function renderConversationHistory(data) {
isLoadingHistory = false;
// 追加新数据
conversationHistory = conversationHistory.concat(data.items);
totalHistory = data.total;
hasMoreHistory = data.hasMore;
currentOffset += data.items.length;
// 渲染所有历史记录
historyList.innerHTML = conversationHistory.map(item => `
<div class="history-item" onclick="selectConversation('${item.id}')">
<div class="history-item-title">${item.title || '未命名会话'}</div>
<div class="history-item-time">${formatTime(item.timestamp)}</div>
</div>
`).join('');
// 如果还有更多数据,添加"加载更多"提示
if (hasMoreHistory && currentOffset < MAX_HISTORY_ITEMS) {
historyList.innerHTML += `
<div class="history-load-more">
<span>滚动加载更多...</span>
</div>
`;
}
}
```
#### 5.1.3 滚动加载
```javascript
historyDropdownMenu.addEventListener('scroll', () => {
const menu = historyDropdownMenu;
const scrollTop = menu.scrollTop;
const scrollHeight = menu.scrollHeight;
const clientHeight = menu.clientHeight;
// 当滚动到距离底部 50px 时,加载更多
if (scrollHeight - scrollTop - clientHeight < 50) {
loadMoreHistory();
}
});
```
#### 5.1.4 时间格式化
```javascript
function formatTime(timestamp) {
const date = new Date(timestamp);
const now = new Date();
const diff = now - date;
if (diff < 60000) return '刚刚';
if (diff < 3600000) return Math.floor(diff / 60000) + '分钟前';
if (diff < 86400000) return Math.floor(diff / 3600000) + '小时前';
if (diff < 604800000) return Math.floor(diff / 86400000) + '天前';
// 超过7天显示具体日期
return date.toLocaleDateString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
}
```
### 5.2 后端消息处理
**文件**`ICHelperPanel.ts`
**消息处理流程**
```typescript
case "loadConversationHistory":
// 加载会话历史(支持分页)
loadConversationHistory(panel, message.offset || 0, message.limit || 10);
break;
case "selectConversation":
// 选择会话(暂未实现)
break;
case "createNewConversation":
// 创建新会话 - 在当前编辑器组中打开新标签页
showICHelperPanel(context, panel.viewColumn);
break;
```
**加载会话历史实现**
```typescript
async function loadConversationHistory(
panel: vscode.WebviewPanel,
offset: number = 0,
limit: number = 10
) {
try {
const historyManager = ChatHistoryManager.getInstance();
const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
if (!workspacePath) {
// 没有打开的工作区,返回空历史
panel.webview.postMessage({
command: "conversationHistory",
items: [],
total: 0,
hasMore: false,
});
return;
}
// 获取会话历史列表(支持分页)
const result = await historyManager.getConversationHistoryList(
workspacePath,
offset,
limit
);
// 发送会话历史到前端
panel.webview.postMessage({
command: "conversationHistory",
items: result.items,
total: result.total,
hasMore: result.hasMore,
});
} catch (error) {
console.error("加载会话历史失败:", error);
// 发生错误时返回空历史
panel.webview.postMessage({
command: "conversationHistory",
items: [],
total: 0,
hasMore: false,
});
}
}
```
---
## 6. 使用示例
### 6.1 创建新任务并保存对话
```typescript
const historyManager = ChatHistoryManager.getInstance();
// 创建新任务
const task = await historyManager.createTask(
'C:\\Users\\admin\\Documents\\Project',
'实现计数器功能'
);
// 添加用户消息
await historyManager.addUserMessage('请帮我生成一个4位计数器');
// 添加 AI 消息
await historyManager.addAiMessage(
'好的我来帮你生成一个4位计数器...',
[{ id: '1', toolName: 'generateCode', parameters: {} }]
);
// 添加工具执行结果
await historyManager.addToolExecutionResult(
'1',
'generateCode',
'代码生成成功'
);
// 记录对话元数据
await historyManager.recordTurnMeta(
1,
{ inputTokens: 120, outputTokens: 350, totalTokens: 470 },
'gpt-4',
2500
);
```
### 6.2 查询会话历史
```typescript
const historyManager = ChatHistoryManager.getInstance();
// 获取第一页前10条
const page1 = await historyManager.getConversationHistoryList(
'C:\\Users\\admin\\Documents\\Project',
0,
10
);
console.log('总数:', page1.total);
console.log('是否还有更多:', page1.hasMore);
console.log('会话列表:', page1.items);
// 获取第二页第11-20条
const page2 = await historyManager.getConversationHistoryList(
'C:\\Users\\admin\\Documents\\Project',
10,
10
);
```
### 6.3 切换任务
```typescript
const historyManager = ChatHistoryManager.getInstance();
// 切换到指定任务
const success = await historyManager.switchTask(
'C:\\Users\\admin\\Documents\\Project',
'task_20231226_a3f9k2'
);
if (success) {
// 获取当前任务会话
const session = await historyManager.getCurrentTaskSession();
console.log('任务元数据:', session.meta);
console.log('对话历史:', session.messages);
console.log('对话元数据:', session.conversationMeta);
}
```
---
## 7. 性能优化
### 7.1 分页加载
- 前端默认每页加载 10 条记录
- 最多显示 100 条历史记录
- 滚动到底部时自动加载下一页
### 7.2 懒加载
- 只在打开下拉菜单时才加载会话历史
- 避免不必要的文件读取操作
### 7.3 缓存机制
- 前端缓存已加载的会话列表
- 避免重复请求相同数据
### 7.4 文件格式优化
- 使用 JSONL 格式存储对话元数据,支持追加写入
- 避免频繁读写整个文件
---
## 8. 错误处理
### 8.1 目录不存在
系统会自动创建不存在的目录:
```typescript
private async ensureTaskDir(taskDir: string): Promise<void> {
try {
const uri = vscode.Uri.file(taskDir);
try {
await vscode.workspace.fs.stat(uri);
} catch {
// 目录不存在,创建它
await vscode.workspace.fs.createDirectory(uri);
console.log(`创建任务目录: ${taskDir}`);
}
} catch (error) {
console.error("创建任务目录失败:", error);
throw error;
}
}
```
### 8.2 文件读取失败
读取失败时返回默认值:
```typescript
private async loadConversation(): Promise<ChatMessage[]> {
try {
const uri = vscode.Uri.file(conversationPath);
const content = await vscode.workspace.fs.readFile(uri);
const data = Buffer.from(content).toString('utf-8');
return JSON.parse(data);
} catch (error) {
// 文件不存在或读取失败,返回空数组
return [];
}
}
```
### 8.3 无工作区处理
没有打开工作区时,自动创建默认任务:
```typescript
private async ensureCurrentTask(): Promise<void> {
if (!this.currentTaskId || !this.currentProjectPath) {
const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
if (workspacePath) {
await this.createTask(workspacePath, "默认任务");
} else {
throw new Error("没有打开的工作区,无法创建任务");
}
}
}
```
---
## 9. 未来扩展
### 9.1 会话切换功能
目前 `selectConversation` 功能暂未实现,未来可以支持:
- 点击历史会话,加载该会话的完整对话历史
- 在新标签页中打开历史会话
- 继续历史会话的对话
### 9.2 会话搜索
- 支持按关键词搜索会话
- 支持按时间范围筛选
- 支持按 Token 使用量排序
### 9.3 会话导出
- 导出为 Markdown 格式
- 导出为 JSON 格式
- 导出为 PDF 格式
### 9.4 会话统计
- 显示总对话轮次
- 显示总 Token 使用量
- 显示平均响应时间
### 9.5 云端同步
- 支持将会话数据同步到云端
- 支持多设备访问
- 支持团队协作
---
## 10. 总结
IC Coder 的会话存储系统采用文件系统存储方案,具有以下优势:
1. **简单可靠**:无需额外的数据库依赖
2. **易于备份**:直接复制文件即可备份
3. **跨平台**:支持 Windows、macOS、Linux
4. **可扩展**:易于添加新的数据字段
5. **高性能**:分页加载,避免一次性加载大量数据
系统已经实现了核心的会话管理功能,包括任务创建、消息保存、历史查询等,为用户提供了完整的会话历史管理体验。

View File

@ -3,8 +3,9 @@
"displayName": "IC Coder plugin", "displayName": "IC Coder plugin",
"description": "Agentic Verilog Coding Platform for Real-World FPGAs", "description": "Agentic Verilog Coding Platform for Real-World FPGAs",
"version": "0.0.2", "version": "0.0.2",
"publisher": "ic-coder-team",
"engines": { "engines": {
"vscode": "^1.107.0" "vscode": "^1.80.0"
}, },
"icon": "media/图案(方底).png", "icon": "media/图案(方底).png",
"categories": [ "categories": [
@ -91,6 +92,26 @@
"type": "webview" "type": "webview"
} }
] ]
},
"configuration": {
"title": "IC Coder",
"properties": {
"icCoder.backendUrl": {
"type": "string",
"default": "http://192.168.1.108:2233",
"description": "后端服务地址"
},
"icCoder.timeout": {
"type": "number",
"default": 60000,
"description": "请求超时时间(毫秒)"
},
"icCoder.userId": {
"type": "string",
"default": "default-user",
"description": "用户ID临时配置"
}
}
} }
}, },
"scripts": { "scripts": {
@ -108,9 +129,10 @@
"devDependencies": { "devDependencies": {
"@types/mocha": "^10.0.10", "@types/mocha": "^10.0.10",
"@types/node": "22.x", "@types/node": "22.x",
"@types/vscode": "^1.107.0", "@types/vscode": "^1.80.0",
"@vscode/test-cli": "^0.0.12", "@vscode/test-cli": "^0.0.12",
"@vscode/test-electron": "^2.5.2", "@vscode/test-electron": "^2.5.2",
"@vscode/vsce": "^3.7.1",
"eslint": "^9.39.1", "eslint": "^9.39.1",
"ts-loader": "^9.5.4", "ts-loader": "^9.5.4",
"typescript": "^5.9.3", "typescript": "^5.9.3",
@ -125,6 +147,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",

1953
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

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

@ -0,0 +1,48 @@
/**
* 配置管理
* 从 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

@ -0,0 +1,52 @@
/**
* 工具图标定义
* 包含各种工具的 SVG 图标
*/
/**
* 折叠图标 SVG用于可折叠的工具结果
*/
export const collapseIconSvg = `
<span class="tool-collapse-icon">
<svg class="icon-collapsed" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M355.05845325 160.07583932c-19.63862503 19.63862503-19.63862503 51.53175211 0 71.17037712L618.05891976 494.24668297c9.74075802 9.74075802 9.74075802 25.76587604 0 35.50663406L355.05845325 792.75378356c-19.63862503 19.63862503-19.63862503 51.53175211 0 71.17037712s51.53175211 19.63862503 71.17037716 0L706.98261396 583.17037714c39.27725009-39.27725009 39.27725009-102.90639522 0-142.18364526L426.22883041 160.07583932c-19.63862503-19.63862503-51.53175211-19.63862503-71.17037716 0z" fill="#8a8a8a"/>
</svg>
<svg class="icon-expanded" style="display:none;" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M899.70688 272.92672l-382.19776 373.53472-393.45664-384.512a43.52 43.52 0 0 0-60.52352 0 41.14944 41.14944 0 0 0 0 59.14624l423.72096 414.11584a43.35616 43.35616 0 0 0 60.56448 0l412.4672-403.11296a41.20064 41.20064 0 0 0 11.06432-40.41728 42.3424 42.3424 0 0 0-30.2848-29.58336 43.52 43.52 0 0 0-41.35424 10.84416z m0 0" fill="#8a8a8a"/>
</svg>
</span>
`;
/**
* 文件写入完成图标 SVG
*/
export const fileWriteIconSvg = `
<span class="tool-file-write-icon">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M866.304 852.096H161.728a31.36 31.36 0 0 1-30.528-30.592 31.36 31.36 0 0 1 30.528-30.528h704.64a31.36 31.36 0 0 1 30.528 30.528c0 16.32-12.224 30.592-30.592 30.592z m-65.152-134.4h-392.96a31.36 31.36 0 0 1-30.592-30.592 31.36 31.36 0 0 1 30.528-30.528h391.04a31.36 31.36 0 0 1 30.528 30.528c0 16.32-12.224 30.592-28.544 30.592z m-596.672-179.2l91.648 93.632-40.704 40.768-91.648-91.648 40.704-42.752zM552.704 188.16l91.648 93.696-42.752 40.704-91.648-91.648 42.752-42.752z" fill="#8a8a8a"/>
<path d="M176 733.952a72.96 72.96 0 0 1-50.88-22.4c-14.272-14.272-22.4-36.672-22.4-56.96l8.128-99.84 423.552-425.6a104.576 104.576 0 0 1 75.328-30.528c32.64 0 63.168 14.272 85.568 36.672 24.384 24.384 36.608 56.96 36.608 89.6 0 28.48-12.16 54.976-32.576 73.28l-419.456 427.648-99.84 8.128H176z m-4.096-152.704l-6.08 77.376c0 4.096 2.048 8.128 4.096 8.128h2.048l77.376-6.08 417.344-425.6c8.128-8.128 12.224-18.304 12.224-28.48 0-14.272-6.08-28.48-16.32-38.72-10.24-10.24-22.4-16.32-36.672-16.32-12.16 0-22.4 4.096-30.528 12.224L171.904 581.248z" fill="#8a8a8a"/>
</svg>
</span>
`;
/**
* 语法检查图标 SVG
*/
export const syntaxCheckIconSvg = `
<span class="tool-syntax-check-icon">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M143.36 241.8688h638.976a33.28 33.28 0 0 0 0-66.56H143.36a33.28 33.28 0 0 0 0 66.56zM143.36 421.2736h423.5264a33.28 33.28 0 0 0 0-66.56H143.36a33.28 33.28 0 0 0 0 66.56zM419.0208 532.8384H143.36a33.28 33.28 0 0 0 0 66.56h275.6608a33.28 33.28 0 0 0 0-66.56zM365.5168 709.5296H129.0752a33.28 33.28 0 0 0 0 66.56h236.4416a33.28 33.28 0 1 0 0-66.56zM918.4256 791.8592l-82.5856-82.432a178.8928 178.8928 0 1 0-47.0528 47.0528l82.5856 82.4832a33.28 33.28 0 1 0 47.0528-47.104z m-342.3232-182.9376a112.128 112.128 0 1 1 112.128 112.0768 112.2816 112.2816 0 0 1-112.128-112.0768z" fill="#8a8a8a"/>
</svg>
</span>
`;
/**
* 已检索代码图标 SVG
*/
export const SearchCode = `
<span class="tool-search-code-icon">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M916.33 859.76L678.51 621.94A318.92 318.92 0 0 0 768 400c0-176.73-143.27-320-320-320S128 223.27 128 400s143.27 320 320 320a318.48 318.48 0 0 0 167.88-47.55l243.88 243.88a40 40 0 1 0 56.57-56.57zM192 400c0-141.38 114.62-256 256-256s256 114.62 256 256-114.62 256-256 256-256-114.62-256-256z" fill="#8a8a8a"/>
</svg>
</span>
`;

View File

@ -13,16 +13,16 @@ export function activate(context: vscode.ExtensionContext) {
// 注册命令:打开助手面板 // 注册命令:打开助手面板
const openPanelCommand = vscode.commands.registerCommand( const openPanelCommand = vscode.commands.registerCommand(
"ic-coder.openPanel", "ic-coder.openPanel",
() => { async () => {
showICHelperPanel(context); await showICHelperPanel(context);
} }
); );
// 注册命令:打开聊天(用于侧边栏) // 注册命令:打开聊天(用于侧边栏)
const openChatCommand = vscode.commands.registerCommand( const openChatCommand = vscode.commands.registerCommand(
"ic-coder.openChat", "ic-coder.openChat",
() => { async () => {
showICHelperPanel(context); await showICHelperPanel(context);
} }
); );

View File

@ -6,14 +6,21 @@ 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";
import { ChatHistoryManager } from "../utils/chatHistoryManager";
import { MessageType } from "../types/chatHistory";
/** /**
* 创建并显示 IC 助手面板 * 创建并显示 IC 助手面板
*/ */
export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?: vscode.ViewColumn) { export async function showICHelperPanel(
context: vscode.ExtensionContext,
viewColumn?: vscode.ViewColumn
) {
// 创建WebView面板 // 创建WebView面板
const panel = vscode.window.createWebviewPanel( const panel = vscode.window.createWebviewPanel(
"icCoder", // 面板ID "icCoder", // 面板ID
@ -26,8 +33,16 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
} }
); );
// 为面板生成唯一ID
const panelId = `panel_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
(panel as any).__uniqueId = panelId;
// 设置标签页图标 // 设置标签页图标
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(
@ -39,9 +54,29 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
// 处理消息 // 处理消息
panel.webview.onDidReceiveMessage( panel.webview.onDidReceiveMessage(
(message) => { async (message) => {
const historyManager = ChatHistoryManager.getInstance();
const panelId = (panel as any).__uniqueId;
switch (message.command) { switch (message.command) {
case "sendMessage": case "sendMessage":
// 仅在用户发送消息时,确保面板有任务上下文
// 如果没有,则创建新任务(仅在首次发送消息时)
if (!historyManager.getPanelTask(panelId)) {
const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
if (workspacePath) {
try {
const taskMeta = await historyManager.createTask(workspacePath, "新对话");
historyManager.setPanelTask(panelId, taskMeta.taskId, workspacePath);
} catch (error) {
console.error("创建任务失败:", error);
}
}
}
// 切换到当前面板的任务上下文
historyManager.switchToPanelTask(panelId);
handleUserMessage(panel, message.text, context.extensionPath); handleUserMessage(panel, message.text, context.extensionPath);
break; break;
case "readFile": case "readFile":
@ -54,7 +89,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 +105,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":
@ -79,20 +122,43 @@ export function showICHelperPanel(context: vscode.ExtensionContext, viewColumn?:
showICHelperPanel(context, panel.viewColumn); showICHelperPanel(context, panel.viewColumn);
break; break;
case "loadConversationHistory": case "loadConversationHistory":
// 加载会话历史(暂未实现 // 加载会话历史(支持分页
panel.webview.postMessage({ loadConversationHistory(panel, message.offset || 0, message.limit || 10);
command: 'conversationHistory',
history: []
});
break; break;
case "selectConversation": case "selectConversation":
// 选择会话(暂未实现) // 选择会话
if (message.conversationId) {
selectConversation(panel, message.conversationId, context.extensionPath);
}
break;
// 新增:处理用户回答
case "submitAnswer":
handleUserAnswer(
message.askId,
message.selected,
message.customInput
);
break;
// 新增:中止对话
case "abortDialog":
abortCurrentDialog();
break; break;
} }
}, },
undefined, undefined,
context.subscriptions context.subscriptions
); );
// 面板关闭时清理任务映射
panel.onDidDispose(
() => {
const historyManager = ChatHistoryManager.getInstance();
const panelId = (panel as any).__uniqueId;
historyManager.removePanelTask(panelId);
},
undefined,
context.subscriptions
);
} }
/** /**
@ -104,8 +170,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 +179,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 +191,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 < 1024
? `${fileSizeKB.toFixed(2)} KB` ? `${fileSizeKB.toFixed(2)} KB`
: `${(fileSizeKB / 1024).toFixed(2)} MB`; : `${(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 +224,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 +257,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 +275,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 +288,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 +304,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,13 +330,235 @@ 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;
} }
/**
* 加载会话历史(支持分页)
*/
async function loadConversationHistory(
panel: vscode.WebviewPanel,
offset: number = 0,
limit: number = 10
) {
try {
const historyManager = ChatHistoryManager.getInstance();
const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
if (!workspacePath) {
// 没有打开的工作区,返回空历史
panel.webview.postMessage({
command: "conversationHistory",
items: [],
total: 0,
hasMore: false,
});
return;
}
// 获取会话历史列表(支持分页)
const result = await historyManager.getConversationHistoryList(
workspacePath,
offset,
limit
);
// 发送会话历史到前端
panel.webview.postMessage({
command: "conversationHistory",
items: result.items,
total: result.total,
hasMore: result.hasMore,
});
} catch (error) {
console.error("加载会话历史失败:", error);
// 发生错误时返回空历史
panel.webview.postMessage({
command: "conversationHistory",
items: [],
total: 0,
hasMore: false,
});
}
}
/**
* 选择并加载指定的会话
*/
async function selectConversation(
panel: vscode.WebviewPanel,
taskId: string,
extensionPath: string
) {
try {
const historyManager = ChatHistoryManager.getInstance();
const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
if (!workspacePath) {
vscode.window.showErrorMessage("没有打开的工作区");
return;
}
// 加载任务会话
const taskSession = await historyManager.loadTaskSession(workspacePath, taskId);
if (!taskSession) {
vscode.window.showErrorMessage(`加载任务 ${taskId} 失败: 任务不存在或数据损坏`);
return;
}
// 切换到该任务
const switched = await historyManager.switchTask(workspacePath, taskId);
if (!switched) {
vscode.window.showErrorMessage(`切换到任务 ${taskId} 失败`);
return;
}
// 更新面板的任务映射,确保后续对话保存到正确的任务中
const panelId = (panel as any).__uniqueId;
historyManager.setPanelTask(panelId, taskId, workspacePath);
// 清空当前聊天界面
panel.webview.postMessage({
command: "clearChat"
});
// 将会话历史消息转换为 segments 格式并发送到前端显示
const segments: any[] = [];
let i = 0;
while (i < taskSession.messages.length) {
const message = taskSession.messages[i];
if (message.type === MessageType.USER) {
// 用户消息 - 如果有累积的 segments先发送
if (segments.length > 0) {
panel.webview.postMessage({
command: "receiveSegments",
segments: [...segments]
});
segments.length = 0;
}
// 发送用户消息
const textContent = message.contents?.find(c => c.type === 'TEXT');
if (textContent && 'text' in textContent) {
panel.webview.postMessage({
command: "addUserMessage",
text: textContent.text
});
}
i++;
} else if (message.type === MessageType.AI) {
// AI消息 - 如果有 segments直接使用
if (message.segments && message.segments.length > 0) {
panel.webview.postMessage({
command: "receiveSegments",
segments: message.segments
});
i++;
} else {
// 旧格式:需要转换为 segments
// 收集连续的 AI 消息、工具调用和工具结果
if (message.text) {
segments.push({
type: 'text',
content: message.text
});
}
// 检查是否有工具调用
if (message.toolExecutionRequests && message.toolExecutionRequests.length > 0) {
for (const toolReq of message.toolExecutionRequests) {
// 查找对应的工具执行结果
let toolResult = '';
if (i + 1 < taskSession.messages.length) {
const nextMsg = taskSession.messages[i + 1];
if (nextMsg.type === MessageType.TOOL_EXECUTION_RESULT &&
nextMsg.id === toolReq.id) {
toolResult = nextMsg.text;
i++; // 跳过工具结果消息
}
}
segments.push({
type: 'tool',
toolName: toolReq.name,
askId: toolReq.id,
toolResult: toolResult
});
}
}
i++;
// 继续收集后续的 AI 消息,直到遇到用户消息或有 segments 的 AI 消息
while (i < taskSession.messages.length) {
const nextMsg = taskSession.messages[i];
if (nextMsg.type === MessageType.USER) {
break;
}
if (nextMsg.type === MessageType.AI) {
if (nextMsg.segments && nextMsg.segments.length > 0) {
break;
}
if (nextMsg.text) {
segments.push({
type: 'text',
content: nextMsg.text
});
}
if (nextMsg.toolExecutionRequests && nextMsg.toolExecutionRequests.length > 0) {
for (const toolReq of nextMsg.toolExecutionRequests) {
let toolResult = '';
if (i + 1 < taskSession.messages.length) {
const resultMsg = taskSession.messages[i + 1];
if (resultMsg.type === MessageType.TOOL_EXECUTION_RESULT &&
resultMsg.id === toolReq.id) {
toolResult = resultMsg.text;
i++; // 跳过工具结果消息
}
}
segments.push({
type: 'tool',
toolName: toolReq.name,
askId: toolReq.id,
toolResult: toolResult
});
}
}
i++;
} else if (nextMsg.type === MessageType.TOOL_EXECUTION_RESULT) {
// 独立的工具结果(没有被上面处理的)
i++;
} else {
i++;
}
}
}
} else {
i++;
}
}
// 发送剩余的 segments
if (segments.length > 0) {
panel.webview.postMessage({
command: "receiveSegments",
segments: segments
});
}
vscode.window.showInformationMessage(`已加载会话: ${taskSession.meta.taskName}`);
} catch (error) {
console.error("选择会话失败:", error);
vscode.window.showErrorMessage(`加载会话失败: ${error}`);
}
}

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,337 @@
/**
* 对话服务
* 整合 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;
/** 实时更新段落(流式过程中) */
onSegmentUpdate?: (segments: MessageSegment[]) => 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);
// 实时发送段落更新
callbacks.onSegmentUpdate?.(this.segments);
},
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.onSegmentUpdate?.(this.segments);
}
// 注意:不在这里调用 callbacks.onToolStart避免与 onToolStart 事件重复
try {
await executeToolCall(data, this.toolContext);
this.updateToolSegment(toolName, 'success', '执行完成');
// 实时发送段落更新
callbacks.onSegmentUpdate?.(this.segments);
// 也不调用 callbacks.onToolComplete避免重复
} catch (error) {
const errorMsg = error instanceof Error ? error.message : '未知错误';
this.updateToolSegment(toolName, 'error', errorMsg);
callbacks.onToolError?.(toolName, errorMsg);
// 实时发送段落更新
callbacks.onSegmentUpdate?.(this.segments);
}
},
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');
// 实时发送段落更新
callbacks.onSegmentUpdate?.(this.segments);
}
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);
// 实时发送段落更新
callbacks.onSegmentUpdate?.(this.segments);
},
onToolError: (data) => {
this.updateToolSegment(data.tool_name, 'error', data.error);
callbacks.onToolError?.(data.tool_name, data.error);
// 实时发送段落更新
callbacks.onSegmentUpdate?.(this.segments);
},
onAskUser: async (data: AskUserEvent) => {
this.finalizeTextSegment();
this.segments.push({
type: 'question',
askId: data.askId,
question: data.question,
options: data.options
});
// 实时发送段落更新(包含问题)
callbacks.onSegmentUpdate?.(this.segments);
// 同时调用 onQuestion 用于更新状态栏等
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,147 @@
/**
* 用户交互处理器
* 处理 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}`);
// 注意:问题显示已经通过 dialogService 的 onSegmentUpdate 统一处理
// 这里不再单独发送 showQuestion 命令,避免重复显示
// 创建 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

@ -56,6 +56,7 @@ export interface AiMessage extends BaseMessage {
text?: string; text?: string;
toolExecutionRequests?: ToolExecutionRequest[]; toolExecutionRequests?: ToolExecutionRequest[];
thinking?: string; thinking?: string;
segments?: any[]; // 保存完整的 segments 信息用于还原显示
} }
/** /**

View File

@ -8,7 +8,8 @@ import {
MessageType, MessageType,
UserMessage, UserMessage,
AiMessage, AiMessage,
SystemMessage SystemMessage,
ToolExecutionResultMessage
} from '../types/chatHistory'; } from '../types/chatHistory';
/** /**
@ -20,6 +21,8 @@ export class ChatHistoryManager {
private baseDir: string; // ~/.iccoder private baseDir: string; // ~/.iccoder
private currentTaskId: string | null = null; private currentTaskId: string | null = null;
private currentProjectPath: string | null = null; private currentProjectPath: string | null = null;
// 存储每个面板的任务信息taskId 和 projectPath
private panelTaskMap: Map<string, { taskId: string; projectPath: string }> = new Map();
private constructor() { private constructor() {
// 设置存储路径: ~/.iccoder // 设置存储路径: ~/.iccoder
@ -33,12 +36,13 @@ export class ChatHistoryManager {
* 规则: * 规则:
* - 替换 \ 和 / 为 -- * - 替换 \ 和 / 为 --
* - 替换 : 为空 * - 替换 : 为空
* 例如C:\Users\admin\Documents\Project -> C--Users-admin-Documents-Project * 例如C:\Users\admin\Documents\Project -> C--Users--admin--Documents--Project
*/ */
private encodeProjectPath(projectPath: string): string { private encodeProjectPath(projectPath: string): string {
return projectPath return projectPath
.replace(/:/g, '') // 移除冒号 .replace(/\\/g, '--') // 替换反斜杠为 --
.replace(/[/\\]/g, '--'); // 替换斜杠为 -- .replace(/\//g, '--') // 替换斜杠为 --
.replace(/:/g, ''); // 移除冒号
} }
/** /**
@ -107,6 +111,43 @@ export class ChatHistoryManager {
return ChatHistoryManager.instance; return ChatHistoryManager.instance;
} }
/**
* 为面板设置任务ID
*/
public setPanelTask(panelId: string, taskId: string, projectPath: string): void {
this.panelTaskMap.set(panelId, { taskId, projectPath });
this.currentTaskId = taskId;
this.currentProjectPath = projectPath;
}
/**
* 获取面板的任务ID
*/
public getPanelTask(panelId: string): string | null {
const taskInfo = this.panelTaskMap.get(panelId);
return taskInfo ? taskInfo.taskId : null;
}
/**
* 切换到指定面板的任务上下文
*/
public switchToPanelTask(panelId: string): boolean {
const taskInfo = this.panelTaskMap.get(panelId);
if (taskInfo) {
this.currentTaskId = taskInfo.taskId;
this.currentProjectPath = taskInfo.projectPath;
return true;
}
return false;
}
/**
* 移除面板的任务映射
*/
public removePanelTask(panelId: string): void {
this.panelTaskMap.delete(panelId);
}
/** /**
* 创建新任务 * 创建新任务
*/ */
@ -264,17 +305,11 @@ export class ChatHistoryManager {
} }
/** /**
* 确保有当前任务,如果没有则自动创建 * 确保有当前任务,如果没有则抛出错误
*/ */
private async ensureCurrentTask(): Promise<void> { private async ensureCurrentTask(): Promise<void> {
if (!this.currentTaskId || !this.currentProjectPath) { if (!this.currentTaskId || !this.currentProjectPath) {
// 获取当前工作区路径 throw new Error("没有当前任务上下文,请确保已正确初始化面板任务");
const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
if (workspacePath) {
await this.createTask(workspacePath, "默认任务");
} else {
throw new Error("没有打开的工作区,无法创建任务");
}
} }
} }
@ -300,14 +335,15 @@ export class ChatHistoryManager {
/** /**
* 添加AI消息 * 添加AI消息
*/ */
public async addAiMessage(text: string, toolRequests?: any[]): Promise<void> { public async addAiMessage(text: string, toolRequests?: any[], segments?: any[]): Promise<void> {
await this.ensureCurrentTask(); await this.ensureCurrentTask();
const messages = await this.loadConversation(); const messages = await this.loadConversation();
const aiMessage: AiMessage = { const aiMessage: AiMessage = {
type: MessageType.AI, type: MessageType.AI,
text, text,
toolExecutionRequests: toolRequests toolExecutionRequests: toolRequests,
segments // 保存完整的 segments 信息
}; };
messages.push(aiMessage); messages.push(aiMessage);
@ -333,6 +369,24 @@ export class ChatHistoryManager {
await this.saveConversation(messages); await this.saveConversation(messages);
} }
/**
* 添加工具执行结果消息
*/
public async addToolExecutionResult(id: string, toolName: string, result: string): Promise<void> {
await this.ensureCurrentTask();
const messages = await this.loadConversation();
const toolResultMessage: ToolExecutionResultMessage = {
type: MessageType.TOOL_EXECUTION_RESULT,
id,
toolName,
text: result
};
messages.push(toolResultMessage);
await this.saveConversation(messages);
}
/** /**
* 记录对话轮次元数据 * 记录对话轮次元数据
*/ */
@ -450,6 +504,20 @@ export class ChatHistoryManager {
tasks.push(JSON.parse(data)); tasks.push(JSON.parse(data));
} catch (error) { } catch (error) {
console.error(`加载任务 ${taskId} 失败:`, error); console.error(`加载任务 ${taskId} 失败:`, error);
// 跳过无效的任务目录
// 尝试清理空目录
try {
const taskDirUri = vscode.Uri.file(path.join(projectDir, taskId));
const taskDirEntries = await vscode.workspace.fs.readDirectory(taskDirUri);
if (taskDirEntries.length === 0) {
// 目录为空,删除它
await vscode.workspace.fs.delete(taskDirUri, { recursive: false });
console.log(`已清理空任务目录: ${taskId}`);
}
} catch (cleanupError) {
// 清理失败,忽略错误
console.warn(`清理任务目录 ${taskId} 失败:`, cleanupError);
}
} }
} }
} }
@ -494,4 +562,132 @@ export class ChatHistoryManager {
public getBaseDir(): string { public getBaseDir(): string {
return this.baseDir; return this.baseDir;
} }
/**
* 加载指定任务的会话内容
* @param projectPath 项目路径
* @param taskId 任务ID
* @returns 任务会话内容如果任务不存在则返回null
*/
public async loadTaskSession(projectPath: string, taskId: string): Promise<TaskSession | null> {
const taskDir = this.getTaskDir(projectPath, taskId);
const metaPath = path.join(taskDir, 'meta.json');
try {
// 检查任务是否存在
const metaUri = vscode.Uri.file(metaPath);
const metaContent = await vscode.workspace.fs.readFile(metaUri);
const meta: TaskMeta = JSON.parse(Buffer.from(metaContent).toString('utf-8'));
// 读取会话内容
const conversationPath = path.join(taskDir, 'conversation.json');
let messages: ChatMessage[] = [];
try {
const conversationUri = vscode.Uri.file(conversationPath);
const conversationContent = await vscode.workspace.fs.readFile(conversationUri);
messages = JSON.parse(Buffer.from(conversationContent).toString('utf-8'));
} catch {
// 会话文件不存在,使用空数组
}
// 读取会话元数据
const conversationMetaPath = path.join(taskDir, 'conversation_meta.jsonl');
let conversationMeta: ConversationMeta[] = [];
try {
const metaUri = vscode.Uri.file(conversationMetaPath);
const content = await vscode.workspace.fs.readFile(metaUri);
const data = Buffer.from(content).toString('utf-8');
conversationMeta = data
.split('\n')
.filter(line => line.trim())
.map(line => JSON.parse(line));
} catch {
// 元数据文件不存在,使用空数组
}
return {
meta,
messages,
conversationMeta
};
} catch (error) {
console.error(`加载任务 ${taskId} 的会话失败:`, error);
return null;
}
}
/**
* 获取会话历史列表(支持分页)
* 返回格式:{ id: taskId, title: 第一句用户消息, timestamp: 创建时间 }
* @param projectPath 项目路径
* @param offset 偏移量从第几条开始默认0
* @param limit 每页数量默认10条
* @returns { items: 历史列表, total: 总数, hasMore: 是否还有更多 }
*/
public async getConversationHistoryList(
projectPath: string,
offset: number = 0,
limit: number = 10
): Promise<{
items: Array<{ id: string; title: string; timestamp: string }>;
total: number;
hasMore: boolean;
}> {
const tasks = await this.listProjectTasks(projectPath);
const total = tasks.length;
const historyList: Array<{ id: string; title: string; timestamp: string }> = [];
// 计算分页范围
const start = offset;
const end = Math.min(offset + limit, total);
const limitedTasks = tasks.slice(start, end);
for (const task of limitedTasks) {
// 读取该任务的 conversation.json 获取第一句用户消息
const taskDir = this.getTaskDir(task.projectPath, task.taskId);
const conversationPath = path.join(taskDir, 'conversation.json');
try {
const uri = vscode.Uri.file(conversationPath);
const content = await vscode.workspace.fs.readFile(uri);
const data = Buffer.from(content).toString('utf-8');
const messages: ChatMessage[] = JSON.parse(data);
// 找到第一条用户消息
const firstUserMessage = messages.find(msg => msg.type === MessageType.USER) as UserMessage | undefined;
let title = '未命名会话';
if (firstUserMessage && firstUserMessage.contents && firstUserMessage.contents.length > 0) {
const textContent = firstUserMessage.contents.find(c => c.type === 'TEXT');
if (textContent && 'text' in textContent) {
// 截取前50个字符作为标题
title = textContent.text.length > 50
? textContent.text.substring(0, 50) + '...'
: textContent.text;
}
}
historyList.push({
id: task.taskId,
title,
timestamp: task.createdAt
});
} catch (error) {
console.error(`读取任务 ${task.taskId} 的会话历史失败:`, error);
// 如果读取失败,使用任务名称作为标题
historyList.push({
id: task.taskId,
title: task.taskName || '未命名会话',
timestamp: task.createdAt
});
}
}
// 返回分页结果
return {
items: historyList,
total,
hasMore: end < total
};
}
} }

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);
// 记录用户消息到历史 // 记录用户消息到历史(允许失败,不阻塞主流程)
try {
const historyManager = ChatHistoryManager.getInstance(); const historyManager = ChatHistoryManager.getInstance();
await historyManager.addUserMessage(text); 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回复到历史(允许失败)
try {
const historyManager = ChatHistoryManager.getInstance();
await historyManager.addAiMessage(reply); await historyManager.addAiMessage(reply);
} catch (error) {
console.warn("记录AI回复历史失败:", error);
}
setTimeout(() => { setTimeout(() => {
panel.webview.postMessage({ panel.webview.postMessage({
@ -62,6 +91,141 @@ 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) => {
// 不再单独处理文本,统一通过 onSegmentUpdate 处理
},
onSegmentUpdate: (segments) => {
// 实时发送段落更新,按后端返回顺序展示
panel.webview.postMessage({
command: "updateSegments",
segments: segments,
});
},
onToolStart: (toolName) => {
// 更新状态栏
panel.webview.postMessage({
command: "updateStatus",
text: `正在执行 ${toolName}...`,
type: "working",
});
},
onToolComplete: (toolName, result) => {
// 工具完成,不需要单独处理,通过 onSegmentUpdate 统一更新
},
onToolError: (toolName, error) => {
// 工具错误,不需要单独处理,通过 onSegmentUpdate 统一更新
},
onQuestion: (askId, question, options) => {
// 只更新状态栏,问题显示由 onSegmentUpdate 统一处理
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: "updateSegments",
segments: segments,
isComplete: true,
});
console.log('[MessageHandler] postMessage 返回值:', result);
// 保存完整的 segments 到历史记录
try {
// 将完整的 segments 保存到一条 AI 消息中
// 这样加载时可以完整还原对话样式
const textContent = segments
.filter(s => s.type === 'text' && s.content)
.map(s => s.content)
.join('\n');
await historyManager.addAiMessage(textContent, undefined, segments);
} catch (error) {
console.warn("保存AI响应历史失败:", error);
}
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

@ -0,0 +1,162 @@
/**
* 模式选择器组件
* 提供 Agent/Ask/Auto 三种模式的选择功能
*/
/**
* 获取模式选择器的 HTML 内容
*/
export function getModeSelectorContent(): string {
return `
<div class="tooltip">
<div class="mode-select" id="modeSelect">
<div class="mode-trigger" onclick="toggleModeDropdown()">
<span class="mode-value" id="modeValue">Agent</span>
<svg class="mode-arrow" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M507.8 727.728a30.016 30.016 0 0 1-21.288-8.824L231.104 463.496a30.088 30.088 0 0 1 0-42.568 30.088 30.088 0 0 1 42.568 0l234.128 234.128 234.16-234.128a30.088 30.088 0 0 1 42.568 0 30.088 30.088 0 0 1 0 42.568L529.08 718.904a30 30 0 0 1-21.28 8.824z" fill="#8a8a8a"/>
</svg>
</div>
<div class="mode-dropdown" id="modeDropdown">
<div class="mode-option" data-value="agent" onclick="selectMode('agent', 'Agent')">Agent</div>
<div class="mode-option" data-value="ask" onclick="selectMode('ask', 'Ask')">Ask</div>
<div class="mode-option" data-value="auto" onclick="selectMode('auto', 'Auto')">Auto</div>
</div>
</div>
<span class="tooltiptext">切换模式</span>
</div>
`;
}
/**
* 获取模式选择器的样式
*/
export function getModeSelectorStyles(): string {
return `
/* 模式选择器样式 */
.mode-select {
position: relative;
user-select: none;
}
.mode-trigger {
display: flex;
align-items: center;
gap: 6px;
padding: 4px 8px;
background: var(--vscode-input-background);
color: var(--vscode-foreground);
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
transition: background 0.2s ease;
}
.mode-trigger:hover {
background: var(--vscode-list-hoverBackground);
}
.mode-value {
white-space: nowrap;
}
.mode-arrow {
width: 12px;
height: 12px;
flex-shrink: 0;
transition: transform 0.2s ease;
}
.mode-select.active .mode-arrow {
transform: rotate(180deg);
}
.mode-dropdown {
position: absolute;
bottom: calc(100% + 2px);
left: 0;
min-width: 100%;
background: var(--vscode-dropdown-background);
border: 1px solid var(--vscode-dropdown-border);
border-radius: 4px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
z-index: 1100;
display: none;
overflow: hidden;
}
.mode-select.active .mode-dropdown {
display: block;
}
/* 模式选择器的选项样式 */
.mode-option {
padding: 6px 12px;
font-size: 12px;
cursor: pointer;
transition: background 0.2s ease;
white-space: nowrap;
}
.mode-option:hover {
background: rgba(128, 128, 128, 0.3);
}
.mode-option.selected {
background: rgba(128, 128, 128, 0.5);
color: var(--vscode-foreground);
}
`;
}
/**
* 获取模式选择器的脚本
*/
export function getModeSelectorScript(): string {
return `
// 模式选择器相关变量
let currentMode = 'agent';
// 切换模式下拉框显示/隐藏
function toggleModeDropdown() {
const modeSelect = document.getElementById('modeSelect');
const modelSelect = document.getElementById('modelSelect');
if (modeSelect) {
modeSelect.classList.toggle('active');
// 关闭模型下拉框
if (modelSelect) {
modelSelect.classList.remove('active');
}
}
}
// 选择模式
function selectMode(value, label) {
currentMode = value;
const modeValue = document.getElementById('modeValue');
if (modeValue) {
modeValue.textContent = label;
}
// 更新选中状态
const options = document.querySelectorAll('.mode-option');
options.forEach(option => {
if (option.getAttribute('data-value') === value) {
option.classList.add('selected');
} else {
option.classList.remove('selected');
}
});
// 关闭下拉框
const modeSelect = document.getElementById('modeSelect');
if (modeSelect) {
modeSelect.classList.remove('active');
}
}
// 获取当前模式
function getCurrentMode() {
return currentMode;
}
// 点击外部关闭模式下拉框
document.addEventListener('click', (event) => {
const modeSelect = document.getElementById('modeSelect');
if (modeSelect && !modeSelect.contains(event.target)) {
modeSelect.classList.remove('active');
}
});
`;
}

View File

@ -0,0 +1,71 @@
/**
* 添加上下文按钮组件
*/
/**
* 获取添加上下文按钮的 HTML 内容
*/
export function getContextButtonContent(): string {
return `
<div class="tooltip">
<button class="add-context-button" onclick="handleAddContext()">
<svg t="1766915545722" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4994" width="200" height="200">
<path d="M469.333333 469.333333V170.666667h85.333334v298.666666h298.666666v85.333334h-298.666666v298.666666h-85.333334v-298.666666H170.666667v-85.333334h298.666666z" fill="#8a8a8a" p-id="4995"></path>
</svg>
<span class="add-context-label">添加上下文</span>
</button>
<span class="tooltiptext">添加文件或代码片段作为上下文</span>
</div>
`;
}
/**
* 获取添加上下文按钮的样式
*/
export function getContextButtonStyles(): string {
return `
/* 添加上下文按钮样式 */
.add-context-button {
display: flex;
align-items: center;
gap: 6px;
padding: 6px 12px;
background: rgba(128, 128, 128, 0.2);
border: 1px solid var(--vscode-input-border);
border-radius: 6px;
color: var(--vscode-foreground);
cursor: pointer;
transition: all 0.2s ease;
font-size: 13px;
font-weight: 500;
}
.add-context-button:hover {
background: rgba(128, 128, 128, 0.3);
border-color: var(--vscode-focusBorder);
}
.add-context-button svg {
width: 16px;
height: 16px;
color: #409eff;
}
.add-context-label {
white-space: nowrap;
}
`;
}
/**
* 获取添加上下文按钮的脚本
*/
export function getContextButtonScript(): string {
return `
// 添加上下文处理函数
function handleAddContext() {
// 发送添加上下文请求到扩展
vscode.postMessage({ command: 'addContext' });
}
`;
}

View File

@ -0,0 +1,249 @@
/**
* 上下文压缩组件
* 提供上下文使用情况显示和压缩功能
*/
/**
* 获取上下文压缩组件的 HTML 内容
*/
export function getContextCompressContent(): string {
return `
<!-- 上下文显示 -->
<div class="context-display">
<div class="context-info" onclick="toggleContextPanel()">
<div class="database-icon">
<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" class="db-svg">
<!-- 数据库容器主体 - 底层灰色 -->
<path d="M870.4 57.6C780.8 19.2 652.8 0 512 0 371.2 0 243.2 19.2 153.6 57.6 51.2 102.4 0 153.6 0 211.2l0 595.2c0 57.6 51.2 115.2 153.6 153.6C243.2 1004.8 371.2 1024 512 1024c140.8 0 268.8-19.2 358.4-57.6 96-38.4 153.6-96 153.6-153.6L1024 211.2C1024 153.6 972.8 102.4 870.4 57.6L870.4 57.6zM812.8 320C729.6 352 614.4 364.8 512 364.8 403.2 364.8 294.4 352 211.2 320 115.2 294.4 70.4 256 70.4 211.2c0-38.4 51.2-76.8 140.8-108.8C294.4 76.8 403.2 64 512 64c102.4 0 217.6 19.2 300.8 44.8 89.6 32 140.8 70.4 140.8 108.8C953.6 256 908.8 294.4 812.8 320L812.8 320zM819.2 505.6C736 531.2 620.8 550.4 512 550.4c-108.8 0-217.6-19.2-307.2-44.8C115.2 473.6 64 435.2 64 396.8L64 326.4C128 352 172.8 384 243.2 396.8 326.4 416 416 428.8 512 428.8c96 0 185.6-12.8 268.8-32C851.2 384 896 352 960 326.4l0 76.8C960 435.2 908.8 473.6 819.2 505.6L819.2 505.6zM819.2 710.4c-83.2 25.6-198.4 44.8-307.2 44.8-108.8 0-217.6-19.2-307.2-44.8C115.2 684.8 64 646.4 64 601.6L64 505.6c64 32 108.8 57.6 179.2 76.8C326.4 601.6 416 614.4 512 614.4c96 0 185.6-12.8 268.8-32C851.2 563.2 896 537.6 960 505.6l0 96C960 646.4 908.8 684.8 819.2 710.4L819.2 710.4zM512 960c-108.8 0-217.6-19.2-307.2-44.8C115.2 889.6 64 851.2 64 812.8l0-96c64 32 108.8 57.6 179.2 76.8 76.8 19.2 172.8 32 262.4 32 96 0 185.6-12.8 268.8-32 76.8-19.2 121.6-44.8 185.6-76.8l0 96c0 38.4-51.2 76.8-140.8 108.8C736 947.2 614.4 960 512 960L512 960z" fill="#94a3b8" class="db-body"/>
<!-- 填充进度效果 - 从下往上填充蓝色 -->
<defs>
<mask id="fill-mask">
<rect x="0" y="0" width="1024" height="1024" id="fillRect" fill="white"/>
</mask>
</defs>
<g mask="url(#fill-mask)">
<path d="M870.4 57.6C780.8 19.2 652.8 0 512 0 371.2 0 243.2 19.2 153.6 57.6 51.2 102.4 0 153.6 0 211.2l0 595.2c0 57.6 51.2 115.2 153.6 153.6C243.2 1004.8 371.2 1024 512 1024c140.8 0 268.8-19.2 358.4-57.6 96-38.4 153.6-96 153.6-153.6L1024 211.2C1024 153.6 972.8 102.4 870.4 57.6L870.4 57.6zM812.8 320C729.6 352 614.4 364.8 512 364.8 403.2 364.8 294.4 352 211.2 320 115.2 294.4 70.4 256 70.4 211.2c0-38.4 51.2-76.8 140.8-108.8C294.4 76.8 403.2 64 512 64c102.4 0 217.6 19.2 300.8 44.8 89.6 32 140.8 70.4 140.8 108.8C953.6 256 908.8 294.4 812.8 320L812.8 320zM819.2 505.6C736 531.2 620.8 550.4 512 550.4c-108.8 0-217.6-19.2-307.2-44.8C115.2 473.6 64 435.2 64 396.8L64 326.4C128 352 172.8 384 243.2 396.8 326.4 416 416 428.8 512 428.8c96 0 185.6-12.8 268.8-32C851.2 384 896 352 960 326.4l0 76.8C960 435.2 908.8 473.6 819.2 505.6L819.2 505.6zM819.2 710.4c-83.2 25.6-198.4 44.8-307.2 44.8-108.8 0-217.6-19.2-307.2-44.8C115.2 684.8 64 646.4 64 601.6L64 505.6c64 32 108.8 57.6 179.2 76.8C326.4 601.6 416 614.4 512 614.4c96 0 185.6-12.8 268.8-32C851.2 563.2 896 537.6 960 505.6l0 96C960 646.4 908.8 684.8 819.2 710.4L819.2 710.4zM512 960c-108.8 0-217.6-19.2-307.2-44.8C115.2 889.6 64 851.2 64 812.8l0-96c64 32 108.8 57.6 179.2 76.8 76.8 19.2 172.8 32 262.4 32 96 0 185.6-12.8 268.8-32 76.8-19.2 121.6-44.8 185.6-76.8l0 96c0 38.4-51.2 76.8-140.8 108.8C736 947.2 614.4 960 512 960L512 960z" fill="#409eff" class="db-fill"/>
</g>
</svg>
</div>
<span class="context-percentage" id="contextPercentage">0%</span>
</div>
<!-- 上下文信息弹窗 -->
<div id="contextPanel" class="context-panel">
<div class="context-panel-content">
<div class="context-info-text" id="contextInfoText">
0k / 200k 已用上下文
</div>
<button class="compress-button" onclick="compressConversation()">
压缩会话
</button>
</div>
</div>
</div>
`;
}
/**
* 获取上下文压缩组件的样式
*/
export function getContextCompressStyles(): string {
return `
/* 上下文显示样式 */
.context-display {
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
.context-info {
display: flex;
align-items: center;
gap: 6px;
height: 40px;
background: transparent;
border: none;
border-radius: 4px;
font-size: 14px;
font-weight: 500;
color: var(--vscode-foreground);
transition: opacity 0.3s ease;
box-shadow: none;
position: relative;
overflow: hidden;
cursor: pointer;
}
.context-info:hover {
opacity: 0.8;
}
.database-icon {
display: flex;
align-items: center;
justify-content: center;
width: 12px;
height: 12px;
position: relative;
}
.db-svg {
width: 100%;
height: 100%;
}
.db-body {
fill: #ffffff;
}
.db-fill {
fill: #409eff;
transition: all 0.3s ease;
}
.context-percentage {
font-size: 14px;
font-weight: 500;
color: var(--vscode-foreground);
text-align: right;
}
/* 上下文信息弹窗样式 */
.context-panel {
position: absolute;
bottom: 100%;
left: 50%;
transform: translateX(-50%);
margin-bottom: 8px;
z-index: 1000;
animation: fadeInUp 0.2s ease-out;
display: none;
}
.context-panel.active {
display: block;
}
.context-panel::after {
content: "";
position: absolute;
bottom: -6px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #ffffff;
}
.context-panel-content {
background: #ffffff;
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 8px;
padding: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
backdrop-filter: blur(10px);
min-width: 160px;
}
.context-info-text {
font-size: 12px;
color: #374151;
text-align: center;
margin-bottom: 8px;
white-space: nowrap;
}
.compress-button {
width: 100%;
background: linear-gradient(145deg, #3b82f6 0%, #1d4ed8 100%);
border: 1px solid rgba(59, 130, 246, 0.3);
border-radius: 6px;
color: white;
font-size: 12px;
font-weight: 500;
padding: 6px 12px;
cursor: pointer;
transition: all 0.2s ease;
}
.compress-button:hover {
background: linear-gradient(145deg, #2563eb 0%, #1e40af 100%);
transform: translateY(-1px);
box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
}
.compress-button:active {
transform: translateY(0);
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateX(-50%) translateY(10px);
}
to {
opacity: 1;
transform: translateX(-50%) translateY(0);
}
}
`;
}
/**
* 获取上下文压缩组件的脚本
*/
export function getContextCompressScript(): string {
return `
// 上下文面板相关函数
function toggleContextPanel() {
const contextPanel = document.getElementById('contextPanel');
if (contextPanel) {
if (contextPanel.classList.contains('active')) {
contextPanel.classList.remove('active');
} else {
contextPanel.classList.add('active');
}
}
}
function compressConversation() {
// 发送压缩会话请求
vscode.postMessage({ command: 'compressConversation' });
addMessage('正在压缩会话...', 'bot');
// 关闭面板
const contextPanel = document.getElementById('contextPanel');
if (contextPanel) {
contextPanel.classList.remove('active');
}
}
function updateContextDisplay(currentTokens, maxTokens) {
const percentage = Math.min(Math.round((currentTokens / maxTokens) * 100), 100);
// 更新百分比显示
const contextPercentage = document.getElementById('contextPercentage');
if (contextPercentage) {
contextPercentage.textContent = percentage + '%';
}
// 更新详细信息
const contextInfoText = document.getElementById('contextInfoText');
if (contextInfoText) {
const currentK = Math.round((currentTokens / 1000) * 10) / 10;
const maxK = Math.round(maxTokens / 1000);
contextInfoText.textContent = \`\${currentK}k / \${maxK}k 已用上下文\`;
}
// 更新SVG填充效果从下往上填充
const fillRect = document.getElementById('fillRect');
if (fillRect) {
const fillHeight = (1024 * percentage) / 100;
const fillY = 1024 - fillHeight;
fillRect.setAttribute('y', fillY.toString());
fillRect.setAttribute('height', fillHeight.toString());
}
}
// 点击外部关闭上下文面板
document.addEventListener('click', (event) => {
const contextDisplay = document.querySelector('.context-display');
const contextPanel = document.getElementById('contextPanel');
if (contextPanel && contextPanel.classList.contains('active') && contextDisplay) {
if (!contextDisplay.contains(event.target)) {
contextPanel.classList.remove('active');
}
}
});
`;
}

View File

@ -111,6 +111,10 @@ export function getConversationHistoryBarStyles(): string {
cursor: pointer; cursor: pointer;
transition: background 0.2s ease; transition: background 0.2s ease;
border-bottom: 1px solid var(--vscode-panel-border); border-bottom: 1px solid var(--vscode-panel-border);
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
} }
.history-item:last-child { .history-item:last-child {
@ -124,15 +128,17 @@ export function getConversationHistoryBarStyles(): string {
.history-item-title { .history-item-title {
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
margin-bottom: 4px;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
flex: 1;
} }
.history-item-time { .history-item-time {
font-size: 12px; font-size: 12px;
opacity: 0.7; opacity: 0.7;
white-space: nowrap;
flex-shrink: 0;
} }
.history-empty { .history-empty {
@ -142,6 +148,14 @@ export function getConversationHistoryBarStyles(): string {
font-size: 14px; font-size: 14px;
} }
.history-load-more {
padding: 12px 16px;
text-align: center;
color: var(--vscode-descriptionForeground);
font-size: 12px;
border-top: 1px solid var(--vscode-panel-border);
}
.new-conversation-button { .new-conversation-button {
width: 36px; width: 36px;
height: 36px; height: 36px;
@ -199,6 +213,12 @@ export function getConversationHistoryBarScript(): string {
// 会话历史相关变量 // 会话历史相关变量
let conversationHistory = []; let conversationHistory = [];
let currentConversationId = null; let currentConversationId = null;
let currentOffset = 0;
let totalHistory = 0;
let hasMoreHistory = false;
let isLoadingHistory = false;
const HISTORY_PAGE_SIZE = 10;
const MAX_HISTORY_ITEMS = 100;
// 切换历史记录下拉菜单 // 切换历史记录下拉菜单
function toggleHistoryDropdown() { function toggleHistoryDropdown() {
@ -211,33 +231,90 @@ export function getConversationHistoryBarScript(): string {
} else { } else {
menu.classList.add('active'); menu.classList.add('active');
button.classList.add('active'); button.classList.add('active');
// 加载会话历史 // 重置并加载会话历史
loadConversationHistory(); resetAndLoadHistory();
} }
} }
// 加载会话历史 // 重置并加载会话历史
function loadConversationHistory() { function resetAndLoadHistory() {
vscode.postMessage({ command: 'loadConversationHistory' }); conversationHistory = [];
} currentOffset = 0;
totalHistory = 0;
// 渲染会话历史列表 hasMoreHistory = false;
function renderConversationHistory(history) {
conversationHistory = history;
const historyList = document.getElementById('historyList'); const historyList = document.getElementById('historyList');
if (historyList) {
historyList.innerHTML = '<div class="history-empty">加载中...</div>';
}
loadMoreHistory();
}
if (!history || history.length === 0) { // 加载更多会话历史
function loadMoreHistory() {
if (isLoadingHistory || (currentOffset > 0 && !hasMoreHistory)) {
return;
}
// 检查是否已达到最大数量
if (currentOffset >= MAX_HISTORY_ITEMS) {
return;
}
isLoadingHistory = true;
vscode.postMessage({
command: 'loadConversationHistory',
offset: currentOffset,
limit: HISTORY_PAGE_SIZE
});
}
// 渲染会话历史列表(支持追加)
function renderConversationHistory(data) {
isLoadingHistory = false;
if (!data || !data.items) {
return;
}
// 追加新数据
conversationHistory = conversationHistory.concat(data.items);
totalHistory = data.total;
hasMoreHistory = data.hasMore;
currentOffset += data.items.length;
const historyList = document.getElementById('historyList');
if (!historyList) {
return;
}
// 如果没有任何历史记录
if (conversationHistory.length === 0) {
historyList.innerHTML = '<div class="history-empty">暂无会话历史</div>'; historyList.innerHTML = '<div class="history-empty">暂无会话历史</div>';
return; return;
} }
historyList.innerHTML = history.map(item => \` // 渲染所有历史记录
<div class="history-item" historyList.innerHTML = conversationHistory.map(item => \`
onclick="selectConversation('\${item.id}')"> <div class="history-item" onclick="selectConversation('\${item.id}')">
<div class="history-item-title">\${item.title || '未命名会话'}</div> <div class="history-item-title">\${item.title || '未命名会话'}</div>
<div class="history-item-time">\${formatTime(item.timestamp)}</div> <div class="history-item-time">\${formatTime(item.timestamp)}</div>
</div> </div>
\`).join(''); \`).join('');
// 如果还有更多数据,添加"加载更多"提示
if (hasMoreHistory && currentOffset < MAX_HISTORY_ITEMS) {
historyList.innerHTML += \`
<div class="history-load-more" id="loadMoreIndicator">
<span>滚动加载更多...</span>
</div>
\`;
} else if (currentOffset >= MAX_HISTORY_ITEMS && hasMoreHistory) {
historyList.innerHTML += \`
<div class="history-load-more">
<span>已显示最近 \${MAX_HISTORY_ITEMS} 条记录</span>
</div>
\`;
}
} }
// 选择会话 // 选择会话
@ -291,6 +368,22 @@ export function getConversationHistoryBarScript(): string {
}); });
} }
// 监听下拉菜单滚动事件
const historyDropdownMenu = document.getElementById('historyDropdownMenu');
if (historyDropdownMenu) {
historyDropdownMenu.addEventListener('scroll', () => {
const menu = historyDropdownMenu;
const scrollTop = menu.scrollTop;
const scrollHeight = menu.scrollHeight;
const clientHeight = menu.clientHeight;
// 当滚动到距离底部 50px 时,加载更多
if (scrollHeight - scrollTop - clientHeight < 50) {
loadMoreHistory();
}
});
}
// 点击外部关闭下拉菜单 // 点击外部关闭下拉菜单
document.addEventListener('click', (event) => { document.addEventListener('click', (event) => {
const container = document.querySelector('.history-dropdown-container'); const container = document.querySelector('.history-dropdown-container');

418
src/views/inputArea.ts Normal file
View File

@ -0,0 +1,418 @@
import { getWaveformPreviewContent } from "./waveformPreviewContent";
import {
getModelSelectorContent,
getModelSelectorStyles,
getModelSelectorScript
} from "./modelSelector";
import {
getModeSelectorContent,
getModeSelectorStyles,
getModeSelectorScript
} from "./agentModeSelector";
import {
getContextButtonContent,
getContextButtonStyles,
getContextButtonScript
} from "./contextButton";
import {
getContextCompressContent,
getContextCompressStyles,
getContextCompressScript
} from "./contextCompress";
/**
* 获取输入区域的 HTML 内容
*/
export function getInputAreaContent(): string {
return `
<div class="input-area">
<div class="input-group">
<div class="input-wrapper">
<!-- 顶部工具栏 -->
<div class="input-top-toolbar">
${getContextButtonContent()}
<!-- Plan 开关 -->
<div class="tooltip">
<label class="plan-toggle">
<input type="checkbox" id="planToggle" onchange="handlePlanToggle()">
<span class="plan-toggle-slider"></span>
<span class="plan-toggle-label">Plan</span>
</label>
<span class="tooltiptext" id="planTooltip">启用 Plan 模式</span>
</div>
</div>
<textarea
id="messageInput"
placeholder="输入您的问题..."
onkeydown="if(event.key === 'Enter' && !event.shiftKey) { event.preventDefault(); sendMessage(); }"
></textarea>
<div class="input-bottom-row">
<div class="mode-selector">
${getModeSelectorContent()}
${getModelSelectorContent()}
</div>
<div class="input-actions">
${getContextCompressContent()}
<!-- 一键优化按钮 -->
<div class="tooltip">
<button id="optimizeButton" class="optimize-button" onclick="handleOptimize()">
<svg t="1765867478136" id="optimizeIcon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2314"><path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" p-id="2315" fill="#409eff"></path></svg>
</button>
<span class="tooltiptext" id="optimizeTooltip">一键优化</span>
</div>
<button onclick="sendMessage()">发送</button>
</div>
</div>
</div>
</div>
</div>
`;
}
/**
* 获取输入区域的样式
*/
export function getInputAreaStyles(): string {
return `
${getModeSelectorStyles()}
${getModelSelectorStyles()}
${getContextButtonStyles()}
${getContextCompressStyles()}
.input-area {
border-top: 1px solid var(--vscode-panel-border);
padding-top: 15px;
flex-shrink: 0;
}
.input-group {
display: flex;
flex-direction: column;
gap: 10px;
background: var(--vscode-input-background);
border: 1px solid var(--vscode-input-border);
border-radius: 8px;
padding: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15), 0 2px 6px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
}
.input-group:hover {
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2), 0 3px 8px rgba(0, 0, 0, 0.15);
}
.input-group:focus-within {
border-color: var(--vscode-focusBorder);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25), 0 3px 10px rgba(0, 0, 0, 0.2);
}
.input-wrapper {
display: flex;
flex-direction: column;
gap: 8px;
width: 100%;
}
/* 顶部工具栏样式 */
.input-top-toolbar {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
gap: 12px;
}
.plan-toggle {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
user-select: none;
}
.plan-toggle input[type="checkbox"] {
display: none;
}
.plan-toggle-slider {
position: relative;
width: 36px;
height: 20px;
background: var(--vscode-input-background);
border: 1px solid var(--vscode-input-border);
border-radius: 10px;
transition: all 0.3s ease;
}
.plan-toggle-slider::before {
content: "";
position: absolute;
width: 14px;
height: 14px;
left: 2px;
top: 2px;
background: var(--vscode-foreground);
border-radius: 50%;
transition: all 0.3s ease;
}
.plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider {
background: #409eff;
border-color: #409eff;
}
.plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider::before {
transform: translateX(16px);
background: white;
}
.plan-toggle-label {
font-size: 13px;
font-weight: 500;
color: var(--vscode-foreground);
}
.input-bottom-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-bottom: -17px;
}
.mode-selector {
display: flex;
align-items: center;
gap: 8px;
position: relative;
}
.input-actions {
display: flex;
align-items: center;
gap: 10px;
}
/* Tooltip 样式 */
.tooltip {
position: relative;
display: inline-block;
}
.tooltip .tooltiptext {
visibility: hidden;
width: auto;
background: #1e1e1e;
color: #ffffff;
text-align: center;
border-radius: 6px;
padding: 6px 12px;
position: absolute;
z-index: 1000;
bottom: 150%;
left: 50%;
transform: translateX(-50%) translateY(10px);
opacity: 0;
transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
font-size: 12px;
font-weight: 500;
border: 1px solid rgba(255, 255, 255, 0.2);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6), 0 2px 4px rgba(0, 0, 0, 0.3);
white-space: nowrap;
letter-spacing: 0.3px;
}
.tooltip .tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -6px;
border-width: 6px;
border-style: solid;
border-color: #1e1e1e transparent transparent transparent;
}
.tooltip .tooltiptext::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -7px;
border-width: 7px;
border-style: solid;
border-color: rgba(255, 255, 255, 0.2) transparent transparent transparent;
z-index: -1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
opacity: 1;
transform: translateX(-50%) translateY(0);
}
textarea {
width: 100%;
padding: 10px;
background: transparent;
color: var(--vscode-input-foreground);
border: none;
border-radius: 4px;
font-family: inherit;
resize: none;
min-height: 40px;
max-height: 200px;
outline: none;
box-sizing: border-box;
overflow-y: auto;
line-height: 1.5;
}
/* 简洁的滚动条样式 */
textarea::-webkit-scrollbar {
width: 8px;
}
textarea::-webkit-scrollbar-track {
background: transparent;
}
textarea::-webkit-scrollbar-thumb {
background: rgba(128, 128, 128, 0.5);
border-radius: 4px;
}
textarea::-webkit-scrollbar-button {
display: none;
}
button {
padding: 0 20px;
background: var(--vscode-button-background);
color: var(--vscode-button-foreground);
border: none;
border-radius: 4px;
cursor: pointer;
}
.optimize-button {
padding: 8px;
background: transparent;
color: var(--vscode-foreground);
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.2s ease;
width: 32px;
height: 32px;
}
.optimize-button:hover {
opacity: 0.7;
}
.optimize-button svg {
width: 16px;
height: 16px;
}
.optimize-button-wrapper {
display: flex;
align-items: flex-end;
}
`;
}
/**
* 获取输入区域的脚本
*/
export function getInputAreaScript(): string {
return `
${getModeSelectorScript()}
${getModelSelectorScript()}
${getContextButtonScript()}
${getContextCompressScript()}
// 自动调整 textarea 高度
function autoResizeTextarea() {
if (messageInput) {
messageInput.style.height = 'auto';
messageInput.style.height = messageInput.scrollHeight + 'px';
}
}
// 监听输入事件,自动调整高度
if (messageInput) {
messageInput.addEventListener('input', autoResizeTextarea);
// 初始化时调整一次高度
autoResizeTextarea();
// 聚焦到输入框
messageInput.focus();
}
function sendMessage() {
const text = messageInput.value.trim();
if (!text) return;
const mode = getCurrentMode(); // 从模式选择器组件获取当前模式
const model = getCurrentModel(); // 从模型选择器组件获取当前模型
addMessage(text, 'user');
vscode.postMessage({ command: 'sendMessage', text: text, mode: mode, model: model });
messageInput.value = '';
autoResizeTextarea(); // 重置输入框高度
messageInput.focus();
// 重置优化状态
resetOptimizeButton();
}
// Plan 开关处理函数
function handlePlanToggle() {
const planToggle = document.getElementById('planToggle');
const planTooltip = document.getElementById('planTooltip');
if (planToggle && planTooltip) {
if (planToggle.checked) {
// 开启 Plan 模式
planTooltip.textContent = '关闭 Plan 模式';
} else {
// 关闭 Plan 模式
planTooltip.textContent = '启用 Plan 模式';
}
}
}
let isOptimized = false; // 标记是否已优化
let originalText = ''; // 保存原始文本用于撤回
function handleOptimize() {
if (isOptimized) {
// 撤回操作
messageInput.value = originalText;
resetOptimizeButton();
} else {
// 优化操作
originalText = messageInput.value; // 保存原始文本
// 使用死数据替换输入框内容
const optimizedTexts = [
'请帮我优化这段代码,提高性能和可读性',
'请分析这个问题并给出最佳解决方案',
'请帮我重构这段代码,使其更加简洁高效',
'请检查代码中的潜在问题并提供改进建议'
];
const randomText = optimizedTexts[Math.floor(Math.random() * optimizedTexts.length)];
messageInput.value = randomText;
// 切换到撤回状态
isOptimized = true;
updateOptimizeButton();
}
messageInput.focus();
autoResizeTextarea();
}
function updateOptimizeButton() {
const optimizeIcon = document.getElementById('optimizeIcon');
const optimizeTooltip = document.getElementById('optimizeTooltip');
if (optimizeIcon && optimizeTooltip) {
// 切换为撤回图标
optimizeIcon.innerHTML = '<path d="M581.056 288.32H232.96l108.352-102.208c15.552-15.744 19.456-31.104 4.16-46.208-16.064-15.872-32.576-15.808-48.64 0l-145.92 144.768c-8.768 8.832-23.488 20.608-22.08 32.448l0.64 4.8-0.64 4.864c-1.344 11.776 6.4 18.24 14.848 26.816l147.648 145.216c16.064 15.808 38.08 20.992 54.144 5.12 15.296-15.104 3.84-38.208-11.328-53.504L233.152 353.6 581.056 352c126.464 0 250.944 111.488 250.944 236.16C832 712.832 707.52 832 581.056 832H246.4c-22.592 0-29.696 9.6-29.696 32.256s7.04 31.744 29.696 31.744H581.12C755.136 896 896 757.696 896 588.16c0-169.408-140.8-299.84-314.944-299.84z" fill="currentColor"/><path d="M323.392 192a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM320.192 514.048a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM237.824 896a32 32 0 1 1 0-64 32 32 0 0 1 0 64z" fill="currentColor"/>';
optimizeTooltip.textContent = '撤回';
}
}
function resetOptimizeButton() {
const optimizeIcon = document.getElementById('optimizeIcon');
const optimizeTooltip = document.getElementById('optimizeTooltip');
if (optimizeIcon && optimizeTooltip) {
// 切换回优化图标(星星图标)
optimizeIcon.innerHTML = '<path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" fill="#409eff"/>';
optimizeTooltip.textContent = '一键优化';
}
isOptimized = false;
originalText = '';
}
`;
}

1279
src/views/messageArea.ts Normal file

File diff suppressed because it is too large Load Diff

250
src/views/modelSelector.ts Normal file
View File

@ -0,0 +1,250 @@
/**
* 模型选择器组件
*/
/**
* 获取模型选择器的 HTML 内容
*/
export function getModelSelectorContent(): string {
return `
<!-- 模型选择 -->
<div class="tooltip">
<div class="custom-select" id="modelSelect">
<div class="select-trigger" onclick="toggleModelDropdown()">
<span class="select-value" id="modelValue">Auto</span>
<svg class="select-arrow" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
<path d="M507.8 727.728a30.016 30.016 0 0 1-21.288-8.824L231.104 463.496a30.088 30.088 0 0 1 0-42.568 30.088 30.088 0 0 1 42.568 0l234.128 234.128 234.16-234.128a30.088 30.088 0 0 1 42.568 0 30.088 30.088 0 0 1 0 42.568L529.08 718.904a30 30 0 0 1-21.28 8.824z" fill="#8a8a8a"/>
</svg>
</div>
<div class="select-dropdown" id="modelDropdown">
<div class="select-option" data-value="lite" data-tooltip="快速响应,适合简单任务" onclick="selectModel('lite', 'Lite')">Lite</div>
<div class="select-option selected" data-value="auto" data-tooltip="自动选择最佳模型" onclick="selectModel('auto', 'Auto')">Auto</div>
<div class="select-option" data-value="syntaxic" data-tooltip="语法分析和代码理解" onclick="selectModel('syntaxic', 'Syntaxic')">Syntaxic</div>
<div class="select-option" data-value="max" data-tooltip="最强性能,复杂任务" onclick="selectModel('max', 'Max')">Max</div>
</div>
<!-- 模型选择器的 tooltip 容器 -->
<div id="modelTooltip" class="model-tooltip"></div>
</div>
<span class="tooltiptext">选择模型</span>
</div>
`;
}
/**
* 获取模型选择器的样式
*/
export function getModelSelectorStyles(): string {
return `
/* 自定义下拉框样式 */
.custom-select {
position: relative;
user-select: none;
}
.select-trigger {
display: flex;
align-items: center;
gap: 6px;
padding: 4px 8px;
background: var(--vscode-input-background);
color: var(--vscode-foreground);
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 12px;
transition: background 0.2s ease;
}
.select-trigger:hover {
background: var(--vscode-list-hoverBackground);
}
.select-value {
white-space: nowrap;
}
.select-arrow {
width: 12px;
height: 12px;
flex-shrink: 0;
transition: transform 0.2s ease;
}
.custom-select.active .select-arrow {
transform: rotate(180deg);
}
.select-dropdown {
position: absolute;
bottom: calc(100% + 2px);
left: 0;
min-width: 100%;
background: var(--vscode-dropdown-background);
border: 1px solid var(--vscode-dropdown-border);
border-radius: 4px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
z-index: 1100;
display: none;
overflow: visible;
}
.custom-select.active .select-dropdown {
display: block;
}
/* 模型选择器的选项样式 */
#modelDropdown .select-option {
position: relative;
padding: 6px 12px;
font-size: 12px;
cursor: pointer;
transition: background 0.2s ease;
white-space: nowrap;
}
#modelDropdown .select-option:hover {
background: rgba(128, 128, 128, 0.3);
}
#modelDropdown .select-option.selected {
background: rgba(128, 128, 128, 0.5);
color: var(--vscode-foreground);
}
/* 模型选择器的 tooltip 样式 */
.model-tooltip {
position: fixed;
background: #1e1e1e;
color: #ffffff;
padding: 8px 12px;
border-radius: 6px;
font-size: 12px;
white-space: nowrap;
pointer-events: none;
z-index: 10000;
border: 1px solid rgba(255, 255, 255, 0.2);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
opacity: 0;
visibility: hidden;
transition: opacity 0.2s ease, visibility 0.2s ease;
}
.model-tooltip.show {
opacity: 1;
visibility: visible;
}
/* tooltip 箭头 */
.model-tooltip::before {
content: "";
position: absolute;
right: 100%;
top: 50%;
transform: translateY(-50%);
border-width: 7px;
border-style: solid;
border-color: transparent rgba(255, 255, 255, 0.2) transparent transparent;
z-index: -1;
}
.model-tooltip::after {
content: "";
position: absolute;
right: 100%;
top: 50%;
transform: translateY(-50%);
border-width: 6px;
border-style: solid;
border-color: transparent #1e1e1e transparent transparent;
margin-right: 1px;
}
`;
}
/**
* 获取模型选择器的脚本
*/
export function getModelSelectorScript(): string {
return `
// 模型选择相关变量
let currentModel = 'auto';
// 切换模型下拉框显示/隐藏
function toggleModelDropdown() {
const modelSelect = document.getElementById('modelSelect');
const customSelect = document.getElementById('customSelect');
if (modelSelect) {
modelSelect.classList.toggle('active');
// 关闭模式下拉框
if (customSelect) {
customSelect.classList.remove('active');
}
}
}
// 选择模型
function selectModel(value, label) {
currentModel = value;
const modelValue = document.getElementById('modelValue');
if (modelValue) {
modelValue.textContent = label;
}
// 更新选中状态
const options = document.querySelectorAll('#modelDropdown .select-option');
options.forEach(option => {
if (option.getAttribute('data-value') === value) {
option.classList.add('selected');
} else {
option.classList.remove('selected');
}
});
// 关闭下拉框
const modelSelect = document.getElementById('modelSelect');
if (modelSelect) {
modelSelect.classList.remove('active');
}
}
// 点击外部关闭模型下拉框
document.addEventListener('click', (event) => {
const modelSelect = document.getElementById('modelSelect');
if (modelSelect && !modelSelect.contains(event.target)) {
modelSelect.classList.remove('active');
}
});
// 获取当前选中的模型
function getCurrentModel() {
return currentModel;
}
// 模型选择器 tooltip 功能
(function initModelTooltip() {
const modelDropdown = document.getElementById('modelDropdown');
const modelTooltip = document.getElementById('modelTooltip');
if (!modelDropdown || !modelTooltip) return;
// 为每个选项添加鼠标事件
const options = modelDropdown.querySelectorAll('.select-option');
options.forEach(option => {
option.addEventListener('mouseenter', function(e) {
const tooltipText = this.getAttribute('data-tooltip');
if (!tooltipText) return;
// 设置 tooltip 内容
modelTooltip.textContent = tooltipText;
// 获取选项的位置
const rect = this.getBoundingClientRect();
// 计算 tooltip 位置(在选项右侧)
const tooltipRect = modelTooltip.getBoundingClientRect();
const left = rect.right + 12;
const top = rect.top + (rect.height / 2) - (tooltipRect.height / 2);
// 设置位置
modelTooltip.style.left = left + 'px';
modelTooltip.style.top = top + 'px';
// 显示 tooltip
modelTooltip.classList.add('show');
});
option.addEventListener('mouseleave', function() {
// 隐藏 tooltip
modelTooltip.classList.remove('show');
});
});
})();
`;
}

File diff suppressed because it is too large Load Diff