# 代码变更审查功能 - 使用说明 ## 功能说明 AI 修改文件后,会在输入框上方显示"代码变更"面板,用户可以: - 查看所有修改的文件列表 - 点击文件查看 diff 对比 - 采纳变更(保存文件) - 拒绝变更(恢复旧内容) ## 已完成的集成 ### 1. 后端集成 - ✅ 在 `ICHelperPanel.ts` 中添加了消息监听(acceptChange/rejectChange) - ✅ 在发送消息时启动变更追踪会话 - ✅ 在文件操作时自动记录变更(messageHandler.ts、toolExecutor.ts) ### 2. 前端集成 - ✅ 在 `webviewContent.ts` 中添加了消息处理(showChanges/changeAccepted/changeRejected) - ✅ 在 `changePanel.ts` 中实现了完整的 UI 交互逻辑 ### 3. 核心功能 - ✅ 变更追踪服务(changeTracker.ts) - ✅ Diff 可视化渲染(diffRenderer.ts) - ✅ 采纳/拒绝变更逻辑 ## 待完成工作 需要在对话结束时调用 `sendChangesToWebview(panel)` 来显示变更面板。 建议在以下位置添加: 1. 在 `handleUserMessage` 函数中,对话流结束时 2. 或在 `dialogManager` 的对话完成回调中 示例代码: ```typescript // 对话结束时 import { sendChangesToWebview } from '../utils/messageHandler'; // 在对话完成的地方调用 sendChangesToWebview(panel); ``` ## 测试步骤 1. 启动插件(F5) 2. 发送消息让 AI 修改文件 3. 对话结束后,输入框上方应显示"代码变更"面板 4. 点击文件查看 diff 5. 点击"采纳"或"拒绝"按钮测试功能