Compare commits
284 Commits
feat/plugi
...
47f95afabb
| Author | SHA1 | Date | |
|---|---|---|---|
| 47f95afabb | |||
| 7fe87e515b | |||
| 081ddec55c | |||
| 12c2f634bd | |||
| 790110ba7e | |||
| b9dc631bf7 | |||
| 6425496d2e | |||
| fd5a01c67f | |||
| 29e80ce296 | |||
| c244a308d7 | |||
| a25d68f527 | |||
| 77b54aebf0 | |||
| 840436eb36 | |||
| f5dd7534f0 | |||
| ebb9de5294 | |||
| 531d140b99 | |||
| 97b8e8aa7d | |||
| 4ed998e937 | |||
| ad0f0336d5 | |||
| 7cde4fa138 | |||
| 1b7259d1c1 | |||
| 09ff812562 | |||
| e7c631d532 | |||
| 06573e37d7 | |||
| d740f4da44 | |||
| f24bd38ec7 | |||
| 45934baf0a | |||
| 4384ee53c5 | |||
| d89c326be5 | |||
| 2dccb4f871 | |||
| a9ddf3074e | |||
| db087bb184 | |||
| 5e9083041f | |||
| be0555d6bc | |||
| ea19dfcbe6 | |||
| fa55e32153 | |||
| f6b1f5c45a | |||
| 1f9a1822c9 | |||
| 63015c6bbc | |||
| 24b30df992 | |||
| 67b1003831 | |||
| 00d37bdaf0 | |||
| c5fcb1427e | |||
| 9118ebd662 | |||
| 19cdf47bed | |||
| 95bac94479 | |||
| 421a8934a7 | |||
| f7f45668d3 | |||
| c8e9a5b897 | |||
| a1bfa62796 | |||
| 64e11cbc3c | |||
| 15445aa13c | |||
| 52834047f2 | |||
| 76817675f1 | |||
| 2cce8f94c9 | |||
| 9b5f102d9f | |||
| 68de33165e | |||
| f56ad33366 | |||
| 35c63802b5 | |||
| 3458f6fe23 | |||
| 8f305033f7 | |||
| 4a18f1c418 | |||
| 373edb6d80 | |||
| 1c66e0e599 | |||
| 536e7720cb | |||
| 75eac4b1ce | |||
| 9ed0afee6b | |||
| f700473967 | |||
| 5fc0fd2a95 | |||
| 5f88c7ceac | |||
| 4c7ec65577 | |||
| 3e18299099 | |||
| 021be88880 | |||
| a479e81682 | |||
| c3e3012a94 | |||
| c9e9df3825 | |||
| 7ca2fa1bcc | |||
| 208c24682b | |||
| 316c784bde | |||
| 1467ae8a89 | |||
| 1881615860 | |||
| 0ea3afbe70 | |||
| 4f1d7f495a | |||
| 7c4ecb013e | |||
| ed5976a22c | |||
| d0462ca4b9 | |||
| eae3968465 | |||
| a734ccbb88 | |||
| 7444bb1140 | |||
| 6ef7e976cc | |||
| 31419e93a1 | |||
| 173132399e | |||
| ae703091d4 | |||
| 8daea722bd | |||
| 032dd1b215 | |||
| 885e2cef75 | |||
| 9296b10150 | |||
| 423c9ddb0e | |||
| 50eacdafde | |||
| d90cca7cef | |||
| 5347425327 | |||
| 28d93c7e75 | |||
| 5339212de9 | |||
| 73a1510de4 | |||
| 606f757699 | |||
| 342bf22f3f | |||
| d2ec73f796 | |||
| c9f597beec | |||
| e9a201ef01 | |||
| 77a89847cb | |||
| c14b7f4dbc | |||
| 64724bf48c | |||
| c9e160f2ef | |||
| 3a19cc638f | |||
| a2e8e74572 | |||
| ad96743fad | |||
| 95b1bd7678 | |||
| 94b6fb056f | |||
| a24fd71636 | |||
| 7d1b8f7e26 | |||
| 5753e120ba | |||
| f55a5bfbcb | |||
| 83b706d5be | |||
| b9e63bc9a9 | |||
| ef0c8748f7 | |||
| 430a2c4062 | |||
| f5bd35c71a | |||
| f958683f53 | |||
| 21a8abd5cf | |||
| 4b2da8244f | |||
| c571cd9137 | |||
| 8cf0e32184 | |||
| 1cbd0c5fe7 | |||
| 72a84ed9e2 | |||
| 58113fb109 | |||
| 25966bc1e2 | |||
| 3c93c07afd | |||
| 85a37b546c | |||
| 37a121c3de | |||
| 341b6540fa | |||
| 1d074e5a94 | |||
| 5a5d82eef8 | |||
| 43189e144a | |||
| fd11eadc19 | |||
| 1231ef0892 | |||
| a1e88d473b | |||
| d08f9a7366 | |||
| faa7b63aee | |||
| e440dd2773 | |||
| a02027e7c9 | |||
| 772b067202 | |||
| a3fd5df8e8 | |||
| bdc55c727a | |||
| 52e4522ed0 | |||
| d44b316c9a | |||
| 939768986c | |||
| 1e99f3cb20 | |||
| 2af79cf1dc | |||
| 5b225126f1 | |||
| 4abb979eab | |||
| 4a790b5aca | |||
| 9786b7141c | |||
| 4a7af49fea | |||
| 15a1de3a90 | |||
| 4687c3faa6 | |||
| 5c19be22d3 | |||
| feff8ea4d3 | |||
| 6abec8c7b7 | |||
| f9b3699bda | |||
| 8da1177bf3 | |||
| a85a044a9b | |||
| 5546791549 | |||
| c58e3603de | |||
| 178f3a7498 | |||
| 940584e1ea | |||
| 4037e9e2d7 | |||
| 4b2f6967dc | |||
| 79ef879b97 | |||
| 1df7462778 | |||
| 0bcdc615e3 | |||
| 5577fe17bb | |||
| 820ee2f848 | |||
| be8365c8cb | |||
| b1dd2442b8 | |||
| 9281d1d724 | |||
| 226bb46094 | |||
| 251289a340 | |||
| c22081c5e9 | |||
| cca82c7885 | |||
| e4ff49bade | |||
| ada4806493 | |||
| 3831de2849 | |||
| 0df529c4fd | |||
| 5c53d7f0e9 | |||
| ef2a0dc16e | |||
| 5ce420295b | |||
| 1d7f3d7626 | |||
| 9b0d2d5e01 | |||
| 27e3351b55 | |||
| de3e84aa4e | |||
| e48e822d07 | |||
| 8dc34ee435 | |||
| d8cd86361e | |||
| acf3f9ff37 | |||
| c27b08cccf | |||
| 9fc3c9f056 | |||
| 60d8eaf0eb | |||
| df6f983e83 | |||
| acf60f2a17 | |||
| f933d84cd1 | |||
| b794d1ceb0 | |||
| 259310a29d | |||
| 715eac5949 | |||
| c2936395d9 | |||
| 8762eacb3e | |||
| 3d535fd3e1 | |||
| ecdbe0bdc0 | |||
| c49aaf753c | |||
| 0f8674e1c7 | |||
| ef2159f1bd | |||
| b662d25c9c | |||
| 1ce1ed715c | |||
| 2587018405 | |||
| 28b75e8475 | |||
| 5287d483d8 | |||
| 16e91bd2c0 | |||
| e6b6bc3698 | |||
| d43cd610a0 | |||
| 842e5fb49b | |||
| 430581598b | |||
| 2d5b297171 | |||
| 023fdb66c3 | |||
| 42481cd314 | |||
| e77194628a | |||
| 2aff54de74 | |||
| 91fadf591f | |||
| 02b56a7031 | |||
| c42ebdfe59 | |||
| 3f0cc8ae29 | |||
| 0f458f6299 | |||
| d415d8ee4e | |||
| bd7a85b705 | |||
| 44bbcde5cf | |||
| f9c9fa1840 | |||
| 53e91fc5a0 | |||
| 4288607ee2 | |||
| d4d86df7de | |||
| 4b8d255207 | |||
| a5dba25a8e | |||
| 719d1396b0 | |||
| 5b6ac43e13 | |||
| f7c2d86a46 | |||
| 83db55c790 | |||
| 94d41c3da9 | |||
| 83f9e2f005 | |||
| 318d3964bd | |||
| 770da72ce3 | |||
| d4c726ea9c | |||
| 082ef923b2 | |||
| c050f0e167 | |||
| 3daa66ea01 | |||
| 9bdaf34471 | |||
| 5cb68652f9 | |||
| 9bfa774336 | |||
| 009da59d38 | |||
| 5ea5ddba6e | |||
| 25a8ea5aa4 | |||
| ef83016b7f | |||
| 2e6812d00d | |||
| b676846b2f | |||
| 9c787627a9 | |||
| 463eedf1dd | |||
| fb1156d24f | |||
| 0b4ec2ca6e | |||
| 10f0877a5e | |||
| 5c2ea0f15c | |||
| 6c5d470bad | |||
| c21ad95963 | |||
| 7c1f1fae07 | |||
| c61e29a41f | |||
| 703912bb5f | |||
| 8ad6a48e8f | |||
| ba75541dd6 | |||
| f87adab7be |
10
.gitignore
vendored
@ -3,3 +3,13 @@ dist
|
||||
node_modules
|
||||
.vscode-test/
|
||||
*.vsix
|
||||
|
||||
# waveform_trace 打包产物
|
||||
tools/waveform_trace/src/build/
|
||||
tools/waveform_trace/src/dist/
|
||||
tools/waveform_trace/src/*.spec
|
||||
|
||||
# Python 缓存
|
||||
__pycache__/
|
||||
*.pyc
|
||||
*.pyo
|
||||
|
||||
8
.idea/.gitignore
generated
vendored
Normal file
@ -0,0 +1,8 @@
|
||||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
# Datasource local storage ignored files
|
||||
/dataSources/
|
||||
/dataSources.local.xml
|
||||
9
.idea/IC-Coder-Plugin.iml
generated
Normal file
@ -0,0 +1,9 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="JAVA_MODULE" version="4">
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$" />
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
16
.idea/codeStyles/Project.xml
generated
Normal file
@ -0,0 +1,16 @@
|
||||
<component name="ProjectCodeStyleConfiguration">
|
||||
<code_scheme name="Project" version="173">
|
||||
<JSCodeStyleSettings version="0">
|
||||
<option name="FORCE_SEMICOLON_STYLE" value="true" />
|
||||
</JSCodeStyleSettings>
|
||||
<JavaCodeStyleSettings>
|
||||
<option name="ENABLE_JAVADOC_FORMATTING" value="false" />
|
||||
</JavaCodeStyleSettings>
|
||||
<codeStyleSettings language="JavaScript">
|
||||
<option name="IF_BRACE_FORCE" value="3" />
|
||||
<option name="DOWHILE_BRACE_FORCE" value="3" />
|
||||
<option name="WHILE_BRACE_FORCE" value="3" />
|
||||
<option name="FOR_BRACE_FORCE" value="3" />
|
||||
</codeStyleSettings>
|
||||
</code_scheme>
|
||||
</component>
|
||||
5
.idea/codeStyles/codeStyleConfig.xml
generated
Normal file
@ -0,0 +1,5 @@
|
||||
<component name="ProjectCodeStyleConfiguration">
|
||||
<state>
|
||||
<option name="USE_PER_PROJECT_SETTINGS" value="true" />
|
||||
</state>
|
||||
</component>
|
||||
6
.idea/inspectionProfiles/Project_Default.xml
generated
Normal file
@ -0,0 +1,6 @@
|
||||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
||||
</profile>
|
||||
</component>
|
||||
6
.idea/misc.xml
generated
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectRootManager" version="2" languageLevel="JDK_25" default="true" project-jdk-name="openjdk-25" project-jdk-type="JavaSDK">
|
||||
<output url="file://$PROJECT_DIR$/out" />
|
||||
</component>
|
||||
</project>
|
||||
8
.idea/modules.xml
generated
Normal file
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/IC-Coder-Plugin.iml" filepath="$PROJECT_DIR$/.idea/IC-Coder-Plugin.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
6
.idea/vcs.xml
generated
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
2
.npmrc
@ -1 +1,3 @@
|
||||
enable-pre-post-scripts = true
|
||||
shamefully-hoist = true
|
||||
public-hoist-pattern[] = *
|
||||
4
.vscode/settings.json
vendored
@ -9,5 +9,7 @@
|
||||
"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
|
||||
"typescript.tsc.autoDetect": "off"
|
||||
"typescript.tsc.autoDetect": "off",
|
||||
// IC Coder 后端服务地址
|
||||
"icCoder.backendUrl": "http://192.168.1.108:2233"
|
||||
}
|
||||
|
||||
33
.vscodeignore
Normal file
@ -0,0 +1,33 @@
|
||||
# 开发文件
|
||||
.vscode/**
|
||||
.vscode-test/**
|
||||
src/**
|
||||
.gitignore
|
||||
.yarnrc
|
||||
vsc-extension-quickstart.md
|
||||
**/tsconfig.json
|
||||
**/.eslintrc.json
|
||||
**/*.map
|
||||
**/*.ts
|
||||
|
||||
# 测试文件
|
||||
out/test/**
|
||||
|
||||
# 依赖
|
||||
node_modules/**
|
||||
|
||||
# 文档(避免中文文件名打包问题)
|
||||
docs/**
|
||||
CLAUDE.md
|
||||
|
||||
# 只排除 waveform_trace 的 src/dist 目录
|
||||
tools/waveform_trace/src/**
|
||||
tools/iverilog/examples/**
|
||||
tools/iverilog/INSTALL.md
|
||||
tools/iverilog/README.md
|
||||
tools/iverilog/DOWNLOAD_INSTRUCTIONS.md
|
||||
|
||||
|
||||
# Git 相关
|
||||
.git/**
|
||||
.github/**
|
||||
69
CHANGELOG.md
@ -1,9 +1,68 @@
|
||||
# Change Log
|
||||
# 更新日志
|
||||
|
||||
All notable changes to the "ic-coder" extension will be documented in this file.
|
||||
所有重要的项目变更都将记录在此文件中。
|
||||
|
||||
Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how to structure this file.
|
||||
## [1.0.12] - 2026-03-06
|
||||
|
||||
## [Unreleased]
|
||||
### 新增
|
||||
|
||||
- Initial release
|
||||
- 支持 AskUserQuestion 多问题和多选功能
|
||||
|
||||
## [1.0.9] - 2026-03-04
|
||||
|
||||
### 优化
|
||||
|
||||
- 将工具折叠图标颜色从蓝色改为灰色
|
||||
- 统一使用蓝色主题色
|
||||
- 优化打包配置,排除重复的 exe 文件
|
||||
|
||||
### 修复
|
||||
|
||||
- 修复代码变更继续对话查找不到之前的代码变更信息的 bug
|
||||
- 修复对话展示两遍的问题
|
||||
|
||||
## [1.0.8] - 2026-03-03
|
||||
|
||||
### 新增
|
||||
|
||||
- 删除文件确认功能
|
||||
- 文件路径标签显示
|
||||
- 企业试用用户欢迎弹窗优化
|
||||
|
||||
### 修复
|
||||
|
||||
- 修复继续对话时消息覆盖问题
|
||||
- 修复试用用户欢迎弹窗显示逻辑
|
||||
- 修复企业试用用户仍弹出邀请码的问题
|
||||
- 修复登录过期点击重新登录失败的问题
|
||||
|
||||
## [1.0.7] - 2026-03-02
|
||||
|
||||
### 修复
|
||||
|
||||
- 修复 AI 响应内容重复显示问题
|
||||
|
||||
## [1.0.6] - 2026-03-02
|
||||
|
||||
### 新增
|
||||
|
||||
- Git Diff 功能:支持查看当前文件的 Git 差异对比
|
||||
|
||||
### 修复
|
||||
|
||||
- 修复添加上下文搜索选择文件不匹配的问题
|
||||
- 修复过期认证状态未清除导致重新登录失败的问题
|
||||
|
||||
## [1.0.4] - 2026-01-28
|
||||
|
||||
IC Coder插件端正式上线。
|
||||
|
||||
IC Coder 插件端是一个是一个自主式人工智能 Verilog 编码平台,可以将芯片设计与验证的效率提升至少20倍!
|
||||
|
||||
主要功能:
|
||||
|
||||
- 自动搭建电路架构:够根据自然语言描述的设计需求,自动生成完整的电路架构
|
||||
- AI自主仿真:IC Coder提供完全自动化的仿真验证流程,无需手动编写测试代码
|
||||
- AI自主代码迭代:实现了真正的自主式开发循环,能够持续优化代码直到满足设计要求
|
||||
- 随时可掌控:提供透明化的开发过程,让用户始终掌握AI的工作状态
|
||||
- 多层次安全保障:将数据安全和隐私保护作为核心设计原则,提供企业级的安全保障
|
||||
|
||||
90
CLAUDE.md
Normal file
@ -0,0 +1,90 @@
|
||||
# CLAUDE.md
|
||||
|
||||
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
||||
|
||||
## Project Overview
|
||||
|
||||
IC Coder Plugin 是一个 VS Code 扩展,为 Verilog/FPGA 开发提供智能辅助功能,包括代码生成、文件操作、iverilog 仿真和 VCD 波形查看。
|
||||
|
||||
## Build Commands
|
||||
|
||||
```bash
|
||||
# 安装依赖
|
||||
pnpm install
|
||||
|
||||
# 编译 (开发模式)
|
||||
pnpm run compile
|
||||
|
||||
# 监听模式编译
|
||||
pnpm run watch
|
||||
|
||||
# 生产环境打包
|
||||
pnpm run package
|
||||
|
||||
# 代码检查
|
||||
pnpm run lint
|
||||
|
||||
# 运行测试
|
||||
pnpm run test
|
||||
|
||||
# 编译测试文件
|
||||
pnpm run compile-tests
|
||||
```
|
||||
|
||||
## Development
|
||||
|
||||
- 按 F5 在 VS Code 中启动调试模式
|
||||
- 使用 webpack 打包,入口文件为 `src/extension.ts`
|
||||
- 输出目录为 `dist/`
|
||||
|
||||
## Architecture
|
||||
|
||||
```
|
||||
src/
|
||||
├── extension.ts # 插件入口,注册命令和视图
|
||||
├── panels/
|
||||
│ ├── ICHelperPanel.ts # 主聊天面板 (WebviewPanel)
|
||||
│ └── VCDViewerPanel.ts # VCD 波形查看器面板
|
||||
├── views/
|
||||
│ ├── ICViewProvider.ts # 侧边栏视图提供者
|
||||
│ └── webviewContent.ts # Webview HTML 内容 (大文件,使用搜索)
|
||||
├── utils/
|
||||
│ ├── messageHandler.ts # 消息处理核心逻辑 (大文件,使用搜索)
|
||||
│ ├── iverilogRunner.ts # iverilog 编译和仿真执行
|
||||
│ ├── chatHistoryManager.ts # 会话历史管理
|
||||
│ ├── createFiles.ts # 文件创建工具
|
||||
│ └── readFiles.ts # 文件读取工具
|
||||
├── types/
|
||||
│ └── chatHistory.ts # 消息类型定义 (LangChain4j 格式)
|
||||
└── test/ # 测试文件
|
||||
```
|
||||
|
||||
### Key Components
|
||||
|
||||
**消息流程**: Webview -> `onDidReceiveMessage` -> `messageHandler.ts` -> 后端处理 -> `panel.webview.postMessage` -> Webview
|
||||
|
||||
**消息类型** (`src/types/chatHistory.ts`):
|
||||
- `MessageType.SYSTEM` / `USER` / `AI` / `TOOL_EXECUTION_RESULT`
|
||||
- 兼容 LangChain4j 格式
|
||||
|
||||
**iverilog 集成** (`tools/iverilog/`):
|
||||
- 内置 Windows x64 版本的 iverilog/vvp
|
||||
- 通过 `IVERILOG_ROOT` 环境变量配置库路径
|
||||
- 支持命令: "生成 VCD"、"运行仿真"、"生成波形"
|
||||
|
||||
## VS Code Extension Points
|
||||
|
||||
- 命令: `ic-coder.openPanel`, `ic-coder.openChat`, `ic-coder.openVCDViewer`
|
||||
- 侧边栏视图: `ic-coder.mainView`
|
||||
- 激活事件: `onLanguage:verilog`, `onLanguage:vhdl`, `onStartupFinished`
|
||||
|
||||
## Dependencies
|
||||
|
||||
- `vcdrom`, `vcd-stream`, `waveql` - VCD 波形处理
|
||||
- `@wavedrom/doppler`, `onml` - 波形渲染
|
||||
- `iconv-lite` - 编码转换
|
||||
|
||||
## Notes
|
||||
|
||||
- `webviewContent.ts` 和 `messageHandler.ts` 文件较大,建议使用搜索而非完整读取
|
||||
- 当前仅支持 Windows 平台的 iverilog,其他平台需用户自行安装
|
||||
12
LICENSE
Normal file
@ -0,0 +1,12 @@
|
||||
Copyright (c) 2025 IC Coder Team. All rights reserved.
|
||||
|
||||
本软件及其相关文档文件(以下简称"软件")的版权归 IC Coder 所有。
|
||||
|
||||
未经版权所有者事先书面许可,不得以任何形式或方式(电子、机械、复印、录制或其他方式)
|
||||
复制、分发、传播、展示、修改或创建本软件的衍生作品。
|
||||
|
||||
本软件按"原样"提供,不提供任何明示或暗示的保证,包括但不限于适销性、特定用途适用性
|
||||
和非侵权性的保证。在任何情况下,作者或版权持有人均不对任何索赔、损害或其他责任负责,
|
||||
无论是在合同诉讼、侵权行为还是其他方面。
|
||||
|
||||
如需商业使用或获取许可,请联系:[pyjtkj@pyjtkj.com]
|
||||
93
README.md
@ -1,24 +1,87 @@
|
||||
# IC Coder Plugin
|
||||
## 什么是IC Coder
|
||||
|
||||
IC Coder 是一个面向 Verilog/FPGA 开发的智能辅助插件。
|
||||
IC Coder是一款**The Agentic AI Verilog Coding Platform(自主式人工智能 Verilog 编码平台)**。我们立志于用AI重塑芯片开发者的效率,将芯片设计与验证的效率提升至少20倍!让芯片开发者们,都能享受到AI发展所带来的科技福利!目标成为全球最好用的"LLM生成Verilog"的平台!
|
||||
|
||||
## 功能特性
|
||||

|
||||
|
||||
- Verilog 代码智能生成
|
||||
- 文件操作支持(创建、读取、修改、删除)
|
||||
- 集成 iverilog 仿真工具
|
||||
- VCD 波形文件生成
|
||||
- 智能对话助手
|
||||
### 核心技术架构
|
||||
|
||||
## 使用说明
|
||||
**我们采用全球顶尖的大语言模型**,加上自研的针对芯片设计领域深度优化的微调模型,为代码生成提供强大的AI能力支撑。
|
||||
|
||||
安装插件后,点击侧边栏的 IC Coder 图标即可开始使用。
|
||||
**核心技术栈**包括:
|
||||
|
||||
## 系统要求
|
||||
- **多智能体架构(Multi-Agent System)**:多个专业化AI智能体协同工作,分别负责架构设计、代码生成、验证测试等不同环节
|
||||
- **增强上下文引擎**:智能理解和管理大规模设计上下文,确保生成代码的一致性和准确性
|
||||
|
||||
- VS Code 1.107.0 或更高版本
|
||||
- 插件已内置 iverilog 工具(Windows 平台)
|
||||
这些技术共同支撑着从需求分析、架构设计、代码生成到验证调试的全流程智能化开发体验。
|
||||
|
||||
## 许可证
|
||||

|
||||
|
||||
MIT
|
||||
## 自动搭建电路架构
|
||||
|
||||
IC Coder能够根据自然语言描述的设计需求,自动生成完整的电路架构。系统会:
|
||||
|
||||
- **智能解析需求**:理解功能规格、性能指标、接口要求等设计约束
|
||||
- **自动模块划分**:根据功能将设计合理拆分为多个子模块,确保模块化和可复用性
|
||||
- **生成层次结构**:建立清晰的模块层次关系,自动处理模块间的信号连接
|
||||
- **结构化信号管理**:将所有电路信号关系进行结构化表示,包括数据流向、控制逻辑、时序关系等
|
||||
- **可视化展示**:以图形化方式展示整体架构,便于理解和审查设计方案
|
||||
|
||||

|
||||
|
||||
## AI自主仿真
|
||||
|
||||
IC Coder提供完全自动化的仿真验证流程,无需手动编写测试代码:
|
||||
|
||||
- **智能Testbench生成**:根据设计模块自动生成完整的测试平台,包括激励生成、时钟复位、接口驱动等
|
||||
- **测试用例自动化**:根据设计规格自动生成覆盖各种场景的测试用例,包括正常功能、边界条件、异常情况等
|
||||
- **一键运行仿真**:自动调用集成仿真器执行仿真
|
||||
- **波形自动生成**:仿真完成后自动生成VCD、波形文件,便于后续分析
|
||||
- **实时进度反馈**:仿真过程中实时显示执行状态和日志信息
|
||||
|
||||

|
||||
|
||||
## AI自主代码迭代
|
||||
|
||||
IC Coder实现了真正的自主式开发循环,能够持续优化代码直到满足设计要求:
|
||||
|
||||
- **智能问题诊断**:根据波形分析结果,自动定位代码中的问题根源
|
||||
- **自动代码修复**:针对发现的问题自动生成修复方案并更新代码
|
||||
- **迭代验证循环**:修复后自动重新运行仿真和波形分析,验证问题是否解决
|
||||
- **持续优化**:如果仍存在问题,继续分析和修复,形成闭环迭代
|
||||
- **收敛保证**:智能判断迭代进展,避免无效循环,确保最终收敛到正确设计
|
||||
- **全程可追溯**:记录每次迭代的修改内容和验证结果,便于回溯和审查
|
||||
|
||||
这种自主迭代能力大幅减少了人工调试时间,让设计验证过程更加高效可靠。
|
||||
|
||||
## 随时可掌控
|
||||
|
||||
IC Coder提供透明化的开发过程,让用户始终掌握AI的工作状态:
|
||||
|
||||
- **实时流程展示**:可视化展示当前执行到哪个阶段(需求分析、架构设计、代码生成、仿真验证等)
|
||||
- **详细执行日志**:记录每一步操作的详细信息,包括AI的思考过程、决策依据、执行结果
|
||||
- **人机协同交互**:在关键决策点支持用户介入,可随时提供反馈、调整方向或修改参数
|
||||
- **进度实时追踪**:显示任务完成进度、预计剩余步骤,让开发过程更加可预期
|
||||
- **智能建议系统**:AI主动提供优化建议和替代方案,用户可选择采纳或自定义
|
||||
- **即时响应机制**:支持随时暂停、恢复或调整AI的工作流程
|
||||
|
||||
这种透明可控的设计理念,让AI开发不再是"黑盒",而是真正的智能协作伙伴。
|
||||
|
||||
## 多层次安全保障
|
||||
|
||||
IC Coder将数据安全和隐私保护作为核心设计原则,提供企业级的安全保障:
|
||||
|
||||
- **本地优先存储**:所有设计文件默认存储在本地,用户完全掌控自己的代码资产
|
||||
- **全链路加密传输**:与云端通信采用TLS/SSL加密,确保数据传输过程中不被窃取或篡改
|
||||
- **云端零存储策略**:云端服务器不保存用户的源代码,仅处理加密后的临时数据,处理完成后立即销毁
|
||||
- **定制化部署选项**:支持企业私有云或本地部署,满足高安全等级需求
|
||||
|
||||
真正做到了代码全链路加密传输、云端零存储,让芯片设计企业可以放心使用AI工具。
|
||||
|
||||
## 反馈
|
||||
|
||||
无论是想与我们深入交流还是遇到任何问题,欢迎您[进入社区](https://iccoder.com:888/community)与我们联系
|
||||
|
||||
## 服务条款和隐私协议
|
||||
|
||||
请阅读我们的[服务条款](https://iccoder.com:888/guides/legal/terms-of-service)和[隐私协议](https://iccoder.com:888/guides/legal/privacy-policy)了解更多细节。
|
||||
|
||||
261
docs/AskUserQuestion-API设计.md
Normal file
@ -0,0 +1,261 @@
|
||||
# AskUserQuestion 多选支持 - API 设计文档
|
||||
|
||||
## 问题描述
|
||||
|
||||
当前 AI 询问用户问题时存在以下问题:
|
||||
1. 后端返回的选项不准确
|
||||
2. 多个问题只给几个选项
|
||||
3. 不支持多选方式
|
||||
|
||||
## 需求
|
||||
|
||||
实现一个问题对应多个选项,支持多选的方式。
|
||||
|
||||
## 数据结构设计
|
||||
|
||||
### 后端返回格式
|
||||
|
||||
后端通过 SSE 的 `ask_user` 事件返回以下格式:
|
||||
|
||||
```json
|
||||
{
|
||||
"askId": "ask_1234567890",
|
||||
"questions": [
|
||||
{
|
||||
"question": "请确认 SPI 控制器的配置需求:工作模式?",
|
||||
"options": [
|
||||
"Master/8位/模式0/固定分频/需要CS",
|
||||
"Master/可配置位宽/可配置模式/需要CS",
|
||||
"Slave模式"
|
||||
],
|
||||
"multiSelect": false
|
||||
},
|
||||
{
|
||||
"question": "数据位宽?",
|
||||
"options": [
|
||||
"8位 还是其他?"
|
||||
],
|
||||
"multiSelect": false
|
||||
},
|
||||
{
|
||||
"question": "时钟极性和相位?",
|
||||
"options": [
|
||||
"CPOL=0/CPHA=0 (模式0) 还是其他模式?"
|
||||
],
|
||||
"multiSelect": false
|
||||
},
|
||||
{
|
||||
"question": "时钟分频?",
|
||||
"options": [
|
||||
"需要可配置的分频比吗?"
|
||||
],
|
||||
"multiSelect": false
|
||||
},
|
||||
{
|
||||
"question": "是否需要芯片选信号 (CS) 控制?",
|
||||
"options": [
|
||||
"是",
|
||||
"否"
|
||||
],
|
||||
"multiSelect": false
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### 前端数据结构
|
||||
|
||||
#### 1. API 类型定义 (`src/types/api.ts`)
|
||||
|
||||
```typescript
|
||||
/** ask_user 事件数据 */
|
||||
export interface AskUserEvent {
|
||||
askId: string;
|
||||
questions: QuestionItem[];
|
||||
}
|
||||
|
||||
/** 单个问题项 */
|
||||
export interface QuestionItem {
|
||||
question: string;
|
||||
options: string[];
|
||||
multiSelect?: boolean; // 是否支持多选,默认 false
|
||||
}
|
||||
```
|
||||
|
||||
#### 2. MessageSegment 类型 (`src/services/dialogService.ts`)
|
||||
|
||||
```typescript
|
||||
export interface MessageSegment {
|
||||
type: "text" | "tool" | "question" | "agent" | "plan" | "progress";
|
||||
// ... 其他字段
|
||||
askId?: string;
|
||||
questions?: QuestionItem[]; // 改为问题数组
|
||||
}
|
||||
```
|
||||
|
||||
#### 3. 用户回答格式 (`src/types/api.ts`)
|
||||
|
||||
```typescript
|
||||
export interface AnswerRequest {
|
||||
taskId: string;
|
||||
askId: string;
|
||||
answers: {
|
||||
[questionIndex: number]: string[]; // 每个问题的答案数组(支持多选)
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
## 前端实现要点
|
||||
|
||||
### 1. 显示多个问题
|
||||
|
||||
```typescript
|
||||
// 遍历 questions 数组,为每个问题生成 UI
|
||||
segment.questions?.forEach((q, index) => {
|
||||
// 显示问题标题
|
||||
// 显示选项(单选或多选)
|
||||
// 收集答案
|
||||
});
|
||||
```
|
||||
|
||||
### 2. 多选支持
|
||||
|
||||
```typescript
|
||||
if (q.multiSelect) {
|
||||
// 渲染复选框
|
||||
// 允许选择多个选项
|
||||
} else {
|
||||
// 渲染单选按钮
|
||||
// 只允许选择一个选项
|
||||
}
|
||||
```
|
||||
|
||||
### 3. 提交答案
|
||||
|
||||
```typescript
|
||||
const answers = {
|
||||
0: ["Master/8位/模式0/固定分频/需要CS"], // 第1个问题的答案
|
||||
1: ["8位 还是其他?"], // 第2个问题的答案
|
||||
2: ["CPOL=0/CPHA=0 (模式0) 还是其他模式?"], // 第3个问题的答案
|
||||
// ...
|
||||
};
|
||||
|
||||
vscode.postMessage({
|
||||
command: 'userAnswer',
|
||||
askId: 'ask_1234567890',
|
||||
answers: answers
|
||||
});
|
||||
```
|
||||
|
||||
## 后端需要做的修改
|
||||
|
||||
### 1. 修改 AskUserQuestion 工具的返回格式
|
||||
|
||||
从:
|
||||
```json
|
||||
{
|
||||
"askId": "xxx",
|
||||
"question": "单个问题",
|
||||
"options": ["选项1", "选项2"]
|
||||
}
|
||||
```
|
||||
|
||||
改为:
|
||||
```json
|
||||
{
|
||||
"askId": "xxx",
|
||||
"questions": [
|
||||
{
|
||||
"question": "问题1",
|
||||
"options": ["选项1", "选项2"],
|
||||
"multiSelect": false
|
||||
},
|
||||
{
|
||||
"question": "问题2",
|
||||
"options": ["选项A", "选项B", "选项C"],
|
||||
"multiSelect": true
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### 2. 接收答案的格式
|
||||
|
||||
从:
|
||||
```json
|
||||
{
|
||||
"taskId": "xxx",
|
||||
"askId": "xxx",
|
||||
"selected": ["选项1"],
|
||||
"customInput": "自定义输入"
|
||||
}
|
||||
```
|
||||
|
||||
改为:
|
||||
```json
|
||||
{
|
||||
"taskId": "xxx",
|
||||
"askId": "xxx",
|
||||
"answers": {
|
||||
"0": ["选项1"], // 第1个问题的答案
|
||||
"1": ["选项A", "选项B"] // 第2个问题的答案(多选)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 示例场景
|
||||
|
||||
### 场景:SPI 控制器配置
|
||||
|
||||
**后端发送:**
|
||||
```json
|
||||
{
|
||||
"askId": "ask_spi_config",
|
||||
"questions": [
|
||||
{
|
||||
"question": "工作模式?",
|
||||
"options": [
|
||||
"Master/8位/模式0/固定分频/需要CS",
|
||||
"Master/可配置位宽/可配置模式/需要CS",
|
||||
"Slave模式"
|
||||
],
|
||||
"multiSelect": false
|
||||
},
|
||||
{
|
||||
"question": "需要哪些功能?",
|
||||
"options": [
|
||||
"可配置时钟分频",
|
||||
"可配置数据位宽",
|
||||
"支持多个CS",
|
||||
"DMA支持"
|
||||
],
|
||||
"multiSelect": true
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
**用户选择:**
|
||||
- 问题1:选择 "Master/8位/模式0/固定分频/需要CS"
|
||||
- 问题2:选择 "可配置时钟分频" 和 "可配置数据位宽"
|
||||
|
||||
**前端提交:**
|
||||
```json
|
||||
{
|
||||
"taskId": "task_xxx",
|
||||
"askId": "ask_spi_config",
|
||||
"answers": {
|
||||
"0": ["Master/8位/模式0/固定分频/需要CS"],
|
||||
"1": ["可配置时钟分频", "可配置数据位宽"]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 总结
|
||||
|
||||
这个设计方案:
|
||||
1. ✅ 支持多个问题
|
||||
2. ✅ 每个问题有多个选项
|
||||
3. ✅ 支持单选和多选
|
||||
4. ✅ 数据结构清晰,易于扩展
|
||||
5. ✅ 向后兼容(可以只有一个问题)
|
||||
409
docs/PUBLISH.md
Normal file
@ -0,0 +1,409 @@
|
||||
# IC Coder 插件发布流程文档
|
||||
|
||||
本文档详细说明如何将 IC Coder 插件发布到 VS Code 插件市场进行测试和正式发布。
|
||||
|
||||
## 目录
|
||||
|
||||
- [前置准备](#前置准备)
|
||||
- [账号配置](#账号配置)
|
||||
- [插件信息完善](#插件信息完善)
|
||||
- [打包与发布](#打包与发布)
|
||||
- [版本更新](#版本更新)
|
||||
- [常见问题](#常见问题)
|
||||
|
||||
---
|
||||
|
||||
## 前置准备
|
||||
|
||||
### 环境要求
|
||||
|
||||
- Node.js 和 pnpm 已安装
|
||||
- VS Code 1.80.0 或更高版本
|
||||
- 已安装 `@vscode/vsce` 工具(项目已包含)
|
||||
|
||||
### 检查清单
|
||||
|
||||
在发布前,请确保以下文件和配置已准备就绪:
|
||||
|
||||
- [x] `package.json` - 插件配置文件
|
||||
- [x] `README.md` - 插件说明文档
|
||||
- [x] `dist/` - 编译后的代码
|
||||
- [x] `media/` - 图标和资源文件
|
||||
- [ ] `CHANGELOG.md` - 版本更新日志(建议添加)
|
||||
- [x] `LICENSE` - 开源许可证(建议添加)
|
||||
|
||||
---
|
||||
|
||||
## 账号配置
|
||||
|
||||
### 1. 创建 Azure DevOps 账号
|
||||
|
||||
1. 访问 [Azure DevOps](https://dev.azure.com)
|
||||
2. 使用 Microsoft 账号注册或登录
|
||||
3. 创建一个组织(如果还没有)
|
||||
|
||||
### 2. 生成 Personal Access Token (PAT)
|
||||
|
||||
这是发布插件的关键凭证,请妥善保管。
|
||||
|
||||
**步骤:**
|
||||
|
||||
1. 登录 Azure DevOps
|
||||
2. 点击右上角用户图标 → **User settings** → **Personal access tokens**
|
||||
3. 点击 **New Token** 按钮
|
||||
4. 配置 Token 信息:
|
||||
- **Name**: `vscode-publisher`(或其他易识别的名称)
|
||||
- **Organization**: 选择 **All accessible organizations**
|
||||
- **Expiration**: 建议选择较长期限(如 90 天或自定义)
|
||||
- **Scopes**: 选择 **Custom defined**
|
||||
- 展开 **Marketplace**
|
||||
- 勾选 **Manage**(包含发布和管理权限)
|
||||
5. 点击 **Create** 生成 Token
|
||||
6. **重要**: 立即复制并保存 Token,页面关闭后将无法再次查看
|
||||
|
||||
**Token 示例格式:**
|
||||
|
||||
```
|
||||
CO03l8nmFBBTNPDg7lN9a9fYwDdgsRIDVDwTrx6Esggi6HnzmrMTJQQJ99BLACAAAAAAAAAAAAAGAZDOVVyT
|
||||
```
|
||||
|
||||
```
|
||||
//蔡工的token
|
||||
6CB3tOZPiwNi6rrOuFHMe6QzrVWBnajW5fJsNgCWu8jtERUCCRnJJQQJ99CAACAAAAAAAAAAAAASAZDO3FnY
|
||||
```
|
||||
|
||||
### 3. 创建发布者账号
|
||||
|
||||
发布者账号是你在 VS Code 市场的身份标识。
|
||||
|
||||
**步骤:**
|
||||
|
||||
1. 访问 [VS Code Marketplace 管理页面](https://marketplace.visualstudio.com/manage)
|
||||
2. 使用 Azure DevOps 账号登录
|
||||
3. 点击 **Create publisher** 按钮
|
||||
4. 填写发布者信息:
|
||||
- **ID**: `ICCoder`(必须与 package.json 中的 `publisher` 字段一致)
|
||||
- **Name**: `IC Coder`(显示名称,可自定义)
|
||||
- **Email**: 你的联系邮箱
|
||||
5. 点击 **Create** 完成创建
|
||||
|
||||
**注意事项:**
|
||||
|
||||
- Publisher ID 一旦创建无法修改
|
||||
- Publisher ID 必须全局唯一
|
||||
- 建议使用有意义且专业的 ID
|
||||
|
||||
---
|
||||
|
||||
## 插件信息完善
|
||||
|
||||
### 1. 完善 package.json
|
||||
|
||||
建议在 `package.json` 中添加以下字段以提升插件质量:
|
||||
|
||||
```json
|
||||
{
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/your-org/ic-coder.git"
|
||||
},
|
||||
"homepage": "https://github.com/your-org/ic-coder#readme",
|
||||
"bugs": {
|
||||
"url": "https://github.com/your-org/ic-coder/issues"
|
||||
},
|
||||
"license": "MIT"
|
||||
}
|
||||
```
|
||||
|
||||
### 2. 创建 CHANGELOG.md
|
||||
|
||||
版本更新日志帮助用户了解每个版本的变化。
|
||||
|
||||
**示例内容:**
|
||||
|
||||
```markdown
|
||||
# 更新日志
|
||||
|
||||
## [0.0.2] - 2025-12-29
|
||||
|
||||
### 新增
|
||||
|
||||
- 添加发送和暂停按钮功能
|
||||
- 添加一键优化按钮组件
|
||||
- 添加 Plan 开关组件
|
||||
- 添加模式选择器组件
|
||||
- 添加上下文压缩功能
|
||||
|
||||
### 改进
|
||||
|
||||
- 优化用户界面交互体验
|
||||
|
||||
## [0.0.1] - 2025-12-XX
|
||||
|
||||
### 新增
|
||||
|
||||
- 初始版本发布
|
||||
- Verilog 代码智能生成
|
||||
- 集成 iverilog 仿真工具
|
||||
- VCD 波形文件查看器
|
||||
```
|
||||
|
||||
### 3. 创建 LICENSE 文件
|
||||
|
||||
如果使用 MIT 许可证,创建 `LICENSE` 文件:
|
||||
|
||||
```
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2025 IC Coder Team
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction...
|
||||
```
|
||||
|
||||
### 4. 优化 README.md
|
||||
|
||||
确保 README 包含:
|
||||
|
||||
- 清晰的功能介绍
|
||||
- 使用截图或 GIF 演示
|
||||
- 详细的使用说明
|
||||
- 系统要求
|
||||
- 常见问题解答
|
||||
|
||||
---
|
||||
|
||||
## 打包与发布
|
||||
|
||||
### 方式一:命令行发布(推荐)
|
||||
|
||||
这是最便捷的发布方式,适合频繁更新。
|
||||
|
||||
**步骤:**
|
||||
|
||||
1. **登录发布者账号**
|
||||
|
||||
```bash
|
||||
pnpm vsce login ic-coder-team
|
||||
```
|
||||
|
||||
系统会提示输入 Personal Access Token,粘贴之前创建的 PAT。
|
||||
|
||||
2. **打包插件**
|
||||
|
||||
```bash
|
||||
# 执行生产环境构建
|
||||
pnpm run package
|
||||
|
||||
# 打包成 .vsix 文件
|
||||
pnpm vsce package
|
||||
```
|
||||
|
||||
这会生成 `ic-coder-plugin-0.0.2.vsix` 文件。
|
||||
|
||||
3. **发布到市场**
|
||||
|
||||
```bash
|
||||
pnpm vsce publish
|
||||
```
|
||||
|
||||
发布成功后会显示插件的市场链接。
|
||||
|
||||
**一键发布(跳过打包步骤):**
|
||||
|
||||
```bash
|
||||
# 直接发布当前版本
|
||||
pnpm vsce publish
|
||||
```
|
||||
|
||||
### 方式二:手动上传
|
||||
|
||||
适合首次发布或网络环境受限的情况。
|
||||
|
||||
**步骤:**
|
||||
|
||||
1. 本地打包插件:
|
||||
|
||||
```bash
|
||||
pnpm run package
|
||||
pnpm vsce package[pnpm vsce package --no-dependencies]
|
||||
```
|
||||
|
||||
2. 访问 [发布者管理页面](https://marketplace.visualstudio.com/manage/publishers/ic-coder-team)
|
||||
|
||||
3. 点击 **New extension** → **Visual Studio Code**
|
||||
|
||||
4. 上传 `ic-coder-plugin-0.0.2.vsix` 文件
|
||||
|
||||
5. 填写插件信息(如果需要)并提交
|
||||
|
||||
6. 等待审核通过
|
||||
|
||||
---
|
||||
|
||||
## 版本更新
|
||||
|
||||
### 自动更新版本号
|
||||
|
||||
使用 `vsce publish` 命令可以自动更新版本号并发布:
|
||||
|
||||
```bash
|
||||
# 补丁版本更新(0.0.2 → 0.0.3)
|
||||
pnpm vsce publish patch
|
||||
|
||||
# 次版本更新(0.0.2 → 0.1.0)
|
||||
pnpm vsce publish minor
|
||||
|
||||
# 主版本更新(0.0.2 → 1.0.0)
|
||||
pnpm vsce publish major
|
||||
```
|
||||
|
||||
### 手动指定版本
|
||||
|
||||
```bash
|
||||
# 发布指定版本
|
||||
npx vsce publish --packagePath iccoder-1.0.7.vsix
|
||||
```
|
||||
|
||||
### 更新流程建议
|
||||
|
||||
1. 修改代码并测试
|
||||
2. 更新 `CHANGELOG.md` 记录变更
|
||||
3. 提交代码到 Git
|
||||
4. 执行发布命令
|
||||
5. 验证市场上的插件是否正常
|
||||
|
||||
## 更新流程
|
||||
|
||||
1. 修改版本号
|
||||
|
||||
手动修改 修改package.json文件
|
||||
|
||||
命令修改
|
||||
|
||||
```bash
|
||||
#补丁版本 (1.0.0 -> 1.0.1)
|
||||
pnpm version patch
|
||||
|
||||
#次要版本 (1.0.0 -> 1.1.0)
|
||||
pnpm version minor
|
||||
|
||||
#主要版本 (1.0.0 -> 2.0.0)
|
||||
pnpm version major
|
||||
```
|
||||
|
||||
2. 打包
|
||||
|
||||
```bash
|
||||
#先编译
|
||||
pnpm run compile
|
||||
|
||||
#中间build
|
||||
pnpm run build
|
||||
|
||||
#后打包成.vsix
|
||||
pnpm vsce package --no-dependencies
|
||||
```
|
||||
|
||||
3. 手动上传/命令上传
|
||||
- https://marketplace.visualstudio.com/ 在这个里面手动上传 更新就选择update
|
||||
- 命令上传:vsce publish
|
||||
|
||||
---
|
||||
|
||||
## 常见问题
|
||||
|
||||
### 1. 发布失败:Authentication failed
|
||||
|
||||
**原因:** PAT Token 无效或过期
|
||||
|
||||
**解决方案:**
|
||||
|
||||
- 重新生成 PAT Token
|
||||
- 重新登录:`pnpm vsce login ic-coder-team`
|
||||
|
||||
### 2. 发布失败:Publisher not found
|
||||
|
||||
**原因:** Publisher ID 不存在或不匹配
|
||||
|
||||
**解决方案:**
|
||||
|
||||
- 检查 `package.json` 中的 `publisher` 字段
|
||||
- 确认已在市场创建对应的 Publisher
|
||||
|
||||
### 3. 打包失败:Missing files
|
||||
|
||||
**原因:** 必需文件缺失
|
||||
|
||||
**解决方案:**
|
||||
|
||||
- 确保 `dist/` 目录存在且包含编译后的代码
|
||||
- 运行 `pnpm run package` 重新构建
|
||||
|
||||
### 4. 插件审核被拒
|
||||
|
||||
**常见原因:**
|
||||
|
||||
- 插件名称或描述违反市场规则
|
||||
- 图标不符合要求(建议 128x128 PNG)
|
||||
- README 内容不完整
|
||||
|
||||
**解决方案:**
|
||||
|
||||
- 查看审核反馈邮件
|
||||
- 修改相关内容后重新发布
|
||||
|
||||
### 5. 如何撤回已发布的版本?
|
||||
|
||||
```bash
|
||||
# 取消发布指定版本
|
||||
pnpm vsce unpublish ic-coder-team.ic-coder-plugin@0.0.2
|
||||
|
||||
# 取消发布整个插件(慎用)
|
||||
pnpm vsce unpublish ic-coder-team.ic-coder-plugin
|
||||
```
|
||||
|
||||
### 6. 如何本地测试 .vsix 文件?
|
||||
|
||||
```bash
|
||||
# 在 VS Code 中安装本地 .vsix 文件
|
||||
code --install-extension ic-coder-plugin-0.0.2.vsix
|
||||
```
|
||||
|
||||
或者在 VS Code 中:
|
||||
|
||||
1. 打开扩展面板
|
||||
2. 点击 `...` 菜单
|
||||
3. 选择 **Install from VSIX...**
|
||||
4. 选择 `.vsix` 文件
|
||||
|
||||
---
|
||||
|
||||
## 发布检查清单
|
||||
|
||||
在正式发布前,请确认以下事项:
|
||||
|
||||
- [ ] 代码已充分测试,无明显 Bug
|
||||
- [ ] `package.json` 版本号已更新
|
||||
- [ ] `CHANGELOG.md` 已记录本次更新内容
|
||||
- [ ] README.md 内容完整且准确
|
||||
- [ ] 图标和资源文件正常显示
|
||||
- [ ] 已在本地安装测试 .vsix 文件
|
||||
- [ ] 已创建 Azure DevOps PAT Token
|
||||
- [ ] 已创建 VS Code Marketplace Publisher
|
||||
- [ ] 已执行 `pnpm run package` 构建生产版本
|
||||
|
||||
---
|
||||
|
||||
## 参考资源
|
||||
|
||||
- [VS Code 插件发布官方文档](https://code.visualstudio.com/api/working-with-extensions/publishing-extension)
|
||||
- [vsce 工具文档](https://github.com/microsoft/vscode-vsce)
|
||||
- [Azure DevOps 文档](https://docs.microsoft.com/en-us/azure/devops/)
|
||||
- [VS Code 插件市场](https://marketplace.visualstudio.com/)
|
||||
|
||||
---
|
||||
|
||||
**文档维护:** IC Coder Team
|
||||
**最后更新:** 2025-12-29
|
||||
804
docs/VSCode-Extension-API-Guide.md
Normal file
@ -0,0 +1,804 @@
|
||||
# VS Code Extension API 核心知识点
|
||||
|
||||
## 目录
|
||||
- [1. Extension 生命周期](#1-extension-生命周期) ⭐⭐⭐
|
||||
- [2. 激活事件 (Activation Events)](#2-激活事件-activation-events) ⭐⭐
|
||||
- [3. 命令系统 (Commands)](#3-命令系统-commands) ⭐⭐
|
||||
- [4. Webview API](#4-webview-api) ⭐⭐⭐⭐⭐ **面试重点**
|
||||
- [5. TreeView 和自定义视图](#5-treeview-和自定义视图) ⭐⭐
|
||||
- [6. 文件系统操作](#6-文件系统操作) ⭐⭐⭐
|
||||
- [7. 配置和存储](#7-配置和存储) ⭐⭐⭐⭐ **面试重点**
|
||||
- [8. 消息通知](#8-消息通知) ⭐
|
||||
- [9. 语言特性支持](#9-语言特性支持) ⭐
|
||||
- [10. 调试和诊断](#10-调试和诊断) ⭐
|
||||
|
||||
---
|
||||
|
||||
## 1. Extension 生命周期 ⭐⭐⭐
|
||||
|
||||
### 1.1 核心函数 🔥必考
|
||||
|
||||
```typescript
|
||||
// extension.ts
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
// 插件激活时调用(只调用一次)
|
||||
export function activate(context: vscode.ExtensionContext) {
|
||||
console.log('Extension is now active!');
|
||||
|
||||
// 注册命令、视图、事件监听等
|
||||
// 使用 context.subscriptions 管理资源
|
||||
}
|
||||
|
||||
// 插件停用时调用(清理资源)
|
||||
export function deactivate() {
|
||||
console.log('Extension is deactivated');
|
||||
// 清理资源、关闭连接等
|
||||
}
|
||||
```
|
||||
|
||||
### 1.2 ExtensionContext 重要属性 🔥必考
|
||||
|
||||
```typescript
|
||||
interface ExtensionContext {
|
||||
// 插件订阅管理(自动清理)
|
||||
subscriptions: { dispose(): any }[];
|
||||
|
||||
// 工作区存储路径
|
||||
storageUri: vscode.Uri | undefined;
|
||||
globalStorageUri: vscode.Uri;
|
||||
|
||||
// 插件路径
|
||||
extensionUri: vscode.Uri;
|
||||
extensionPath: string;
|
||||
|
||||
// 状态存储
|
||||
workspaceState: Memento; // 工作区级别
|
||||
globalState: Memento; // 全局级别
|
||||
secrets: SecretStorage; // 敏感信息存储
|
||||
|
||||
// 环境变量
|
||||
environmentVariableCollection: EnvironmentVariableCollection;
|
||||
}
|
||||
```
|
||||
|
||||
### 1.3 资源管理最佳实践 🔥必考
|
||||
|
||||
```typescript
|
||||
export function activate(context: vscode.ExtensionContext) {
|
||||
// ✅ 推荐:使用 context.subscriptions 自动管理
|
||||
context.subscriptions.push(
|
||||
vscode.commands.registerCommand('extension.command', () => {})
|
||||
);
|
||||
|
||||
// ❌ 不推荐:手动管理容易忘记清理
|
||||
const disposable = vscode.commands.registerCommand('extension.command', () => {});
|
||||
// 需要在 deactivate 中手动调用 disposable.dispose()
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 2. 激活事件 (Activation Events) ⭐⭐
|
||||
|
||||
### 2.1 常用激活事件 📌重要
|
||||
|
||||
```json
|
||||
// package.json
|
||||
{
|
||||
"activationEvents": [
|
||||
// 启动时激活
|
||||
"onStartupFinished",
|
||||
|
||||
// 执行命令时激活
|
||||
"onCommand:extension.helloWorld",
|
||||
|
||||
// 打开特定语言文件时激活
|
||||
"onLanguage:javascript",
|
||||
"onLanguage:verilog",
|
||||
|
||||
// 打开特定文件类型时激活
|
||||
"onFileSystem:sftp",
|
||||
|
||||
// 打开特定视图时激活
|
||||
"onView:myCustomView",
|
||||
|
||||
// 调试时激活
|
||||
"onDebug",
|
||||
|
||||
// 打开特定 URI 时激活
|
||||
"onUri",
|
||||
|
||||
// Webview 恢复时激活
|
||||
"onWebviewPanel:myWebview",
|
||||
|
||||
// 任务执行时激活
|
||||
"onTaskType:npm"
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
### 2.2 延迟激活策略 🔥必考
|
||||
|
||||
```typescript
|
||||
// ✅ 推荐:使用 onStartupFinished 延迟激活
|
||||
"activationEvents": ["onStartupFinished"]
|
||||
|
||||
// ❌ 不推荐:使用 * 会拖慢启动速度
|
||||
"activationEvents": ["*"]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3. 命令系统 (Commands)
|
||||
|
||||
### 3.1 注册命令
|
||||
|
||||
```typescript
|
||||
// 注册简单命令
|
||||
const disposable = vscode.commands.registerCommand(
|
||||
'extension.helloWorld',
|
||||
() => {
|
||||
vscode.window.showInformationMessage('Hello World!');
|
||||
}
|
||||
);
|
||||
context.subscriptions.push(disposable);
|
||||
|
||||
// 注册带参数的命令
|
||||
vscode.commands.registerCommand(
|
||||
'extension.openFile',
|
||||
(filePath: string) => {
|
||||
vscode.workspace.openTextDocument(filePath).then(doc => {
|
||||
vscode.window.showTextDocument(doc);
|
||||
});
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
### 3.2 执行命令
|
||||
|
||||
```typescript
|
||||
// 执行内置命令
|
||||
await vscode.commands.executeCommand('workbench.action.files.save');
|
||||
|
||||
// 执行自定义命令
|
||||
await vscode.commands.executeCommand('extension.openFile', '/path/to/file');
|
||||
|
||||
// 获取所有可用命令
|
||||
const commands = await vscode.commands.getCommands();
|
||||
```
|
||||
|
||||
### 3.3 常用内置命令
|
||||
|
||||
```typescript
|
||||
// 文件操作
|
||||
'workbench.action.files.save'
|
||||
'workbench.action.files.saveAll'
|
||||
'workbench.action.closeActiveEditor'
|
||||
|
||||
// 编辑器操作
|
||||
'editor.action.formatDocument'
|
||||
'editor.action.commentLine'
|
||||
'editor.action.selectAll'
|
||||
|
||||
// 窗口操作
|
||||
'workbench.action.toggleSidebarVisibility'
|
||||
'workbench.action.terminal.new'
|
||||
'workbench.action.quickOpen'
|
||||
|
||||
// Git 操作
|
||||
'git.commit'
|
||||
'git.push'
|
||||
'git.pull'
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 4. Webview API ⭐⭐⭐⭐⭐ **面试重点**
|
||||
|
||||
### 4.1 创建 Webview Panel 🔥必考
|
||||
|
||||
```typescript
|
||||
const panel = vscode.window.createWebviewPanel(
|
||||
'myWebview', // viewType(唯一标识)
|
||||
'My Webview', // 标题
|
||||
vscode.ViewColumn.One, // 显示位置
|
||||
{
|
||||
enableScripts: true, // 启用 JavaScript
|
||||
retainContextWhenHidden: true, // 隐藏时保留状态
|
||||
localResourceRoots: [ // 允许访问的本地资源路径
|
||||
vscode.Uri.joinPath(context.extensionUri, 'media')
|
||||
]
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
### 4.2 设置 Webview 内容
|
||||
|
||||
```typescript
|
||||
panel.webview.html = getWebviewContent();
|
||||
|
||||
function getWebviewContent() {
|
||||
return `<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>My Webview</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello from Webview!</h1>
|
||||
<button onclick="sendMessage()">Send Message</button>
|
||||
|
||||
<script>
|
||||
const vscode = acquireVsCodeApi();
|
||||
|
||||
function sendMessage() {
|
||||
vscode.postMessage({
|
||||
command: 'alert',
|
||||
text: 'Hello from Webview!'
|
||||
});
|
||||
}
|
||||
|
||||
// 接收来自 Extension 的消息
|
||||
window.addEventListener('message', event => {
|
||||
const message = event.data;
|
||||
console.log('Received:', message);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>`;
|
||||
}
|
||||
```
|
||||
|
||||
### 4.3 Webview 消息通信 🔥必考(项目核心)
|
||||
|
||||
```typescript
|
||||
// Extension → Webview
|
||||
panel.webview.postMessage({
|
||||
command: 'update',
|
||||
data: 'some data'
|
||||
});
|
||||
|
||||
// Webview → Extension
|
||||
panel.webview.onDidReceiveMessage(
|
||||
message => {
|
||||
switch (message.command) {
|
||||
case 'alert':
|
||||
vscode.window.showInformationMessage(message.text);
|
||||
break;
|
||||
case 'getData':
|
||||
// 处理数据请求
|
||||
panel.webview.postMessage({
|
||||
command: 'dataResponse',
|
||||
data: fetchData()
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
undefined,
|
||||
context.subscriptions
|
||||
);
|
||||
```
|
||||
|
||||
### 4.4 Webview 生命周期管理 📌重要
|
||||
|
||||
```typescript
|
||||
// 监听 Webview 关闭事件
|
||||
panel.onDidDispose(
|
||||
() => {
|
||||
// 清理资源
|
||||
console.log('Webview disposed');
|
||||
},
|
||||
null,
|
||||
context.subscriptions
|
||||
);
|
||||
|
||||
// 监听 Webview 可见性变化
|
||||
panel.onDidChangeViewState(
|
||||
e => {
|
||||
if (e.webviewPanel.visible) {
|
||||
console.log('Webview is now visible');
|
||||
}
|
||||
},
|
||||
null,
|
||||
context.subscriptions
|
||||
);
|
||||
```
|
||||
|
||||
### 4.5 加载本地资源 📌重要
|
||||
|
||||
```typescript
|
||||
// 获取本地资源 URI
|
||||
const scriptUri = panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(context.extensionUri, 'media', 'script.js')
|
||||
);
|
||||
|
||||
const styleUri = panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(context.extensionUri, 'media', 'style.css')
|
||||
);
|
||||
|
||||
// 在 HTML 中使用
|
||||
const html = `
|
||||
<link href="${styleUri}" rel="stylesheet">
|
||||
<script src="${scriptUri}"></script>
|
||||
`;
|
||||
```
|
||||
|
||||
### 4.6 Webview 状态持久化 📌重要
|
||||
|
||||
```typescript
|
||||
// Webview 中保存状态
|
||||
const vscode = acquireVsCodeApi();
|
||||
const state = vscode.getState() || { count: 0 };
|
||||
|
||||
// 更新状态
|
||||
state.count++;
|
||||
vscode.setState(state);
|
||||
|
||||
// Extension 中序列化状态
|
||||
panel.webview.options = {
|
||||
enableScripts: true,
|
||||
retainContextWhenHidden: true
|
||||
};
|
||||
|
||||
// 恢复 Webview
|
||||
vscode.window.registerWebviewPanelSerializer('myWebview', {
|
||||
async deserializeWebviewPanel(webviewPanel, state) {
|
||||
webviewPanel.webview.html = getWebviewContent();
|
||||
// 恢复状态
|
||||
webviewPanel.webview.postMessage({ command: 'restore', state });
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. TreeView 和自定义视图
|
||||
|
||||
### 5.1 创建 TreeView Provider
|
||||
|
||||
```typescript
|
||||
class MyTreeDataProvider implements vscode.TreeDataProvider<TreeItem> {
|
||||
private _onDidChangeTreeData = new vscode.EventEmitter<TreeItem | undefined>();
|
||||
readonly onDidChangeTreeData = this._onDidChangeTreeData.event;
|
||||
|
||||
refresh(): void {
|
||||
this._onDidChangeTreeData.fire(undefined);
|
||||
}
|
||||
|
||||
getTreeItem(element: TreeItem): vscode.TreeItem {
|
||||
return element;
|
||||
}
|
||||
|
||||
getChildren(element?: TreeItem): Thenable<TreeItem[]> {
|
||||
if (!element) {
|
||||
// 返回根节点
|
||||
return Promise.resolve([
|
||||
new TreeItem('Item 1', vscode.TreeItemCollapsibleState.None),
|
||||
new TreeItem('Item 2', vscode.TreeItemCollapsibleState.Collapsed)
|
||||
]);
|
||||
}
|
||||
// 返回子节点
|
||||
return Promise.resolve([]);
|
||||
}
|
||||
}
|
||||
|
||||
class TreeItem extends vscode.TreeItem {
|
||||
constructor(
|
||||
public readonly label: string,
|
||||
public readonly collapsibleState: vscode.TreeItemCollapsibleState
|
||||
) {
|
||||
super(label, collapsibleState);
|
||||
this.tooltip = `Tooltip for ${label}`;
|
||||
this.command = {
|
||||
command: 'extension.itemClicked',
|
||||
title: 'Click Item',
|
||||
arguments: [this]
|
||||
};
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 5.2 注册 TreeView
|
||||
|
||||
```typescript
|
||||
const treeDataProvider = new MyTreeDataProvider();
|
||||
const treeView = vscode.window.createTreeView('myTreeView', {
|
||||
treeDataProvider,
|
||||
showCollapseAll: true
|
||||
});
|
||||
|
||||
context.subscriptions.push(treeView);
|
||||
|
||||
// 刷新视图
|
||||
treeDataProvider.refresh();
|
||||
```
|
||||
|
||||
### 5.3 WebviewView Provider(侧边栏 Webview)
|
||||
|
||||
```typescript
|
||||
class MyWebviewViewProvider implements vscode.WebviewViewProvider {
|
||||
resolveWebviewView(
|
||||
webviewView: vscode.WebviewView,
|
||||
context: vscode.WebviewViewResolveContext,
|
||||
token: vscode.CancellationToken
|
||||
) {
|
||||
webviewView.webview.options = {
|
||||
enableScripts: true
|
||||
};
|
||||
|
||||
webviewView.webview.html = getWebviewContent();
|
||||
|
||||
webviewView.webview.onDidReceiveMessage(message => {
|
||||
// 处理消息
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 注册
|
||||
vscode.window.registerWebviewViewProvider(
|
||||
'myWebviewView',
|
||||
new MyWebviewViewProvider()
|
||||
);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 6. 文件系统操作 ⭐⭐⭐
|
||||
|
||||
### 6.1 读取文件 📌重要
|
||||
|
||||
```typescript
|
||||
// 读取文本文件
|
||||
const uri = vscode.Uri.file('/path/to/file.txt');
|
||||
const content = await vscode.workspace.fs.readFile(uri);
|
||||
const text = Buffer.from(content).toString('utf8');
|
||||
|
||||
// 使用 TextDocument API
|
||||
const document = await vscode.workspace.openTextDocument(uri);
|
||||
const text = document.getText();
|
||||
```
|
||||
|
||||
### 6.2 写入文件
|
||||
|
||||
```typescript
|
||||
// 写入文件
|
||||
const uri = vscode.Uri.file('/path/to/file.txt');
|
||||
const content = Buffer.from('Hello World', 'utf8');
|
||||
await vscode.workspace.fs.writeFile(uri, content);
|
||||
|
||||
// 使用 WorkspaceEdit
|
||||
const edit = new vscode.WorkspaceEdit();
|
||||
edit.createFile(uri, { overwrite: true });
|
||||
edit.insert(uri, new vscode.Position(0, 0), 'Hello World');
|
||||
await vscode.workspace.applyEdit(edit);
|
||||
```
|
||||
|
||||
### 6.3 文件监听
|
||||
|
||||
```typescript
|
||||
// 监听文件变化
|
||||
const watcher = vscode.workspace.createFileSystemWatcher('**/*.js');
|
||||
|
||||
watcher.onDidCreate(uri => {
|
||||
console.log('File created:', uri.fsPath);
|
||||
});
|
||||
|
||||
watcher.onDidChange(uri => {
|
||||
console.log('File changed:', uri.fsPath);
|
||||
});
|
||||
|
||||
watcher.onDidDelete(uri => {
|
||||
console.log('File deleted:', uri.fsPath);
|
||||
});
|
||||
|
||||
context.subscriptions.push(watcher);
|
||||
```
|
||||
|
||||
### 6.4 工作区操作
|
||||
|
||||
```typescript
|
||||
// 获取工作区文件夹
|
||||
const workspaceFolders = vscode.workspace.workspaceFolders;
|
||||
if (workspaceFolders) {
|
||||
const rootPath = workspaceFolders[0].uri.fsPath;
|
||||
}
|
||||
|
||||
// 查找文件
|
||||
const files = await vscode.workspace.findFiles(
|
||||
'**/*.ts', // include pattern
|
||||
'**/node_modules/**' // exclude pattern
|
||||
);
|
||||
|
||||
// 打开文件
|
||||
const document = await vscode.workspace.openTextDocument(uri);
|
||||
await vscode.window.showTextDocument(document);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 7. 配置和存储 ⭐⭐⭐⭐ **面试重点**
|
||||
|
||||
### 7.1 读取配置 📌重要
|
||||
|
||||
```typescript
|
||||
// 读取配置
|
||||
const config = vscode.workspace.getConfiguration('myExtension');
|
||||
const value = config.get<string>('settingName', 'defaultValue');
|
||||
|
||||
// 监听配置变化
|
||||
vscode.workspace.onDidChangeConfiguration(e => {
|
||||
if (e.affectsConfiguration('myExtension.settingName')) {
|
||||
console.log('Configuration changed');
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
### 7.2 更新配置
|
||||
|
||||
```typescript
|
||||
const config = vscode.workspace.getConfiguration('myExtension');
|
||||
|
||||
// 更新用户配置(全局)
|
||||
await config.update('settingName', 'newValue', vscode.ConfigurationTarget.Global);
|
||||
|
||||
// 更新工作区配置
|
||||
await config.update('settingName', 'newValue', vscode.ConfigurationTarget.Workspace);
|
||||
```
|
||||
|
||||
### 7.3 状态存储 🔥必考
|
||||
|
||||
```typescript
|
||||
// 工作区状态(仅当前工作区)
|
||||
await context.workspaceState.update('key', 'value');
|
||||
const value = context.workspaceState.get('key');
|
||||
|
||||
// 全局状态(跨工作区)
|
||||
await context.globalState.update('key', 'value');
|
||||
const value = context.globalState.get('key');
|
||||
|
||||
// 存储对象
|
||||
await context.globalState.update('userData', { name: 'John', age: 30 });
|
||||
```
|
||||
|
||||
### 7.4 敏感信息存储 🔥必考(Token 管理)
|
||||
|
||||
```typescript
|
||||
// 存储密码、Token 等敏感信息
|
||||
await context.secrets.store('apiToken', 'secret-token-value');
|
||||
|
||||
// 读取
|
||||
const token = await context.secrets.get('apiToken');
|
||||
|
||||
// 删除
|
||||
await context.secrets.delete('apiToken');
|
||||
|
||||
// 监听变化
|
||||
context.secrets.onDidChange(e => {
|
||||
console.log('Secret changed:', e.key);
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 8. 消息通知
|
||||
|
||||
### 8.1 信息提示
|
||||
|
||||
```typescript
|
||||
// 普通信息
|
||||
vscode.window.showInformationMessage('Operation completed!');
|
||||
|
||||
// 警告
|
||||
vscode.window.showWarningMessage('This action may cause issues');
|
||||
|
||||
// 错误
|
||||
vscode.window.showErrorMessage('Operation failed!');
|
||||
```
|
||||
|
||||
### 8.2 带按钮的提示
|
||||
|
||||
```typescript
|
||||
const result = await vscode.window.showInformationMessage(
|
||||
'Do you want to continue?',
|
||||
'Yes',
|
||||
'No',
|
||||
'Cancel'
|
||||
);
|
||||
|
||||
if (result === 'Yes') {
|
||||
// 用户点击了 Yes
|
||||
}
|
||||
```
|
||||
|
||||
### 8.3 输入框
|
||||
|
||||
```typescript
|
||||
// 简单输入
|
||||
const input = await vscode.window.showInputBox({
|
||||
prompt: 'Enter your name',
|
||||
placeHolder: 'John Doe',
|
||||
validateInput: (value) => {
|
||||
return value.length < 3 ? 'Name too short' : null;
|
||||
}
|
||||
});
|
||||
|
||||
// 快速选择
|
||||
const selected = await vscode.window.showQuickPick(
|
||||
['Option 1', 'Option 2', 'Option 3'],
|
||||
{
|
||||
placeHolder: 'Select an option',
|
||||
canPickMany: false
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
### 8.4 进度提示
|
||||
|
||||
```typescript
|
||||
await vscode.window.withProgress(
|
||||
{
|
||||
location: vscode.ProgressLocation.Notification,
|
||||
title: 'Processing...',
|
||||
cancellable: true
|
||||
},
|
||||
async (progress, token) => {
|
||||
token.onCancellationRequested(() => {
|
||||
console.log('User canceled');
|
||||
});
|
||||
|
||||
progress.report({ increment: 0, message: 'Starting...' });
|
||||
await doWork1();
|
||||
|
||||
progress.report({ increment: 50, message: 'Half done...' });
|
||||
await doWork2();
|
||||
|
||||
progress.report({ increment: 100, message: 'Complete!' });
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 9. 语言特性支持
|
||||
|
||||
### 9.1 代码补全
|
||||
|
||||
```typescript
|
||||
const provider = vscode.languages.registerCompletionItemProvider(
|
||||
'javascript',
|
||||
{
|
||||
provideCompletionItems(document, position) {
|
||||
const item = new vscode.CompletionItem('myFunction');
|
||||
item.kind = vscode.CompletionItemKind.Function;
|
||||
item.detail = 'My custom function';
|
||||
item.documentation = 'This is a custom function';
|
||||
item.insertText = new vscode.SnippetString('myFunction($1)$0');
|
||||
|
||||
return [item];
|
||||
}
|
||||
},
|
||||
'.' // 触发字符
|
||||
);
|
||||
|
||||
context.subscriptions.push(provider);
|
||||
```
|
||||
|
||||
### 9.2 悬停提示
|
||||
|
||||
```typescript
|
||||
const provider = vscode.languages.registerHoverProvider('javascript', {
|
||||
provideHover(document, position) {
|
||||
const range = document.getWordRangeAtPosition(position);
|
||||
const word = document.getText(range);
|
||||
|
||||
return new vscode.Hover([
|
||||
`**${word}**`,
|
||||
'This is a hover tooltip'
|
||||
]);
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
### 9.3 诊断(错误提示)
|
||||
|
||||
```typescript
|
||||
const diagnosticCollection = vscode.languages.createDiagnosticCollection('myExtension');
|
||||
context.subscriptions.push(diagnosticCollection);
|
||||
|
||||
function updateDiagnostics(document: vscode.TextDocument) {
|
||||
const diagnostics: vscode.Diagnostic[] = [];
|
||||
|
||||
const text = document.getText();
|
||||
const regex = /TODO/g;
|
||||
let match;
|
||||
|
||||
while ((match = regex.exec(text))) {
|
||||
const range = new vscode.Range(
|
||||
document.positionAt(match.index),
|
||||
document.positionAt(match.index + match[0].length)
|
||||
);
|
||||
|
||||
const diagnostic = new vscode.Diagnostic(
|
||||
range,
|
||||
'TODO found',
|
||||
vscode.DiagnosticSeverity.Warning
|
||||
);
|
||||
|
||||
diagnostics.push(diagnostic);
|
||||
}
|
||||
|
||||
diagnosticCollection.set(document.uri, diagnostics);
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 10. 调试和诊断
|
||||
|
||||
### 10.1 输出通道
|
||||
|
||||
```typescript
|
||||
const outputChannel = vscode.window.createOutputChannel('My Extension');
|
||||
context.subscriptions.push(outputChannel);
|
||||
|
||||
outputChannel.appendLine('Extension activated');
|
||||
outputChannel.show(); // 显示输出面板
|
||||
```
|
||||
|
||||
### 10.2 日志记录
|
||||
|
||||
```typescript
|
||||
// 使用 LogOutputChannel(带时间戳)
|
||||
const logger = vscode.window.createOutputChannel('My Extension', { log: true });
|
||||
|
||||
logger.trace('Trace message');
|
||||
logger.debug('Debug message');
|
||||
logger.info('Info message');
|
||||
logger.warn('Warning message');
|
||||
logger.error('Error message');
|
||||
```
|
||||
|
||||
### 10.3 错误处理
|
||||
|
||||
```typescript
|
||||
try {
|
||||
await riskyOperation();
|
||||
} catch (error) {
|
||||
if (error instanceof Error) {
|
||||
vscode.window.showErrorMessage(`Error: ${error.message}`);
|
||||
logger.error(error.stack || error.message);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 最佳实践总结
|
||||
|
||||
### ✅ 推荐做法
|
||||
|
||||
1. **资源管理**:所有 disposable 对象都放入 `context.subscriptions`
|
||||
2. **延迟激活**:使用 `onStartupFinished` 而不是 `*`
|
||||
3. **异步操作**:使用 `async/await` 处理异步操作
|
||||
4. **错误处理**:捕获异常并给用户友好提示
|
||||
5. **类型安全**:充分利用 TypeScript 类型系统
|
||||
6. **状态持久化**:使用 `globalState`/`workspaceState` 保存状态
|
||||
7. **敏感信息**:使用 `secrets` API 存储 Token、密码等
|
||||
|
||||
### ❌ 避免做法
|
||||
|
||||
1. 不要在 `activate` 中执行耗时操作
|
||||
2. 不要忘记清理资源(监听器、Webview 等)
|
||||
3. 不要在 Webview 中直接访问文件系统
|
||||
4. 不要在配置中存储敏感信息
|
||||
5. 不要阻塞主线程(使用 Worker 或异步操作)
|
||||
|
||||
---
|
||||
|
||||
## 参考资源
|
||||
|
||||
- [VS Code Extension API 官方文档](https://code.visualstudio.com/api)
|
||||
- [Extension Samples](https://github.com/microsoft/vscode-extension-samples)
|
||||
- [Extension Guidelines](https://code.visualstudio.com/api/references/extension-guidelines)
|
||||
573
docs/authentication-implementation.md
Normal file
@ -0,0 +1,573 @@
|
||||
# IC Coder 认证系统实现文档
|
||||
|
||||
## 概述
|
||||
|
||||
本文档详细说明了 IC Coder 插件如何集成 VSCode Authentication API,实现用户登录功能,并在 VSCode 左下角账户区域显示登录状态。
|
||||
|
||||
## 架构设计
|
||||
|
||||
### 核心组件
|
||||
|
||||
1. **ICCoderAuthenticationProvider** - 认证提供者
|
||||
2. **VSCode Authentication API** - VSCode 官方认证接口
|
||||
3. **本地 HTTP 服务器** - 处理登录回调
|
||||
4. **ICViewProvider** - 侧边栏视图(根据登录状态显示不同按钮)
|
||||
|
||||
### 工作流程
|
||||
|
||||
```
|
||||
用户点击登录
|
||||
↓
|
||||
调用 vscode.authentication.getSession()
|
||||
↓
|
||||
ICCoderAuthenticationProvider.createSession()
|
||||
↓
|
||||
启动本地 HTTP 服务器(动态端口)
|
||||
↓
|
||||
打开浏览器访问登录页面
|
||||
↓
|
||||
用户在网站完成登录
|
||||
↓
|
||||
网站重定向到 http://localhost:{port}/callback?token=xxx
|
||||
↓
|
||||
本地服务器接收 token
|
||||
↓
|
||||
创建 AuthenticationSession
|
||||
↓
|
||||
VSCode 左下角显示账户信息
|
||||
```
|
||||
|
||||
## 详细实现
|
||||
|
||||
### 1. Authentication Provider 实现
|
||||
|
||||
文件:`src/services/icCoderAuthProvider.ts`
|
||||
|
||||
#### 1.1 类定义
|
||||
|
||||
```typescript
|
||||
export class ICCoderAuthenticationProvider
|
||||
implements vscode.AuthenticationProvider
|
||||
{
|
||||
private _onDidChangeSessions =
|
||||
new vscode.EventEmitter<vscode.AuthenticationProviderAuthenticationSessionsChangeEvent>();
|
||||
public readonly onDidChangeSessions = this._onDidChangeSessions.event;
|
||||
|
||||
private _sessions: vscode.AuthenticationSession[] = [];
|
||||
}
|
||||
```
|
||||
|
||||
**关键点:**
|
||||
|
||||
- 实现 `vscode.AuthenticationProvider` 接口
|
||||
- 使用 `EventEmitter` 通知会话变化
|
||||
- 在内存中维护会话列表
|
||||
|
||||
#### 1.2 核心方法
|
||||
|
||||
##### getSessions() - 获取会话列表
|
||||
|
||||
```typescript
|
||||
async getSessions(scopes?: readonly string[]): Promise<readonly vscode.AuthenticationSession[]> {
|
||||
return this._sessions;
|
||||
}
|
||||
```
|
||||
|
||||
##### createSession() - 创建会话(登录)
|
||||
|
||||
```typescript
|
||||
async createSession(scopes: readonly string[]): Promise<vscode.AuthenticationSession> {
|
||||
const token = await this.login();
|
||||
|
||||
const session: vscode.AuthenticationSession = {
|
||||
id: this.generateSessionId(),
|
||||
accessToken: token,
|
||||
account: {
|
||||
id: "iccoder-user",
|
||||
label: "IC Coder 用户",
|
||||
},
|
||||
scopes: [...scopes],
|
||||
};
|
||||
|
||||
this._sessions.push(session);
|
||||
await this.saveSessions();
|
||||
|
||||
this._onDidChangeSessions.fire({
|
||||
added: [session],
|
||||
removed: [],
|
||||
changed: [],
|
||||
});
|
||||
|
||||
return session;
|
||||
}
|
||||
```
|
||||
|
||||
**关键点:**
|
||||
|
||||
- 调用 `login()` 方法获取 token
|
||||
- 创建 `AuthenticationSession` 对象
|
||||
- 保存到 `globalState`
|
||||
- 触发 `onDidChangeSessions` 事件通知 VSCode
|
||||
|
||||
##### removeSession() - 删除会话(登出)
|
||||
|
||||
```typescript
|
||||
async removeSession(sessionId: string): Promise<void> {
|
||||
const sessionIndex = this._sessions.findIndex((s) => s.id === sessionId);
|
||||
if (sessionIndex > -1) {
|
||||
const session = this._sessions[sessionIndex];
|
||||
this._sessions.splice(sessionIndex, 1);
|
||||
await this.saveSessions();
|
||||
|
||||
this._onDidChangeSessions.fire({
|
||||
added: [],
|
||||
removed: [session],
|
||||
changed: [],
|
||||
});
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 2. 本地 HTTP 服务器实现
|
||||
|
||||
#### 2.1 动态端口分配
|
||||
|
||||
```typescript
|
||||
server.listen(0, () => {
|
||||
const address = server.address();
|
||||
const port = typeof address === "object" && address ? address.port : 3000;
|
||||
resolve({ server, port });
|
||||
});
|
||||
```
|
||||
|
||||
**关键点:**
|
||||
|
||||
- 使用端口 `0` 让系统自动分配可用端口
|
||||
- 避免端口冲突问题
|
||||
- 支持多个用户同时使用
|
||||
|
||||
#### 2.2 回调处理
|
||||
|
||||
```typescript
|
||||
if (url.pathname === "/callback") {
|
||||
const token = url.searchParams.get("token");
|
||||
|
||||
if (token) {
|
||||
// 返回成功页面
|
||||
res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
|
||||
res.end(this.getSuccessPage(iconBase64));
|
||||
|
||||
// 关闭服务器
|
||||
server.close();
|
||||
|
||||
// 返回 token
|
||||
if ((server as any)._loginResolve) {
|
||||
(server as any)._loginResolve(token);
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 3. package.json 配置
|
||||
|
||||
#### 3.1 注册 Authentication Provider
|
||||
|
||||
```json
|
||||
{
|
||||
"contributes": {
|
||||
"authentication": [
|
||||
{
|
||||
"id": "iccoder",
|
||||
"label": "IC Coder"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**关键点:**
|
||||
|
||||
- `id` 必须与代码中使用的 ID 一致
|
||||
- `label` 会显示在 VSCode 账户菜单中
|
||||
|
||||
#### 3.2 注册命令
|
||||
|
||||
```json
|
||||
{
|
||||
"contributes": {
|
||||
"commands": [
|
||||
{
|
||||
"command": "ic-coder.login",
|
||||
"title": "IC Coder: 登录账户",
|
||||
"category": "IC Coder"
|
||||
},
|
||||
{
|
||||
"command": "ic-coder.logout",
|
||||
"title": "IC Coder: 退出登录",
|
||||
"category": "IC Coder"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 4. extension.ts 注册
|
||||
|
||||
#### 4.1 注册 Authentication Provider
|
||||
|
||||
```typescript
|
||||
export function activate(context: vscode.ExtensionContext) {
|
||||
// 注册 Authentication Provider
|
||||
const authProvider = new ICCoderAuthenticationProvider(context);
|
||||
context.subscriptions.push(
|
||||
vscode.authentication.registerAuthenticationProvider(
|
||||
"iccoder",
|
||||
"IC Coder",
|
||||
authProvider
|
||||
)
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
#### 4.2 登录命令
|
||||
|
||||
```typescript
|
||||
const loginCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.login",
|
||||
async () => {
|
||||
try {
|
||||
await vscode.authentication.getSession("iccoder", [], {
|
||||
createIfNone: true,
|
||||
});
|
||||
} catch (error) {
|
||||
vscode.window.showErrorMessage(`登录失败: ${error}`);
|
||||
}
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
**关键点:**
|
||||
|
||||
- `createIfNone: true` 会在没有会话时自动调用 `createSession()`
|
||||
- VSCode 会自动处理 UI 交互
|
||||
|
||||
#### 4.3 登出命令
|
||||
|
||||
```typescript
|
||||
const logoutCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.logout",
|
||||
async () => {
|
||||
try {
|
||||
const session = await vscode.authentication.getSession("iccoder", [], {
|
||||
createIfNone: false,
|
||||
});
|
||||
if (session) {
|
||||
await vscode.authentication.getSession("iccoder", [], {
|
||||
clearSessionPreference: true,
|
||||
forceNewSession: true,
|
||||
});
|
||||
vscode.window.showInformationMessage("已退出登录");
|
||||
}
|
||||
} catch (error) {
|
||||
vscode.window.showInformationMessage("当前未登录");
|
||||
}
|
||||
}
|
||||
);
|
||||
```
|
||||
|
||||
### 5. ICViewProvider 集成
|
||||
|
||||
#### 5.1 检查登录状态
|
||||
|
||||
```typescript
|
||||
private async checkLoginStatus(): Promise<boolean> {
|
||||
try {
|
||||
const session = await vscode.authentication.getSession("iccoder", [], { createIfNone: false });
|
||||
return !!session;
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 5.2 根据登录状态显示不同按钮
|
||||
|
||||
```typescript
|
||||
resolveWebviewView(webviewView: vscode.WebviewView) {
|
||||
this.checkLoginStatus().then((isLoggedIn) => {
|
||||
webviewView.webview.html = this.getWebviewContent(
|
||||
webviewView.webview,
|
||||
isLoggedIn
|
||||
);
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
```typescript
|
||||
${isLoggedIn
|
||||
? '<button class="btn" onclick="openChat()">开始创作</button>'
|
||||
: '<button class="btn" onclick="login()">登录账户</button>'
|
||||
}
|
||||
```
|
||||
|
||||
### 6. 网站前端配置
|
||||
|
||||
#### 6.1 检测插件登录请求
|
||||
|
||||
```javascript
|
||||
// 在登录页面检测 redirect_uri 参数
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const redirectUri = urlParams.get("redirect_uri");
|
||||
|
||||
if (redirectUri) {
|
||||
// 保存回调地址
|
||||
localStorage.setItem("plugin_redirect_uri", redirectUri);
|
||||
}
|
||||
```
|
||||
|
||||
#### 6.2 登录成功后重定向
|
||||
|
||||
```javascript
|
||||
// 用户登录成功,拿到 token
|
||||
const token = response.data.token;
|
||||
|
||||
// 检查是否需要重定向回插件
|
||||
const redirectUri = localStorage.getItem("plugin_redirect_uri");
|
||||
|
||||
if (redirectUri) {
|
||||
// 重定向回插件,带上 token
|
||||
window.location.href = `${redirectUri}?token=${token}`;
|
||||
localStorage.removeItem("plugin_redirect_uri");
|
||||
} else {
|
||||
// 正常登录流程
|
||||
router.push("/dashboard");
|
||||
}
|
||||
```
|
||||
|
||||
## 关键技术点
|
||||
|
||||
### 1. 动态端口分配
|
||||
|
||||
**问题:** 固定端口可能被占用,导致登录失败
|
||||
|
||||
**解决方案:** 使用端口 `0` 让系统自动分配可用端口
|
||||
|
||||
```typescript
|
||||
server.listen(0, () => {
|
||||
const address = server.address();
|
||||
const port = typeof address === "object" && address ? address.port : 3000;
|
||||
});
|
||||
```
|
||||
|
||||
### 2. Promise 异步等待
|
||||
|
||||
**问题:** 需要等待浏览器登录完成后才能继续
|
||||
|
||||
**解决方案:** 使用 Promise 包装回调逻辑
|
||||
|
||||
```typescript
|
||||
return new Promise((resolve, reject) => {
|
||||
(server as any)._loginResolve = resolve;
|
||||
(server as any)._loginReject = reject;
|
||||
});
|
||||
```
|
||||
|
||||
### 3. 会话持久化
|
||||
|
||||
**问题:** 重启 VSCode 后需要重新登录
|
||||
|
||||
**解决方案:** 使用 `globalState` 保存会话
|
||||
|
||||
```typescript
|
||||
await this.context.globalState.update("icCoderSessions", this._sessions);
|
||||
```
|
||||
|
||||
### 4. 事件通知机制
|
||||
|
||||
**问题:** VSCode 需要知道会话状态变化
|
||||
|
||||
**解决方案:** 使用 `EventEmitter` 触发事件
|
||||
|
||||
```typescript
|
||||
this._onDidChangeSessions.fire({
|
||||
added: [session],
|
||||
removed: [],
|
||||
changed: [],
|
||||
});
|
||||
```
|
||||
|
||||
## 用户体验
|
||||
|
||||
### 登录流程
|
||||
|
||||
1. 用户点击侧边栏"登录账户"按钮
|
||||
2. 浏览器自动打开登录页面
|
||||
3. 用户在网站完成登录
|
||||
4. 浏览器自动跳转到成功页面
|
||||
5. VSCode 左下角显示"IC Coder 用户"
|
||||
6. 侧边栏按钮变为"开始创作"
|
||||
|
||||
### 登出流程
|
||||
|
||||
1. 点击 VSCode 左下角账户图标
|
||||
2. 选择"IC Coder"账户
|
||||
3. 点击"退出"按钮
|
||||
4. 或使用命令 `IC Coder: 退出登录`
|
||||
|
||||
## 常见问题
|
||||
|
||||
### Q1: 为什么不直接使用 globalState 存储 token?
|
||||
|
||||
**A:** 使用 VSCode Authentication API 的优势:
|
||||
|
||||
- ✅ 统一的用户体验(左下角账户区域)
|
||||
- ✅ VSCode 自动管理会话生命周期
|
||||
- ✅ 支持多账户切换
|
||||
- ✅ 更好的安全性(VSCode 负责加密存储)
|
||||
|
||||
### Q2: 如何处理 token 过期?
|
||||
|
||||
**A:** 可以在 API 请求失败时:
|
||||
|
||||
1. 检测 401 错误
|
||||
2. 调用 `removeSession()` 清除过期会话
|
||||
3. 提示用户重新登录
|
||||
|
||||
### Q3: 如何支持多个账户?
|
||||
|
||||
**A:** 修改 `account` 对象:
|
||||
|
||||
```typescript
|
||||
account: {
|
||||
id: userInfo.id,
|
||||
label: userInfo.username,
|
||||
}
|
||||
```
|
||||
|
||||
### Q4: 登录页面如何获取用户信息?
|
||||
|
||||
**A:** 可以在登录成功后,通过 API 获取用户信息:
|
||||
|
||||
```typescript
|
||||
const userInfo = await fetch("https://api.iccoder.com/user/info", {
|
||||
headers: { Authorization: `Bearer ${token}` },
|
||||
});
|
||||
|
||||
const session: vscode.AuthenticationSession = {
|
||||
account: {
|
||||
id: userInfo.id,
|
||||
label: userInfo.username,
|
||||
},
|
||||
// ...
|
||||
};
|
||||
```
|
||||
|
||||
## 安全考虑
|
||||
|
||||
### 1. Token 存储
|
||||
|
||||
- ✅ 使用 VSCode `globalState` 加密存储
|
||||
- ✅ 不在代码中硬编码敏感信息
|
||||
- ✅ Token 仅在内存和加密存储中传递
|
||||
|
||||
### 2. 本地服务器
|
||||
|
||||
- ✅ 仅监听 `localhost`,不暴露到外网
|
||||
- ✅ 使用动态端口,避免固定端口被劫持
|
||||
- ✅ 接收到 token 后立即关闭服务器
|
||||
- ✅ 设置 5 分钟超时,防止服务器长期运行
|
||||
|
||||
### 3. HTTPS 考虑
|
||||
|
||||
**当前实现:** 使用 HTTP 本地回调
|
||||
|
||||
**生产环境建议:**
|
||||
|
||||
- 网站使用 HTTPS
|
||||
- 本地回调使用 HTTP(localhost 不受浏览器限制)
|
||||
- 或使用 `vscode://` 协议(需要网站支持)
|
||||
|
||||
## 测试指南
|
||||
|
||||
### 1. 本地测试
|
||||
|
||||
```bash
|
||||
# 启动调试模式
|
||||
按 F5
|
||||
|
||||
# 测试登录
|
||||
1. 打开侧边栏
|
||||
2. 点击"登录账户"
|
||||
3. 在浏览器完成登录
|
||||
4. 检查左下角是否显示账户
|
||||
|
||||
# 测试登出
|
||||
1. 点击左下角账户
|
||||
2. 选择"IC Coder"
|
||||
3. 点击"退出"
|
||||
```
|
||||
|
||||
### 2. 调试技巧
|
||||
|
||||
```typescript
|
||||
// 在 ICCoderAuthenticationProvider 中添加日志
|
||||
console.log("🔐 创建会话:", session);
|
||||
console.log("🔑 Token:", token);
|
||||
|
||||
// 在 ICViewProvider 中添加日志
|
||||
console.log("🔍 登录状态:", isLoggedIn);
|
||||
```
|
||||
|
||||
### 3. 常见错误排查
|
||||
|
||||
| 错误 | 原因 | 解决方案 |
|
||||
| ------------------------------- | --------------- | ---------------------------------- |
|
||||
| `getSessions is not a function` | VSCode 版本过低 | 升级到 1.63.0+ |
|
||||
| 端口被占用 | 固定端口冲突 | 使用动态端口(已实现) |
|
||||
| 登录后未显示账户 | 未触发事件 | 检查 `_onDidChangeSessions.fire()` |
|
||||
| 重启后需要重新登录 | 未保存会话 | 检查 `saveSessions()` 调用 |
|
||||
|
||||
## 文件结构
|
||||
|
||||
```
|
||||
ic-coder/
|
||||
├── src/
|
||||
│ ├── services/
|
||||
│ │ └── icCoderAuthProvider.ts # Authentication Provider 实现
|
||||
│ ├── views/
|
||||
│ │ └── ICViewProvider.ts # 侧边栏视图(集成登录状态)
|
||||
│ └── extension.ts # 注册 Provider 和命令
|
||||
├── package.json # 配置 authentication 和 commands
|
||||
└── docs/
|
||||
└── authentication-implementation.md # 本文档
|
||||
```
|
||||
|
||||
## 参考资料
|
||||
|
||||
- [VSCode Authentication API](https://code.visualstudio.com/api/references/vscode-api#authentication)
|
||||
- [Authentication Provider Sample](https://github.com/microsoft/vscode-extension-samples/tree/main/authentication-sample)
|
||||
- [VSCode Extension Guidelines](https://code.visualstudio.com/api/references/extension-guidelines)
|
||||
|
||||
## 总结
|
||||
|
||||
本实现通过以下步骤完成了 VSCode Authentication API 的集成:
|
||||
|
||||
1. ✅ 创建 `ICCoderAuthenticationProvider` 类实现认证逻辑
|
||||
2. ✅ 在 `package.json` 中注册 authentication provider
|
||||
3. ✅ 在 `extension.ts` 中注册 provider 和命令
|
||||
4. ✅ 实现本地 HTTP 服务器处理登录回调
|
||||
5. ✅ 使用动态端口避免冲突
|
||||
6. ✅ 集成到侧边栏视图,根据登录状态显示不同按钮
|
||||
7. ✅ 配置网站前端支持插件登录重定向
|
||||
|
||||
**最终效果:**
|
||||
|
||||
- 用户登录后,VSCode 左下角显示"IC Coder 用户"
|
||||
- 侧边栏根据登录状态显示"登录账户"或"开始创作"按钮
|
||||
- 支持通过账户菜单或命令进行登录/登出操作
|
||||
|
||||
---
|
||||
|
||||
**文档版本:** 1.0
|
||||
**最后更新:** 2025-12-29
|
||||
**作者:** Roe-xin
|
||||
45
docs/code-changes-feature.md
Normal file
@ -0,0 +1,45 @@
|
||||
# 代码变更审查功能
|
||||
|
||||
## 功能概述
|
||||
|
||||
AI 修改文件后,会在输入框上方显示"代码变更"面板,用户可以查看所有修改并选择采纳或拒绝。
|
||||
|
||||
## 核心文件
|
||||
|
||||
### 1. 数据结构
|
||||
- `src/types/fileChanges.ts` - 变更数据类型定义
|
||||
|
||||
### 2. 服务层
|
||||
- `src/services/changeTracker.ts` - 变更追踪服务(单例)
|
||||
- `trackChange()` - 记录文件变更
|
||||
- `acceptChange()` - 采纳变更(保存文件)
|
||||
- `rejectChange()` - 拒绝变更(恢复旧内容)
|
||||
|
||||
### 3. UI 组件
|
||||
- `src/views/changePanel.ts` - 变更面板 UI
|
||||
- `src/utils/diffRenderer.ts` - Diff 可视化渲染
|
||||
|
||||
### 4. 集成点
|
||||
- `src/utils/messageHandler.ts` - 消息处理
|
||||
- `trackFileChange()` - 记录变更
|
||||
- `handleAcceptChange()` - 处理采纳
|
||||
- `handleRejectChange()` - 处理拒绝
|
||||
- `sendChangesToWebview()` - 发送变更到前端
|
||||
|
||||
- `src/services/toolExecutor.ts` - 工具执行器
|
||||
- 在 `executeFileWrite()` 中记录变更
|
||||
|
||||
## 使用流程
|
||||
|
||||
1. **开始对话** - 调用 `startChangeSession(sessionId)`
|
||||
2. **修改文件** - 自动调用 `trackFileChange()`
|
||||
3. **对话结束** - 调用 `sendChangesToWebview()` 显示变更面板
|
||||
4. **用户操作** - 点击采纳/拒绝按钮
|
||||
5. **处理结果** - 保存或恢复文件内容
|
||||
|
||||
## 待完成工作
|
||||
|
||||
1. 在 ICHelperPanel 中集成消息处理(监听 acceptChange/rejectChange 命令)
|
||||
2. 在对话结束时调用 `sendChangesToWebview()`
|
||||
3. 在 Webview 中实现变更列表的动态渲染
|
||||
4. 处理前端的采纳/拒绝响应
|
||||
42
docs/code-to-chat-feature.md
Normal file
@ -0,0 +1,42 @@
|
||||
# 代码快速添加到对话功能
|
||||
|
||||
## 功能说明
|
||||
|
||||
选中代码后,通过右键菜单/小灯泡/快捷键(Ctrl+Shift+I),将代码作为上下文添加到聊天面板输入框上方。
|
||||
|
||||
## 实现方式
|
||||
|
||||
### 1. Code Action Provider
|
||||
`src/providers/codeActionProvider.ts` - 提供小灯泡菜单选项
|
||||
|
||||
### 2. 命令注册
|
||||
`src/extension.ts` - 注册 `ic-coder.addCodeToChat` 命令,发送消息到 webview
|
||||
|
||||
### 3. 全局引用
|
||||
`src/panels/ICHelperPanel.ts` - 保存 panel 到 `(global as any).currentICHelperPanel`
|
||||
|
||||
### 4. 上下文显示
|
||||
`src/views/contextDisplay.ts` - 添加 `code` 类型支持和 `addCodeContext` 消息处理
|
||||
|
||||
### 5. 配置
|
||||
`package.json` - 配置命令、右键菜单、快捷键
|
||||
|
||||
## 用户体验
|
||||
|
||||
1. 选中代码
|
||||
2. 右键/小灯泡/Ctrl+Shift+I
|
||||
3. 代码显示为上下文项:`文件名.v:10-25` 📄
|
||||
4. 输入问题发送(代码自动作为上下文)
|
||||
|
||||
## 数据结构
|
||||
|
||||
代码上下文存储为 JSON:
|
||||
```json
|
||||
{
|
||||
"fileName": "路径",
|
||||
"startLine": 10,
|
||||
"endLine": 25,
|
||||
"code": "代码内容",
|
||||
"languageId": "verilog"
|
||||
}
|
||||
```
|
||||
294
docs/delete-file-confirmation.md
Normal file
@ -0,0 +1,294 @@
|
||||
# 删除文件确认功能实现文档
|
||||
|
||||
## 1. 功能概述
|
||||
|
||||
在 AI 返回删除文件命令时,前端拦截并弹出确认对话框,用户确认后才执行删除操作。
|
||||
|
||||
## 2. 架构设计
|
||||
|
||||
### 2.1 消息流程
|
||||
|
||||
```
|
||||
AI 后端 → 删除文件工具调用 → 前端拦截 → 用户确认对话框
|
||||
↓
|
||||
确定/取消
|
||||
↓
|
||||
执行删除/返回取消结果
|
||||
↓
|
||||
返回 TOOL_EXECUTION_RESULT
|
||||
↓
|
||||
AI 后端
|
||||
```
|
||||
|
||||
### 2.2 关键原则
|
||||
|
||||
**前端必须返回结果**:无论用户选择什么,前端都必须向后端返回 `TOOL_EXECUTION_RESULT`,否则后端会等待超时。
|
||||
|
||||
## 3. 实现方案
|
||||
|
||||
### 3.1 修改位置
|
||||
|
||||
文件:`src/utils/messageHandler.ts`
|
||||
|
||||
在处理工具调用的函数中,找到删除文件的工具处理逻辑。
|
||||
|
||||
### 3.2 核心代码实现
|
||||
|
||||
```typescript
|
||||
/**
|
||||
* 处理删除文件工具调用(带用户确认)
|
||||
*/
|
||||
async function handleDeleteFileTool(
|
||||
toolCall: any,
|
||||
panel: vscode.WebviewPanel
|
||||
): Promise<ToolExecutionResult> {
|
||||
const filePath = toolCall.arguments.filePath; // 根据实际参数名调整
|
||||
|
||||
// 弹出确认对话框
|
||||
const confirmed = await vscode.window.showWarningMessage(
|
||||
`确定要删除文件吗?\n\n${filePath}`,
|
||||
{
|
||||
modal: true, // 模态对话框,阻止其他操作
|
||||
detail: '此操作不可撤销'
|
||||
},
|
||||
'确定删除',
|
||||
'取消'
|
||||
);
|
||||
|
||||
// 用户确认删除
|
||||
if (confirmed === '确定删除') {
|
||||
try {
|
||||
// 执行删除操作
|
||||
const uri = vscode.Uri.file(filePath);
|
||||
await vscode.workspace.fs.delete(uri, {
|
||||
recursive: false, // 如果是目录需要设置为 true
|
||||
useTrash: true // 移到回收站而非永久删除(推荐)
|
||||
});
|
||||
|
||||
// 返回成功结果
|
||||
return {
|
||||
type: 'TOOL_EXECUTION_RESULT',
|
||||
toolCallId: toolCall.id,
|
||||
result: JSON.stringify({
|
||||
success: true,
|
||||
message: `文件已删除: ${filePath}`
|
||||
})
|
||||
};
|
||||
} catch (error) {
|
||||
// 删除失败
|
||||
return {
|
||||
type: 'TOOL_EXECUTION_RESULT',
|
||||
toolCallId: toolCall.id,
|
||||
result: JSON.stringify({
|
||||
success: false,
|
||||
error: `删除失败: ${error.message}`
|
||||
})
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// 用户取消或关闭对话框
|
||||
return {
|
||||
type: 'TOOL_EXECUTION_RESULT',
|
||||
toolCallId: toolCall.id,
|
||||
result: JSON.stringify({
|
||||
success: false,
|
||||
message: '用户取消了删除操作'
|
||||
})
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
### 3.3 集成到消息处理流程
|
||||
|
||||
在 `messageHandler.ts` 的工具调用处理逻辑中:
|
||||
|
||||
```typescript
|
||||
// 示例:在处理工具调用的地方
|
||||
async function handleToolCall(toolCall: any, panel: vscode.WebviewPanel) {
|
||||
switch (toolCall.name) {
|
||||
case 'deleteFile': // 根据实际工具名称调整
|
||||
return await handleDeleteFileTool(toolCall, panel);
|
||||
|
||||
case 'deleteDirectory': // 如果有删除目录的工具
|
||||
return await handleDeleteDirectoryTool(toolCall, panel);
|
||||
|
||||
// ... 其他工具
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 4. 用户体验优化
|
||||
|
||||
### 4.1 对话框样式
|
||||
|
||||
```typescript
|
||||
const confirmed = await vscode.window.showWarningMessage(
|
||||
`确定要删除文件吗?\n\n📄 ${path.basename(filePath)}\n📁 ${path.dirname(filePath)}`,
|
||||
{
|
||||
modal: true,
|
||||
detail: '⚠️ 文件将被移到回收站,可以恢复'
|
||||
},
|
||||
'确定删除',
|
||||
'取消'
|
||||
);
|
||||
```
|
||||
|
||||
### 4.2 批量删除优化
|
||||
|
||||
如果 AI 一次返回多个删除操作:
|
||||
|
||||
```typescript
|
||||
// 方案 1:逐个确认
|
||||
for (const file of filesToDelete) {
|
||||
await handleDeleteFileTool(file, panel);
|
||||
}
|
||||
|
||||
// 方案 2:批量确认(推荐)
|
||||
const confirmed = await vscode.window.showWarningMessage(
|
||||
`确定要删除以下 ${filesToDelete.length} 个文件吗?\n\n${filesToDelete.join('\n')}`,
|
||||
{ modal: true },
|
||||
'全部删除',
|
||||
'取消'
|
||||
);
|
||||
```
|
||||
|
||||
## 5. 安全考虑
|
||||
|
||||
### 5.1 使用回收站
|
||||
|
||||
```typescript
|
||||
await vscode.workspace.fs.delete(uri, {
|
||||
useTrash: true // 移到回收站,可恢复
|
||||
});
|
||||
```
|
||||
|
||||
### 5.2 路径验证
|
||||
|
||||
```typescript
|
||||
// 防止删除工作区外的文件
|
||||
const workspaceFolders = vscode.workspace.workspaceFolders;
|
||||
if (!workspaceFolders) {
|
||||
return { success: false, error: '未打开工作区' };
|
||||
}
|
||||
|
||||
const isInWorkspace = workspaceFolders.some(folder =>
|
||||
filePath.startsWith(folder.uri.fsPath)
|
||||
);
|
||||
|
||||
if (!isInWorkspace) {
|
||||
return { success: false, error: '只能删除工作区内的文件' };
|
||||
}
|
||||
```
|
||||
|
||||
### 5.3 敏感文件保护
|
||||
|
||||
```typescript
|
||||
const protectedFiles = [
|
||||
'package.json',
|
||||
'tsconfig.json',
|
||||
'.git',
|
||||
'node_modules'
|
||||
];
|
||||
|
||||
const fileName = path.basename(filePath);
|
||||
if (protectedFiles.includes(fileName)) {
|
||||
vscode.window.showErrorMessage(`不允许删除系统文件: ${fileName}`);
|
||||
return { success: false, error: '受保护的文件' };
|
||||
}
|
||||
```
|
||||
|
||||
## 6. 错误处理
|
||||
|
||||
### 6.1 常见错误
|
||||
|
||||
```typescript
|
||||
try {
|
||||
await vscode.workspace.fs.delete(uri, { useTrash: true });
|
||||
} catch (error) {
|
||||
if (error.code === 'FileNotFound') {
|
||||
return { success: false, error: '文件不存在' };
|
||||
}
|
||||
if (error.code === 'NoPermissions') {
|
||||
return { success: false, error: '没有删除权限' };
|
||||
}
|
||||
return { success: false, error: error.message };
|
||||
}
|
||||
```
|
||||
|
||||
## 7. 测试场景
|
||||
|
||||
### 7.1 基本测试
|
||||
|
||||
- [ ] 用户点击"确定删除" → 文件被删除
|
||||
- [ ] 用户点击"取消" → 文件保留,返回取消消息
|
||||
- [ ] 用户关闭对话框 → 文件保留,返回取消消息
|
||||
- [ ] 文件不存在 → 返回错误消息
|
||||
- [ ] 没有删除权限 → 返回错误消息
|
||||
|
||||
### 7.2 边界测试
|
||||
|
||||
- [ ] 删除工作区外的文件 → 拒绝
|
||||
- [ ] 删除受保护文件 → 拒绝
|
||||
- [ ] 批量删除 → 正确处理
|
||||
- [ ] 后端收到取消消息后继续对话 → 流程正常
|
||||
|
||||
## 8. 配置选项(可选)
|
||||
|
||||
可以添加用户设置来控制行为:
|
||||
|
||||
```json
|
||||
// package.json
|
||||
"configuration": {
|
||||
"properties": {
|
||||
"ic-coder.confirmDelete": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "删除文件前是否需要确认"
|
||||
},
|
||||
"ic-coder.useTrash": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "删除文件时移到回收站而非永久删除"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
读取配置:
|
||||
|
||||
```typescript
|
||||
const config = vscode.workspace.getConfiguration('ic-coder');
|
||||
const needConfirm = config.get<boolean>('confirmDelete', true);
|
||||
const useTrash = config.get<boolean>('useTrash', true);
|
||||
|
||||
if (needConfirm) {
|
||||
// 弹出确认对话框
|
||||
}
|
||||
```
|
||||
|
||||
## 9. 总结
|
||||
|
||||
### 9.1 后端是否需要修改?
|
||||
|
||||
**不需要**。后端继续返回删除工具调用,前端负责:
|
||||
1. 拦截工具调用
|
||||
2. 弹出确认对话框
|
||||
3. 执行或取消删除
|
||||
4. **必须返回结果给后端**
|
||||
|
||||
### 9.2 关键要点
|
||||
|
||||
- ✅ 前端必须返回 `TOOL_EXECUTION_RESULT`
|
||||
- ✅ 使用 `useTrash: true` 提高安全性
|
||||
- ✅ 验证文件路径在工作区内
|
||||
- ✅ 保护敏感文件
|
||||
- ✅ 提供清晰的错误消息
|
||||
|
||||
### 9.3 下一步
|
||||
|
||||
1. 在 `messageHandler.ts` 中找到工具调用处理逻辑
|
||||
2. 实现 `handleDeleteFileTool` 函数
|
||||
3. 集成到现有流程
|
||||
4. 测试各种场景
|
||||
5. 考虑添加用户配置选项
|
||||
50
docs/integration-guide.md
Normal file
@ -0,0 +1,50 @@
|
||||
# 代码变更审查功能 - 使用说明
|
||||
|
||||
## 功能说明
|
||||
|
||||
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. 点击"采纳"或"拒绝"按钮测试功能
|
||||
739
docs/invitation-code-design.md
Normal file
@ -0,0 +1,739 @@
|
||||
# 邀请码验证功能设计方案
|
||||
|
||||
## 一、整体流程
|
||||
|
||||
```
|
||||
用户首次使用 → 检查邀请码状态 → 未验证则弹窗输入 → 后端验证 → 验证通过后可正常对话
|
||||
```
|
||||
|
||||
## 二、前端设计
|
||||
|
||||
### 2.1 邀请码状态管理
|
||||
|
||||
在 `ExtensionContext.globalState` 中存储邀请码验证状态:
|
||||
|
||||
```typescript
|
||||
// 存储结构
|
||||
{
|
||||
"invitationCodeVerified": true,
|
||||
"invitationCode": "INVITE2024ABC",
|
||||
"verifiedTime": "2024-01-20T10:30:00"
|
||||
}
|
||||
```
|
||||
|
||||
### 2.2 UI 交互流程
|
||||
|
||||
#### 弹窗输入邀请码
|
||||
使用 `vscode.window.showInputBox` 实现:
|
||||
|
||||
```typescript
|
||||
const invitationCode = await vscode.window.showInputBox({
|
||||
prompt: '请输入邀请码以继续使用 IC Coder',
|
||||
placeHolder: '例如:INVITE2024ABC',
|
||||
ignoreFocusOut: true,
|
||||
validateInput: (value) => {
|
||||
if (!value || value.trim().length === 0) {
|
||||
return '邀请码不能为空';
|
||||
}
|
||||
if (value.length < 6) {
|
||||
return '邀请码格式不正确';
|
||||
}
|
||||
return null;
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
#### 验证结果提示
|
||||
- 成功:`vscode.window.showInformationMessage('邀请码验证成功!')`
|
||||
- 失败:`vscode.window.showErrorMessage('邀请码无效或已过期,请重新输入')`
|
||||
|
||||
### 2.3 验证时机
|
||||
|
||||
在以下场景触发邀请码验证:
|
||||
|
||||
1. **用户首次发送消息时**(在 `handleUserMessage` 中检查)
|
||||
2. **用户登录后**(在登录成功回调中检查)
|
||||
3. **Token 过期重新登录后**
|
||||
|
||||
### 2.4 前端验证流程图
|
||||
|
||||
```
|
||||
发送消息前检查
|
||||
├─ 检查是否已登录
|
||||
│ └─ 未登录 → 提示登录
|
||||
├─ 检查邀请码是否已验证
|
||||
│ ├─ 未验证
|
||||
│ │ ├─ 弹窗输入邀请码
|
||||
│ │ ├─ 调用后端验证接口 POST /api/invitation/verify
|
||||
│ │ ├─ 验证成功
|
||||
│ │ │ ├─ 保存验证状态到 globalState
|
||||
│ │ │ └─ 继续发送消息
|
||||
│ │ └─ 验证失败
|
||||
│ │ ├─ 显示错误提示
|
||||
│ │ └─ 阻止发送消息
|
||||
│ └─ 已验证 → 继续发送消息
|
||||
```
|
||||
|
||||
### 2.5 前端文件修改清单
|
||||
|
||||
#### 新增文件
|
||||
|
||||
**`src/services/invitationService.ts`** - 邀请码服务
|
||||
```typescript
|
||||
/**
|
||||
* 邀请码验证服务
|
||||
*/
|
||||
export class InvitationService {
|
||||
/**
|
||||
* 检查用户是否已验证邀请码
|
||||
*/
|
||||
static async isVerified(context: vscode.ExtensionContext): Promise<boolean>
|
||||
|
||||
/**
|
||||
* 验证邀请码
|
||||
*/
|
||||
static async verifyCode(code: string): Promise<boolean>
|
||||
|
||||
/**
|
||||
* 保存验证状态
|
||||
*/
|
||||
static async saveVerificationStatus(
|
||||
context: vscode.ExtensionContext,
|
||||
code: string
|
||||
): Promise<void>
|
||||
|
||||
/**
|
||||
* 清除验证状态(用于退出登录)
|
||||
*/
|
||||
static async clearVerificationStatus(
|
||||
context: vscode.ExtensionContext
|
||||
): Promise<void>
|
||||
|
||||
/**
|
||||
* 显示邀请码输入弹窗
|
||||
*/
|
||||
static async showInputDialog(): Promise<string | undefined>
|
||||
}
|
||||
```
|
||||
|
||||
#### 修改文件
|
||||
|
||||
**`src/utils/messageHandler.ts`**
|
||||
- 在 `handleUserMessage` 函数开头添加邀请码验证检查
|
||||
|
||||
**`src/services/apiClient.ts`**
|
||||
- 添加 `verifyInvitationCode` 函数
|
||||
- 添加 `checkInvitationStatus` 函数
|
||||
|
||||
**`src/types/api.ts`**
|
||||
- 添加邀请码相关类型定义
|
||||
|
||||
**`src/panels/ICHelperPanel.ts`**
|
||||
- 在面板创建时检查邀请码状态(可选)
|
||||
|
||||
**`src/extension.ts`**
|
||||
- 在登录成功后检查邀请码状态
|
||||
|
||||
### 2.6 类型定义
|
||||
|
||||
在 `src/types/api.ts` 中添加:
|
||||
|
||||
```typescript
|
||||
// ============== 邀请码验证 ==============
|
||||
|
||||
/**
|
||||
* 邀请码验证请求
|
||||
* POST /api/invitation/verify
|
||||
*/
|
||||
export interface InvitationVerifyRequest {
|
||||
/** 邀请码 */
|
||||
code: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 邀请码验证响应
|
||||
*/
|
||||
export interface InvitationVerifyResponse {
|
||||
/** 响应代码 */
|
||||
code: number;
|
||||
/** 响应消息 */
|
||||
msg: string;
|
||||
/** 验证结果数据 */
|
||||
data?: {
|
||||
/** 是否验证成功 */
|
||||
verified: boolean;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 邀请码状态响应
|
||||
* GET /api/invitation/status
|
||||
*/
|
||||
export interface InvitationStatusResponse {
|
||||
/** 响应代码 */
|
||||
code: number;
|
||||
/** 响应消息 */
|
||||
msg?: string;
|
||||
/** 状态数据 */
|
||||
data?: {
|
||||
/** 是否已验证 */
|
||||
verified: boolean;
|
||||
/** 使用的邀请码 */
|
||||
invitationCode?: string;
|
||||
/** 验证时间 */
|
||||
verifiedTime?: string;
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
## 三、后端设计
|
||||
|
||||
### 3.1 数据库设计
|
||||
|
||||
#### 邀请码表 (invitation_codes)
|
||||
|
||||
```sql
|
||||
CREATE TABLE invitation_codes (
|
||||
id BIGINT PRIMARY KEY AUTO_INCREMENT COMMENT '主键ID',
|
||||
code VARCHAR(32) UNIQUE NOT NULL COMMENT '邀请码',
|
||||
max_uses INT DEFAULT 1 COMMENT '最大使用次数,-1表示无限制',
|
||||
used_count INT DEFAULT 0 COMMENT '已使用次数',
|
||||
expire_time DATETIME COMMENT '过期时间,NULL表示永不过期',
|
||||
created_by BIGINT COMMENT '创建者用户ID',
|
||||
created_time DATETIME DEFAULT CURRENT_TIMESTAMP COMMENT '创建时间',
|
||||
updated_time DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '更新时间',
|
||||
status TINYINT DEFAULT 1 COMMENT '状态:1-有效,0-禁用',
|
||||
remark VARCHAR(500) COMMENT '备注',
|
||||
INDEX idx_code (code),
|
||||
INDEX idx_status (status),
|
||||
INDEX idx_expire_time (expire_time)
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='邀请码表';
|
||||
```
|
||||
|
||||
#### 用户邀请码关联表 (user_invitation)
|
||||
|
||||
```sql
|
||||
CREATE TABLE user_invitation (
|
||||
id BIGINT PRIMARY KEY AUTO_INCREMENT COMMENT '主键ID',
|
||||
user_id BIGINT NOT NULL COMMENT '用户ID',
|
||||
invitation_code VARCHAR(32) NOT NULL COMMENT '使用的邀请码',
|
||||
verified_time DATETIME DEFAULT CURRENT_TIMESTAMP COMMENT '验证时间',
|
||||
ip_address VARCHAR(50) COMMENT '验证时的IP地址',
|
||||
UNIQUE KEY uk_user_id (user_id),
|
||||
INDEX idx_invitation_code (invitation_code),
|
||||
INDEX idx_verified_time (verified_time)
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='用户邀请码关联表';
|
||||
```
|
||||
|
||||
### 3.2 API 接口设计
|
||||
|
||||
#### 3.2.1 验证邀请码
|
||||
|
||||
**接口地址**:`POST /api/invitation/verify`
|
||||
|
||||
**请求头**:
|
||||
```
|
||||
Authorization: Bearer {token}
|
||||
Content-Type: application/json
|
||||
```
|
||||
|
||||
**请求体**:
|
||||
```json
|
||||
{
|
||||
"code": "INVITE2024ABC"
|
||||
}
|
||||
```
|
||||
|
||||
**响应示例**:
|
||||
|
||||
成功:
|
||||
```json
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "验证成功",
|
||||
"data": {
|
||||
"verified": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
失败:
|
||||
```json
|
||||
{
|
||||
"code": 400,
|
||||
"msg": "邀请码无效或已过期"
|
||||
}
|
||||
```
|
||||
|
||||
```json
|
||||
{
|
||||
"code": 400,
|
||||
"msg": "邀请码使用次数已达上限"
|
||||
}
|
||||
```
|
||||
|
||||
```json
|
||||
{
|
||||
"code": 400,
|
||||
"msg": "您已验证过邀请码,无需重复验证"
|
||||
}
|
||||
```
|
||||
|
||||
#### 3.2.2 查询验证状态
|
||||
|
||||
**接口地址**:`GET /api/invitation/status`
|
||||
|
||||
**请求头**:
|
||||
```
|
||||
Authorization: Bearer {token}
|
||||
```
|
||||
|
||||
**响应示例**:
|
||||
|
||||
已验证:
|
||||
```json
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "success",
|
||||
"data": {
|
||||
"verified": true,
|
||||
"invitationCode": "INVITE2024ABC",
|
||||
"verifiedTime": "2024-01-20T10:30:00"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
未验证:
|
||||
```json
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "success",
|
||||
"data": {
|
||||
"verified": false
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 3.2.3 管理接口(管理员使用)
|
||||
|
||||
**生成邀请码**:`POST /api/admin/invitation/generate`
|
||||
|
||||
请求体:
|
||||
```json
|
||||
{
|
||||
"count": 10,
|
||||
"maxUses": 1,
|
||||
"expireTime": "2024-12-31T23:59:59",
|
||||
"remark": "2024年1月批次"
|
||||
}
|
||||
```
|
||||
|
||||
响应:
|
||||
```json
|
||||
{
|
||||
"code": 200,
|
||||
"msg": "生成成功",
|
||||
"data": {
|
||||
"codes": [
|
||||
"INVITE2024001",
|
||||
"INVITE2024002",
|
||||
"..."
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**查询邀请码列表**:`GET /api/admin/invitation/list`
|
||||
|
||||
**禁用邀请码**:`PUT /api/admin/invitation/disable/{code}`
|
||||
|
||||
**查询使用记录**:`GET /api/admin/invitation/usage/{code}`
|
||||
|
||||
### 3.3 后端验证逻辑
|
||||
|
||||
#### 验证流程
|
||||
|
||||
```java
|
||||
public boolean verifyInvitationCode(Long userId, String code) {
|
||||
// 1. 检查邀请码是否存在
|
||||
InvitationCode invitationCode = invitationCodeMapper.selectByCode(code);
|
||||
if (invitationCode == null) {
|
||||
throw new BusinessException("邀请码不存在");
|
||||
}
|
||||
|
||||
// 2. 检查邀请码状态
|
||||
if (invitationCode.getStatus() != 1) {
|
||||
throw new BusinessException("邀请码已被禁用");
|
||||
}
|
||||
|
||||
// 3. 检查是否过期
|
||||
if (invitationCode.getExpireTime() != null
|
||||
&& invitationCode.getExpireTime().before(new Date())) {
|
||||
throw new BusinessException("邀请码已过期");
|
||||
}
|
||||
|
||||
// 4. 检查使用次数
|
||||
if (invitationCode.getMaxUses() != -1
|
||||
&& invitationCode.getUsedCount() >= invitationCode.getMaxUses()) {
|
||||
throw new BusinessException("邀请码使用次数已达上限");
|
||||
}
|
||||
|
||||
// 5. 检查用户是否已验证过
|
||||
UserInvitation existing = userInvitationMapper.selectByUserId(userId);
|
||||
if (existing != null) {
|
||||
throw new BusinessException("您已验证过邀请码,无需重复验证");
|
||||
}
|
||||
|
||||
// 6. 创建用户验证记录
|
||||
UserInvitation userInvitation = new UserInvitation();
|
||||
userInvitation.setUserId(userId);
|
||||
userInvitation.setInvitationCode(code);
|
||||
userInvitation.setVerifiedTime(new Date());
|
||||
userInvitationMapper.insert(userInvitation);
|
||||
|
||||
// 7. 增加邀请码使用次数
|
||||
invitationCodeMapper.incrementUsedCount(code);
|
||||
|
||||
return true;
|
||||
}
|
||||
```
|
||||
|
||||
### 3.4 权限拦截
|
||||
|
||||
在对话接口中添加邀请码验证拦截:
|
||||
|
||||
```java
|
||||
@PostMapping("/dialog/stream")
|
||||
public SseEmitter dialog(@RequestBody DialogRequest request) {
|
||||
// 获取当前用户ID
|
||||
Long userId = SecurityUtils.getUserId();
|
||||
|
||||
// 检查用户是否已验证邀请码
|
||||
if (!invitationService.isUserVerified(userId)) {
|
||||
throw new BusinessException("请先验证邀请码后再使用对话功能");
|
||||
}
|
||||
|
||||
// 继续处理对话请求
|
||||
// ...
|
||||
}
|
||||
```
|
||||
|
||||
或者使用拦截器统一处理:
|
||||
|
||||
```java
|
||||
@Component
|
||||
public class InvitationInterceptor implements HandlerInterceptor {
|
||||
|
||||
@Autowired
|
||||
private InvitationService invitationService;
|
||||
|
||||
@Override
|
||||
public boolean preHandle(HttpServletRequest request,
|
||||
HttpServletResponse response,
|
||||
Object handler) throws Exception {
|
||||
// 获取当前用户ID
|
||||
Long userId = SecurityUtils.getUserId();
|
||||
|
||||
// 检查是否需要验证邀请码的接口
|
||||
String uri = request.getRequestURI();
|
||||
if (needsInvitationVerification(uri)) {
|
||||
if (!invitationService.isUserVerified(userId)) {
|
||||
throw new BusinessException("请先验证邀请码");
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
private boolean needsInvitationVerification(String uri) {
|
||||
// 需要验证邀请码的接口列表
|
||||
return uri.startsWith("/api/dialog/")
|
||||
|| uri.startsWith("/api/task/");
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 3.5 后端文件清单
|
||||
|
||||
#### 实体类
|
||||
- `com.iccoder.entity.InvitationCode` - 邀请码实体
|
||||
- `com.iccoder.entity.UserInvitation` - 用户邀请码关联实体
|
||||
|
||||
#### Mapper
|
||||
- `com.iccoder.mapper.InvitationCodeMapper` - 邀请码数据访问
|
||||
- `com.iccoder.mapper.UserInvitationMapper` - 用户邀请码关联数据访问
|
||||
|
||||
#### Service
|
||||
- `com.iccoder.service.InvitationService` - 邀请码业务逻辑
|
||||
- `com.iccoder.service.impl.InvitationServiceImpl` - 实现类
|
||||
|
||||
#### Controller
|
||||
- `com.iccoder.controller.InvitationController` - 邀请码接口
|
||||
- `com.iccoder.controller.admin.InvitationAdminController` - 管理接口
|
||||
|
||||
#### 拦截器
|
||||
- `com.iccoder.interceptor.InvitationInterceptor` - 邀请码验证拦截器
|
||||
|
||||
## 四、用户体验优化
|
||||
|
||||
### 4.1 首次使用引导
|
||||
|
||||
在用户首次打开聊天面板时,如果未验证邀请码,显示友好的引导信息:
|
||||
|
||||
```typescript
|
||||
// 在 ICHelperPanel.ts 中
|
||||
if (!await InvitationService.isVerified(context)) {
|
||||
panel.webview.postMessage({
|
||||
command: 'showInvitationGuide',
|
||||
message: '欢迎使用 IC Coder!请先输入邀请码以开始使用。'
|
||||
});
|
||||
}
|
||||
```
|
||||
|
||||
### 4.2 状态持久化
|
||||
|
||||
验证状态保存在 `globalState` 中,避免重复验证:
|
||||
|
||||
```typescript
|
||||
// 保存验证状态
|
||||
await context.globalState.update('invitationCodeVerified', true);
|
||||
await context.globalState.update('invitationCode', code);
|
||||
await context.globalState.update('verifiedTime', new Date().toISOString());
|
||||
```
|
||||
|
||||
### 4.3 错误提示优化
|
||||
|
||||
根据不同的错误类型,提供清晰的提示信息:
|
||||
|
||||
| 错误类型 | 提示信息 |
|
||||
|---------|---------|
|
||||
| 邀请码不存在 | "邀请码不存在,请检查后重新输入" |
|
||||
| 邀请码已过期 | "邀请码已过期,请联系管理员获取新的邀请码" |
|
||||
| 使用次数已达上限 | "该邀请码使用次数已达上限,请使用其他邀请码" |
|
||||
| 已验证过 | "您已验证过邀请码,无需重复验证" |
|
||||
| 网络错误 | "网络连接失败,请检查网络后重试" |
|
||||
|
||||
### 4.4 支持重新验证
|
||||
|
||||
提供命令允许用户更换邀请码:
|
||||
|
||||
```typescript
|
||||
// 在 extension.ts 中注册命令
|
||||
context.subscriptions.push(
|
||||
vscode.commands.registerCommand('ic-coder.changeInvitationCode', async () => {
|
||||
const confirm = await vscode.window.showWarningMessage(
|
||||
'确定要更换邀请码吗?',
|
||||
'确定',
|
||||
'取消'
|
||||
);
|
||||
|
||||
if (confirm === '确定') {
|
||||
await InvitationService.clearVerificationStatus(context);
|
||||
vscode.window.showInformationMessage('已清除邀请码,请重新验证');
|
||||
}
|
||||
})
|
||||
);
|
||||
```
|
||||
|
||||
### 4.5 Webview 中显示状态(可选)
|
||||
|
||||
在聊天界面顶部显示邀请码验证状态:
|
||||
|
||||
```html
|
||||
<!-- 已验证 -->
|
||||
<div class="invitation-status verified">
|
||||
<span class="icon">✓</span>
|
||||
<span>邀请码已验证</span>
|
||||
</div>
|
||||
|
||||
<!-- 未验证 -->
|
||||
<div class="invitation-status unverified">
|
||||
<span class="icon">!</span>
|
||||
<span>请先验证邀请码</span>
|
||||
<button onclick="verifyInvitationCode()">立即验证</button>
|
||||
</div>
|
||||
```
|
||||
|
||||
## 五、安全考虑
|
||||
|
||||
### 5.1 邀请码生成规则
|
||||
|
||||
使用安全的随机算法生成邀请码:
|
||||
|
||||
```java
|
||||
public String generateInvitationCode() {
|
||||
// 使用 UUID + 时间戳 + 随机数
|
||||
String uuid = UUID.randomUUID().toString().replace("-", "");
|
||||
String timestamp = String.valueOf(System.currentTimeMillis());
|
||||
String random = RandomStringUtils.randomAlphanumeric(6);
|
||||
|
||||
// 组合并取前16位
|
||||
String combined = uuid + timestamp + random;
|
||||
String code = DigestUtils.sha256Hex(combined).substring(0, 16).toUpperCase();
|
||||
|
||||
return "IC" + code; // 添加前缀,例如:IC3F2A9B1C4D5E6F
|
||||
}
|
||||
```
|
||||
|
||||
### 5.2 防暴力破解
|
||||
|
||||
限制验证频率,添加验证失败次数限制:
|
||||
|
||||
```java
|
||||
// 使用 Redis 记录验证失败次数
|
||||
String key = "invitation:fail:" + userId;
|
||||
Integer failCount = redisTemplate.opsForValue().get(key);
|
||||
|
||||
if (failCount != null && failCount >= 5) {
|
||||
throw new BusinessException("验证失败次数过多,请1小时后再试");
|
||||
}
|
||||
|
||||
// 验证失败时增加计数
|
||||
if (!verifySuccess) {
|
||||
redisTemplate.opsForValue().increment(key);
|
||||
redisTemplate.expire(key, 1, TimeUnit.HOURS);
|
||||
}
|
||||
```
|
||||
|
||||
### 5.3 Token 绑定
|
||||
|
||||
邀请码验证状态与用户 Token 绑定,退出登录时清除:
|
||||
|
||||
```typescript
|
||||
// 在退出登录时清除验证状态
|
||||
vscode.commands.registerCommand('ic-coder.logout', async () => {
|
||||
// 清除 session
|
||||
await clearSession();
|
||||
|
||||
// 清除邀请码验证状态
|
||||
await InvitationService.clearVerificationStatus(context);
|
||||
|
||||
vscode.window.showInformationMessage('已退出登录');
|
||||
});
|
||||
```
|
||||
|
||||
### 5.4 日志记录
|
||||
|
||||
记录所有验证尝试,便于审计和分析:
|
||||
|
||||
```java
|
||||
@Slf4j
|
||||
public class InvitationServiceImpl implements InvitationService {
|
||||
|
||||
@Override
|
||||
public boolean verifyInvitationCode(Long userId, String code) {
|
||||
log.info("用户 {} 尝试验证邀请码: {}", userId, code);
|
||||
|
||||
try {
|
||||
// 验证逻辑
|
||||
// ...
|
||||
|
||||
log.info("用户 {} 验证邀请码成功: {}", userId, code);
|
||||
return true;
|
||||
} catch (Exception e) {
|
||||
log.warn("用户 {} 验证邀请码失败: {}, 原因: {}",
|
||||
userId, code, e.getMessage());
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 5.5 敏感信息保护
|
||||
|
||||
- 邀请码在数据库中可以考虑加密存储(可选)
|
||||
- API 响应中不暴露邀请码的详细信息(如剩余次数)
|
||||
- 前端不缓存邀请码明文,只保存验证状态
|
||||
|
||||
## 六、实施步骤
|
||||
|
||||
### 阶段一:后端开发(优先)
|
||||
|
||||
1. 创建数据库表
|
||||
2. 实现邀请码生成和管理功能
|
||||
3. 实现验证接口
|
||||
4. 添加权限拦截
|
||||
5. 测试接口功能
|
||||
|
||||
### 阶段二:前端开发
|
||||
|
||||
1. 添加类型定义
|
||||
2. 实现 `InvitationService`
|
||||
3. 修改 `apiClient.ts` 添加接口调用
|
||||
4. 修改 `messageHandler.ts` 添加验证检查
|
||||
5. 测试完整流程
|
||||
|
||||
### 阶段三:联调测试
|
||||
|
||||
1. 前后端联调
|
||||
2. 测试各种异常场景
|
||||
3. 优化用户体验
|
||||
4. 性能测试
|
||||
|
||||
### 阶段四:上线部署
|
||||
|
||||
1. 生成初始邀请码
|
||||
2. 更新用户文档
|
||||
3. 灰度发布
|
||||
4. 监控运行状态
|
||||
|
||||
## 七、测试用例
|
||||
|
||||
### 7.1 正常流程测试
|
||||
|
||||
| 测试场景 | 预期结果 |
|
||||
|---------|---------|
|
||||
| 首次使用,输入有效邀请码 | 验证成功,可以正常对话 |
|
||||
| 已验证用户再次打开面板 | 无需重复验证,直接使用 |
|
||||
| 退出登录后重新登录 | 需要重新验证邀请码 |
|
||||
|
||||
### 7.2 异常场景测试
|
||||
|
||||
| 测试场景 | 预期结果 |
|
||||
|---------|---------|
|
||||
| 输入不存在的邀请码 | 提示"邀请码不存在" |
|
||||
| 输入已过期的邀请码 | 提示"邀请码已过期" |
|
||||
| 输入使用次数已满的邀请码 | 提示"使用次数已达上限" |
|
||||
| 已验证用户尝试再次验证 | 提示"已验证过,无需重复验证" |
|
||||
| 网络断开时验证 | 提示"网络连接失败" |
|
||||
| 连续输入错误邀请码5次 | 提示"验证失败次数过多,请稍后再试" |
|
||||
|
||||
### 7.3 边界条件测试
|
||||
|
||||
| 测试场景 | 预期结果 |
|
||||
|---------|---------|
|
||||
| 邀请码为空 | 前端验证拦截,提示"邀请码不能为空" |
|
||||
| 邀请码长度不足 | 前端验证拦截,提示"邀请码格式不正确" |
|
||||
| 邀请码包含特殊字符 | 后端验证失败,提示"邀请码不存在" |
|
||||
| 同一邀请码多人同时使用 | 使用数据库锁,确保不超过最大次数 |
|
||||
|
||||
## 八、FAQ
|
||||
|
||||
### Q1: 用户忘记邀请码怎么办?
|
||||
A: 邀请码验证成功后,用户无需记住邀请码。如果需要查看,可以在设置中显示已验证的邀请码。
|
||||
|
||||
### Q2: 邀请码可以重复使用吗?
|
||||
A: 取决于邀请码的 `maxUses` 设置。可以设置为 1(一次性)、N(限定次数)或 -1(无限制)。
|
||||
|
||||
### Q3: 如何批量生成邀请码?
|
||||
A: 使用管理接口 `POST /api/admin/invitation/generate`,指定生成数量即可。
|
||||
|
||||
### Q4: 邀请码验证失败会影响登录吗?
|
||||
A: 不会。邀请码验证是独立的,只影响对话功能的使用,不影响登录。
|
||||
|
||||
### Q5: 可以为不同用户群体设置不同的邀请码吗?
|
||||
A: 可以。通过 `remark` 字段标记不同批次的邀请码,便于管理和统计。
|
||||
|
||||
## 九、后续优化方向
|
||||
|
||||
1. **邀请码分级**:不同等级的邀请码对应不同的权限(如对话次数、模型选择等)
|
||||
2. **邀请奖励**:邀请他人使用可获得积分或额外权限
|
||||
3. **邀请统计**:统计每个邀请码的使用情况和用户活跃度
|
||||
4. **自动过期**:根据使用情况自动延长或缩短邀请码有效期
|
||||
5. **白名单机制**:特定用户可以免邀请码使用
|
||||
|
||||
---
|
||||
|
||||
**文档版本**:v1.0
|
||||
**最后更新**:2026-01-27
|
||||
**维护者**:IC Coder Team
|
||||
161
docs/personal-rules-mvp-requirements.md
Normal file
@ -0,0 +1,161 @@
|
||||
# 个人规则功能需求文档(方案 A:本地 `.md` 注入)
|
||||
|
||||
## 1. 文档目标
|
||||
|
||||
在不改动现有核心对话模式的前提下,实现“个人规则(Personal Rules)”能力:
|
||||
用户可在插件内维护个人规则文本,插件保存到本地 `.md` 文件;每次发起对话时自动读取并随请求传递给后端,由后端注入模型上下文,影响回答风格与行为。
|
||||
|
||||
## 2. 范围定义
|
||||
|
||||
### 2.1 本期范围(MVP)
|
||||
|
||||
1. 支持用户编辑、保存、启用/停用个人规则。
|
||||
2. 本地落盘为 `.md` 文件。
|
||||
3. 发消息时自动加载规则并传给后端。
|
||||
4. 后端接收结构化字段并注入提示词。
|
||||
5. 基础异常处理和可观测提示。
|
||||
|
||||
### 2.2 非本期范围
|
||||
|
||||
1. 云端同步、多设备同步。
|
||||
2. 规则版本历史/回滚。
|
||||
3. 多规则集合管理(仅单份个人规则文本)。
|
||||
4. 团队共享规则。
|
||||
|
||||
## 3. 术语与核心概念
|
||||
|
||||
1. `Personal Rules`:用户个人偏好与约束文本。
|
||||
2. `Rules File`:本地规则文件,Markdown 格式。
|
||||
3. `Rules Enabled`:规则开关;关闭时不注入。
|
||||
4. `Rules Injection`:请求时将规则传后端并参与模型上下文构建。
|
||||
|
||||
## 4. 用户故事
|
||||
|
||||
1. 作为用户,我希望在插件里写下“回答风格、代码习惯、语言偏好”等个人规则。
|
||||
2. 作为用户,我希望规则保存在本地可见文件中。
|
||||
3. 作为用户,我希望发消息时自动生效,无需每次重复输入。
|
||||
4. 作为用户,我希望可以一键关闭规则,临时不生效。
|
||||
|
||||
## 5. 功能需求(前端/Webview + 扩展端)
|
||||
|
||||
### 5.1 规则管理界面
|
||||
|
||||
1. 提供“个人规则”入口。
|
||||
2. 提供多行编辑框(显示当前规则内容)。
|
||||
3. 提供“保存”按钮。
|
||||
4. 提供“启用/停用”开关。
|
||||
5. 显示当前状态:
|
||||
6. 规则是否启用。
|
||||
7. 规则字数/长度。
|
||||
8. 最近保存时间(可选)。
|
||||
|
||||
### 5.2 本地文件存储
|
||||
|
||||
1. 规则内容保存到本地 `.md`。
|
||||
2. 推荐文件名:`personal-rules.md`。
|
||||
3. 推荐路径(优先):插件全局存储目录下固定子路径。
|
||||
4. 文件不存在时可自动创建。
|
||||
5. 用户可通过“打开规则文件”查看(可选)。
|
||||
|
||||
### 5.3 对话发送前处理
|
||||
|
||||
1. 用户点击发送消息。
|
||||
2. 扩展端检查规则开关:
|
||||
3. 关闭:不读取规则,不传后端。
|
||||
4. 开启:读取 `.md` 内容。
|
||||
5. 读取成功且非空时,将规则文本附加到对话请求结构化字段。
|
||||
6. 读取失败时:提示告警,但不阻断正常对话。
|
||||
|
||||
### 5.4 限制与防护
|
||||
|
||||
1. 规则长度上限(例如 4000 字符,可配置)。
|
||||
2. 超限时保存被拒绝,提示用户缩短。
|
||||
3. 空白内容视为“无规则”。
|
||||
4. 不允许二进制或非文本写入。
|
||||
|
||||
## 6. 功能需求(后端)
|
||||
|
||||
### 6.1 请求协议扩展
|
||||
|
||||
在现有对话请求结构中增加字段:
|
||||
|
||||
1. `personalRules`:字符串,可选。
|
||||
2. `rulesEnabled`:布尔,可选(便于追踪)。
|
||||
3. `rulesMeta`:可选元信息(长度、来源)。
|
||||
|
||||
### 6.2 注入策略
|
||||
|
||||
1. 后端收到 `personalRules` 后,将其注入系统提示层(而非用户消息层)。
|
||||
2. 注入顺序建议:
|
||||
3. 系统安全与平台策略。
|
||||
4. 产品默认系统提示。
|
||||
5. 用户个人规则。
|
||||
6. 用户输入。
|
||||
7. 若 `personalRules` 为空或开关关闭,则跳过注入。
|
||||
|
||||
### 6.3 风险控制
|
||||
|
||||
1. 规则文本不允许覆盖平台安全策略。
|
||||
2. 记录本次是否注入规则(日志字段即可)。
|
||||
3. 异常不应导致整次对话失败(可降级为无规则对话)。
|
||||
|
||||
## 7. 前后端对接设计
|
||||
|
||||
### 7.1 消息链路
|
||||
|
||||
1. Webview 触发 `sendMessage`。
|
||||
2. 扩展端 `messageHandler` 统一处理发送。
|
||||
3. `messageHandler` 在调用 `dialogService.sendMessage` 前读取个人规则。
|
||||
4. `dialogService` 组装 `DialogRequest`,带上 `personalRules`。
|
||||
5. `sseHandler` 发起流式请求。
|
||||
6. 后端注入规则后进入模型推理。
|
||||
7. 正常走现有 SSE 回传流程。
|
||||
|
||||
### 7.2 职责边界
|
||||
|
||||
1. Webview:展示与编辑,不直接拼接最终请求。
|
||||
2. 扩展端:规则文件读写、开关状态管理、请求组装。
|
||||
3. 后端:规则注入、优先级控制、审计日志。
|
||||
|
||||
## 8. 数据与状态设计
|
||||
|
||||
### 8.1 本地文件
|
||||
|
||||
1. 文件格式:Markdown 纯文本。
|
||||
2. 内容约定:无强制模板,允许自由文本。
|
||||
3. 编码:UTF-8。
|
||||
|
||||
### 8.2 本地配置状态
|
||||
|
||||
1. `personalRulesEnabled`:是否启用。
|
||||
2. `personalRulesPath`:规则文件路径(可固定也可配置)。
|
||||
3. `lastSavedAt`:最近保存时间(可选)。
|
||||
|
||||
## 9. 异常与降级
|
||||
|
||||
1. 文件不存在:自动创建空文件,视为无规则。
|
||||
2. 文件读取失败:弹出提示,继续无规则发送。
|
||||
3. 文件写入失败:保存失败提示,不更新状态。
|
||||
4. 后端字段不识别:请求兼容,后端忽略新字段。
|
||||
5. 后端注入失败:降级为普通对话,记录日志。
|
||||
|
||||
## 10. 安全与合规要求
|
||||
|
||||
1. 个人规则属于用户本地数据,不主动上传除非发起对话。
|
||||
2. 日志中避免完整打印规则正文(最多打印长度和哈希)。
|
||||
3. 后端注入时必须确保平台安全策略优先级更高。
|
||||
|
||||
## 11. 验收标准(UAT)
|
||||
|
||||
1. 用户保存规则后,本地存在 `personal-rules.md` 且内容一致。
|
||||
2. 开启规则发送消息时,请求中可观测到 `personalRules` 字段。
|
||||
3. 关闭规则发送消息时,请求中不含该字段或为空。
|
||||
4. 规则文件损坏/读取失败时,不影响正常聊天。
|
||||
5. 超过长度上限时,前端保存被拒绝且提示明确。
|
||||
6. 后端日志可确认“本次是否注入个人规则”。
|
||||
|
||||
## 12. 迭代建议(下一阶段)
|
||||
|
||||
1. 规则模板(代码风格、语言风格、测试偏好)。
|
||||
2. 项目规则与个人规则合并策略。
|
||||
3. 云端同步(按 `userId`),多端一致。
|
||||
911
docs/system-notification-implementation.md
Normal file
@ -0,0 +1,911 @@
|
||||
# IC Coder 系统通知功能实现方案
|
||||
|
||||
## 目录
|
||||
|
||||
- [1. 需求背景](#1-需求背景)
|
||||
- [2. 技术方案对比](#2-技术方案对比)
|
||||
- [3. 推荐方案详解](#3-推荐方案详解)
|
||||
- [4. 实现步骤](#4-实现步骤)
|
||||
- [5. API 设计](#5-api-设计)
|
||||
- [6. 配置选项](#6-配置选项)
|
||||
- [7. 测试方案](#7-测试方案)
|
||||
- [8. 注意事项](#8-注意事项)
|
||||
- [9. 常见问题](#9-常见问题)
|
||||
|
||||
---
|
||||
|
||||
## 1. 需求背景
|
||||
|
||||
### 1.1 问题描述
|
||||
|
||||
当前 IC Coder 插件使用 VS Code 内置的通知 API (`vscode.window.showInformationMessage`) 来提示用户任务完成。这种方式存在以下问题:
|
||||
|
||||
- **可见性问题**: 用户切换到其他应用时,无法看到 VS Code 内部的通知
|
||||
- **错过通知**: 长时间运行的任务(如 iverilog 仿真)完成时,用户可能已经离开 VS Code
|
||||
- **用户体验**: 需要用户主动回到 VS Code 才能知道任务状态
|
||||
|
||||
### 1.2 目标
|
||||
|
||||
实现系统级通知功能,使得:
|
||||
|
||||
1. 用户在任何应用中都能收到任务完成通知
|
||||
2. 通知显示在操作系统的通知中心(Windows Action Center / macOS Notification Center / Linux notify-send)
|
||||
3. 支持自定义通知内容、图标、声音
|
||||
4. 用户可以配置是否启用系统通知
|
||||
|
||||
---
|
||||
|
||||
## 2. 技术方案对比
|
||||
|
||||
### 2.1 方案一:node-notifier(推荐)
|
||||
|
||||
**描述**: 使用 `node-notifier` 库,封装了各平台的原生通知 API
|
||||
|
||||
**优点**:
|
||||
- ✅ 跨平台支持(Windows/macOS/Linux)
|
||||
- ✅ API 简单易用
|
||||
- ✅ 支持自定义图标、声音、操作按钮
|
||||
- ✅ 活跃维护,社区支持良好
|
||||
- ✅ 支持通知点击回调
|
||||
|
||||
**缺点**:
|
||||
- ❌ 需要添加额外依赖(~500KB)
|
||||
- ❌ 首次使用需要用户授权
|
||||
|
||||
**适用场景**: 需要跨平台支持的生产环境
|
||||
|
||||
---
|
||||
|
||||
### 2.2 方案二:Windows PowerShell Toast 通知
|
||||
|
||||
**描述**: 使用 PowerShell 脚本调用 Windows 10/11 的 Toast 通知 API
|
||||
|
||||
**优点**:
|
||||
- ✅ 无需额外依赖
|
||||
- ✅ 支持丰富的 Toast 样式(按钮、输入框等)
|
||||
- ✅ 与 Windows 系统深度集成
|
||||
|
||||
**缺点**:
|
||||
- ❌ 仅支持 Windows 10/11
|
||||
- ❌ 需要执行 PowerShell 脚本,可能有安全限制
|
||||
- ❌ 实现复杂度较高
|
||||
|
||||
**适用场景**: 仅针对 Windows 平台的专用功能
|
||||
|
||||
---
|
||||
|
||||
### 2.3 方案三:Electron Notification API
|
||||
|
||||
**描述**: 使用 Electron 的 `Notification` API(VS Code 基于 Electron)
|
||||
|
||||
**优点**:
|
||||
- ✅ 无需额外依赖
|
||||
- ✅ 跨平台支持
|
||||
- ✅ API 简洁
|
||||
|
||||
**缺点**:
|
||||
- ❌ VS Code 扩展 API 未直接暴露 Electron API
|
||||
- ❌ 需要通过 `@vscode/webview-ui-toolkit` 或其他方式间接调用
|
||||
- ❌ 可能存在兼容性问题
|
||||
|
||||
**适用场景**: 理论可行,但实际受限于 VS Code 扩展沙箱
|
||||
|
||||
---
|
||||
|
||||
### 2.4 方案四:结合 VS Code 通知 + 系统通知
|
||||
|
||||
**描述**: 同时使用 VS Code 内置通知和系统通知
|
||||
|
||||
**优点**:
|
||||
- ✅ 双重保障,覆盖所有场景
|
||||
- ✅ 用户在 VS Code 内外都能看到
|
||||
|
||||
**缺点**:
|
||||
- ❌ 可能显得冗余
|
||||
- ❌ 需要处理两种通知的协调逻辑
|
||||
|
||||
**适用场景**: 对通知可靠性要求极高的场景
|
||||
|
||||
---
|
||||
|
||||
### 2.5 方案对比表
|
||||
|
||||
| 方案 | 跨平台 | 依赖大小 | 实现难度 | 用户体验 | 推荐度 |
|
||||
|------|--------|----------|----------|----------|--------|
|
||||
| node-notifier | ✅ | ~500KB | ⭐ 低 | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ |
|
||||
| PowerShell Toast | ❌ Windows Only | 0 | ⭐⭐⭐ 高 | ⭐⭐⭐⭐ | ⭐⭐ |
|
||||
| Electron API | ✅ | 0 | ⭐⭐⭐⭐ 很高 | ⭐⭐⭐ | ⭐ |
|
||||
| 双重通知 | ✅ | ~500KB | ⭐⭐ 中 | ⭐⭐⭐⭐ | ⭐⭐⭐ |
|
||||
|
||||
---
|
||||
|
||||
## 3. 推荐方案详解
|
||||
|
||||
### 3.1 选择 node-notifier 的理由
|
||||
|
||||
1. **成熟稳定**: 被广泛使用(npm 周下载量 > 200 万)
|
||||
2. **跨平台**: 自动适配不同操作系统的通知机制
|
||||
3. **功能丰富**: 支持图标、声音、操作按钮、回调
|
||||
4. **易于集成**: 与 VS Code 扩展开发无缝集成
|
||||
|
||||
### 3.2 node-notifier 工作原理
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ IC Coder Extension │
|
||||
│ ┌────────────────────────────────────────────────────────┐ │
|
||||
│ │ notificationService.ts │ │
|
||||
│ │ ┌──────────────────────────────────────────────────┐ │ │
|
||||
│ │ │ sendSystemNotification(title, message, options) │ │ │
|
||||
│ │ └──────────────────┬───────────────────────────────┘ │ │
|
||||
│ └────────────────────┼──────────────────────────────────┘ │
|
||||
└────────────────────────┼─────────────────────────────────────┘
|
||||
│
|
||||
▼
|
||||
┌──────────────────────┐
|
||||
│ node-notifier │
|
||||
│ (跨平台适配层) │
|
||||
└──────────┬───────────┘
|
||||
│
|
||||
┌───────────────┼───────────────┐
|
||||
│ │ │
|
||||
▼ ▼ ▼
|
||||
┌─────────┐ ┌──────────┐ ┌──────────┐
|
||||
│ Windows │ │ macOS │ │ Linux │
|
||||
│ Toast │ │ NSUser │ │ notify- │
|
||||
│ Notif. │ │ Notif. │ │ send │
|
||||
└─────────┘ └──────────┘ └──────────┘
|
||||
```
|
||||
|
||||
### 3.3 各平台通知效果
|
||||
|
||||
#### Windows 10/11
|
||||
- 显示在右下角 Action Center
|
||||
- 支持应用图标、标题、消息、操作按钮
|
||||
- 可以播放系统声音
|
||||
- 通知历史保存在通知中心
|
||||
|
||||
#### macOS
|
||||
- 显示在右上角 Notification Center
|
||||
- 支持应用图标、标题、副标题、消息
|
||||
- 可以播放系统声音
|
||||
- 支持回复和操作按钮
|
||||
|
||||
#### Linux
|
||||
- 使用 `notify-send` 或 `libnotify`
|
||||
- 显示位置取决于桌面环境(GNOME/KDE/XFCE)
|
||||
- 支持图标、标题、消息、紧急程度
|
||||
|
||||
---
|
||||
|
||||
## 4. 实现步骤
|
||||
|
||||
### 4.1 安装依赖
|
||||
|
||||
```bash
|
||||
# 安装 node-notifier
|
||||
pnpm add node-notifier
|
||||
|
||||
# 安装类型定义
|
||||
pnpm add -D @types/node-notifier
|
||||
```
|
||||
|
||||
### 4.2 创建通知服务模块
|
||||
|
||||
创建 `src/services/notificationService.ts`
|
||||
|
||||
```typescript
|
||||
import * as notifier from 'node-notifier';
|
||||
import * as path from 'path';
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
/**
|
||||
* 通知类型枚举
|
||||
*/
|
||||
export enum NotificationType {
|
||||
INFO = 'info',
|
||||
SUCCESS = 'success',
|
||||
WARNING = 'warning',
|
||||
ERROR = 'error'
|
||||
}
|
||||
|
||||
/**
|
||||
* 通知选项接口
|
||||
*/
|
||||
export interface NotificationOptions {
|
||||
/** 通知标题 */
|
||||
title: string;
|
||||
/** 通知消息 */
|
||||
message: string;
|
||||
/** 通知类型 */
|
||||
type?: NotificationType;
|
||||
/** 是否播放声音 */
|
||||
sound?: boolean;
|
||||
/** 超时时间(秒),0 表示不自动消失 */
|
||||
timeout?: number;
|
||||
/** 自定义图标路径 */
|
||||
icon?: string;
|
||||
/** 点击通知时的回调 */
|
||||
onClick?: () => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 系统通知服务类
|
||||
*/
|
||||
export class NotificationService {
|
||||
private static instance: NotificationService;
|
||||
private readonly extensionPath: string;
|
||||
private readonly iconPath: string;
|
||||
|
||||
private constructor(context: vscode.ExtensionContext) {
|
||||
this.extensionPath = context.extensionPath;
|
||||
this.iconPath = path.join(this.extensionPath, 'resources', 'icon.png');
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取单例实例
|
||||
*/
|
||||
public static getInstance(context?: vscode.ExtensionContext): NotificationService {
|
||||
if (!NotificationService.instance && context) {
|
||||
NotificationService.instance = new NotificationService(context);
|
||||
}
|
||||
return NotificationService.instance;
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查是否启用系统通知
|
||||
*/
|
||||
private isSystemNotificationEnabled(): boolean {
|
||||
const config = vscode.workspace.getConfiguration('ic-coder');
|
||||
return config.get<boolean>('enableSystemNotification', true);
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送系统通知
|
||||
*/
|
||||
public sendNotification(options: NotificationOptions): void {
|
||||
// 检查用户配置
|
||||
if (!this.isSystemNotificationEnabled()) {
|
||||
console.log('[NotificationService] 系统通知已禁用');
|
||||
return;
|
||||
}
|
||||
|
||||
const {
|
||||
title,
|
||||
message,
|
||||
type = NotificationType.INFO,
|
||||
sound = true,
|
||||
timeout = 10,
|
||||
icon,
|
||||
onClick
|
||||
} = options;
|
||||
|
||||
// 准备通知参数
|
||||
const notificationConfig: notifier.Notification = {
|
||||
title: title,
|
||||
message: message,
|
||||
icon: icon || this.iconPath,
|
||||
sound: sound,
|
||||
wait: false,
|
||||
timeout: timeout,
|
||||
appID: 'IC Coder' // Windows 10/11 需要
|
||||
};
|
||||
|
||||
// 发送通知
|
||||
notifier.notify(notificationConfig, (err, response, metadata) => {
|
||||
if (err) {
|
||||
console.error('[NotificationService] 通知发送失败:', err);
|
||||
// 降级到 VS Code 内置通知
|
||||
this.fallbackToVSCodeNotification(title, message, type);
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('[NotificationService] 通知已发送:', response, metadata);
|
||||
});
|
||||
|
||||
// 监听通知点击事件
|
||||
if (onClick) {
|
||||
notifier.on('click', (notifierObject, options, event) => {
|
||||
onClick();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 降级到 VS Code 内置通知
|
||||
*/
|
||||
private fallbackToVSCodeNotification(
|
||||
title: string,
|
||||
message: string,
|
||||
type: NotificationType
|
||||
): void {
|
||||
const fullMessage = `${title}: ${message}`;
|
||||
|
||||
switch (type) {
|
||||
case NotificationType.ERROR:
|
||||
vscode.window.showErrorMessage(fullMessage);
|
||||
break;
|
||||
case NotificationType.WARNING:
|
||||
vscode.window.showWarningMessage(fullMessage);
|
||||
break;
|
||||
case NotificationType.SUCCESS:
|
||||
case NotificationType.INFO:
|
||||
default:
|
||||
vscode.window.showInformationMessage(fullMessage);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送成功通知
|
||||
*/
|
||||
public success(title: string, message: string, onClick?: () => void): void {
|
||||
this.sendNotification({
|
||||
title,
|
||||
message,
|
||||
type: NotificationType.SUCCESS,
|
||||
sound: true,
|
||||
timeout: 10,
|
||||
onClick
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送错误通知
|
||||
*/
|
||||
public error(title: string, message: string, onClick?: () => void): void {
|
||||
this.sendNotification({
|
||||
title,
|
||||
message,
|
||||
type: NotificationType.ERROR,
|
||||
sound: true,
|
||||
timeout: 15,
|
||||
onClick
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送警告通知
|
||||
*/
|
||||
public warning(title: string, message: string, onClick?: () => void): void {
|
||||
this.sendNotification({
|
||||
title,
|
||||
message,
|
||||
type: NotificationType.WARNING,
|
||||
sound: true,
|
||||
timeout: 10,
|
||||
onClick
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送信息通知
|
||||
*/
|
||||
public info(title: string, message: string, onClick?: () => void): void {
|
||||
this.sendNotification({
|
||||
title,
|
||||
message,
|
||||
type: NotificationType.INFO,
|
||||
sound: false,
|
||||
timeout: 8,
|
||||
onClick
|
||||
});
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 4.3 在扩展入口初始化服务
|
||||
|
||||
修改 `src/extension.ts`
|
||||
|
||||
```typescript
|
||||
import { NotificationService } from './services/notificationService';
|
||||
|
||||
export function activate(context: vscode.ExtensionContext) {
|
||||
// 初始化通知服务
|
||||
const notificationService = NotificationService.getInstance(context);
|
||||
|
||||
// ... 其他初始化代码
|
||||
}
|
||||
```
|
||||
|
||||
### 4.4 在消息处理器中使用
|
||||
|
||||
修改 `src/utils/messageHandler.ts`
|
||||
|
||||
```typescript
|
||||
import { NotificationService } from '../services/notificationService';
|
||||
|
||||
// 在适当的位置添加通知
|
||||
export async function handleMessage(message: any, panel: vscode.WebviewPanel) {
|
||||
const notificationService = NotificationService.getInstance();
|
||||
|
||||
// 示例:iverilog 仿真完成
|
||||
if (message.type === 'simulationComplete') {
|
||||
notificationService.success(
|
||||
'IC Coder - 仿真完成',
|
||||
'iverilog 仿真已成功完成,VCD 文件已生成',
|
||||
() => {
|
||||
// 点击通知时聚焦到 VS Code
|
||||
vscode.window.showTextDocument(vscode.window.activeTextEditor!.document);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// 示例:仿真失败
|
||||
if (message.type === 'simulationError') {
|
||||
notificationService.error(
|
||||
'IC Coder - 仿真失败',
|
||||
`仿真过程中发生错误: ${message.error}`,
|
||||
() => {
|
||||
// 点击通知时打开输出面板
|
||||
panel.reveal();
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 4.5 添加配置项
|
||||
|
||||
修改 `package.json`
|
||||
|
||||
```json
|
||||
{
|
||||
"contributes": {
|
||||
"configuration": {
|
||||
"title": "IC Coder",
|
||||
"properties": {
|
||||
"ic-coder.enableSystemNotification": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "启用系统级通知(任务完成时显示操作系统通知)"
|
||||
},
|
||||
"ic-coder.notificationSound": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "通知时播放系统声音"
|
||||
},
|
||||
"ic-coder.notificationTimeout": {
|
||||
"type": "number",
|
||||
"default": 10,
|
||||
"minimum": 0,
|
||||
"maximum": 60,
|
||||
"description": "通知自动消失时间(秒),0 表示不自动消失"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. API 设计
|
||||
|
||||
### 5.1 核心 API
|
||||
|
||||
#### `NotificationService.getInstance(context?)`
|
||||
|
||||
获取通知服务单例实例
|
||||
|
||||
**参数**:
|
||||
- `context` (可选): `vscode.ExtensionContext` - 扩展上下文,首次调用时必须提供
|
||||
|
||||
**返回**: `NotificationService` 实例
|
||||
|
||||
**示例**:
|
||||
```typescript
|
||||
const notificationService = NotificationService.getInstance(context);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
#### `sendNotification(options)`
|
||||
|
||||
发送自定义通知
|
||||
|
||||
**参数**:
|
||||
- `options`: `NotificationOptions` - 通知选项对象
|
||||
|
||||
**返回**: `void`
|
||||
|
||||
**示例**:
|
||||
```typescript
|
||||
notificationService.sendNotification({
|
||||
title: 'IC Coder',
|
||||
message: '任务已完成',
|
||||
type: NotificationType.SUCCESS,
|
||||
sound: true,
|
||||
timeout: 10,
|
||||
onClick: () => {
|
||||
console.log('用户点击了通知');
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
#### `success(title, message, onClick?)`
|
||||
|
||||
发送成功通知(快捷方法)
|
||||
|
||||
**参数**:
|
||||
- `title`: `string` - 通知标题
|
||||
- `message`: `string` - 通知消息
|
||||
- `onClick` (可选): `() => void` - 点击回调
|
||||
|
||||
**示例**:
|
||||
```typescript
|
||||
notificationService.success(
|
||||
'IC Coder',
|
||||
'VCD 文件生成成功',
|
||||
() => panel.reveal()
|
||||
);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
#### `error(title, message, onClick?)`
|
||||
|
||||
发送错误通知(快捷方法)
|
||||
|
||||
**参数**:
|
||||
- `title`: `string` - 通知标题
|
||||
- `message`: `string` - 通知消息
|
||||
- `onClick` (可选): `() => void` - 点击回调
|
||||
|
||||
**示例**:
|
||||
```typescript
|
||||
notificationService.error(
|
||||
'IC Coder',
|
||||
'编译失败: 语法错误',
|
||||
() => vscode.commands.executeCommand('workbench.action.showErrorsWarnings')
|
||||
);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
#### `warning(title, message, onClick?)`
|
||||
|
||||
发送警告通知(快捷方法)
|
||||
|
||||
---
|
||||
|
||||
#### `info(title, message, onClick?)`
|
||||
|
||||
发送信息通知(快捷方法)
|
||||
|
||||
---
|
||||
|
||||
### 5.2 类型定义
|
||||
|
||||
```typescript
|
||||
enum NotificationType {
|
||||
INFO = 'info',
|
||||
SUCCESS = 'success',
|
||||
WARNING = 'warning',
|
||||
ERROR = 'error'
|
||||
}
|
||||
|
||||
interface NotificationOptions {
|
||||
title: string;
|
||||
message: string;
|
||||
type?: NotificationType;
|
||||
sound?: boolean;
|
||||
timeout?: number;
|
||||
icon?: string;
|
||||
onClick?: () => void;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 6. 配置选项
|
||||
|
||||
### 6.1 用户配置项
|
||||
|
||||
| 配置项 | 类型 | 默认值 | 说明 |
|
||||
|--------|------|--------|------|
|
||||
| `ic-coder.enableSystemNotification` | `boolean` | `true` | 是否启用系统通知 |
|
||||
| `ic-coder.notificationSound` | `boolean` | `true` | 是否播放通知声音 |
|
||||
| `ic-coder.notificationTimeout` | `number` | `10` | 通知自动消失时间(秒) |
|
||||
|
||||
### 6.2 配置方式
|
||||
|
||||
#### 方式 1: VS Code 设置界面
|
||||
|
||||
1. 打开 VS Code 设置 (`Ctrl+,` / `Cmd+,`)
|
||||
2. 搜索 "IC Coder"
|
||||
3. 找到 "Enable System Notification" 选项
|
||||
4. 勾选或取消勾选
|
||||
|
||||
#### 方式 2: settings.json
|
||||
|
||||
```json
|
||||
{
|
||||
"ic-coder.enableSystemNotification": true,
|
||||
"ic-coder.notificationSound": true,
|
||||
"ic-coder.notificationTimeout": 10
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 7. 测试方案
|
||||
|
||||
### 7.1 单元测试
|
||||
|
||||
创建 `src/test/suite/notificationService.test.ts`
|
||||
|
||||
```typescript
|
||||
import * as assert from 'assert';
|
||||
import * as vscode from 'vscode';
|
||||
import { NotificationService, NotificationType } from '../../services/notificationService';
|
||||
|
||||
suite('NotificationService Test Suite', () => {
|
||||
let notificationService: NotificationService;
|
||||
|
||||
suiteSetup(() => {
|
||||
const context = {
|
||||
extensionPath: __dirname
|
||||
} as vscode.ExtensionContext;
|
||||
notificationService = NotificationService.getInstance(context);
|
||||
});
|
||||
|
||||
test('应该成功创建单例实例', () => {
|
||||
const instance1 = NotificationService.getInstance();
|
||||
const instance2 = NotificationService.getInstance();
|
||||
assert.strictEqual(instance1, instance2);
|
||||
});
|
||||
|
||||
test('应该发送成功通知', (done) => {
|
||||
notificationService.success('测试标题', '测试消息');
|
||||
setTimeout(() => done(), 1000);
|
||||
});
|
||||
});
|
||||
```
|
||||
|
||||
### 7.2 手动测试清单
|
||||
|
||||
#### Windows 测试
|
||||
- [ ] 通知显示在 Action Center
|
||||
- [ ] 点击通知能够聚焦到 VS Code
|
||||
- [ ] 通知声音正常播放
|
||||
- [ ] 通知图标正确显示
|
||||
- [ ] 通知在设定时间后自动消失
|
||||
- [ ] 禁用系统通知后不再显示
|
||||
|
||||
---
|
||||
|
||||
## 8. 注意事项
|
||||
|
||||
### 8.1 权限问题
|
||||
|
||||
**Windows**:
|
||||
- 首次使用时,Windows 可能会弹出权限请求
|
||||
- 用户需要在"设置 > 系统 > 通知和操作"中允许应用通知
|
||||
|
||||
**macOS**:
|
||||
- 需要在"系统偏好设置 > 通知"中允许 VS Code 发送通知
|
||||
|
||||
**Linux**:
|
||||
- 需要安装 `libnotify-bin` 包
|
||||
- 不同桌面环境的通知样式可能不同
|
||||
|
||||
### 8.2 通知频率控制
|
||||
|
||||
为避免通知轰炸,建议实现防抖机制:
|
||||
|
||||
```typescript
|
||||
export class NotificationService {
|
||||
private lastNotificationTime: Map<string, number> = new Map();
|
||||
private readonly DEBOUNCE_INTERVAL = 3000; // 3 秒
|
||||
|
||||
private shouldSendNotification(key: string): boolean {
|
||||
const now = Date.now();
|
||||
const lastTime = this.lastNotificationTime.get(key) || 0;
|
||||
|
||||
if (now - lastTime < this.DEBOUNCE_INTERVAL) {
|
||||
return false;
|
||||
}
|
||||
|
||||
this.lastNotificationTime.set(key, now);
|
||||
return true;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 8.3 错误处理
|
||||
|
||||
通知发送失败时,自动降级到 VS Code 内置通知。
|
||||
|
||||
### 8.4 安全考虑
|
||||
|
||||
- **不要在通知中显示敏感信息**(如 token、密码)
|
||||
- **验证通知内容**,防止 XSS 攻击
|
||||
- **限制通知频率**,防止滥用
|
||||
|
||||
---
|
||||
|
||||
## 9. 常见问题
|
||||
|
||||
### 9.1 通知不显示
|
||||
|
||||
**问题**: 调用通知 API 后,系统没有显示通知
|
||||
|
||||
**可能原因**:
|
||||
1. 用户禁用了系统通知权限
|
||||
2. 操作系统的"勿扰模式"已启用
|
||||
3. `node-notifier` 安装失败或版本不兼容
|
||||
|
||||
**解决方案**:
|
||||
```typescript
|
||||
// 添加调试日志
|
||||
notifier.notify(notificationConfig, (err, response, metadata) => {
|
||||
if (err) {
|
||||
console.error('[NotificationService] 错误:', err);
|
||||
} else {
|
||||
console.log('[NotificationService] 响应:', response);
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
### 9.2 通知点击回调不触发
|
||||
|
||||
**问题**: 点击通知后,`onClick` 回调没有执行
|
||||
|
||||
**解决方案**:
|
||||
```typescript
|
||||
// 设置 wait: true
|
||||
const notificationConfig: notifier.Notification = {
|
||||
title: title,
|
||||
message: message,
|
||||
wait: true, // 等待用户交互
|
||||
};
|
||||
```
|
||||
|
||||
### 9.3 通知图标不显示
|
||||
|
||||
**问题**: 通知显示时没有自定义图标
|
||||
|
||||
**解决方案**:
|
||||
```typescript
|
||||
import * as fs from 'fs';
|
||||
|
||||
// 检查图标是否存在
|
||||
if (!fs.existsSync(this.iconPath)) {
|
||||
console.warn(`图标文件不存在: ${this.iconPath}`);
|
||||
this.iconPath = ''; // 使用系统默认图标
|
||||
}
|
||||
```
|
||||
|
||||
### 9.4 Linux 上通知不工作
|
||||
|
||||
**问题**: 在 Linux 系统上通知无法显示
|
||||
|
||||
**解决方案**:
|
||||
```bash
|
||||
# Ubuntu/Debian
|
||||
sudo apt-get install libnotify-bin
|
||||
|
||||
# Fedora/RHEL
|
||||
sudo dnf install libnotify
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 10. 最佳实践
|
||||
|
||||
### 10.1 通知时机
|
||||
|
||||
**推荐发送通知的场景**:
|
||||
- ✅ 长时间运行的任务完成(> 10 秒)
|
||||
- ✅ 后台任务完成(用户可能已切换到其他应用)
|
||||
- ✅ 发生错误需要用户关注
|
||||
- ✅ 重要状态变更
|
||||
|
||||
**不推荐发送通知的场景**:
|
||||
- ❌ 即时完成的操作(< 3 秒)
|
||||
- ❌ 用户主动触发且立即完成的操作
|
||||
- ❌ 频繁发生的事件(如自动保存)
|
||||
- ❌ 调试信息或日志
|
||||
|
||||
### 10.2 通知内容
|
||||
|
||||
**标题**:
|
||||
- 简洁明了,不超过 20 个字符
|
||||
- 包含应用名称(如 "IC Coder - 仿真完成")
|
||||
- 使用动作完成时态("已完成" 而不是 "完成中")
|
||||
|
||||
**消息**:
|
||||
- 提供具体信息,不超过 100 个字符
|
||||
- 包含关键细节(如文件名、错误类型)
|
||||
- 避免技术术语,使用用户友好的语言
|
||||
|
||||
**示例**:
|
||||
```typescript
|
||||
// ✅ 好的通知
|
||||
notificationService.success(
|
||||
'IC Coder - 仿真完成',
|
||||
'testbench.v 仿真成功,VCD 文件已生成'
|
||||
);
|
||||
|
||||
// ❌ 不好的通知
|
||||
notificationService.success('完成', '操作已完成');
|
||||
```
|
||||
|
||||
### 10.3 通知优先级
|
||||
|
||||
根据重要性设置不同的通知类型和超时时间:
|
||||
|
||||
```typescript
|
||||
// 高优先级:错误(15 秒)
|
||||
notificationService.error(
|
||||
'IC Coder - 编译失败',
|
||||
'发现 3 个语法错误,请检查代码'
|
||||
);
|
||||
|
||||
// 中优先级:警告(10 秒)
|
||||
notificationService.warning(
|
||||
'IC Coder - 警告',
|
||||
'仿真时间过长,可能存在死循环'
|
||||
);
|
||||
|
||||
// 低优先级:信息(8 秒,无声音)
|
||||
notificationService.info(
|
||||
'IC Coder - 提示',
|
||||
'已自动保存工作区'
|
||||
);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 11. 性能指标
|
||||
|
||||
### 11.1 预期性能
|
||||
|
||||
| 指标 | 目标值 | 说明 |
|
||||
|------|--------|------|
|
||||
| 通知发送延迟 | < 100ms | 从调用到系统显示 |
|
||||
| 内存占用 | < 5MB | 通知服务常驻内存 |
|
||||
| CPU 占用 | < 1% | 空闲时 CPU 使用率 |
|
||||
| 包体积增加 | ~500KB | node-notifier 依赖 |
|
||||
|
||||
---
|
||||
|
||||
## 12. 参考资料
|
||||
|
||||
### 12.1 官方文档
|
||||
|
||||
- [node-notifier GitHub](https://github.com/mikaelbr/node-notifier)
|
||||
- [VS Code Extension API](https://code.visualstudio.com/api)
|
||||
- [Windows Toast Notifications](https://docs.microsoft.com/en-us/windows/apps/design/shell/tiles-and-notifications/toast-notifications-overview)
|
||||
|
||||
### 12.2 相关文章
|
||||
|
||||
- [Best Practices for Desktop Notifications](https://web.dev/notifications/)
|
||||
- [Designing Better Notifications](https://uxdesign.cc/designing-better-notifications-36ba9c0b3e0e)
|
||||
|
||||
---
|
||||
|
||||
## 13. 总结
|
||||
|
||||
本文档详细介绍了在 IC Coder 插件中实现系统级通知功能的完整方案,包括:
|
||||
|
||||
✅ **技术选型**: 选择 `node-notifier` 作为跨平台通知解决方案
|
||||
✅ **架构设计**: 单例模式的通知服务类,支持多种通知类型
|
||||
✅ **实现细节**: 完整的代码示例和配置说明
|
||||
✅ **测试方案**: 单元测试、集成测试和手动测试清单
|
||||
✅ **最佳实践**: 通知时机、内容设计和用户体验优化
|
||||
✅ **故障排查**: 常见问题和解决方案
|
||||
|
||||
通过实现系统级通知,IC Coder 插件能够在用户切换到其他应用时仍然及时通知任务状态,显著提升用户体验。
|
||||
|
||||
---
|
||||
|
||||
**文档版本**: v1.0
|
||||
**最后更新**: 2026-01-26
|
||||
**作者**: IC Coder Team
|
||||
**许可**: MIT License
|
||||
|
||||
277
docs/token-expiration-check.md
Normal file
@ -0,0 +1,277 @@
|
||||
# Token 过期检查实现方案
|
||||
|
||||
## 1. 概述
|
||||
|
||||
实现三个关键时机的 Token 过期检查:
|
||||
- 插件激活时
|
||||
- 发起 API 请求前
|
||||
- 用户交互时(打开面板/侧边栏)
|
||||
|
||||
## 2. 数据存储
|
||||
|
||||
### 2.1 存储位置
|
||||
使用 VS Code 的 `globalState` 存储:
|
||||
```typescript
|
||||
context.globalState.update('tokenExp', exp);
|
||||
```
|
||||
|
||||
### 2.2 存储内容
|
||||
- `token`: 用户 token
|
||||
- `tokenExp`: 过期时间戳(秒)
|
||||
- `userInfo`: 用户信息
|
||||
|
||||
## 3. 核心函数设计
|
||||
|
||||
### 3.1 过期检查函数
|
||||
```typescript
|
||||
/**
|
||||
* 检查 token 是否过期
|
||||
* @param exp - 过期时间戳(秒)
|
||||
* @param bufferSeconds - 提前判断过期的缓冲时间(默认 60 秒)
|
||||
* @returns true 表示已过期或即将过期
|
||||
*/
|
||||
function isTokenExpired(exp: number | undefined, bufferSeconds: number = 60): boolean {
|
||||
if (!exp) {
|
||||
return true; // 没有过期时间,视为已过期
|
||||
}
|
||||
|
||||
const now = Math.floor(Date.now() / 1000); // 当前时间戳(秒)
|
||||
return now >= (exp - bufferSeconds); // 提前 60 秒判断过期
|
||||
}
|
||||
```
|
||||
|
||||
### 3.2 清除登录状态函数
|
||||
```typescript
|
||||
/**
|
||||
* 清除所有登录相关状态
|
||||
*/
|
||||
async function clearAuthState(context: vscode.ExtensionContext): Promise<void> {
|
||||
await context.globalState.update('token', undefined);
|
||||
await context.globalState.update('tokenExp', undefined);
|
||||
await context.globalState.update('userInfo', undefined);
|
||||
}
|
||||
```
|
||||
|
||||
### 3.3 统一过期处理函数
|
||||
```typescript
|
||||
/**
|
||||
* 处理 token 过期情况
|
||||
* @param context - 扩展上下文
|
||||
* @param showMessage - 是否显示提示消息
|
||||
*/
|
||||
async function handleTokenExpired(
|
||||
context: vscode.ExtensionContext,
|
||||
showMessage: boolean = true
|
||||
): Promise<void> {
|
||||
await clearAuthState(context);
|
||||
|
||||
if (showMessage) {
|
||||
const action = await vscode.window.showWarningMessage(
|
||||
'登录已过期,请重新登录',
|
||||
'立即登录'
|
||||
);
|
||||
|
||||
if (action === '立即登录') {
|
||||
// 触发登录流程(打开登录面板)
|
||||
vscode.commands.executeCommand('ic-coder.openPanel');
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 4. 三个检查时机实现
|
||||
|
||||
### 4.1 插件激活时检查
|
||||
|
||||
**位置**: `src/extension.ts` 的 `activate` 函数
|
||||
|
||||
**实现**:
|
||||
```typescript
|
||||
export async function activate(context: vscode.ExtensionContext) {
|
||||
console.log('IC Coder 插件正在激活...');
|
||||
|
||||
// 1. 检查 token 是否过期
|
||||
const tokenExp = context.globalState.get<number>('tokenExp');
|
||||
if (isTokenExpired(tokenExp)) {
|
||||
// 静默清除,不显示提示(避免启动时打扰用户)
|
||||
await handleTokenExpired(context, false);
|
||||
}
|
||||
|
||||
// ... 其他激活逻辑
|
||||
}
|
||||
```
|
||||
|
||||
**说明**: 启动时静默检查,如果过期则清除状态,但不弹窗提示
|
||||
|
||||
---
|
||||
|
||||
### 4.2 发起 API 请求前检查
|
||||
|
||||
**位置**: `src/utils/messageHandler.ts` 的 API 请求函数
|
||||
|
||||
**实现**:
|
||||
```typescript
|
||||
// 在发送消息到后端前检查
|
||||
async function sendMessageToBackend(message: string, context: vscode.ExtensionContext) {
|
||||
// 1. 检查 token 是否过期
|
||||
const tokenExp = context.globalState.get<number>('tokenExp');
|
||||
if (isTokenExpired(tokenExp)) {
|
||||
await handleTokenExpired(context, true); // 显示提示
|
||||
return; // 中断请求
|
||||
}
|
||||
|
||||
const token = context.globalState.get<string>('token');
|
||||
if (!token) {
|
||||
vscode.window.showWarningMessage('请先登录');
|
||||
return;
|
||||
}
|
||||
|
||||
// 2. 继续发送请求
|
||||
// ... 原有请求逻辑
|
||||
}
|
||||
```
|
||||
|
||||
**说明**: 每次 API 请求前检查,如果过期则提示用户并中断请求
|
||||
|
||||
---
|
||||
|
||||
### 4.3 用户交互时检查
|
||||
|
||||
**位置**:
|
||||
- `src/panels/ICHelperPanel.ts` - 打开聊天面板时
|
||||
- `src/views/ICViewProvider.ts` - 侧边栏视图加载时
|
||||
|
||||
**实现 - 聊天面板**:
|
||||
```typescript
|
||||
// ICHelperPanel.ts
|
||||
public static render(extensionUri: vscode.Uri, context: vscode.ExtensionContext) {
|
||||
// 1. 检查 token 是否过期
|
||||
const tokenExp = context.globalState.get<number>('tokenExp');
|
||||
if (isTokenExpired(tokenExp)) {
|
||||
handleTokenExpired(context, true); // 显示提示
|
||||
// 继续渲染面板,但会显示未登录状态
|
||||
}
|
||||
|
||||
// 2. 创建或显示面板
|
||||
// ... 原有逻辑
|
||||
}
|
||||
```
|
||||
|
||||
**实现 - 侧边栏视图**:
|
||||
```typescript
|
||||
// ICViewProvider.ts
|
||||
public resolveWebviewView(webviewView: vscode.WebviewView) {
|
||||
// 1. 检查 token 是否过期
|
||||
const tokenExp = this._context.globalState.get<number>('tokenExp');
|
||||
if (isTokenExpired(tokenExp)) {
|
||||
handleTokenExpired(this._context, false); // 静默清除
|
||||
// 继续渲染,显示未登录状态
|
||||
}
|
||||
|
||||
// 2. 渲染视图
|
||||
// ... 原有逻辑
|
||||
}
|
||||
```
|
||||
|
||||
**说明**: 打开面板时检查,聊天面板显示提示,侧边栏静默处理
|
||||
|
||||
## 5. 后端响应处理
|
||||
|
||||
### 5.1 保存 exp 字段
|
||||
|
||||
**位置**: `src/utils/messageHandler.ts` 处理登录响应的地方
|
||||
|
||||
**实现**:
|
||||
```typescript
|
||||
// 处理登录成功响应
|
||||
if (response.data.token) {
|
||||
await context.globalState.update('token', response.data.token);
|
||||
|
||||
// 保存过期时间
|
||||
if (response.data.exp) {
|
||||
await context.globalState.update('tokenExp', response.data.exp);
|
||||
}
|
||||
|
||||
// 保存用户信息
|
||||
if (response.data.userInfo) {
|
||||
await context.globalState.update('userInfo', response.data.userInfo);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 5.2 处理 401 响应
|
||||
|
||||
**实现**:
|
||||
```typescript
|
||||
// API 请求错误处理
|
||||
if (error.response?.status === 401) {
|
||||
// 后端返回 401,说明 token 无效或过期
|
||||
await handleTokenExpired(context, true);
|
||||
return;
|
||||
}
|
||||
```
|
||||
|
||||
## 6. 工具函数位置
|
||||
|
||||
建议创建新文件 `src/utils/authHelper.ts`:
|
||||
|
||||
```typescript
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
export function isTokenExpired(exp: number | undefined, bufferSeconds: number = 60): boolean {
|
||||
if (!exp) {
|
||||
return true;
|
||||
}
|
||||
const now = Math.floor(Date.now() / 1000);
|
||||
return now >= (exp - bufferSeconds);
|
||||
}
|
||||
|
||||
export async function clearAuthState(context: vscode.ExtensionContext): Promise<void> {
|
||||
await context.globalState.update('token', undefined);
|
||||
await context.globalState.update('tokenExp', undefined);
|
||||
await context.globalState.update('userInfo', undefined);
|
||||
}
|
||||
|
||||
export async function handleTokenExpired(
|
||||
context: vscode.ExtensionContext,
|
||||
showMessage: boolean = true
|
||||
): Promise<void> {
|
||||
await clearAuthState(context);
|
||||
|
||||
if (showMessage) {
|
||||
const action = await vscode.window.showWarningMessage(
|
||||
'登录已过期,请重新登录',
|
||||
'立即登录'
|
||||
);
|
||||
|
||||
if (action === '立即登录') {
|
||||
vscode.commands.executeCommand('ic-coder.openPanel');
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 7. 测试场景
|
||||
|
||||
1. **启动测试**: 设置过期的 exp,重启插件,验证状态被清除
|
||||
2. **请求测试**: 设置即将过期的 exp,发送消息,验证被拦截
|
||||
3. **交互测试**: 设置过期的 exp,打开面板,验证提示显示
|
||||
4. **401 测试**: 模拟后端返回 401,验证状态清除
|
||||
|
||||
## 8. 注意事项
|
||||
|
||||
- 使用 60 秒缓冲时间,避免请求中途过期
|
||||
- 启动和侧边栏加载时静默处理,避免打扰用户
|
||||
- 主动操作(发消息、打开聊天面板)时显示提示
|
||||
- 所有时间戳使用秒为单位(与后端保持一致)
|
||||
- 过期检查应该在所有需要 token 的操作前执行
|
||||
|
||||
## 9. 修改文件清单
|
||||
|
||||
需要修改的文件:
|
||||
1. **新建**: `src/utils/authHelper.ts` - 认证辅助工具函数
|
||||
2. **修改**: `src/extension.ts` - 插件激活时检查
|
||||
3. **修改**: `src/utils/messageHandler.ts` - API 请求前检查 + 保存 exp + 处理 401
|
||||
4. **修改**: `src/panels/ICHelperPanel.ts` - 打开聊天面板时检查
|
||||
5. **修改**: `src/views/ICViewProvider.ts` - 侧边栏加载时检查
|
||||
|
||||
55
docs/webpack-optimization.md
Normal file
@ -0,0 +1,55 @@
|
||||
# Webpack 打包优化说明
|
||||
|
||||
## 优化内容
|
||||
|
||||
### 1. 自动模式切换
|
||||
- 开发模式:保持源码可读性
|
||||
- 生产模式:自动压缩代码
|
||||
|
||||
### 2. 性能优化
|
||||
- **Tree Shaking**:移除未使用的代码
|
||||
- **transpileOnly**:跳过类型检查,加快编译速度
|
||||
- **自动清理**:每次打包自动删除旧文件
|
||||
|
||||
### 3. 体积监控
|
||||
- 单文件超过 2MB 会发出警告
|
||||
- 帮助及时发现打包体积问题
|
||||
|
||||
## 使用方法
|
||||
|
||||
### 开发模式
|
||||
```bash
|
||||
# 编译(不压缩)
|
||||
pnpm run compile
|
||||
|
||||
# 监听模式(自动重新编译)
|
||||
pnpm run watch
|
||||
```
|
||||
|
||||
### 生产模式
|
||||
```bash
|
||||
# Windows
|
||||
set NODE_ENV=production && pnpm run package
|
||||
|
||||
# macOS/Linux
|
||||
NODE_ENV=production pnpm run package
|
||||
```
|
||||
|
||||
## 打包结果
|
||||
|
||||
- **输出目录**:`dist/`
|
||||
- **入口文件**:`dist/extension.js`
|
||||
- **静态资源**:`dist/assets/`
|
||||
|
||||
## 性能对比
|
||||
|
||||
| 模式 | 体积 | 编译速度 | Source Map |
|
||||
|------|------|----------|------------|
|
||||
| 开发 | 较大 | 快 | 完整 |
|
||||
| 生产 | 小 | 较慢 | 隐藏 |
|
||||
|
||||
## 注意事项
|
||||
|
||||
1. 开发时使用 `pnpm run watch`,修改代码自动重新编译
|
||||
2. 发布前必须使用生产模式打包
|
||||
3. 如果打包体积超过 2MB,检查是否引入了不必要的依赖
|
||||
751
docs/会话存储技术文档.md
Normal 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. **高性能**:分页加载,避免一次性加载大量数据
|
||||
|
||||
系统已经实现了核心的会话管理功能,包括任务创建、消息保存、历史查询等,为用户提供了完整的会话历史管理体验。
|
||||
783
docs/插件试用用户功能实现方案.md
Normal file
@ -0,0 +1,783 @@
|
||||
# 插件试用用户功能实现方案
|
||||
|
||||
## 1. 方案概述
|
||||
|
||||
**核心思路:**
|
||||
- Web 登录成功后只返回 token(保持现状)
|
||||
- 插件调用 `getUserInfo(token)` 时,后端返回的数据里包含标识字段
|
||||
- 前端根据该字段判断是否是插件试用用户
|
||||
- 插件试用用户:显示欢迎弹窗,不显示邀请码弹窗
|
||||
- 正式用户:显示邀请码弹窗(现有逻辑)
|
||||
|
||||
---
|
||||
|
||||
## 2. 后端需要做什么
|
||||
|
||||
### 2.1 在用户信息接口中添加字段
|
||||
|
||||
**接口:** `GET /system/user/getInfo`
|
||||
|
||||
**现有响应:**
|
||||
```json
|
||||
{
|
||||
"userId": "xxx",
|
||||
"username": "testuser",
|
||||
"nickname": "测试用户",
|
||||
"email": "test@example.com"
|
||||
}
|
||||
```
|
||||
|
||||
**新增字段:**
|
||||
|
||||
**方案 :添加 isPluginTrial 字段**
|
||||
|
||||
```json
|
||||
{
|
||||
"userId": "xxx",
|
||||
"username": "testuser",
|
||||
"nickname": "测试用户",
|
||||
"email": "test@example.com",
|
||||
"isPluginTrial": true, // ← 新增:是否是插件试用用户
|
||||
"pluginTrialExpiresAt": 1709654400000 // ← 新增:试用到期时间(毫秒时间戳)
|
||||
}
|
||||
```
|
||||
|
||||
### 2.2 后端逻辑说明
|
||||
|
||||
**判断逻辑:**
|
||||
```javascript
|
||||
// 伪代码
|
||||
function getUserInfo(userId) {
|
||||
const user = db.users.findById(userId);
|
||||
|
||||
// 判断是否是插件试用用户(后端自己的逻辑)
|
||||
const isPluginTrial = checkIfPluginTrialUser(user);
|
||||
|
||||
return {
|
||||
userId: user.id,
|
||||
username: user.username,
|
||||
nickname: user.nickname,
|
||||
email: user.email,
|
||||
isPluginTrial: isPluginTrial,
|
||||
pluginTrialExpiresAt: isPluginTrial ? user.trial_expires_at : null
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
**Token 过期时间:**
|
||||
- 插件试用用户:JWT Token 设置 15 天过期
|
||||
- 正式用户:JWT Token 设置 30 天过期(或现有逻辑)
|
||||
|
||||
---
|
||||
|
||||
## 3. 前端需要修改的地方
|
||||
|
||||
### 3.1 修改 UserInfo 接口
|
||||
|
||||
**文件:** `src/services/userService.ts`
|
||||
|
||||
**现有接口:**
|
||||
```typescript
|
||||
interface UserInfo {
|
||||
userId: string;
|
||||
username: string;
|
||||
nickname: string;
|
||||
email?: string;
|
||||
phonenumber?: string;
|
||||
avatar?: string;
|
||||
roles?: string[];
|
||||
permissions?: string[];
|
||||
createTime?: string;
|
||||
loginDate?: string;
|
||||
membership?: {
|
||||
tierCode: string;
|
||||
tierName: string;
|
||||
tierLevel: number;
|
||||
remainingDays?: number;
|
||||
monthlyCredits?: number;
|
||||
};
|
||||
credits?: number;
|
||||
}
|
||||
```
|
||||
|
||||
**新增字段:**
|
||||
```typescript
|
||||
interface UserInfo {
|
||||
// ... 现有字段
|
||||
isPluginTrial?: boolean; // ← 新增:是否是插件试用用户
|
||||
pluginTrialExpiresAt?: number; // ← 新增:试用到期时间(毫秒时间戳)
|
||||
membership?: {
|
||||
tierCode: string;
|
||||
tierName: string;
|
||||
tierLevel: number;
|
||||
remainingDays?: number;
|
||||
monthlyCredits?: number;
|
||||
};
|
||||
credits?: number;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 3.2 修改 onTokenReceived() 方法
|
||||
|
||||
**文件:** `src/services/userService.ts`
|
||||
|
||||
**现有代码位置:** 约 200 行左右
|
||||
|
||||
**修改内容:**
|
||||
```typescript
|
||||
async onTokenReceived(token: string) {
|
||||
// 现有逻辑:并行获取三类信息
|
||||
const [userInfo, membershipInfo, credits] = await Promise.all([
|
||||
getUserInfo(token),
|
||||
getMembershipInfo(token),
|
||||
fetchBalanceWithToken(token)
|
||||
]);
|
||||
|
||||
// 合并数据
|
||||
const fullUserInfo = {
|
||||
...userInfo,
|
||||
membership: membershipInfo,
|
||||
credits: credits
|
||||
};
|
||||
|
||||
// 保存到 globalState
|
||||
await this.context.globalState.update('icCoderUserInfo', fullUserInfo);
|
||||
|
||||
// ========== 新增逻辑 ==========
|
||||
// 判断是否是插件试用用户
|
||||
if (fullUserInfo.isPluginTrial === true) {
|
||||
// 插件试用用户:显示欢迎弹窗,不显示邀请码弹窗
|
||||
await this.showWelcomePanel();
|
||||
// 标记为已显示欢迎弹窗(避免重复显示)
|
||||
await this.context.globalState.update('pluginTrialWelcomed', true);
|
||||
} else {
|
||||
// 正式用户:显示邀请码弹窗(现有逻辑)
|
||||
await this.checkAndShowInvitationModal();
|
||||
}
|
||||
// ========== 新增逻辑结束 ==========
|
||||
|
||||
return fullUserInfo;
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 3.3 新增欢迎弹窗面板
|
||||
|
||||
**新建文件:** `src/panels/WelcomePanel.ts`
|
||||
|
||||
```typescript
|
||||
/**
|
||||
* 欢迎引导面板
|
||||
* 功能:插件试用用户首次登录显示使用教程
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
export class WelcomePanel {
|
||||
public static currentPanel: WelcomePanel | undefined;
|
||||
private readonly _panel: vscode.WebviewPanel;
|
||||
private _disposables: vscode.Disposable[] = [];
|
||||
|
||||
private constructor(panel: vscode.WebviewPanel) {
|
||||
this._panel = panel;
|
||||
this._panel.webview.html = this.getHtmlContent();
|
||||
|
||||
// 监听关闭事件
|
||||
this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
|
||||
}
|
||||
|
||||
public static render(context: vscode.ExtensionContext) {
|
||||
// 避免重复显示
|
||||
if (WelcomePanel.currentPanel) {
|
||||
WelcomePanel.currentPanel._panel.reveal(vscode.ViewColumn.One);
|
||||
return;
|
||||
}
|
||||
|
||||
const panel = vscode.window.createWebviewPanel(
|
||||
'icCoderWelcome',
|
||||
'欢迎使用 IC Coder',
|
||||
vscode.ViewColumn.One,
|
||||
{
|
||||
enableScripts: true,
|
||||
retainContextWhenHidden: true
|
||||
}
|
||||
);
|
||||
|
||||
WelcomePanel.currentPanel = new WelcomePanel(panel);
|
||||
}
|
||||
|
||||
private getHtmlContent(): string {
|
||||
return `
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>欢迎使用 IC Coder</title>
|
||||
<style>
|
||||
body {
|
||||
padding: 40px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
line-height: 1.6;
|
||||
color: var(--vscode-foreground);
|
||||
background-color: var(--vscode-editor-background);
|
||||
}
|
||||
h1 {
|
||||
color: var(--vscode-textLink-foreground);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.welcome-message {
|
||||
font-size: 16px;
|
||||
margin-bottom: 30px;
|
||||
color: var(--vscode-descriptionForeground);
|
||||
}
|
||||
.step {
|
||||
margin: 20px 0;
|
||||
padding: 20px;
|
||||
background: var(--vscode-editor-inactiveSelectionBackground);
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid var(--vscode-textLink-foreground);
|
||||
}
|
||||
.step h3 {
|
||||
margin-top: 0;
|
||||
color: var(--vscode-textLink-foreground);
|
||||
}
|
||||
.step p {
|
||||
margin: 10px 0;
|
||||
}
|
||||
.button {
|
||||
padding: 12px 24px;
|
||||
background: var(--vscode-button-background);
|
||||
color: var(--vscode-button-foreground);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.button:hover {
|
||||
background: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>🎉 欢迎使用 IC Coder!</h1>
|
||||
<p class="welcome-message">
|
||||
您已成功激活 15 天试用期,让我们开始探索 IC Coder 的强大功能吧!
|
||||
</p>
|
||||
|
||||
<div class="step">
|
||||
<h3>📝 步骤 1:打开聊天面板</h3>
|
||||
<p>点击侧边栏的 IC Coder 图标,或使用命令面板搜索 "IC Coder: Open Chat"</p>
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<h3>💬 步骤 2:输入您的需求</h3>
|
||||
<p>描述您想要生成的 Verilog 代码或需要帮助的问题,AI 将为您提供专业的解决方案</p>
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<h3>🔬 步骤 3:运行仿真</h3>
|
||||
<p>使用 "生成 VCD" 命令运行 iverilog 仿真,并通过波形查看器查看仿真结果</p>
|
||||
</div>
|
||||
|
||||
<button class="button" onclick="close()">开始使用</button>
|
||||
|
||||
<script>
|
||||
function close() {
|
||||
// 通知 VS Code 关闭面板
|
||||
window.close();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
`;
|
||||
}
|
||||
|
||||
public dispose() {
|
||||
WelcomePanel.currentPanel = undefined;
|
||||
this._panel.dispose();
|
||||
while (this._disposables.length) {
|
||||
const disposable = this._disposables.pop();
|
||||
if (disposable) {
|
||||
disposable.dispose();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 3.4 新增过期提醒面板
|
||||
|
||||
**新建文件:** `src/panels/ExpiredPanel.ts`
|
||||
|
||||
```typescript
|
||||
/**
|
||||
* 试用期到期提醒面板
|
||||
* 功能:试用期到期时显示续费提示
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
export class ExpiredPanel {
|
||||
public static render() {
|
||||
const panel = vscode.window.createWebviewPanel(
|
||||
'icCoderExpired',
|
||||
'试用期已到期',
|
||||
vscode.ViewColumn.One,
|
||||
{ enableScripts: true }
|
||||
);
|
||||
|
||||
panel.webview.html = this.getHtmlContent();
|
||||
}
|
||||
|
||||
private static getHtmlContent(): string {
|
||||
return `
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
body {
|
||||
padding: 60px 40px;
|
||||
text-align: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
color: var(--vscode-foreground);
|
||||
background-color: var(--vscode-editor-background);
|
||||
}
|
||||
h1 {
|
||||
color: var(--vscode-errorForeground);
|
||||
font-size: 28px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
margin: 15px 0;
|
||||
color: var(--vscode-descriptionForeground);
|
||||
}
|
||||
.button {
|
||||
padding: 12px 30px;
|
||||
background: var(--vscode-button-background);
|
||||
color: var(--vscode-button-foreground);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
margin: 10px;
|
||||
}
|
||||
.button:hover {
|
||||
background: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>⏰ 您的试用期已到期</h1>
|
||||
<p>感谢您使用 IC Coder!您的 15 天试用期已结束。</p>
|
||||
<p>如需继续使用,请联系我们获取正式版本。</p>
|
||||
|
||||
<button class="button" onclick="contact()">联系我们</button>
|
||||
|
||||
<script>
|
||||
function contact() {
|
||||
// 可以打开联系页面或发送邮件
|
||||
window.open('https://iccoder.com/contact', '_blank');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
`;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 3.5 新增过期检测服务
|
||||
|
||||
**新建文件:** `src/services/trialExpirationService.ts`
|
||||
|
||||
```typescript
|
||||
/**
|
||||
* 试用期过期检测服务
|
||||
* 功能:检查插件试用用户是否过期
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
import { getUserInfo } from './userService';
|
||||
import { ExpiredPanel } from '../panels/ExpiredPanel';
|
||||
|
||||
export class TrialExpirationService {
|
||||
private context: vscode.ExtensionContext;
|
||||
|
||||
constructor(context: vscode.ExtensionContext) {
|
||||
this.context = context;
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查是否过期
|
||||
* @returns true=已过期,false=未过期
|
||||
*/
|
||||
public async checkExpiration(): Promise<boolean> {
|
||||
const userInfo = await getUserInfo();
|
||||
|
||||
// 不是插件试用用户,不需要检查
|
||||
if (!userInfo?.isPluginTrial) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// 没有过期时间,不检查
|
||||
if (!userInfo.pluginTrialExpiresAt) {
|
||||
return false;
|
||||
}
|
||||
|
||||
// 检查是否过期
|
||||
const now = Date.now();
|
||||
if (now >= userInfo.pluginTrialExpiresAt) {
|
||||
// 已过期
|
||||
await this.handleExpired();
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理过期逻辑
|
||||
*/
|
||||
private async handleExpired(): Promise<void> {
|
||||
// 显示过期弹窗
|
||||
ExpiredPanel.render();
|
||||
|
||||
// 清除本地数据(可选)
|
||||
// await this.context.globalState.update('icCoderUserInfo', undefined);
|
||||
// await this.context.globalState.update('icCoderSessions', undefined);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 3.6 在消息发送前检查过期
|
||||
|
||||
**文件:** `src/utils/messageHandler.ts`
|
||||
|
||||
**修改位置:** 在发送消息给后端之前添加过期检查
|
||||
|
||||
```typescript
|
||||
import { TrialExpirationService } from '../services/trialExpirationService';
|
||||
|
||||
// 在 handleUserMessage 或类似的消息处理函数中添加
|
||||
async function handleUserMessage(message: string, context: vscode.ExtensionContext) {
|
||||
// ========== 新增:检查试用期是否过期 ==========
|
||||
const trialService = new TrialExpirationService(context);
|
||||
const isExpired = await trialService.checkExpiration();
|
||||
|
||||
if (isExpired) {
|
||||
// 已过期,禁止使用
|
||||
return {
|
||||
success: false,
|
||||
message: '您的试用期已到期,请联系我们获取正式版本'
|
||||
};
|
||||
}
|
||||
// ========== 新增结束 ==========
|
||||
|
||||
// 现有的消息处理逻辑
|
||||
// ...
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 4. 完整的实现流程
|
||||
|
||||
### 4.1 登录流程(带过期检查)
|
||||
|
||||
```
|
||||
1. 用户点击登录
|
||||
↓
|
||||
2. 打开浏览器,Web 端登录
|
||||
↓
|
||||
3. 重定向回插件:http://localhost:{port}/callback?token={token}
|
||||
↓
|
||||
4. 插件调用 onTokenReceived(token)
|
||||
↓
|
||||
5. 并行获取:getUserInfo + getMembershipInfo + Credits
|
||||
↓
|
||||
6. 后端返回 userInfo(包含 isPluginTrial 和 pluginTrialExpiresAt)
|
||||
↓
|
||||
7. 判断 isPluginTrial === true?
|
||||
├─ 是:显示欢迎弹窗,不显示邀请码弹窗
|
||||
└─ 否:显示邀请码弹窗(现有逻辑)
|
||||
↓
|
||||
8. 保存用户信息到 globalState
|
||||
```
|
||||
|
||||
### 4.2 使用功能时的过期检查
|
||||
|
||||
```
|
||||
1. 用户发送消息/使用功能
|
||||
↓
|
||||
2. 调用 trialService.checkExpiration()
|
||||
↓
|
||||
3. 获取 userInfo,检查 isPluginTrial
|
||||
↓
|
||||
4. 如果是插件试用用户,检查 Date.now() >= pluginTrialExpiresAt?
|
||||
├─ 是:显示过期弹窗,禁止使用,返回 true
|
||||
└─ 否:允许使用,返回 false
|
||||
↓
|
||||
5. 继续正常的消息处理流程
|
||||
```
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 5. ⚠️ 潜在 Bug 和注意事项
|
||||
|
||||
### 5.1 时间同步问题
|
||||
|
||||
**问题:** 前端使用 `Date.now()` 判断过期,如果用户本地时间不准确会导致误判
|
||||
|
||||
**场景:**
|
||||
- 用户本地时间快了 1 天 → 提前显示过期弹窗
|
||||
- 用户本地时间慢了 1 天 → 过期后仍可使用
|
||||
|
||||
**解决方案:**
|
||||
```typescript
|
||||
// 方案 1:每次使用前调用后端验证(推荐)
|
||||
async checkExpiration(): Promise<boolean> {
|
||||
try {
|
||||
// 调用后端接口验证 Token 是否过期
|
||||
const response = await fetch(`${API_BASE}/auth/verify`, {
|
||||
headers: { 'Authorization': `Bearer ${token}` }
|
||||
});
|
||||
|
||||
if (response.status === 401) {
|
||||
// Token 过期
|
||||
await this.handleExpired();
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
} catch (error) {
|
||||
// 网络错误,使用本地时间判断
|
||||
const userInfo = await getUserInfo();
|
||||
return Date.now() >= (userInfo?.pluginTrialExpiresAt || 0);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 5.2 欢迎弹窗重复显示
|
||||
|
||||
**问题:** 每次登录都显示欢迎弹窗,用户体验不好
|
||||
|
||||
**场景:**
|
||||
- 试用用户第一次登录显示欢迎弹窗 ✅
|
||||
- 用户关闭插件后重新打开,又显示欢迎弹窗 ❌
|
||||
|
||||
**解决方案:**
|
||||
```typescript
|
||||
async onTokenReceived(token: string) {
|
||||
// ... 获取用户信息
|
||||
|
||||
if (fullUserInfo.isPluginTrial === true) {
|
||||
// 检查是否已经显示过欢迎弹窗
|
||||
const hasWelcomed = this.context.globalState.get('pluginTrialWelcomed');
|
||||
|
||||
if (!hasWelcomed) {
|
||||
await this.showWelcomePanel();
|
||||
await this.context.globalState.update('pluginTrialWelcomed', true);
|
||||
}
|
||||
} else {
|
||||
await this.checkAndShowInvitationModal();
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 5.3 isPluginTrial 字段类型不一致
|
||||
|
||||
**问题:** 后端可能返回 `true`、`false`、`null`、`undefined`,前端判断时需要严格处理
|
||||
|
||||
**场景:**
|
||||
```typescript
|
||||
// ❌ 错误写法
|
||||
if (userInfo.isPluginTrial) {
|
||||
// undefined 会被判断为 false
|
||||
}
|
||||
|
||||
// ✅ 正确写法
|
||||
if (userInfo.isPluginTrial === true) {
|
||||
// 插件试用用户
|
||||
}
|
||||
```
|
||||
|
||||
**建议:**
|
||||
- 后端统一返回 `true` 或 `false`,不要返回 `null`
|
||||
- 前端使用严格相等 `===` 判断
|
||||
|
||||
|
||||
### 5.4 Token 过期但前端未清除
|
||||
|
||||
**问题:** Token 在后端已过期,但前端仍保存着过期的 Token
|
||||
|
||||
**场景:**
|
||||
- 用户 15 天后打开插件
|
||||
- 前端尝试调用 API,后端返回 401
|
||||
- 前端没有处理 401,导致功能异常
|
||||
|
||||
**解决方案:**
|
||||
```typescript
|
||||
// 在 apiClient.ts 中统一处理 401
|
||||
async function apiCall(url: string, options: any) {
|
||||
const response = await fetch(url, options);
|
||||
|
||||
if (response.status === 401) {
|
||||
// Token 过期,清除本地数据
|
||||
await clearAllData();
|
||||
ExpiredPanel.render();
|
||||
throw new Error('Token expired');
|
||||
}
|
||||
|
||||
return response.json();
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 6. 前后端对接清单
|
||||
|
||||
### 6.1 后端需要提供
|
||||
|
||||
**1. 修改 `GET /system/user/getInfo` 接口**
|
||||
- 新增字段:`isPluginTrial` (boolean)
|
||||
- 新增字段:`pluginTrialExpiresAt` (number, 毫秒时间戳)
|
||||
|
||||
**2. Token 过期时间设置**
|
||||
- 插件试用用户:JWT Token 设置 15 天过期
|
||||
- 正式用户:保持现有逻辑
|
||||
|
||||
**3. 测试账号**
|
||||
- 提供 1-2 个插件试用用户账号用于测试
|
||||
|
||||
### 6.2 前端需要修改
|
||||
|
||||
**1. 修改文件:**
|
||||
- `src/services/userService.ts` - 修改 UserInfo 接口和 onTokenReceived()
|
||||
- `src/utils/messageHandler.ts` - 添加过期检查
|
||||
|
||||
**2. 新增文件:**
|
||||
- `src/panels/WelcomePanel.ts` - 欢迎弹窗
|
||||
- `src/panels/ExpiredPanel.ts` - 过期提醒弹窗
|
||||
- `src/services/trialExpirationService.ts` - 过期检测服务
|
||||
|
||||
**3. globalState 新增存储键:**
|
||||
- `pluginTrialWelcomed` (boolean) - 是否已显示欢迎弹窗
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 7. 测试计划
|
||||
|
||||
### 7.1 登录流程测试
|
||||
|
||||
**测试用例 1:插件试用用户登录**
|
||||
- 使用插件试用用户账号登录
|
||||
- 验证是否显示欢迎弹窗
|
||||
- 验证是否不显示邀请码弹窗
|
||||
- 验证 userInfo 中 isPluginTrial === true
|
||||
|
||||
**测试用例 2:正式用户登录**
|
||||
- 使用正式用户账号登录
|
||||
- 验证是否显示邀请码弹窗
|
||||
- 验证是否不显示欢迎弹窗
|
||||
- 验证 userInfo 中 isPluginTrial !== true
|
||||
|
||||
**测试用例 3:欢迎弹窗不重复显示**
|
||||
- 插件试用用户登录后显示欢迎弹窗
|
||||
- 关闭插件重新打开
|
||||
- 验证不再显示欢迎弹窗
|
||||
|
||||
|
||||
### 7.2 过期检测测试
|
||||
|
||||
**测试用例 4:未过期用户正常使用**
|
||||
- 插件试用用户登录(未过期)
|
||||
- 发送消息使用功能
|
||||
- 验证功能正常使用
|
||||
|
||||
**测试用例 5:已过期用户禁止使用**
|
||||
- 修改本地时间到 15 天后(或修改 pluginTrialExpiresAt)
|
||||
- 尝试发送消息
|
||||
- 验证显示过期弹窗
|
||||
- 验证功能被禁用
|
||||
|
||||
**测试用例 6:Token 过期处理**
|
||||
- 使用过期的 Token 调用 API
|
||||
- 验证后端返回 401
|
||||
- 验证前端显示过期弹窗
|
||||
|
||||
|
||||
---
|
||||
|
||||
## 8. 总结
|
||||
|
||||
### 8.1 核心改动点
|
||||
|
||||
**后端(最小改动):**
|
||||
1. `GET /system/user/getInfo` 接口新增 2 个字段
|
||||
2. JWT Token 根据用户类型设置不同过期时间
|
||||
|
||||
**前端(主要改动):**
|
||||
1. 修改 UserInfo 接口定义
|
||||
2. 修改 onTokenReceived() 添加判断逻辑
|
||||
3. 新增 3 个文件(欢迎面板、过期面板、过期检测服务)
|
||||
4. 在消息发送前添加过期检查
|
||||
|
||||
### 8.2 关键判断逻辑
|
||||
|
||||
```typescript
|
||||
// 登录后判断
|
||||
if (userInfo.isPluginTrial === true) {
|
||||
showWelcomePanel(); // 显示欢迎弹窗
|
||||
} else {
|
||||
showInvitationModal(); // 显示邀请码弹窗
|
||||
}
|
||||
|
||||
// 使用前判断
|
||||
if (Date.now() >= userInfo.pluginTrialExpiresAt) {
|
||||
showExpiredPanel(); // 显示过期弹窗
|
||||
return; // 禁止使用
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
### 8.3 必须注意的问题
|
||||
|
||||
1. **时间同步问题** - 用户本地时间不准确导致误判,建议调用后端验证
|
||||
2. **isPluginTrial 严格判断** - 必须使用 `=== true` 判断
|
||||
3. **欢迎弹窗重复显示** - 使用 globalState 标记避免重复
|
||||
4. **Token 过期处理** - 在 apiClient 中统一处理 401 响应
|
||||
|
||||
### 8.4 实现优先级
|
||||
|
||||
**P0(必须实现):**
|
||||
1. 后端接口新增字段
|
||||
2. 前端 UserInfo 接口修改
|
||||
3. 前端 onTokenReceived() 判断逻辑
|
||||
4. 过期检测逻辑
|
||||
|
||||
**P1(重要):**
|
||||
1. 欢迎弹窗
|
||||
2. 过期提醒弹窗
|
||||
|
||||
**P2(优化):**
|
||||
1. 后端验证过期(避免时间同步问题)
|
||||
2. 更友好的过期提示
|
||||
|
||||
---
|
||||
|
||||
**文档完成!** 基于你现有的代码架构,这个方案改动最小,实现最简单。
|
||||
|
||||
1027
docs/数据流程详解.md
Normal file
|
Before Width: | Height: | Size: 160 KiB |
251
media/USER_MANUAL.md
Normal file
@ -0,0 +1,251 @@
|
||||
# IC Coder 插件端用户手册
|
||||
|
||||
欢迎**宁德时代新能源科技股份有限公司**的各位专家使用 IC Coder 企业版!
|
||||
|
||||
本手册旨在为贵公司提供插件的安装、配置及使用指导,帮助您快速上手并充分发挥工具的功能。
|
||||
|
||||
在使用过程中,如遇任何功能异常、性能问题或操作疑问,欢迎随时联系我们,我们将在第一时间为您提供支持。
|
||||
|
||||
若贵司有特定的业务场景或个性化功能需求,也可直接与我们沟通,我们会为贵司进行定制化开发。
|
||||
|
||||
| 功能 | 说明 |
|
||||
| ----------------------- | ---------------------------------------------------- |
|
||||
| 自研微调模型 | IC Coder 自研顶尖 Max 微调模型,专为 FPGA 开发 |
|
||||
| 高质量 Verilog 代码生成 | 根据自然语言描述生成符合规范的 Verilog 代码 |
|
||||
| 自动语法检查 | 自动检测代码语法错误并自动修复 |
|
||||
| 自动仿真 | 内置编译器,自动编译和仿真 |
|
||||
| 波形检查工具 | 内置 VCD 波形查看器,自动波形解析 |
|
||||
| 自主检查迭代 | AI 自动检查代码问题并迭代优化 |
|
||||
| Diff 功能 | 快速比较代码差异,追踪 AI 修改,可一键确认和撤销修改 |
|
||||
| Code Action 快捷操作 | Ctrl+L 快捷键或右键菜单快速添加代码到对话 |
|
||||
| 支持上下文连续对话 | 多轮对话,AI 记住之前的交互内容 |
|
||||
| 会话历史管理 | 自动保存对话记录,随时恢复历史会话 |
|
||||
|
||||
## IC Coder 快速入门指南
|
||||
|
||||
### 系统要求
|
||||
|
||||
- **Visual Studio Code**: 版本 >= 1.60.0
|
||||
|
||||
各位专家也可以通过这个链接下载VSCode [下载链接](https://code.visualstudio.com/)
|
||||
|
||||
---
|
||||
|
||||
### 安装步骤
|
||||
|
||||
#### 步骤 1:通过 VSIX 文件安装(推荐)
|
||||
|
||||
1. **获取安装包**
|
||||
- 确保您已经获得 `iccoder-Trial-1.0.vsix` 文件
|
||||
|
||||
2. **打开 VS Code**
|
||||
- 启动 Visual Studio Code
|
||||
|
||||
3. **安装插件**
|
||||
|
||||
有以下三种安装方式:
|
||||
|
||||
**方式 A:通过命令面板**
|
||||
- 按 `Ctrl+Shift+P` (Windows/Linux) 或 `Cmd+Shift+P` (macOS) 打开命令面板
|
||||
- 输入 `Extensions: Install from VSIX...`
|
||||
- 选择 `iccoder-Trial-1.0.vsix` 文件
|
||||
- 等待安装完成
|
||||
|
||||

|
||||
|
||||
**方式 B:通过扩展视图**
|
||||
- 点击左侧活动栏的扩展图标(或按 `Ctrl+Shift+X`)
|
||||
- 点击扩展视图右上角的 `...` (更多操作)
|
||||
- 选择 `从 VSIX 安装...`
|
||||
- 选择 `iccoder-Trial-1.0.vsix` 文件
|
||||
|
||||

|
||||
|
||||
**方式 C:通过命令行**
|
||||
|
||||
```bash
|
||||
code --install-extension iccoder-Trial-1.0.vsix
|
||||
```
|
||||
|
||||
4. **重启 VS Code**
|
||||
- 安装完成后,建议重启 VS Code 以确保插件正常加载
|
||||
|
||||
#### 步骤 2:打开 IC Coder 界面
|
||||
|
||||
**登录后会自动打开**,手动打开也有以下几种方式:
|
||||
|
||||
**方式 1:通过侧边栏**
|
||||
|
||||
- 点击左侧活动栏的 IC Coder 图标
|
||||
- 侧边栏会显示 IC Coder 聊天界面
|
||||
|
||||

|
||||
|
||||
**方式 2:通过命令面板**
|
||||
|
||||
- 按 `Ctrl+Shift+P` (Windows/Linux) 或 `Cmd+Shift+P` (macOS)
|
||||
- 输入以下命令之一:
|
||||
- `IC Coder: 打开聊天` - 打开聊天界面
|
||||
- `打开 IC Coder 助手` - 打开助手面板
|
||||
|
||||

|
||||
|
||||
---
|
||||
|
||||
#### 步骤 3:开始使用
|
||||
|
||||
插件已预配置好后端服务,安装后即可直接使用,无需手动配置。
|
||||
|
||||

|
||||
|
||||
### 故障排除
|
||||
|
||||
#### 问题 :插件无法安装
|
||||
|
||||
**症状**:安装 VSIX 文件时报错
|
||||
|
||||
#### 解决方案:
|
||||
|
||||
- 确认 VS Code 版本 >= 1.60.0
|
||||
|
||||
- 检查 VSIX 文件是否完整(未损坏)
|
||||
|
||||
- 尝试以管理员权限运行 VS Code
|
||||
|
||||
- 清除 VS Code 缓存后重试
|
||||
|
||||
### 完整使用流程示例
|
||||
|
||||
下面通过一个完整的案例,展示如何使用 IC Coder 从需求到代码生成的全过程。
|
||||
|
||||
#### 步骤 1:输入设计需求
|
||||
|
||||
在对话框中输入设计需求,例如:
|
||||
|
||||
```
|
||||
我需要设计一个 8 位加法器,要求有进位输入和进位输出
|
||||
```
|
||||
|
||||
点击**发送**按钮。
|
||||
|
||||

|
||||
|
||||
#### 步骤 2:AI 询问补充信息
|
||||
|
||||
AI 会根据需求,询问一些关键的设计细节。例如:
|
||||
|
||||
- 是否需要溢出检测?
|
||||
- 时钟频率要求是多少?
|
||||
- 是否需要流水线设计?
|
||||
|
||||
您只需要根据实际需求**选择相应的选项或者直接输入需求**即可,AI 会根据您的选择生成最合适的设计方案。
|
||||
|
||||
#### 步骤 3:确认 AI 生成的任务列表
|
||||
|
||||
AI 会根据您的需求和补充信息,生成一个详细的任务列表(Todo List)
|
||||
|
||||

|
||||
|
||||
仔细查看任务列表,确认无误后点击**确认**按钮,AI 将开始执行。
|
||||
|
||||
#### 步骤 4:观察 AI 执行过程
|
||||
|
||||
AI 开始工作后,您可以在对话框中实时看到所有执行步骤:
|
||||
|
||||

|
||||
|
||||
每个步骤完成后,任务列表中对应的项目会被标记为完成状态。
|
||||
|
||||
#### 步骤 5:仿真运行与结果查看
|
||||
|
||||
当 AI 完成代码生成后,会自动运行仿真验证:
|
||||
|
||||

|
||||
|
||||
#### 步骤 6:查看生成的文件
|
||||
|
||||
所有生成的文件会自动保存到您的工作目录中:
|
||||
|
||||
```
|
||||
project/
|
||||
├── src/
|
||||
│ └── tb_adder_8bit.v # RTL 设计文件
|
||||
├── sim/
|
||||
│ └── tb_adder_8bit # 测试平台文件
|
||||
└── tb_adder_8bit.vcd # 波形文件
|
||||
```
|
||||
|
||||
您可以在 VS Code 的文件资源管理器中直接打开这些文件进行查看或修改。
|
||||
|
||||
#### 步骤8:继续对话
|
||||
|
||||
如果您对给出的结果不太满意,您可以告诉IC Coder您想具体修改的地方或者文件
|
||||
|
||||
#### 使用流程总结
|
||||
|
||||
整个使用流程可以概括为:
|
||||
|
||||
- **输入需求** → 在对话框中描述您的设计需求
|
||||
- **回答问题** → 根据 AI 的询问选择合适的选项
|
||||
- **确认任务** → 查看并确认 AI 生成的任务列表
|
||||
- **观察执行** → 实时查看 AI 的所有执行步骤
|
||||
- **查看结果** → 仿真成功后查看生成的文件
|
||||
|
||||
#### 使用提示
|
||||
|
||||
**如何描述需求更准确?**
|
||||
|
||||
- **明确功能**:清楚说明模块要实现什么功能
|
||||
- **指定参数**:说明位宽、时钟频率等关键参数
|
||||
- **特殊要求**:如果有特殊的时序要求或接口规范,请明确说明
|
||||
|
||||
**示例:**
|
||||
|
||||
```
|
||||
好的描述:设计一个 16 位的 FIFO,深度为 256,支持异步读写
|
||||
不够清晰:帮我写一个 FIFO
|
||||
```
|
||||
|
||||
#### 常见问题
|
||||
|
||||
**Q: 仿真失败了怎么办?**
|
||||
A: AI 会根据错误自动修复代码并重新仿真。
|
||||
|
||||
**Q: 可以修改生成的代码吗?**
|
||||
A: 可以,可以直接编辑文件,然后告诉 AI 重新运行仿真。
|
||||
|
||||
**Q: 可以导入已有的代码吗?**
|
||||
A: 可以,在工作区中打开对应的代码文件夹,然后直接在对话中告诉 AI 您要修改或优化哪个文件,AI 会读取并进行修改。
|
||||
|
||||
**Q: 如何查看 AI 的思考过程?**
|
||||
A: 在执行过程中,AI 会实时显示每一步的操作和决策依据。
|
||||
|
||||
**Q: 如何保存对话历史?**
|
||||
A: 对话历史会自动保存在本地,可以点击历史对话查看历史会话记录。
|
||||
|
||||
---
|
||||
|
||||
### 卸载插件
|
||||
|
||||
如需卸载插件:
|
||||
|
||||
1. 打开扩展视图
|
||||
2. 找到 "IC Coder" 插件
|
||||
3. 点击卸载按钮
|
||||
4. 重启 VS Code
|
||||
|
||||
---
|
||||
|
||||
### 注意事项
|
||||
|
||||
1. **需提前打开一个文件夹作为工作区**,否则会准确的为您服务
|
||||
|
||||

|
||||
|
||||
2. **开箱即用**
|
||||
- 插件已预配置后端服务,无需手动设置
|
||||
- 安装后即可直接使用所有功能
|
||||
|
||||
---
|
||||
|
||||
**祝您使用愉快!如有问题欢迎反馈。**
|
||||
BIN
media/description/auto-build-architecture-copy.png
Normal file
|
After Width: | Height: | Size: 168 KiB |
BIN
media/description/auto-build-architecture.png
Normal file
|
After Width: | Height: | Size: 81 KiB |
BIN
media/description/auto-simulation-1.png
Normal file
|
After Width: | Height: | Size: 212 KiB |
BIN
media/description/auto-simulation-2.png
Normal file
|
After Width: | Height: | Size: 251 KiB |
BIN
media/description/auto-simulation-3.png
Normal file
|
After Width: | Height: | Size: 266 KiB |
BIN
media/description/input-requirement-1.png
Normal file
|
After Width: | Height: | Size: 113 KiB |
BIN
media/description/input-requirement-2.png
Normal file
|
After Width: | Height: | Size: 188 KiB |
BIN
media/description/input-requirement-3.png
Normal file
|
After Width: | Height: | Size: 242 KiB |
BIN
media/description/plan-design-doc-1.png
Normal file
|
After Width: | Height: | Size: 349 KiB |
BIN
media/description/plan-design-doc-2.png
Normal file
|
After Width: | Height: | Size: 302 KiB |
BIN
media/description/real-time-follow-1.png
Normal file
|
After Width: | Height: | Size: 157 KiB |
BIN
media/description/real-time-follow-2.png
Normal file
|
After Width: | Height: | Size: 305 KiB |
BIN
media/description/real-time-follow-3.png
Normal file
|
After Width: | Height: | Size: 253 KiB |
BIN
media/description/real-time-follow-4.png
Normal file
|
After Width: | Height: | Size: 209 KiB |
BIN
media/homepage-logo.png
Normal file
|
After Width: | Height: | Size: 252 KiB |
|
Before Width: | Height: | Size: 889 KiB After Width: | Height: | Size: 889 KiB |
BIN
media/manual/仿真运行结果.png
Normal file
|
After Width: | Height: | Size: 22 KiB |
BIN
media/manual/侧边栏打开.png
Normal file
|
After Width: | Height: | Size: 155 KiB |
BIN
media/manual/命令面板打开.png
Normal file
|
After Width: | Height: | Size: 30 KiB |
BIN
media/manual/安装方式1.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
media/manual/安装方式2.png
Normal file
|
After Width: | Height: | Size: 142 KiB |
BIN
media/manual/打开文件夹.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
media/manual/确认任务.png
Normal file
|
After Width: | Height: | Size: 47 KiB |
BIN
media/manual/聊天界面.png
Normal file
|
After Width: | Height: | Size: 202 KiB |
BIN
media/manual/观察执行过程.png
Normal file
|
After Width: | Height: | Size: 104 KiB |
BIN
media/manual/输入需求.png
Normal file
|
After Width: | Height: | Size: 62 KiB |
|
Before Width: | Height: | Size: 681 B After Width: | Height: | Size: 681 B |
200
media/surfer/index.html
Normal file
@ -0,0 +1,200 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
|
||||
<!-- Disable zooming: -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
|
||||
<head>
|
||||
<!-- change this to your project name -->
|
||||
<title>Surfer</title>
|
||||
|
||||
<!-- config for our rust wasm binary. go to https://trunkrs.dev/assets/#rust for more customization -->
|
||||
<script type="module">
|
||||
import init from '/surfer.js';
|
||||
await init({module_or_path: '/surfer_bg.wasm'});
|
||||
import {WebHandle, inject_message, id_of_name, draw_text_arrow} from '/surfer.js';
|
||||
window.inject_message = inject_message;
|
||||
window.id_of_name = id_of_name;
|
||||
window.draw_text_arrow = draw_text_arrow;
|
||||
/*SURFER_SETUP_HOOKS*/
|
||||
</script>
|
||||
|
||||
<!-- this is the base url relative to which other urls will be constructed. trunk will insert this from the public-url option -->
|
||||
<base href="/" />
|
||||
|
||||
|
||||
<script>
|
||||
function on_surfer_error(msg) {
|
||||
console.log("Setting error message")
|
||||
document.getElementById("error_message").innerHTML = msg
|
||||
document.getElementById("error_container").style.display = "block"
|
||||
}
|
||||
window.on_surfer_error = on_surfer_error;
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<link rel="manifest" href="manifest.json">
|
||||
<meta name="theme-color" media="(prefers-color-scheme: light)" content="white">
|
||||
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#404040">
|
||||
|
||||
<style>
|
||||
html {
|
||||
/* Remove touch delay: */
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
body {
|
||||
/* Light mode background color for what is not covered by the egui canvas,
|
||||
or where the egui canvas is translucent. */
|
||||
background: #909090;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
/* Dark mode background color for what is not covered by the egui canvas,
|
||||
or where the egui canvas is translucent. */
|
||||
background: #404040;
|
||||
}
|
||||
}
|
||||
|
||||
/* Allow canvas to fill entire web page: */
|
||||
html,
|
||||
body {
|
||||
overflow: hidden;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Make canvas fill entire document: */
|
||||
canvas {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.centered {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: #f0f0f0;
|
||||
font-size: 24px;
|
||||
font-family: Ubuntu-Light, Helvetica, sans-serif;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ---------------------------------------------- */
|
||||
/* Loading animation from https://loading.io/css/ */
|
||||
.lds-dual-ring {
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.lds-dual-ring:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin: 0px;
|
||||
border-radius: 50%;
|
||||
border: 3px solid #fff;
|
||||
border-color: #fff transparent #fff transparent;
|
||||
animation: lds-dual-ring 1.2s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes lds-dual-ring {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
#error_container {
|
||||
padding: 1em;
|
||||
border-radius: 0.5em;
|
||||
margin: 0px auto;
|
||||
max-width: 980px;
|
||||
color: #ffffff;
|
||||
background-color: black;
|
||||
position: relative;
|
||||
height: 90%;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
#error_container a {
|
||||
color: #ff9999;
|
||||
}
|
||||
|
||||
#error_message {
|
||||
overflow: scroll;
|
||||
white-space: break-spaces;
|
||||
}
|
||||
</style>
|
||||
<link rel="modulepreload" href="/surfer.js" crossorigin="anonymous" integrity="sha384-s5jcnzgSMjwjfa1Jq5kr3vQVXGQ7D+ZdMsCBdbbcmKefqvRKw652YAYaaHZJQob6"><link rel="preload" href="/surfer_bg.wasm" crossorigin="anonymous" integrity="sha384-YzYZZQJDXiKIAVpyBMziailnMHJ/sxzBq0VNMP854yLbTd2lneCR5ZgcvB4cYMFc" as="fetch" type="application/wasm"></head>
|
||||
|
||||
<body>
|
||||
<!-- The WASM code will resize the canvas dynamically -->
|
||||
<!-- the id is hardcoded in main.rs . so, make sure both match. -->
|
||||
<canvas id="the_canvas_id"></canvas>
|
||||
|
||||
<div id="error_container" style="display: none;">
|
||||
<h1>Sorry, Surfer crashed 🔥</h1>
|
||||
<p>
|
||||
Something caused Surfer to crash. Please report the error on
|
||||
<a href="https://gitlab.com/surfer-project/surfer/-/issues/new">
|
||||
gitlab
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
Any report is appreciated, but it is extra helpful if you can attach the waveform that caused
|
||||
the crash and/or the steps to reproduce the crash.
|
||||
</p>
|
||||
<h3>
|
||||
Backtrace:
|
||||
</h3>
|
||||
<div class="error_container">
|
||||
<!-- This is filled in by javascript -->
|
||||
<code id="error_message"></code>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Register the message listener system -->
|
||||
<script src="integration.js"></script>
|
||||
<script>
|
||||
register_message_listener()
|
||||
</script>
|
||||
|
||||
<!--Register Service Worker. this will cache the wasm / js scripts for offline use (for PWA functionality). -->
|
||||
<!-- Force refresh (Ctrl + F5) to load the latest files instead of cached files -->
|
||||
<script>
|
||||
// We disable caching during development so that we always view the latest version.
|
||||
if ('serviceWorker' in navigator && window.location.hash !== "#dev") {
|
||||
window.addEventListener('load', function () {
|
||||
navigator.serviceWorker.register('sw.js');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
<!-- Powered by egui: https://github.com/emilk/egui/ -->
|
||||
65
media/surfer/integration.js
Normal file
@ -0,0 +1,65 @@
|
||||
// Web apps which integrate Surfer as an iframe can give commands to surfer via
|
||||
// the .postMessage [1] function on the iframe.
|
||||
//
|
||||
// For example, to tell Surfer to load waveforms from a URL, use
|
||||
// `.postMessage({command: "LoadUrl", url: "https://app.surfer-project.org/picorv32.vcd"})`
|
||||
//
|
||||
// For more complex functionality, one can also inject any `Message` defined
|
||||
// in `surfer::Message` in surfer/main.rs. However, the API of these messages
|
||||
// is not stable and may change at any time. If you add functionality via
|
||||
// these, make sure to test the new functionality when changing Surfer version.
|
||||
//
|
||||
// [1] https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
|
||||
|
||||
function register_message_listener() {
|
||||
window.addEventListener("message", (event) => {
|
||||
// JSON decode the message
|
||||
const decoded = event.data
|
||||
|
||||
switch (decoded.command) {
|
||||
// Load a waveform from a URL. The format is inferred from the data.
|
||||
// Example: `{command: "LoadUrl", url: "https://app.surfer-project.org/picorv32.vcd"}`
|
||||
|
||||
case 'LoadUrl': {
|
||||
const msg = {
|
||||
LoadWaveformFileFromUrl: [
|
||||
decoded.url,
|
||||
"Clear"
|
||||
]
|
||||
}
|
||||
inject_message(JSON.stringify(msg))
|
||||
break;
|
||||
}
|
||||
|
||||
case 'ToggleMenu': {
|
||||
const msg = "ToggleMenu"
|
||||
inject_message(JSON.stringify(msg))
|
||||
break;
|
||||
}
|
||||
|
||||
// Load waveform data directly from string content
|
||||
case 'LoadData': {
|
||||
const msg = {
|
||||
LoadFromData: [
|
||||
decoded.content,
|
||||
decoded.fileName || "waveform.vcd",
|
||||
"Clear"
|
||||
]
|
||||
}
|
||||
inject_message(JSON.stringify(msg))
|
||||
break;
|
||||
}
|
||||
|
||||
// Inject any other message supported by Surfer in the surfer::Message enum.
|
||||
// NOTE: The API of these is unstable.
|
||||
case 'InjectMessage': {
|
||||
inject_message(decoded.message);
|
||||
break
|
||||
}
|
||||
|
||||
default:
|
||||
console.log(`Unknown message.command ${decoded.command}`)
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
10
media/surfer/manifest.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"background_color": "white",
|
||||
"display": "standalone",
|
||||
"id": "/index.html",
|
||||
"lang": "en-US",
|
||||
"name": "Surfer",
|
||||
"short_name": "surfer",
|
||||
"start_url": "./index.html",
|
||||
"theme_color": "white"
|
||||
}
|
||||
2227
media/surfer/surfer.js
Normal file
200
media/surfer/surfer/index.html
Normal file
@ -0,0 +1,200 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
|
||||
<!-- Disable zooming: -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
|
||||
<head>
|
||||
<!-- change this to your project name -->
|
||||
<title>Surfer</title>
|
||||
|
||||
<!-- config for our rust wasm binary. go to https://trunkrs.dev/assets/#rust for more customization -->
|
||||
<script type="module">
|
||||
import init from '/surfer.js';
|
||||
await init({module_or_path: '/surfer_bg.wasm'});
|
||||
import {WebHandle, inject_message, id_of_name, draw_text_arrow} from '/surfer.js';
|
||||
window.inject_message = inject_message;
|
||||
window.id_of_name = id_of_name;
|
||||
window.draw_text_arrow = draw_text_arrow;
|
||||
/*SURFER_SETUP_HOOKS*/
|
||||
</script>
|
||||
|
||||
<!-- this is the base url relative to which other urls will be constructed. trunk will insert this from the public-url option -->
|
||||
<base href="/" />
|
||||
|
||||
|
||||
<script>
|
||||
function on_surfer_error(msg) {
|
||||
console.log("Setting error message")
|
||||
document.getElementById("error_message").innerHTML = msg
|
||||
document.getElementById("error_container").style.display = "block"
|
||||
}
|
||||
window.on_surfer_error = on_surfer_error;
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<link rel="manifest" href="manifest.json">
|
||||
<meta name="theme-color" media="(prefers-color-scheme: light)" content="white">
|
||||
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#404040">
|
||||
|
||||
<style>
|
||||
html {
|
||||
/* Remove touch delay: */
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
body {
|
||||
/* Light mode background color for what is not covered by the egui canvas,
|
||||
or where the egui canvas is translucent. */
|
||||
background: #909090;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
/* Dark mode background color for what is not covered by the egui canvas,
|
||||
or where the egui canvas is translucent. */
|
||||
background: #404040;
|
||||
}
|
||||
}
|
||||
|
||||
/* Allow canvas to fill entire web page: */
|
||||
html,
|
||||
body {
|
||||
overflow: hidden;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Make canvas fill entire document: */
|
||||
canvas {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.centered {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: #f0f0f0;
|
||||
font-size: 24px;
|
||||
font-family: Ubuntu-Light, Helvetica, sans-serif;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ---------------------------------------------- */
|
||||
/* Loading animation from https://loading.io/css/ */
|
||||
.lds-dual-ring {
|
||||
display: inline-block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.lds-dual-ring:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin: 0px;
|
||||
border-radius: 50%;
|
||||
border: 3px solid #fff;
|
||||
border-color: #fff transparent #fff transparent;
|
||||
animation: lds-dual-ring 1.2s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes lds-dual-ring {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
#error_container {
|
||||
padding: 1em;
|
||||
border-radius: 0.5em;
|
||||
margin: 0px auto;
|
||||
max-width: 980px;
|
||||
color: #ffffff;
|
||||
background-color: black;
|
||||
position: relative;
|
||||
height: 90%;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
#error_container a {
|
||||
color: #ff9999;
|
||||
}
|
||||
|
||||
#error_message {
|
||||
overflow: scroll;
|
||||
white-space: break-spaces;
|
||||
}
|
||||
</style>
|
||||
<link rel="modulepreload" href="/surfer.js" crossorigin="anonymous" integrity="sha384-s5jcnzgSMjwjfa1Jq5kr3vQVXGQ7D+ZdMsCBdbbcmKefqvRKw652YAYaaHZJQob6"><link rel="preload" href="/surfer_bg.wasm" crossorigin="anonymous" integrity="sha384-YzYZZQJDXiKIAVpyBMziailnMHJ/sxzBq0VNMP854yLbTd2lneCR5ZgcvB4cYMFc" as="fetch" type="application/wasm"></head>
|
||||
|
||||
<body>
|
||||
<!-- The WASM code will resize the canvas dynamically -->
|
||||
<!-- the id is hardcoded in main.rs . so, make sure both match. -->
|
||||
<canvas id="the_canvas_id"></canvas>
|
||||
|
||||
<div id="error_container" style="display: none;">
|
||||
<h1>Sorry, Surfer crashed 🔥</h1>
|
||||
<p>
|
||||
Something caused Surfer to crash. Please report the error on
|
||||
<a href="https://gitlab.com/surfer-project/surfer/-/issues/new">
|
||||
gitlab
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
Any report is appreciated, but it is extra helpful if you can attach the waveform that caused
|
||||
the crash and/or the steps to reproduce the crash.
|
||||
</p>
|
||||
<h3>
|
||||
Backtrace:
|
||||
</h3>
|
||||
<div class="error_container">
|
||||
<!-- This is filled in by javascript -->
|
||||
<code id="error_message"></code>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Register the message listener system -->
|
||||
<script src="integration.js"></script>
|
||||
<script>
|
||||
register_message_listener()
|
||||
</script>
|
||||
|
||||
<!--Register Service Worker. this will cache the wasm / js scripts for offline use (for PWA functionality). -->
|
||||
<!-- Force refresh (Ctrl + F5) to load the latest files instead of cached files -->
|
||||
<script>
|
||||
// We disable caching during development so that we always view the latest version.
|
||||
if ('serviceWorker' in navigator && window.location.hash !== "#dev") {
|
||||
window.addEventListener('load', function () {
|
||||
navigator.serviceWorker.register('sw.js');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
<!-- Powered by egui: https://github.com/emilk/egui/ -->
|
||||
52
media/surfer/surfer/integration.js
Normal file
@ -0,0 +1,52 @@
|
||||
// Web apps which integrate Surfer as an iframe can give commands to surfer via
|
||||
// the .postMessage [1] function on the iframe.
|
||||
//
|
||||
// For example, to tell Surfer to load waveforms from a URL, use
|
||||
// `.postMessage({command: "LoadUrl", url: "https://app.surfer-project.org/picorv32.vcd"})`
|
||||
//
|
||||
// For more complex functionality, one can also inject any `Message` defined
|
||||
// in `surfer::Message` in surfer/main.rs. However, the API of these messages
|
||||
// is not stable and may change at any time. If you add functionality via
|
||||
// these, make sure to test the new functionality when changing Surfer version.
|
||||
//
|
||||
// [1] https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
|
||||
|
||||
function register_message_listener() {
|
||||
window.addEventListener("message", (event) => {
|
||||
// JSON decode the message
|
||||
const decoded = event.data
|
||||
|
||||
switch (decoded.command) {
|
||||
// Load a waveform from a URL. The format is inferred from the data.
|
||||
// Example: `{command: "LoadUrl", url: "https://app.surfer-project.org/picorv32.vcd"}`
|
||||
|
||||
case 'LoadUrl': {
|
||||
const msg = {
|
||||
LoadWaveformFileFromUrl: [
|
||||
decoded.url,
|
||||
"Clear"
|
||||
]
|
||||
}
|
||||
inject_message(JSON.stringify(msg))
|
||||
break;
|
||||
}
|
||||
|
||||
case 'ToggleMenu': {
|
||||
const msg = "ToggleMenu"
|
||||
inject_message(JSON.stringify(msg))
|
||||
break;
|
||||
}
|
||||
|
||||
// Inject any other message supported by Surfer in the surfer::Message enum.
|
||||
// NOTE: The API of these is unstable.
|
||||
case 'InjectMessage': {
|
||||
inject_message(decoded.message);
|
||||
break
|
||||
}
|
||||
|
||||
default:
|
||||
console.log(`Unknown message.command ${decoded.command}`)
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
10
media/surfer/surfer/manifest.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"background_color": "white",
|
||||
"display": "standalone",
|
||||
"id": "/index.html",
|
||||
"lang": "en-US",
|
||||
"name": "Surfer",
|
||||
"short_name": "surfer",
|
||||
"start_url": "./index.html",
|
||||
"theme_color": "white"
|
||||
}
|
||||
2227
media/surfer/surfer/surfer.js
Normal file
BIN
media/surfer/surfer/surfer_bg.wasm
Normal file
37
media/surfer/surfer/sw.js
Normal file
@ -0,0 +1,37 @@
|
||||
self.addEventListener("install", function () {
|
||||
self.skipWaiting();
|
||||
});
|
||||
|
||||
self.addEventListener("activate", (event) => {
|
||||
event.waitUntil(self.clients.claim());
|
||||
});
|
||||
|
||||
self.addEventListener("fetch", function (event) {
|
||||
if (event.request.cache === "only-if-cached" && event.request.mode !== "same-origin") {
|
||||
return;
|
||||
}
|
||||
|
||||
event.respondWith(
|
||||
fetch(event.request)
|
||||
.then(function (response) {
|
||||
// It seems like we only need to set the headers for index.html
|
||||
// If you want to be on the safe side, comment this out
|
||||
// if (!response.url.includes("index.html")) return response;
|
||||
|
||||
const newHeaders = new Headers(response.headers);
|
||||
newHeaders.set("Cross-Origin-Embedder-Policy", "require-corp");
|
||||
newHeaders.set("Cross-Origin-Opener-Policy", "same-origin");
|
||||
|
||||
const moddedResponse = new Response(response.body, {
|
||||
status: response.status,
|
||||
statusText: response.statusText,
|
||||
headers: newHeaders,
|
||||
});
|
||||
|
||||
return moddedResponse;
|
||||
})
|
||||
.catch(function (e) {
|
||||
console.error(e);
|
||||
})
|
||||
);
|
||||
});
|
||||
BIN
media/surfer/surfer_bg.wasm
Normal file
37
media/surfer/sw.js
Normal file
@ -0,0 +1,37 @@
|
||||
self.addEventListener("install", function () {
|
||||
self.skipWaiting();
|
||||
});
|
||||
|
||||
self.addEventListener("activate", (event) => {
|
||||
event.waitUntil(self.clients.claim());
|
||||
});
|
||||
|
||||
self.addEventListener("fetch", function (event) {
|
||||
if (event.request.cache === "only-if-cached" && event.request.mode !== "same-origin") {
|
||||
return;
|
||||
}
|
||||
|
||||
event.respondWith(
|
||||
fetch(event.request)
|
||||
.then(function (response) {
|
||||
// It seems like we only need to set the headers for index.html
|
||||
// If you want to be on the safe side, comment this out
|
||||
// if (!response.url.includes("index.html")) return response;
|
||||
|
||||
const newHeaders = new Headers(response.headers);
|
||||
newHeaders.set("Cross-Origin-Embedder-Policy", "require-corp");
|
||||
newHeaders.set("Cross-Origin-Opener-Policy", "same-origin");
|
||||
|
||||
const moddedResponse = new Response(response.body, {
|
||||
status: response.status,
|
||||
statusText: response.statusText,
|
||||
headers: newHeaders,
|
||||
});
|
||||
|
||||
return moddedResponse;
|
||||
})
|
||||
.catch(function (e) {
|
||||
console.error(e);
|
||||
})
|
||||
);
|
||||
});
|
||||
114
package.json
@ -1,14 +1,16 @@
|
||||
{
|
||||
"name": "ic-coder-plugin",
|
||||
"displayName": "IC Coder plugin",
|
||||
"name": "iccoder",
|
||||
"displayName": "IC Coder: Agentic Verilog Platform",
|
||||
"description": "Agentic Verilog Coding Platform for Real-World FPGAs",
|
||||
"version": "0.0.2",
|
||||
"version": "1.0.12",
|
||||
"publisher": "ICCoderAgenticVerilogPlatform",
|
||||
"engines": {
|
||||
"vscode": "^1.107.0"
|
||||
"vscode": "^1.80.0"
|
||||
},
|
||||
"icon": "media/图案(方底).png",
|
||||
"icon": "media/icon.png",
|
||||
"categories": [
|
||||
"Other"
|
||||
"Chat",
|
||||
"Programming Languages"
|
||||
],
|
||||
"keywords": [
|
||||
"IC",
|
||||
@ -18,9 +20,14 @@
|
||||
"eda",
|
||||
"assistant"
|
||||
],
|
||||
"license": "SEE LICENSE IN LICENSE",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://git.pengyejiatu.com/pengyejiatu/IC-Coder-Plugin.git"
|
||||
},
|
||||
"activationEvents": [
|
||||
"onCommand:ic-coder.openPanel",
|
||||
"onView:ic-coder-sidebar",
|
||||
"onView:ic-coder.mainView",
|
||||
"onLanguage:verilog",
|
||||
"onLanguage:vhdl",
|
||||
"onStartupFinished"
|
||||
@ -44,34 +51,31 @@
|
||||
"category": "IC Coder"
|
||||
},
|
||||
{
|
||||
"command": "ic-coder.viewHistory",
|
||||
"title": "查看会话历史",
|
||||
"command": "ic-coder.testNotification",
|
||||
"title": "测试系统通知",
|
||||
"category": "IC Coder"
|
||||
},
|
||||
{
|
||||
"command": "ic-coder.newSession",
|
||||
"title": "新建会话",
|
||||
"command": "ic-coder.addCodeToChat",
|
||||
"title": "添加到 IC Coder 对话",
|
||||
"category": "IC Coder"
|
||||
},
|
||||
}
|
||||
],
|
||||
"menus": {
|
||||
"editor/context": [
|
||||
{
|
||||
"command": "ic-coder.exportSession",
|
||||
"title": "导出当前会话",
|
||||
"category": "IC Coder"
|
||||
"command": "ic-coder.addCodeToChat",
|
||||
"when": "editorHasSelection",
|
||||
"group": "9_cutcopypaste"
|
||||
}
|
||||
]
|
||||
},
|
||||
"keybindings": [
|
||||
{
|
||||
"command": "ic-coder.deleteSession",
|
||||
"title": "删除会话",
|
||||
"category": "IC Coder"
|
||||
},
|
||||
{
|
||||
"command": "ic-coder.clearHistory",
|
||||
"title": "清空会话历史",
|
||||
"category": "IC Coder"
|
||||
},
|
||||
{
|
||||
"command": "ic-coder.searchSession",
|
||||
"title": "搜索会话",
|
||||
"category": "IC Coder"
|
||||
"command": "ic-coder.addCodeToChat",
|
||||
"key": "ctrl+l",
|
||||
"mac": "cmd+l",
|
||||
"when": "editorTextFocus && editorHasSelection"
|
||||
}
|
||||
],
|
||||
"viewsContainers": {
|
||||
@ -79,7 +83,7 @@
|
||||
{
|
||||
"id": "ic-coder-sidebar",
|
||||
"title": "IC Coder",
|
||||
"icon": "media/侧边栏logo.png"
|
||||
"icon": "media/sidebar-icon.png"
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -91,6 +95,46 @@
|
||||
"type": "webview"
|
||||
}
|
||||
]
|
||||
},
|
||||
"authentication": [
|
||||
{
|
||||
"id": "iccoder",
|
||||
"label": "IC Coder"
|
||||
}
|
||||
],
|
||||
"customEditors": [
|
||||
{
|
||||
"viewType": "ic-coder.vcdViewer",
|
||||
"displayName": "VCD 波形查看器",
|
||||
"selector": [
|
||||
{
|
||||
"filenamePattern": "*.vcd"
|
||||
}
|
||||
],
|
||||
"priority": "default"
|
||||
}
|
||||
],
|
||||
"configuration": {
|
||||
"title": "IC Coder",
|
||||
"properties": {
|
||||
"ic-coder.enableSystemNotification": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "启用系统级通知(任务完成时显示操作系统通知)"
|
||||
},
|
||||
"ic-coder.notificationSound": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "通知时播放系统声音"
|
||||
},
|
||||
"ic-coder.notificationTimeout": {
|
||||
"type": "number",
|
||||
"default": 10,
|
||||
"minimum": 0,
|
||||
"maximum": 60,
|
||||
"description": "通知自动消失时间(秒),0 表示不自动消失"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
@ -108,9 +152,12 @@
|
||||
"devDependencies": {
|
||||
"@types/mocha": "^10.0.10",
|
||||
"@types/node": "22.x",
|
||||
"@types/vscode": "^1.107.0",
|
||||
"@types/node-notifier": "^8.0.5",
|
||||
"@types/vscode": "^1.80.0",
|
||||
"@vscode/test-cli": "^0.0.12",
|
||||
"@vscode/test-electron": "^2.5.2",
|
||||
"@vscode/vsce": "^3.7.1",
|
||||
"copy-webpack-plugin": "^14.0.0",
|
||||
"eslint": "^9.39.1",
|
||||
"ts-loader": "^9.5.4",
|
||||
"typescript": "^5.9.3",
|
||||
@ -118,14 +165,11 @@
|
||||
"webpack": "^5.103.0",
|
||||
"webpack-cli": "^6.0.1"
|
||||
},
|
||||
"files": [
|
||||
"dist",
|
||||
"media",
|
||||
"tools"
|
||||
],
|
||||
"dependencies": {
|
||||
"@wavedrom/doppler": "^1.14.0",
|
||||
"eventsource-parser": "^3.0.6",
|
||||
"iconv-lite": "^0.7.1",
|
||||
"node-notifier": "^10.0.1",
|
||||
"onml": "^2.1.0",
|
||||
"style-mod": "^4.1.3",
|
||||
"vcd-stream": "^1.5.0",
|
||||
|
||||
2027
pnpm-lock.yaml
generated
BIN
rustup-init.exe
Normal file
BIN
src/assets/QRCode/wx.png
Normal file
|
After Width: | Height: | Size: 119 KiB |
BIN
src/assets/model/Auto.png
Normal file
|
After Width: | Height: | Size: 1.9 KiB |
BIN
src/assets/model/Max.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
src/assets/model/Sy.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
src/assets/model/lite.png
Normal file
|
After Width: | Height: | Size: 112 KiB |
BIN
src/assets/titleIcon/PRO+.png
Normal file
|
After Width: | Height: | Size: 1.3 MiB |
BIN
src/assets/titleIcon/PRO-Try.png
Normal file
|
After Width: | Height: | Size: 302 KiB |
BIN
src/assets/titleIcon/PRO.png
Normal file
|
After Width: | Height: | Size: 1.1 MiB |
BIN
src/assets/titleIcon/free.png
Normal file
|
After Width: | Height: | Size: 138 KiB |
237
src/components/codeHighlight.ts
Normal file
@ -0,0 +1,237 @@
|
||||
/**
|
||||
* 代码高亮组件
|
||||
*
|
||||
* 功能说明:
|
||||
* - 使用 highlight.js 提供专业的代码语法高亮
|
||||
* - 支持多种编程语言(Verilog, JavaScript, Python 等)
|
||||
* - 提供行内代码和代码块的不同样式
|
||||
* - 自动检测语言类型
|
||||
*/
|
||||
|
||||
/**
|
||||
* 获取 highlight.js 的 CDN 链接
|
||||
*/
|
||||
export function getHighlightJsLinks(): string {
|
||||
return `
|
||||
<!-- Highlight.js CSS (VS Code Dark+ 主题) -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/vs2015.min.css">
|
||||
<!-- Highlight.js 核心库 -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
|
||||
<!-- Verilog 语言支持 -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/verilog.min.js"></script>
|
||||
`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取代码高亮的样式
|
||||
*/
|
||||
export function getCodeHighlightStyles(): string {
|
||||
return `
|
||||
/* 代码块基础样式 */
|
||||
.segment-text pre {
|
||||
background: var(--vscode-textCodeBlock-background);
|
||||
border: 1px solid var(--vscode-panel-border);
|
||||
border-radius: 6px;
|
||||
padding: 12px;
|
||||
overflow-x: auto;
|
||||
margin: 12px 0;
|
||||
position: relative;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.segment-text pre code {
|
||||
background: transparent !important;
|
||||
padding: 0;
|
||||
border: none;
|
||||
display: block;
|
||||
line-height: 1.5;
|
||||
white-space: pre;
|
||||
font-family: 'Courier New', Consolas, 'Monaco', monospace;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
/* 行内代码样式 */
|
||||
.segment-text code:not(pre code) {
|
||||
background: var(--vscode-textCodeBlock-background);
|
||||
padding: 2px 6px;
|
||||
border-radius: 3px;
|
||||
color: var(--vscode-textPreformat-foreground);
|
||||
border: 1px solid var(--vscode-panel-border);
|
||||
font-family: 'Courier New', Consolas, 'Monaco', monospace;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
/* 覆盖 highlight.js 的背景色,使用 VSCode 主题色 */
|
||||
.segment-text pre code.hljs {
|
||||
background: transparent !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
/* 代码块语言标签 */
|
||||
.code-block-wrapper {
|
||||
position: relative;
|
||||
margin: -20px 0;
|
||||
}
|
||||
|
||||
.code-language-label {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
background: var(--vscode-badge-background);
|
||||
color: var(--vscode-badge-foreground);
|
||||
padding: 2px 8px;
|
||||
border-radius: 3px;
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
opacity: 0.8;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* 代码块复制按钮 */
|
||||
.code-copy-btn {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
background: var(--vscode-button-secondaryBackground);
|
||||
color: var(--vscode-button-secondaryForeground);
|
||||
border: 1px solid var(--vscode-button-border);
|
||||
border-radius: 4px;
|
||||
padding: 4px 8px;
|
||||
font-size: 11px;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.code-block-wrapper:hover .code-copy-btn {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.code-copy-btn:hover {
|
||||
background: var(--vscode-button-secondaryHoverBackground);
|
||||
}
|
||||
|
||||
.code-copy-btn.copied {
|
||||
background: var(--vscode-button-background);
|
||||
color: var(--vscode-button-foreground);
|
||||
}
|
||||
|
||||
/* 代码块滚动条样式 */
|
||||
.segment-text pre::-webkit-scrollbar {
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
.segment-text pre::-webkit-scrollbar-track {
|
||||
background: var(--vscode-scrollbarSlider-background);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.segment-text pre::-webkit-scrollbar-thumb {
|
||||
background: var(--vscode-scrollbarSlider-hoverBackground);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.segment-text pre::-webkit-scrollbar-thumb:hover {
|
||||
background: var(--vscode-scrollbarSlider-activeBackground);
|
||||
}
|
||||
`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取代码高亮的脚本
|
||||
*/
|
||||
export function getCodeHighlightScript(): string {
|
||||
return `
|
||||
/**
|
||||
* 使用 highlight.js 进行代码高亮
|
||||
*/
|
||||
function highlightCodeBlocks() {
|
||||
// 等待 highlight.js 加载完成
|
||||
if (typeof hljs === 'undefined') {
|
||||
setTimeout(highlightCodeBlocks, 100);
|
||||
return;
|
||||
}
|
||||
|
||||
const codeBlocks = document.querySelectorAll('.segment-text pre code:not(.hljs)');
|
||||
codeBlocks.forEach((block) => {
|
||||
hljs.highlightElement(block);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 为代码块添加复制按钮
|
||||
*/
|
||||
function enhanceCodeBlocks() {
|
||||
const codeBlocks = document.querySelectorAll('.segment-text pre code');
|
||||
|
||||
codeBlocks.forEach((codeElement) => {
|
||||
const preElement = codeElement.parentElement;
|
||||
if (!preElement || preElement.classList.contains('enhanced')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 标记为已增强,避免重复处理
|
||||
preElement.classList.add('enhanced');
|
||||
|
||||
// 应用语法高亮
|
||||
if (typeof hljs !== 'undefined' && !codeElement.classList.contains('hljs')) {
|
||||
hljs.highlightElement(codeElement);
|
||||
}
|
||||
|
||||
// 创建包装器
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.className = 'code-block-wrapper';
|
||||
preElement.parentNode.insertBefore(wrapper, preElement);
|
||||
wrapper.appendChild(preElement);
|
||||
|
||||
// 添加复制按钮
|
||||
const copyBtn = document.createElement('button');
|
||||
copyBtn.className = 'code-copy-btn';
|
||||
copyBtn.textContent = '复制';
|
||||
copyBtn.onclick = function() {
|
||||
const code = codeElement.textContent;
|
||||
navigator.clipboard.writeText(code).then(() => {
|
||||
copyBtn.textContent = '已复制';
|
||||
copyBtn.classList.add('copied');
|
||||
setTimeout(() => {
|
||||
copyBtn.textContent = '复制';
|
||||
copyBtn.classList.remove('copied');
|
||||
}, 2000);
|
||||
});
|
||||
};
|
||||
wrapper.appendChild(copyBtn);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 监听 DOM 变化,自动增强新添加的代码块
|
||||
*/
|
||||
function observeCodeBlocks() {
|
||||
const observer = new MutationObserver((mutations) => {
|
||||
mutations.forEach((mutation) => {
|
||||
if (mutation.addedNodes.length > 0) {
|
||||
enhanceCodeBlocks();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
observer.observe(document.getElementById('messages'), {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
}
|
||||
|
||||
// 初始化代码块增强
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
enhanceCodeBlocks();
|
||||
observeCodeBlocks();
|
||||
});
|
||||
} else {
|
||||
enhanceCodeBlocks();
|
||||
observeCodeBlocks();
|
||||
}
|
||||
`;
|
||||
}
|
||||
116
src/config/settings.ts
Normal file
@ -0,0 +1,116 @@
|
||||
/**
|
||||
* 配置管理
|
||||
* 支持 dev(本地开发)和 test(测试服务器)两种环境
|
||||
*/
|
||||
import * as vscode from "vscode";
|
||||
|
||||
/** 环境类型 */
|
||||
type Environment = "dev" | "test" | "prod";
|
||||
|
||||
/** 当前环境 - 修改这里切换环境 */
|
||||
const CURRENT_ENV: Environment = "prod";
|
||||
|
||||
/** 服务等级类型 */
|
||||
export type ServiceTier = "lite" | "syntaxic" | "max" | "auto";
|
||||
|
||||
/** 配置项接口 */
|
||||
export interface IccoderConfig {
|
||||
/** 后端服务地址 */
|
||||
backendUrl: string;
|
||||
/** 登录页面地址 */
|
||||
loginUrl: string;
|
||||
/** 后端服务地址(strangeLoop) */
|
||||
backendUrlStrongeLoop: string;
|
||||
/** 请求超时时间(毫秒) */
|
||||
timeout: number;
|
||||
/** 用户ID(临时使用,后续对接认证) */
|
||||
userId: string;
|
||||
/** 服务等级 */
|
||||
serviceTier: ServiceTier;
|
||||
}
|
||||
|
||||
/** 自定义配置缓存 */
|
||||
let customConfig: Partial<IccoderConfig> | null = null;
|
||||
|
||||
/** 环境配置 */
|
||||
const ENV_CONFIG: Record<Environment, IccoderConfig> = {
|
||||
/** 本地开发环境 - 通过 Gateway 路由 */
|
||||
dev: {
|
||||
backendUrl: "http://localhost:8080/iccoder",
|
||||
backendUrlStrongeLoop: "http://localhost:8080",
|
||||
loginUrl: "http://localhost/login",
|
||||
timeout: 300000,
|
||||
userId: "default-user",
|
||||
serviceTier: "max",
|
||||
},
|
||||
/** 测试服务器环境 - 通过 Gateway 路由 */
|
||||
test: {
|
||||
backendUrl: "http://192.168.1.108:2029/iccoder",
|
||||
backendUrlStrongeLoop: "http://192.168.1.108:2029",
|
||||
loginUrl: "http://192.168.1.108:2005/login",
|
||||
timeout: 60000,
|
||||
userId: "default-user",
|
||||
serviceTier: "max",
|
||||
},
|
||||
/** 生产环境 - 通过 Gateway 路由 */
|
||||
prod: {
|
||||
backendUrl: "https://api.iccoder.com",
|
||||
backendUrlStrongeLoop: "http://192.168.1.115:2029",
|
||||
loginUrl: "https://iccoder.com/login",
|
||||
timeout: 60000,
|
||||
userId: "default-user",
|
||||
serviceTier: "auto",
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* 设置自定义配置
|
||||
*/
|
||||
export function setCustomConfig(config: Partial<IccoderConfig>) {
|
||||
customConfig = config;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前环境
|
||||
*/
|
||||
export function getCurrentEnv(): Environment {
|
||||
return CURRENT_ENV;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取配置项
|
||||
*/
|
||||
export function getConfig(): IccoderConfig {
|
||||
const baseConfig = { ...ENV_CONFIG[CURRENT_ENV] };
|
||||
|
||||
// 合并自定义配置(空字符串表示使用默认)
|
||||
if (customConfig?.backendUrl && customConfig.backendUrl !== '') {
|
||||
baseConfig.backendUrl = customConfig.backendUrl;
|
||||
}
|
||||
|
||||
return baseConfig;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取后端 API 地址
|
||||
*/
|
||||
export function getApiUrl(path: string): string {
|
||||
const { backendUrl } = getConfig();
|
||||
const baseUrl = backendUrl.endsWith("/")
|
||||
? backendUrl.slice(0, -1)
|
||||
: backendUrl;
|
||||
const apiPath = path.startsWith("/") ? path : `/${path}`;
|
||||
return `${baseUrl}${apiPath}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取 StrangeLoop 服务 API 地址(用于用户信息等)
|
||||
*/
|
||||
export function getStrangeLoopApiUrl(path: string): string {
|
||||
const { backendUrlStrongeLoop } = getConfig();
|
||||
const baseUrl = backendUrlStrongeLoop.endsWith("/")
|
||||
? backendUrlStrongeLoop.slice(0, -1)
|
||||
: backendUrlStrongeLoop;
|
||||
const apiPath = path.startsWith("/") ? path : `/${path}`;
|
||||
return `${baseUrl}${apiPath}`;
|
||||
}
|
||||
202
src/constants/toolIcons.ts
Normal file
353
src/extension.ts
@ -1,28 +1,123 @@
|
||||
import * as vscode from "vscode";
|
||||
import { ICViewProvider } from "./views/ICViewProvider";
|
||||
import { showICHelperPanel } from "./panels/ICHelperPanel";
|
||||
import { VCDViewerPanel } from "./panels/VCDViewerPanel";
|
||||
import { VCDViewerPanel, VCDViewerEditorProvider } from "./panels/VCDViewerPanel";
|
||||
import { UserManualPanel } from "./panels/UserManualPanel";
|
||||
import { ChatHistoryManager } from "./utils/chatHistoryManager";
|
||||
import { ICCoderAuthenticationProvider } from "./services/icCoderAuthProvider";
|
||||
import { VCDFileServer } from "./services/vcdFileServer";
|
||||
import { isTokenExpired } from "./utils/jwtUtils";
|
||||
import { NotificationService } from "./services/notificationService";
|
||||
import { InvitationService } from "./services/invitationService";
|
||||
import { ICCoderCodeActionProvider } from "./providers/codeActionProvider";
|
||||
import { setCustomConfig } from "./config/settings";
|
||||
|
||||
export function activate(context: vscode.ExtensionContext) {
|
||||
export async function activate(context: vscode.ExtensionContext) {
|
||||
console.log("🎉 IC Coder 插件已激活!");
|
||||
|
||||
// 自动打开聊天面板
|
||||
// 加载保存的配置
|
||||
const savedSettings = context.globalState.get('generalSettings') as any;
|
||||
if (savedSettings?.backendUrl) {
|
||||
setCustomConfig({
|
||||
backendUrl: savedSettings.backendUrl,
|
||||
});
|
||||
}
|
||||
|
||||
// 创建装饰类型(代码旁边的提示)
|
||||
const decorationType = vscode.window.createTextEditorDecorationType({
|
||||
after: {
|
||||
contentText: ' Ctrl+L 添加到 IC Coder 对话',
|
||||
color: '#888',
|
||||
fontStyle: 'italic',
|
||||
margin: '0 0 0 1em'
|
||||
}
|
||||
});
|
||||
|
||||
// 更新装饰
|
||||
const updateDecorations = () => {
|
||||
const editor = vscode.window.activeTextEditor;
|
||||
if (!editor) return;
|
||||
|
||||
if (!editor.selection.isEmpty) {
|
||||
const range = new vscode.Range(editor.selection.end, editor.selection.end);
|
||||
const decoration = { range };
|
||||
editor.setDecorations(decorationType, [decoration]);
|
||||
} else {
|
||||
editor.setDecorations(decorationType, []);
|
||||
}
|
||||
};
|
||||
|
||||
context.subscriptions.push(
|
||||
vscode.window.onDidChangeTextEditorSelection(updateDecorations),
|
||||
vscode.window.onDidChangeActiveTextEditor(updateDecorations)
|
||||
);
|
||||
|
||||
updateDecorations();
|
||||
|
||||
// 初始化通知服务
|
||||
const notificationService = NotificationService.getInstance(context);
|
||||
console.log('[Extension] 通知服务已初始化');
|
||||
|
||||
// 【已禁用】登录和 token 验证 - 无需登录即可使用
|
||||
// const storedSessions = context.globalState.get<any[]>('icCoderSessions', []);
|
||||
// console.log('[Extension] 检查 sessions 数量:', storedSessions.length);
|
||||
//
|
||||
// if (storedSessions.length > 0) {
|
||||
// const session = storedSessions[0];
|
||||
// const token = session.accessToken;
|
||||
// console.log('[Extension] 检查 token 是否过期...');
|
||||
//
|
||||
// if (token) {
|
||||
// const expired = isTokenExpired(token);
|
||||
// console.log('[Extension] token 过期检查结果:', expired);
|
||||
//
|
||||
// if (expired) {
|
||||
// await context.globalState.update('icCoderSessions', []);
|
||||
// await context.globalState.update('icCoderUserInfo', undefined);
|
||||
// console.log('[Extension] Token 已过期,已清除所有登录状态');
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// 初始化 VCD 文件服务器
|
||||
const vcdFileServer = new VCDFileServer(context.extensionUri);
|
||||
vcdFileServer.start().then((port) => {
|
||||
console.log(`VCD 文件服务器已启动,端口: ${port}`);
|
||||
}).catch((error) => {
|
||||
console.error("启动 VCD 文件服务器失败:", error);
|
||||
});
|
||||
|
||||
// 在插件停用时关闭服务器
|
||||
context.subscriptions.push({
|
||||
dispose: () => vcdFileServer.stop()
|
||||
});
|
||||
|
||||
// 【已禁用】Authentication Provider 注册 - 无需登录
|
||||
const authProvider = new ICCoderAuthenticationProvider(context);
|
||||
// context.subscriptions.push(
|
||||
// vscode.authentication.registerAuthenticationProvider(
|
||||
// "iccoder",
|
||||
// "IC Coder",
|
||||
// authProvider
|
||||
// )
|
||||
// );
|
||||
|
||||
// 【已禁用】登录状态检查 - 直接打开聊天面板
|
||||
vscode.commands.executeCommand("ic-coder.openChat");
|
||||
|
||||
// 注册命令:打开助手面板
|
||||
const openPanelCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.openPanel",
|
||||
() => {
|
||||
showICHelperPanel(context);
|
||||
async () => {
|
||||
await showICHelperPanel(context);
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:打开聊天(用于侧边栏)
|
||||
const openChatCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.openChat",
|
||||
() => {
|
||||
showICHelperPanel(context);
|
||||
async () => {
|
||||
await showICHelperPanel(context);
|
||||
}
|
||||
);
|
||||
|
||||
@ -50,7 +145,217 @@ export function activate(context: vscode.ExtensionContext) {
|
||||
}
|
||||
}
|
||||
|
||||
VCDViewerPanel.createOrShow(context.extensionUri, vcdFilePath);
|
||||
VCDViewerPanel.createOrShow(context.extensionUri, vcdFilePath, vcdFileServer);
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:在浏览器中打开 VCD 波形查看器
|
||||
const openVCDViewerInBrowserCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.openVCDViewerInBrowser",
|
||||
async (vcdFilePath?: string) => {
|
||||
if (!vcdFilePath) {
|
||||
const fileUri = await vscode.window.showOpenDialog({
|
||||
canSelectFiles: true,
|
||||
canSelectFolders: false,
|
||||
canSelectMany: false,
|
||||
filters: {
|
||||
"VCD 文件": ["vcd"],
|
||||
"所有文件": ["*"],
|
||||
},
|
||||
title: "选择 VCD 文件",
|
||||
});
|
||||
|
||||
if (fileUri && fileUri[0]) {
|
||||
vcdFilePath = fileUri[0].fsPath;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// 注册文件到服务器
|
||||
const fileId = vcdFileServer.registerFile(vcdFilePath);
|
||||
const viewerUrl = vcdFileServer.getViewerUrl(fileId);
|
||||
|
||||
// 在默认浏览器中打开
|
||||
vscode.env.openExternal(vscode.Uri.parse(viewerUrl));
|
||||
vscode.window.showInformationMessage(`波形查看器已在浏览器中打开`);
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:打开用户手册
|
||||
const openUserManualCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.openUserManual",
|
||||
() => {
|
||||
UserManualPanel.render(context.extensionUri);
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:用户登录
|
||||
const loginCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.login",
|
||||
async (options?: { forceReauth?: boolean }) => {
|
||||
try {
|
||||
const forceReauth = options?.forceReauth === true;
|
||||
const session = await vscode.authentication.getSession("iccoder", [], {
|
||||
createIfNone: false,
|
||||
});
|
||||
const expired = session?.accessToken
|
||||
? isTokenExpired(session.accessToken)
|
||||
: null;
|
||||
|
||||
// 会话仍有效时,直接打开聊天面板
|
||||
if (session && expired === false && !forceReauth) {
|
||||
vscode.commands.executeCommand("ic-coder.openChat");
|
||||
return;
|
||||
}
|
||||
|
||||
// 1) 清空当前登录状态信息
|
||||
await authProvider.clearSessionsForRelogin();
|
||||
await context.globalState.update("icCoderSessions", []);
|
||||
await context.globalState.update("icCoderUserInfo", undefined);
|
||||
|
||||
// 2) 重新登录(强制新会话)
|
||||
await vscode.authentication.getSession("iccoder", [], {
|
||||
clearSessionPreference: true,
|
||||
forceNewSession: true,
|
||||
});
|
||||
} catch (error) {
|
||||
vscode.window.showErrorMessage(`登录失败: ${error}`);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:用户登出
|
||||
const logoutCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.logout",
|
||||
async () => {
|
||||
try {
|
||||
const session = await vscode.authentication.getSession("iccoder", [], { createIfNone: false });
|
||||
if (session) {
|
||||
// 调用 authProvider 的 removeSession 方法
|
||||
await authProvider.removeSession(session.id);
|
||||
// 清除邀请码验证状态
|
||||
await InvitationService.clearVerificationStatus(context);
|
||||
} else {
|
||||
vscode.window.showInformationMessage("当前未登录");
|
||||
}
|
||||
} catch (error) {
|
||||
vscode.window.showInformationMessage("当前未登录");
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:更换邀请码
|
||||
const changeInvitationCodeCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.changeInvitationCode",
|
||||
async () => {
|
||||
const confirm = await vscode.window.showWarningMessage(
|
||||
'确定要更换邀请码吗?',
|
||||
'确定',
|
||||
'取消'
|
||||
);
|
||||
|
||||
if (confirm === '确定') {
|
||||
await InvitationService.clearVerificationStatus(context);
|
||||
vscode.window.showInformationMessage('已清除邀请码,请重新验证');
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:测试系统通知
|
||||
const testNotificationCommand = vscode.commands.registerCommand(
|
||||
"ic-coder.testNotification",
|
||||
() => {
|
||||
console.log('[Extension] ========== 测试通知命令被调用 ==========');
|
||||
|
||||
// 先显示 VS Code 通知确认命令执行
|
||||
vscode.window.showInformationMessage('正在测试系统通知...');
|
||||
|
||||
// 发送系统通知
|
||||
notificationService.success(
|
||||
'IC Coder - 测试通知',
|
||||
'系统通知功能正常工作!',
|
||||
() => {
|
||||
vscode.window.showInformationMessage('您点击了系统通知!');
|
||||
}
|
||||
);
|
||||
|
||||
console.log('[Extension] 测试通知命令执行完成');
|
||||
}
|
||||
);
|
||||
|
||||
// 注册命令:将选中代码添加到对话
|
||||
const addCodeToChat = vscode.commands.registerCommand(
|
||||
"ic-coder.addCodeToChat",
|
||||
async () => {
|
||||
console.log('[addCodeToChat] 命令触发');
|
||||
const editor = vscode.window.activeTextEditor;
|
||||
if (!editor) {
|
||||
console.log('[addCodeToChat] 没有活动编辑器');
|
||||
return;
|
||||
}
|
||||
|
||||
const selection = editor.selection;
|
||||
const selectedText = editor.document.getText(selection);
|
||||
|
||||
if (!selectedText) {
|
||||
vscode.window.showWarningMessage("请先选择代码");
|
||||
return;
|
||||
}
|
||||
|
||||
const fileName = editor.document.fileName;
|
||||
const startLine = selection.start.line + 1;
|
||||
const endLine = selection.end.line + 1;
|
||||
|
||||
// 检查是否已有打开的面板
|
||||
let panel = (global as any).currentICHelperPanel;
|
||||
let needCreatePanel = false;
|
||||
|
||||
if (!panel) {
|
||||
needCreatePanel = true;
|
||||
} else {
|
||||
// 尝试访问 webview,如果抛出异常说明已销毁
|
||||
try {
|
||||
const _ = panel.webview;
|
||||
} catch (e) {
|
||||
needCreatePanel = true;
|
||||
}
|
||||
}
|
||||
|
||||
console.log('[addCodeToChat] 需要创建面板:', needCreatePanel);
|
||||
|
||||
if (needCreatePanel) {
|
||||
console.log('[addCodeToChat] 正在打开面板...');
|
||||
await showICHelperPanel(context);
|
||||
panel = (global as any).currentICHelperPanel;
|
||||
console.log('[addCodeToChat] 面板打开后状态:', panel ? '成功' : '失败');
|
||||
|
||||
// 如果面板仍未创建(如未登录),直接返回
|
||||
if (!panel) {
|
||||
console.log('[addCodeToChat] 面板创建失败,退出');
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// 发送代码上下文
|
||||
console.log('[addCodeToChat] 准备发送代码到面板');
|
||||
setTimeout(() => {
|
||||
try {
|
||||
if (panel?.webview) {
|
||||
console.log('[addCodeToChat] 发送 addCodeContext 消息');
|
||||
panel.webview.postMessage({
|
||||
command: 'addCodeContext',
|
||||
fileName,
|
||||
startLine,
|
||||
endLine,
|
||||
code: selectedText,
|
||||
languageId: editor.document.languageId
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('[addCodeToChat] 发送消息失败:', e);
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
);
|
||||
|
||||
@ -102,10 +407,25 @@ export function activate(context: vscode.ExtensionContext) {
|
||||
*/
|
||||
|
||||
// 注册侧边栏视图
|
||||
const viewProvider = new ICViewProvider(context.extensionUri);
|
||||
const viewProvider = new ICViewProvider(context.extensionUri, context);
|
||||
const viewRegistration = vscode.window.registerWebviewViewProvider(
|
||||
"ic-coder.mainView",
|
||||
viewProvider
|
||||
viewProvider,
|
||||
{
|
||||
webviewOptions: {
|
||||
retainContextWhenHidden: true
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// 注册 VCD 自定义编辑器
|
||||
const vcdEditorProvider = VCDViewerEditorProvider.register(context, vcdFileServer);
|
||||
|
||||
// 注册 Code Action Provider
|
||||
const codeActionProvider = vscode.languages.registerCodeActionsProvider(
|
||||
{ scheme: 'file' },
|
||||
new ICCoderCodeActionProvider(),
|
||||
{ providedCodeActionKinds: [vscode.CodeActionKind.RefactorRewrite] }
|
||||
);
|
||||
|
||||
// 添加到订阅
|
||||
@ -113,6 +433,15 @@ export function activate(context: vscode.ExtensionContext) {
|
||||
openPanelCommand,
|
||||
openChatCommand,
|
||||
openVCDViewerCommand,
|
||||
openVCDViewerInBrowserCommand,
|
||||
openUserManualCommand,
|
||||
loginCommand,
|
||||
logoutCommand,
|
||||
changeInvitationCodeCommand,
|
||||
testNotificationCommand,
|
||||
addCodeToChat,
|
||||
// testTrialUserCommand,
|
||||
// testExpiredUserCommand,
|
||||
// TODO: 等待重新实现这些命令
|
||||
// viewHistoryCommand,
|
||||
// newSessionCommand,
|
||||
@ -120,7 +449,9 @@ export function activate(context: vscode.ExtensionContext) {
|
||||
// deleteSessionCommand,
|
||||
// clearHistoryCommand,
|
||||
// searchSessionCommand,
|
||||
viewRegistration
|
||||
viewRegistration,
|
||||
vcdEditorProvider,
|
||||
codeActionProvider
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
78
src/panels/ExpiredPanel.ts
Normal file
@ -0,0 +1,78 @@
|
||||
/**
|
||||
* 试用期到期提醒面板
|
||||
* 功能:试用期到期时显示续费提示
|
||||
* 依赖:vscode
|
||||
* 使用场景:试用用户到期时显示
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
export class ExpiredPanel {
|
||||
public static render() {
|
||||
const panel = vscode.window.createWebviewPanel(
|
||||
'icCoderExpired',
|
||||
'试用期已到期',
|
||||
vscode.ViewColumn.One,
|
||||
{ enableScripts: true }
|
||||
);
|
||||
|
||||
panel.webview.html = this.getHtmlContent();
|
||||
}
|
||||
|
||||
private static getHtmlContent(): string {
|
||||
return `
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
body {
|
||||
padding: 60px 40px;
|
||||
text-align: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
color: var(--vscode-foreground);
|
||||
background-color: var(--vscode-editor-background);
|
||||
}
|
||||
h1 {
|
||||
color: var(--vscode-errorForeground);
|
||||
font-size: 28px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
margin: 15px 0;
|
||||
color: var(--vscode-descriptionForeground);
|
||||
}
|
||||
.button {
|
||||
padding: 12px 30px;
|
||||
background: var(--vscode-button-background);
|
||||
color: var(--vscode-button-foreground);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
margin: 10px;
|
||||
}
|
||||
.button:hover {
|
||||
background: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>⏰ 您的试用期已到期</h1>
|
||||
<p>感谢您使用 IC Coder!您的 15 天试用期已结束。</p>
|
||||
<p>如需继续使用,请联系我们获取正式版本。</p>
|
||||
|
||||
<button class="button" onclick="contact()">联系我们</button>
|
||||
|
||||
<script>
|
||||
function contact() {
|
||||
window.open('https://iccoder.com/contact', '_blank');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
`;
|
||||
}
|
||||
}
|
||||
181
src/panels/UserManualPanel.ts
Normal file
@ -0,0 +1,181 @@
|
||||
/**
|
||||
* 用户手册只读预览面板
|
||||
*/
|
||||
|
||||
import * as vscode from "vscode";
|
||||
|
||||
export class UserManualPanel {
|
||||
public static currentPanel: UserManualPanel | undefined;
|
||||
private readonly _panel: vscode.WebviewPanel;
|
||||
private _disposables: vscode.Disposable[] = [];
|
||||
|
||||
private constructor(panel: vscode.WebviewPanel, extensionUri: vscode.Uri) {
|
||||
this._panel = panel;
|
||||
this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
|
||||
this._update(extensionUri);
|
||||
}
|
||||
|
||||
public static render(extensionUri: vscode.Uri) {
|
||||
if (UserManualPanel.currentPanel) {
|
||||
UserManualPanel.currentPanel._panel.reveal(vscode.ViewColumn.One);
|
||||
} else {
|
||||
const panel = vscode.window.createWebviewPanel(
|
||||
"userManual",
|
||||
"IC Coder 用户手册",
|
||||
vscode.ViewColumn.One,
|
||||
{
|
||||
enableScripts: true,
|
||||
localResourceRoots: [vscode.Uri.joinPath(extensionUri, "media")],
|
||||
},
|
||||
);
|
||||
UserManualPanel.currentPanel = new UserManualPanel(panel, extensionUri);
|
||||
}
|
||||
}
|
||||
|
||||
private async _update(extensionUri: vscode.Uri) {
|
||||
const manualPath = vscode.Uri.joinPath(
|
||||
extensionUri,
|
||||
"media",
|
||||
"USER_MANUAL.md",
|
||||
);
|
||||
const markdown = await vscode.workspace.fs.readFile(manualPath);
|
||||
const content = Buffer.from(markdown).toString("utf-8");
|
||||
this._panel.webview.html = await this._getHtmlContent(
|
||||
content,
|
||||
extensionUri,
|
||||
);
|
||||
}
|
||||
|
||||
private async _getHtmlContent(
|
||||
markdown: string,
|
||||
extensionUri: vscode.Uri,
|
||||
): Promise<string> {
|
||||
let inCodeBlock = false;
|
||||
let inTable = false;
|
||||
let tableRows: string[] = [];
|
||||
const lines: string[] = [];
|
||||
|
||||
// 先处理图片
|
||||
markdown = markdown.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, (_, alt, src) => {
|
||||
const imgUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(extensionUri, "media", src),
|
||||
);
|
||||
return `<img src="${imgUri}" alt="${alt}">`;
|
||||
});
|
||||
|
||||
markdown.split("\n").forEach((line) => {
|
||||
// 代码块
|
||||
if (line.startsWith("```")) {
|
||||
if (inCodeBlock) {
|
||||
lines.push("</code></pre>");
|
||||
inCodeBlock = false;
|
||||
} else {
|
||||
lines.push("<pre><code>");
|
||||
inCodeBlock = true;
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (inCodeBlock) {
|
||||
lines.push(line);
|
||||
return;
|
||||
}
|
||||
|
||||
// 表格
|
||||
if (line.startsWith("|")) {
|
||||
if (!inTable) inTable = true;
|
||||
tableRows.push(line);
|
||||
return;
|
||||
} else if (inTable) {
|
||||
// 表格结束
|
||||
const headers = tableRows[0]
|
||||
.split("|")
|
||||
.filter((c) => c.trim())
|
||||
.map((h) => `<th>${h.trim()}</th>`)
|
||||
.join("");
|
||||
const body = tableRows
|
||||
.slice(2)
|
||||
.map(
|
||||
(r) =>
|
||||
"<tr>" +
|
||||
r
|
||||
.split("|")
|
||||
.filter((c) => c.trim())
|
||||
.map((c) => `<td>${c.trim()}</td>`)
|
||||
.join("") +
|
||||
"</tr>",
|
||||
)
|
||||
.join("");
|
||||
lines.push(
|
||||
`<table><thead><tr>${headers}</tr></thead><tbody>${body}</tbody></table>`,
|
||||
);
|
||||
tableRows = [];
|
||||
inTable = false;
|
||||
}
|
||||
|
||||
// 其他行
|
||||
if (line === "---") lines.push("<hr>");
|
||||
else if (line.startsWith("#### "))
|
||||
lines.push(`<h4>${line.slice(5)}</h4>`);
|
||||
else if (line.startsWith("### ")) lines.push(`<h3>${line.slice(4)}</h3>`);
|
||||
else if (line.startsWith("## ")) lines.push(`<h2>${line.slice(3)}</h2>`);
|
||||
else if (line.startsWith("# ")) lines.push(`<h1>${line.slice(2)}</h1>`);
|
||||
else if (line.startsWith("- "))
|
||||
lines.push(
|
||||
`<li>${line.slice(2).replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>")}</li>`,
|
||||
);
|
||||
else if (line.trim() === "") lines.push("<p></p>");
|
||||
else
|
||||
lines.push(
|
||||
`<p>${line.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>").replace(/\[(.+?)\]\((.+?)\)/g, '<a href="$2">$1</a>')}</p>`,
|
||||
);
|
||||
});
|
||||
|
||||
const html = lines
|
||||
.join("\n")
|
||||
.replace(/((?:<li>.*<\/li>\n?)+)/g, "<ul>$1</ul>");
|
||||
|
||||
return `<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
padding: 40px;
|
||||
line-height: 1.8;
|
||||
font-size: 16px;
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
h1 { font-size: 2em; border-bottom: 3px solid #ddd; padding-bottom: 15px; margin: 30px 0 20px; }
|
||||
h2 { font-size: 1.6em; margin-top: 40px; border-bottom: 2px solid #eee; padding-bottom: 10px; }
|
||||
h3 { font-size: 1.3em; margin-top: 30px; }
|
||||
h4 { font-size: 1.1em; margin-top: 20px; font-weight: 600; }
|
||||
p { margin: 15px 0; }
|
||||
img { display: block; margin: 30px auto; max-width: 100%; border: 1px solid #ddd; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
|
||||
table { border-collapse: collapse; width: 100%; margin: 25px 0; font-size: 15px; }
|
||||
th, td { border: 1px solid #ddd; padding: 12px 16px; text-align: left; }
|
||||
th { background: #636363; font-weight: 600; }
|
||||
tr:hover { background: #636363; }
|
||||
ul { margin: 15px 0; padding-left: 30px; }
|
||||
li { margin: 8px 0; margin-left: 40px;}
|
||||
pre { background: #2f2f2f; padding: 20px; border-radius: 6px; overflow-x: auto; margin: 20px 0; border: 1px solid #e0e0e0; }
|
||||
code { font-family: 'Consolas', 'Monaco', monospace; font-size: 14px; line-height: 1.6; }
|
||||
hr { border: none; border-top: 2px solid #e0e0e0; margin: 30px 0; }
|
||||
a { color: #0066cc; text-decoration: none; }
|
||||
a:hover { text-decoration: underline; }
|
||||
strong { font-weight: 600; color: #e5e5e5; }
|
||||
</style>
|
||||
</head>
|
||||
<body>${html}</body>
|
||||
</html>`;
|
||||
}
|
||||
|
||||
public dispose() {
|
||||
UserManualPanel.currentPanel = undefined;
|
||||
this._panel.dispose();
|
||||
while (this._disposables.length) {
|
||||
this._disposables.pop()?.dispose();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,19 +1,86 @@
|
||||
import * as vscode from "vscode";
|
||||
import * as path from "path";
|
||||
import * as fs from "fs";
|
||||
import { VCDFileServer } from "../services/vcdFileServer";
|
||||
|
||||
/**
|
||||
* VCD 波形查看器面板
|
||||
* VCD 波形查看器自定义编辑器提供者
|
||||
*/
|
||||
export class VCDViewerEditorProvider
|
||||
implements vscode.CustomReadonlyEditorProvider
|
||||
{
|
||||
public static register(
|
||||
context: vscode.ExtensionContext,
|
||||
vcdFileServer: VCDFileServer,
|
||||
): vscode.Disposable {
|
||||
const provider = new VCDViewerEditorProvider(context, vcdFileServer);
|
||||
const providerRegistration = vscode.window.registerCustomEditorProvider(
|
||||
"ic-coder.vcdViewer",
|
||||
provider,
|
||||
{
|
||||
webviewOptions: {
|
||||
retainContextWhenHidden: true,
|
||||
},
|
||||
},
|
||||
);
|
||||
return providerRegistration;
|
||||
}
|
||||
|
||||
constructor(
|
||||
private readonly context: vscode.ExtensionContext,
|
||||
private readonly vcdFileServer: VCDFileServer,
|
||||
) {}
|
||||
|
||||
async openCustomDocument(
|
||||
uri: vscode.Uri,
|
||||
openContext: vscode.CustomDocumentOpenContext,
|
||||
token: vscode.CancellationToken,
|
||||
): Promise<vscode.CustomDocument> {
|
||||
return {
|
||||
uri,
|
||||
dispose: () => {},
|
||||
};
|
||||
}
|
||||
|
||||
async resolveCustomEditor(
|
||||
document: vscode.CustomDocument,
|
||||
webviewPanel: vscode.WebviewPanel,
|
||||
token: vscode.CancellationToken,
|
||||
): Promise<void> {
|
||||
webviewPanel.webview.options = {
|
||||
enableScripts: true,
|
||||
localResourceRoots: [this.context.extensionUri],
|
||||
};
|
||||
|
||||
// 使用公共工厂方法创建 VCD 查看器实例
|
||||
VCDViewerPanel.createFromWebviewPanel(
|
||||
webviewPanel,
|
||||
this.context.extensionUri,
|
||||
document.uri.fsPath,
|
||||
this.vcdFileServer,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* VCD 波形查看器面板 (使用 Surfer)
|
||||
*/
|
||||
export class VCDViewerPanel {
|
||||
public static currentPanel: VCDViewerPanel | undefined;
|
||||
private readonly _panel: vscode.WebviewPanel;
|
||||
private readonly _extensionUri: vscode.Uri;
|
||||
private _disposables: vscode.Disposable[] = [];
|
||||
private _currentVcdPath: string | undefined;
|
||||
private _vcdFileServer: VCDFileServer | undefined;
|
||||
|
||||
private constructor(panel: vscode.WebviewPanel, extensionUri: vscode.Uri) {
|
||||
private constructor(
|
||||
panel: vscode.WebviewPanel,
|
||||
extensionUri: vscode.Uri,
|
||||
vcdFileServer?: VCDFileServer,
|
||||
) {
|
||||
this._panel = panel;
|
||||
this._extensionUri = extensionUri;
|
||||
this._vcdFileServer = vcdFileServer;
|
||||
|
||||
// 设置初始 HTML 内容
|
||||
this._panel.webview.html = this._getLoadingHtml();
|
||||
@ -24,24 +91,40 @@ export class VCDViewerPanel {
|
||||
// 监听来自 webview 的消息
|
||||
this._panel.webview.onDidReceiveMessage(
|
||||
(message) => {
|
||||
console.log("[VCDViewerPanel] 收到消息:", message);
|
||||
switch (message.command) {
|
||||
case "loadVCD":
|
||||
if (message.filePath) {
|
||||
this.loadVCDFile(message.filePath);
|
||||
}
|
||||
break;
|
||||
case "loaded":
|
||||
// Surfer iframe 加载完成,发送 VCD 文件
|
||||
console.log(
|
||||
"[VCDViewerPanel] Surfer 已加载,当前 VCD 路径:",
|
||||
this._currentVcdPath,
|
||||
);
|
||||
if (this._currentVcdPath) {
|
||||
this.sendVcdToSurfer(this._currentVcdPath);
|
||||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
null,
|
||||
this._disposables
|
||||
this._disposables,
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建或显示 VCD 查看器面板
|
||||
*/
|
||||
public static createOrShow(extensionUri: vscode.Uri, vcdFilePath?: string) {
|
||||
const column = vscode.ViewColumn.One;
|
||||
public static createOrShow(
|
||||
extensionUri: vscode.Uri,
|
||||
vcdFilePath?: string,
|
||||
vcdFileServer?: VCDFileServer,
|
||||
) {
|
||||
// 在当前活动编辑器旁边打开新列
|
||||
const column = vscode.ViewColumn.Beside;
|
||||
|
||||
// 如果已经有面板打开,则显示它
|
||||
if (VCDViewerPanel.currentPanel) {
|
||||
@ -61,10 +144,14 @@ export class VCDViewerPanel {
|
||||
enableScripts: true,
|
||||
retainContextWhenHidden: true,
|
||||
localResourceRoots: [extensionUri],
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
VCDViewerPanel.currentPanel = new VCDViewerPanel(panel, extensionUri);
|
||||
VCDViewerPanel.currentPanel = new VCDViewerPanel(
|
||||
panel,
|
||||
extensionUri,
|
||||
vcdFileServer,
|
||||
);
|
||||
|
||||
// 如果提供了 VCD 文件路径,加载它
|
||||
if (vcdFilePath) {
|
||||
@ -72,26 +159,145 @@ export class VCDViewerPanel {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 从已有的 webview panel 创建 VCD 查看器(用于自定义编辑器)
|
||||
*/
|
||||
public static createFromWebviewPanel(
|
||||
panel: vscode.WebviewPanel,
|
||||
extensionUri: vscode.Uri,
|
||||
vcdFilePath: string,
|
||||
vcdFileServer?: VCDFileServer,
|
||||
) {
|
||||
const viewer = new VCDViewerPanel(panel, extensionUri, vcdFileServer);
|
||||
viewer.loadVCDFile(vcdFilePath);
|
||||
return viewer;
|
||||
}
|
||||
|
||||
/**
|
||||
* 加载 VCD 文件
|
||||
*/
|
||||
public loadVCDFile(vcdFilePath: string) {
|
||||
try {
|
||||
console.log("[VCDViewerPanel] 开始加载 VCD 文件:", vcdFilePath);
|
||||
|
||||
// 检查文件是否存在
|
||||
if (!fs.existsSync(vcdFilePath)) {
|
||||
vscode.window.showErrorMessage(`VCD 文件不存在: ${vcdFilePath}`);
|
||||
return;
|
||||
}
|
||||
|
||||
// 保存当前 VCD 路径
|
||||
this._currentVcdPath = vcdFilePath;
|
||||
console.log("[VCDViewerPanel] VCD 路径已保存:", this._currentVcdPath);
|
||||
|
||||
// 更新面板标题
|
||||
const fileName = path.basename(vcdFilePath);
|
||||
this._panel.title = `VCD 波形查看器 - ${fileName}`;
|
||||
this._panel.title = `波形查看器 - ${fileName}`;
|
||||
|
||||
// 设置 HTML 内容
|
||||
this._panel.webview.html = this._getWebviewContent(vcdFilePath);
|
||||
this._panel.webview.html = this._getWebviewContent();
|
||||
console.log("[VCDViewerPanel] Webview HTML 已设置");
|
||||
} catch (error) {
|
||||
vscode.window.showErrorMessage(
|
||||
`加载 VCD 文件失败: ${error instanceof Error ? error.message : "未知错误"}`
|
||||
`加载 VCD 文件失败: ${error instanceof Error ? error.message : "未知错误"}`,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析 VCD 文件获取根模块及其直接子模块名称
|
||||
*/
|
||||
private parseVcdRootScope(vcdFilePath: string): string[] {
|
||||
try {
|
||||
// 读取 VCD 文件
|
||||
const buffer = fs.readFileSync(vcdFilePath, { encoding: "utf8" });
|
||||
const lines = buffer.split("\n");
|
||||
|
||||
const scopeNames: string[] = [];
|
||||
let scopeDepth = 0;
|
||||
const scopeStack: string[] = [];
|
||||
|
||||
for (const line of lines) {
|
||||
const trimmed = line.trim();
|
||||
|
||||
// 遇到 $enddefinitions 就停止解析
|
||||
if (trimmed.startsWith("$enddefinitions")) {
|
||||
break;
|
||||
}
|
||||
|
||||
// 查找 $scope 定义
|
||||
const scopeMatch = trimmed.match(/^\$scope\s+(\w+)\s+(\w+)/);
|
||||
if (scopeMatch) {
|
||||
const scopeType = scopeMatch[1];
|
||||
const scopeName = scopeMatch[2];
|
||||
|
||||
// 记录顶层 module (depth = 0)
|
||||
if (scopeDepth === 0 && scopeType === "module") {
|
||||
scopeStack.push(scopeName);
|
||||
console.log("[VCDViewerPanel] 找到顶层作用域:", scopeName);
|
||||
}
|
||||
// 记录顶层下的直接子模块 (depth = 1)
|
||||
else if (scopeDepth === 1 && scopeType === "module") {
|
||||
const fullPath = [...scopeStack, scopeName];
|
||||
scopeNames.push(fullPath.join("."));
|
||||
console.log("[VCDViewerPanel] 找到子模块:", fullPath.join("."));
|
||||
}
|
||||
|
||||
scopeDepth++;
|
||||
}
|
||||
|
||||
// 遇到 $upscope 减少深度
|
||||
if (trimmed.startsWith("$upscope")) {
|
||||
scopeDepth--;
|
||||
if (scopeDepth === 0) {
|
||||
scopeStack.pop();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return scopeNames;
|
||||
} catch (error) {
|
||||
console.error("[VCDViewerPanel] 解析 VCD 文件失败:", error);
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送 VCD 文件到 Surfer
|
||||
*/
|
||||
private sendVcdToSurfer(vcdFilePath: string) {
|
||||
try {
|
||||
console.log("[VCDViewerPanel] 准备发送 VCD 到 Surfer:", vcdFilePath);
|
||||
|
||||
if (!this._vcdFileServer) {
|
||||
throw new Error("VCD 文件服务器未初始化");
|
||||
}
|
||||
|
||||
// 解析 VCD 文件获取根模块名称
|
||||
const scopeNames = this.parseVcdRootScope(vcdFilePath);
|
||||
console.log("[VCDViewerPanel] 解析到的作用域名称:", scopeNames);
|
||||
|
||||
// 注册文件到 HTTP 服务器
|
||||
const fileId = this._vcdFileServer.registerFile(vcdFilePath);
|
||||
const httpUrl = this._vcdFileServer.getFileUrl(fileId);
|
||||
const fileName = path.basename(vcdFilePath);
|
||||
|
||||
console.log("[VCDViewerPanel] 文件名:", fileName);
|
||||
console.log("[VCDViewerPanel] HTTP URL:", httpUrl);
|
||||
|
||||
// 使用 LoadUrl 命令通过 HTTP 加载文件
|
||||
this._panel.webview.postMessage({
|
||||
command: "loadVcdUrl",
|
||||
url: httpUrl,
|
||||
fileName: fileName,
|
||||
scopeNames: scopeNames, // 传递解析到的作用域名称
|
||||
});
|
||||
|
||||
console.log("[VCDViewerPanel] 已发送 loadVcdUrl 消息到 webview");
|
||||
} catch (error) {
|
||||
console.error("[VCDViewerPanel] 发送 VCD 数据失败:", error);
|
||||
vscode.window.showErrorMessage(
|
||||
`发送 VCD 数据失败: ${error instanceof Error ? error.message : "未知错误"}`,
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -163,188 +369,249 @@ export class VCDViewerPanel {
|
||||
/**
|
||||
* 获取 Webview 的 HTML 内容
|
||||
*/
|
||||
private _getWebviewContent(vcdFilePath: string): string {
|
||||
// 获取资源 URI
|
||||
const vcdromJsUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this._extensionUri, "media", "vcdrom", "vcdrom.js")
|
||||
private _getWebviewContent(): string {
|
||||
// 获取 surfer 资源 URI
|
||||
const surferJsUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this._extensionUri, "media", "surfer", "surfer.js"),
|
||||
);
|
||||
const vcdWasmUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this._extensionUri, "media", "vcdrom", "vcd.wasm")
|
||||
const surferWasmUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(
|
||||
this._extensionUri,
|
||||
"media",
|
||||
"surfer",
|
||||
"surfer_bg.wasm",
|
||||
),
|
||||
);
|
||||
const fontRegularUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this._extensionUri, "media", "vcdrom", "IosevkaDrom-Regular.woff2")
|
||||
const integrationJsUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(
|
||||
this._extensionUri,
|
||||
"media",
|
||||
"surfer",
|
||||
"integration.js",
|
||||
),
|
||||
);
|
||||
const fontObliqueUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this._extensionUri, "media", "vcdrom", "IosevkaDrom-Oblique.woff2")
|
||||
);
|
||||
const fontItalicUri = this._panel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this._extensionUri, "media", "vcdrom", "IosevkaDrom-Italic.woff2")
|
||||
);
|
||||
|
||||
// 读取 VCD 文件内容并转换为 base64
|
||||
const vcdContent = fs.readFileSync(vcdFilePath, "utf-8");
|
||||
const vcdBase64 = Buffer.from(vcdContent).toString("base64");
|
||||
|
||||
return `<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; font-src ${this._panel.webview.cspSource}; style-src 'unsafe-inline' ${this._panel.webview.cspSource}; script-src 'unsafe-inline' 'unsafe-eval' ${this._panel.webview.cspSource}; img-src ${this._panel.webview.cspSource} data:; connect-src ${this._panel.webview.cspSource};">
|
||||
<title>VCD 波形查看器</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; style-src 'unsafe-inline'; script-src 'unsafe-inline' 'unsafe-eval' ${this._panel.webview.cspSource}; worker-src blob:; connect-src ${this._panel.webview.cspSource} blob: http://127.0.0.1:*;">
|
||||
<title>波形查看器</title>
|
||||
|
||||
<script>
|
||||
// 获取 VS Code API(只能调用一次)
|
||||
const vscode = acquireVsCodeApi();
|
||||
window.vscode = vscode;
|
||||
window.surferReady = false;
|
||||
window.pendingVcdData = null;
|
||||
|
||||
function on_surfer_error(msg) {
|
||||
console.log("Surfer error:", msg);
|
||||
document.getElementById("error_message").innerHTML = msg;
|
||||
document.getElementById("error_container").style.display = "block";
|
||||
}
|
||||
window.on_surfer_error = on_surfer_error;
|
||||
|
||||
// 加载 VCD URL 的函数
|
||||
function loadVcdUrl(data) {
|
||||
try {
|
||||
console.log('[Webview] ========== 开始加载 VCD URL ==========');
|
||||
console.log('[Webview] URL:', data.url);
|
||||
console.log('[Webview] Scope names from VCD:', data.scopeNames);
|
||||
|
||||
// 使用 setTimeout 确保 Surfer 完全准备好
|
||||
setTimeout(() => {
|
||||
console.log('[Webview] 通过 postMessage 发送 LoadUrl 命令');
|
||||
|
||||
// 使用 integration.js 提供的标准 LoadUrl 命令
|
||||
window.postMessage({
|
||||
command: 'LoadUrl',
|
||||
url: data.url
|
||||
}, '*');
|
||||
|
||||
console.log('[Webview] ✅ 已发送 LoadUrl 命令');
|
||||
|
||||
// 等待文件加载完成后,自动添加所有信号
|
||||
setTimeout(async () => {
|
||||
try {
|
||||
console.log('[Webview] Attempting to add all signals automatically');
|
||||
|
||||
// 使用从 VCD 文件解析出来的作用域名称
|
||||
let scopeNamesToTry = [];
|
||||
|
||||
if (data.scopeNames && data.scopeNames.length > 0) {
|
||||
// 使用解析出来的实际子模块路径(例如 "tb.dut")
|
||||
scopeNamesToTry = data.scopeNames.map(path => path.split('.'));
|
||||
console.log('[Webview] Using parsed scope names:', scopeNamesToTry);
|
||||
} else {
|
||||
// 回退到常见的根作用域名称
|
||||
scopeNamesToTry = [
|
||||
['top'],
|
||||
['testbench'],
|
||||
['tb'],
|
||||
['test'],
|
||||
['dut']
|
||||
];
|
||||
console.log('[Webview] Using fallback scope names');
|
||||
}
|
||||
|
||||
for (let i = 0; i < scopeNamesToTry.length; i++) {
|
||||
const scopeName = scopeNamesToTry[i];
|
||||
try {
|
||||
const addScopeMsg = {
|
||||
"AddScope": [
|
||||
{
|
||||
"strs": scopeName,
|
||||
"id": {"Wellen": i + 1}
|
||||
},
|
||||
true // 递归添加子模块的所有信号
|
||||
]
|
||||
};
|
||||
window.inject_message(JSON.stringify(addScopeMsg));
|
||||
console.log('[Webview] Sent AddScope for: ' + scopeName.join('.') + ' (recursive)');
|
||||
} catch (e) {
|
||||
console.log('[Webview] Failed for scope: ' + scopeName.join('.'), e);
|
||||
}
|
||||
}
|
||||
|
||||
// 等待信号加载完成后,自动缩放到全部时间范围
|
||||
setTimeout(() => {
|
||||
try {
|
||||
window.inject_message(JSON.stringify("ZoomToFit"));
|
||||
console.log('[Webview] Sent ZoomToFit command');
|
||||
} catch (e) {
|
||||
console.log('[Webview] ZoomToFit failed:', e);
|
||||
}
|
||||
}, 500);
|
||||
|
||||
} catch (e) {
|
||||
console.error('[Webview] Failed to add signals:', e);
|
||||
}
|
||||
}, 1500);
|
||||
|
||||
}, 100);
|
||||
|
||||
} catch (error) {
|
||||
console.error('[Webview] ❌ 加载 VCD 失败:', error);
|
||||
on_surfer_error(error.message + '\\n' + error.stack);
|
||||
}
|
||||
}
|
||||
window.loadVcdUrl = loadVcdUrl;
|
||||
</script>
|
||||
|
||||
<script type="module">
|
||||
console.log('[Webview] 开始初始化 Surfer...');
|
||||
import init from '${surferJsUri}';
|
||||
await init({module_or_path: '${surferWasmUri}'});
|
||||
console.log('[Webview] Surfer WASM 已加载');
|
||||
|
||||
import {WebHandle, inject_message, id_of_name, draw_text_arrow} from '${surferJsUri}';
|
||||
window.inject_message = inject_message;
|
||||
window.id_of_name = id_of_name;
|
||||
window.draw_text_arrow = draw_text_arrow;
|
||||
|
||||
console.log('[Webview] Surfer 函数已导入,inject_message 类型:', typeof window.inject_message);
|
||||
|
||||
// 等待一小段时间确保 Surfer 完全初始化
|
||||
await new Promise(resolve => setTimeout(resolve, 100));
|
||||
|
||||
window.surferReady = true;
|
||||
console.log('[Webview] Surfer 已完全初始化并准备就绪');
|
||||
|
||||
// 关闭 Surfer 的日志面板(如果打开的话)
|
||||
try {
|
||||
window.inject_message(JSON.stringify("ToggleLogs"));
|
||||
console.log('[Webview] 已发送关闭日志面板命令');
|
||||
} catch (e) {
|
||||
console.log('[Webview] 关闭日志面板失败:', e);
|
||||
}
|
||||
|
||||
// 如果有待处理的 VCD 数据,现在加载它
|
||||
if (window.pendingVcdData) {
|
||||
console.log('[Webview] 发现待处理的 VCD 数据,立即加载');
|
||||
loadVcdUrl(window.pendingVcdData);
|
||||
window.pendingVcdData = null;
|
||||
} else {
|
||||
console.log('[Webview] 没有待处理的 VCD 数据');
|
||||
}
|
||||
|
||||
// 通知 VS Code surfer 已加载完成
|
||||
console.log('[Webview] 发送 loaded 消息到 VS Code');
|
||||
window.vscode.postMessage({ command: 'loaded' });
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: 'Iosevka Drom Web';
|
||||
font-display: swap;
|
||||
font-weight: 400;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
src: url('${fontRegularUri}') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Iosevka Drom Web';
|
||||
font-display: swap;
|
||||
font-weight: 400;
|
||||
font-stretch: normal;
|
||||
font-style: oblique;
|
||||
src: url('${fontObliqueUri}') format('woff2');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Iosevka Drom Web';
|
||||
font-display: swap;
|
||||
font-weight: 400;
|
||||
font-stretch: normal;
|
||||
font-style: italic;
|
||||
src: url('${fontItalicUri}') format('woff2');
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Iosevka Drom Web', monospace;
|
||||
color: var(--vscode-foreground);
|
||||
background-color: var(--vscode-editor-background);
|
||||
html, body {
|
||||
overflow: hidden;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: var(--vscode-editor-background);
|
||||
}
|
||||
|
||||
#waveform-container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#waveform1 {
|
||||
canvas {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.loading {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
border: 4px solid var(--vscode-progressBar-background);
|
||||
border-top: 4px solid var(--vscode-progressBar-foreground);
|
||||
border-radius: 50%;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
animation: spin 1s linear infinite;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.error-message {
|
||||
padding: 20px;
|
||||
#error_container {
|
||||
padding: 1em;
|
||||
border-radius: 0.5em;
|
||||
margin: 0px auto;
|
||||
max-width: 980px;
|
||||
color: var(--vscode-errorForeground);
|
||||
background-color: var(--vscode-inputValidation-errorBackground);
|
||||
border: 1px solid var(--vscode-inputValidation-errorBorder);
|
||||
border-radius: 4px;
|
||||
margin: 20px;
|
||||
position: relative;
|
||||
height: 90%;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
#error_message {
|
||||
overflow: scroll;
|
||||
white-space: break-spaces;
|
||||
}
|
||||
</style>
|
||||
<script src="${vcdromJsUri}"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="waveform-container">
|
||||
<div class="loading">
|
||||
<div class="spinner"></div>
|
||||
<p>正在加载 VCD 波形...</p>
|
||||
</div>
|
||||
<div id="waveform1"></div>
|
||||
<canvas id="the_canvas_id"></canvas>
|
||||
|
||||
<div id="error_container" style="display: none;">
|
||||
<h3>❌ Surfer 加载失败</h3>
|
||||
<code id="error_message"></code>
|
||||
</div>
|
||||
|
||||
<script src="${integrationJsUri}"></script>
|
||||
<script>
|
||||
(async function() {
|
||||
try {
|
||||
// 设置 WASM 文件路径
|
||||
window.wasmBinaryFile = '${vcdWasmUri}';
|
||||
register_message_listener();
|
||||
|
||||
// 解码 base64 VCD 内容
|
||||
const vcdBase64 = '${vcdBase64}';
|
||||
const vcdContent = atob(vcdBase64);
|
||||
console.log('[Webview] 注册 VS Code 消息监听器');
|
||||
// 监听来自 VS Code 扩展的消息(使用 vscode API)
|
||||
window.addEventListener('message', event => {
|
||||
const message = event.data;
|
||||
|
||||
// 隐藏加载提示
|
||||
document.querySelector('.loading').style.display = 'none';
|
||||
// 检查是否来自 VS Code
|
||||
if (message.command === 'loadVcdUrl') {
|
||||
console.log('[Webview] 收到 VS Code 消息,命令:', message.command);
|
||||
console.log('[Webview] Surfer 就绪状态:', window.surferReady);
|
||||
|
||||
// 创建一个函数来提供 VCD 数据流
|
||||
const vcdProvider = async (handler) => {
|
||||
// 将 VCD 内容转换为 Uint8Array
|
||||
const encoder = new TextEncoder();
|
||||
const vcdData = encoder.encode(vcdContent);
|
||||
|
||||
// 创建一个 ReadableStream reader
|
||||
const stream = new ReadableStream({
|
||||
start(controller) {
|
||||
controller.enqueue(vcdData);
|
||||
controller.close();
|
||||
}
|
||||
});
|
||||
|
||||
const reader = stream.getReader();
|
||||
|
||||
// 调用 handler 并传递 reader
|
||||
await handler([{
|
||||
key: 'local',
|
||||
value: 'waveform.vcd',
|
||||
format: 'raw',
|
||||
baseName: 'waveform.vcd',
|
||||
ext: 'vcd',
|
||||
reader: reader
|
||||
}]);
|
||||
};
|
||||
|
||||
// 初始化 VCDrom,使用函数回调方式
|
||||
if (typeof VCDrom === 'function') {
|
||||
await VCDrom('waveform1', vcdProvider);
|
||||
if (window.surferReady) {
|
||||
// Surfer 已就绪,立即加载
|
||||
loadVcdUrl(message);
|
||||
} else {
|
||||
throw new Error('VCDrom 未正确加载');
|
||||
// Surfer 未就绪,保存数据等待加载
|
||||
console.log('[Webview] Surfer 未就绪,保存数据待加载');
|
||||
window.pendingVcdData = message;
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.error('加载 VCD 波形失败:', error);
|
||||
document.getElementById('waveform-container').innerHTML =
|
||||
'<div class="error-message">' +
|
||||
'<h3>❌ 加载 VCD 波形失败</h3>' +
|
||||
'<p>' + error.message + '</p>' +
|
||||
'<p style="margin-top: 10px;">请确保 VCD 文件格式正确。</p>' +
|
||||
'<pre style="margin-top: 10px; padding: 10px; background: rgba(0,0,0,0.1); overflow: auto;">' + error.stack + '</pre>' +
|
||||
'</div>';
|
||||
}
|
||||
})();
|
||||
}, true); // 使用捕获阶段,优先于 integration.js 的监听器
|
||||
</script>
|
||||
</body>
|
||||
</html>`;
|
||||
|
||||
153
src/panels/WelcomePanel.ts
Normal file
@ -0,0 +1,153 @@
|
||||
/**
|
||||
* 欢迎引导面板
|
||||
* 功能:插件试用用户首次登录显示使用教程
|
||||
* 依赖:vscode
|
||||
* 使用场景:试用用户首次登录时显示
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
export class WelcomePanel {
|
||||
public static currentPanel: WelcomePanel | undefined;
|
||||
private readonly _panel: vscode.WebviewPanel;
|
||||
private _disposables: vscode.Disposable[] = [];
|
||||
|
||||
private constructor(panel: vscode.WebviewPanel) {
|
||||
this._panel = panel;
|
||||
this._panel.webview.html = this.getHtmlContent();
|
||||
|
||||
// 监听来自 webview 的消息
|
||||
this._panel.webview.onDidReceiveMessage(
|
||||
(message) => {
|
||||
if (message.command === 'close') {
|
||||
this._panel.dispose();
|
||||
}
|
||||
},
|
||||
null,
|
||||
this._disposables
|
||||
);
|
||||
|
||||
// 监听关闭事件
|
||||
this._panel.onDidDispose(() => this.dispose(), null, this._disposables);
|
||||
}
|
||||
|
||||
public static render(context: vscode.ExtensionContext) {
|
||||
// 避免重复显示
|
||||
if (WelcomePanel.currentPanel) {
|
||||
WelcomePanel.currentPanel._panel.reveal(vscode.ViewColumn.One);
|
||||
return;
|
||||
}
|
||||
|
||||
const panel = vscode.window.createWebviewPanel(
|
||||
'icCoderWelcome',
|
||||
'欢迎使用 IC Coder',
|
||||
vscode.ViewColumn.One,
|
||||
{
|
||||
enableScripts: true,
|
||||
retainContextWhenHidden: true
|
||||
}
|
||||
);
|
||||
|
||||
WelcomePanel.currentPanel = new WelcomePanel(panel);
|
||||
}
|
||||
|
||||
private getHtmlContent(): string {
|
||||
return `
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>欢迎使用 IC Coder</title>
|
||||
<style>
|
||||
body {
|
||||
padding: 40px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
line-height: 1.6;
|
||||
color: var(--vscode-foreground);
|
||||
background-color: var(--vscode-editor-background);
|
||||
}
|
||||
h1 {
|
||||
color: var(--vscode-textLink-foreground);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.welcome-message {
|
||||
font-size: 16px;
|
||||
margin-bottom: 30px;
|
||||
color: var(--vscode-descriptionForeground);
|
||||
}
|
||||
.step {
|
||||
margin: 20px 0;
|
||||
padding: 20px;
|
||||
background: var(--vscode-editor-inactiveSelectionBackground);
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid var(--vscode-textLink-foreground);
|
||||
}
|
||||
.step h3 {
|
||||
margin-top: 0;
|
||||
color: var(--vscode-textLink-foreground);
|
||||
}
|
||||
.step p {
|
||||
margin: 10px 0;
|
||||
}
|
||||
.button {
|
||||
padding: 12px 24px;
|
||||
background: var(--vscode-button-background);
|
||||
color: var(--vscode-button-foreground);
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.button:hover {
|
||||
background: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>🎉 欢迎使用 IC Coder!</h1>
|
||||
<p class="welcome-message">
|
||||
您已成功激活 15 天试用期,让我们开始探索 IC Coder 的强大功能吧!
|
||||
</p>
|
||||
|
||||
<div class="step">
|
||||
<h3>📝 步骤 1:打开聊天面板</h3>
|
||||
<p>点击侧边栏的 IC Coder 图标,或使用命令面板搜索 "IC Coder: Open Chat"</p>
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<h3>💬 步骤 2:输入您的需求</h3>
|
||||
<p>描述您想要生成的 Verilog 代码或需要帮助的问题,AI 将为您提供专业的解决方案</p>
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<h3>🔬 步骤 3:运行仿真</h3>
|
||||
<p>使用 "生成 VCD" 命令运行 iverilog 仿真,并通过波形查看器查看仿真结果</p>
|
||||
</div>
|
||||
|
||||
<button class="button" onclick="closePanel()">开始使用</button>
|
||||
|
||||
<script>
|
||||
const vscode = acquireVsCodeApi();
|
||||
|
||||
function closePanel() {
|
||||
vscode.postMessage({ command: 'close' });
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
`;
|
||||
}
|
||||
|
||||
public dispose() {
|
||||
WelcomePanel.currentPanel = undefined;
|
||||
this._panel.dispose();
|
||||
while (this._disposables.length) {
|
||||
const disposable = this._disposables.pop();
|
||||
if (disposable) {
|
||||
disposable.dispose();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
26
src/providers/codeActionProvider.ts
Normal file
@ -0,0 +1,26 @@
|
||||
/**
|
||||
* Code Action Provider - 为选中代码提供快捷操作
|
||||
* 功能:在小灯泡菜单中显示"添加到 IC Coder 对话"选项
|
||||
*/
|
||||
import * as vscode from 'vscode';
|
||||
|
||||
export class ICCoderCodeActionProvider implements vscode.CodeActionProvider {
|
||||
provideCodeActions(
|
||||
document: vscode.TextDocument,
|
||||
range: vscode.Range
|
||||
): vscode.CodeAction[] {
|
||||
const selectedText = document.getText(range);
|
||||
if (!selectedText) return [];
|
||||
|
||||
const action = new vscode.CodeAction(
|
||||
'💬 添加到 IC Coder 对话',
|
||||
vscode.CodeActionKind.RefactorRewrite
|
||||
);
|
||||
action.command = {
|
||||
command: 'ic-coder.addCodeToChat',
|
||||
title: '添加到对话'
|
||||
};
|
||||
|
||||
return [action];
|
||||
}
|
||||
}
|
||||
395
src/services/apiClient.ts
Normal file
@ -0,0 +1,395 @@
|
||||
/**
|
||||
* API 客户端
|
||||
* 封装与后端的 HTTP 通信
|
||||
*/
|
||||
import * as vscode from "vscode";
|
||||
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,
|
||||
ToolConfirmResponse,
|
||||
UserInfoResponse,
|
||||
InvitationVerifyRequest,
|
||||
InvitationVerifyResponse,
|
||||
InvitationStatusResponse,
|
||||
} from "../types/api";
|
||||
|
||||
/**
|
||||
* HTTP 请求选项
|
||||
*/
|
||||
interface RequestOptions {
|
||||
method: "GET" | "POST" | "PUT" | "DELETE";
|
||||
headers?: Record<string, string>;
|
||||
body?: unknown;
|
||||
timeout?: number;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前登录的 Token
|
||||
*/
|
||||
async function getAuthToken(): Promise<string | undefined> {
|
||||
try {
|
||||
const session = await vscode.authentication.getSession("iccoder", [], {
|
||||
silent: true,
|
||||
});
|
||||
return session?.accessToken;
|
||||
} catch {
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送 HTTP 请求
|
||||
*/
|
||||
async function request<T>(path: string, options: RequestOptions): Promise<T> {
|
||||
const url = new URL(getApiUrl(path));
|
||||
const { timeout } = getConfig();
|
||||
|
||||
// 自动获取 Token
|
||||
const token = await getAuthToken();
|
||||
|
||||
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",
|
||||
...(token ? { Authorization: `Bearer ${token}` } : {}),
|
||||
...options.headers,
|
||||
},
|
||||
timeout: options.timeout || timeout,
|
||||
};
|
||||
|
||||
console.log("[HTTP] 请求详情:", {
|
||||
url: url.toString(),
|
||||
method: options.method,
|
||||
headers: requestOptions.headers,
|
||||
hasToken: !!token,
|
||||
body: options.body,
|
||||
});
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
const req = httpModule.request(requestOptions, (res) => {
|
||||
let data = "";
|
||||
|
||||
// console.log('[HTTP] 响应状态码:', res.statusCode);
|
||||
// console.log('[HTTP] 响应头:', res.headers);
|
||||
|
||||
res.on("data", (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on("end", () => {
|
||||
console.log("[HTTP] 响应体:", data);
|
||||
try {
|
||||
const json = JSON.parse(data);
|
||||
// console.log('[HTTP] 解析后的响应:', JSON.stringify(json, null, 2));
|
||||
|
||||
if (res.statusCode && res.statusCode >= 200 && res.statusCode < 300) {
|
||||
console.log("[HTTP] 请求成功");
|
||||
resolve(json as T);
|
||||
} else {
|
||||
console.error("[HTTP] 请求失败:", {
|
||||
statusCode: res.statusCode,
|
||||
error: json.error,
|
||||
message: json.message,
|
||||
msg: json.msg,
|
||||
});
|
||||
reject(
|
||||
new Error(
|
||||
json.error ||
|
||||
json.message ||
|
||||
json.msg ||
|
||||
`HTTP ${res.statusCode}`,
|
||||
),
|
||||
);
|
||||
}
|
||||
} catch (e) {
|
||||
// console.error('[HTTP] 解析响应失败:', e);
|
||||
// console.error('[HTTP] 原始响应:', data);
|
||||
reject(new Error(`解析响应失败: ${data}`));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on("error", (error) => {
|
||||
// console.error('[HTTP] 请求错误:', error);
|
||||
reject(error);
|
||||
});
|
||||
|
||||
req.on("timeout", () => {
|
||||
// console.error('[HTTP] 请求超时');
|
||||
req.destroy();
|
||||
reject(new Error("请求超时"));
|
||||
});
|
||||
|
||||
if (options.body) {
|
||||
const bodyStr = JSON.stringify(options.body);
|
||||
// console.log('[HTTP] 发送请求体:', bodyStr);
|
||||
req.write(bodyStr);
|
||||
}
|
||||
|
||||
req.end();
|
||||
// console.log('[HTTP] 请求已发送');
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 提交工具执行结果
|
||||
* 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,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 提交工具确认响应(Ask 模式)
|
||||
* POST /api/tool/confirm
|
||||
*/
|
||||
export async function submitToolConfirm(
|
||||
response: ToolConfirmResponse,
|
||||
): Promise<ToolResultResponse> {
|
||||
console.log(
|
||||
`[API] 提交工具确认: confirmId=${response.confirmId}, approved=${response.approved}`,
|
||||
);
|
||||
return request<ToolResultResponse>("/api/tool/confirm", {
|
||||
method: "POST",
|
||||
body: response,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 健康检查
|
||||
* GET /api/dialog/health
|
||||
*/
|
||||
export async function healthCheck(): Promise<{ status: string }> {
|
||||
return request<{ status: string }>("/api/dialog/health", {
|
||||
method: "GET",
|
||||
timeout: 5000,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 停止对话请求
|
||||
*/
|
||||
export interface StopDialogRequest {
|
||||
taskId: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 停止对话响应
|
||||
*/
|
||||
export interface StopDialogResponse {
|
||||
success: boolean;
|
||||
taskId: string;
|
||||
message?: string;
|
||||
error?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 停止对话
|
||||
* POST /api/dialog/stop
|
||||
*/
|
||||
export async function stopDialog(taskId: string): Promise<StopDialogResponse> {
|
||||
console.log(`[API] 停止对话: taskId=${taskId}`);
|
||||
return request<StopDialogResponse>("/api/dialog/stop", {
|
||||
method: "POST",
|
||||
body: { taskId },
|
||||
});
|
||||
}
|
||||
|
||||
/** 压缩对话响应 */
|
||||
export interface CompactDialogResponse {
|
||||
success: boolean;
|
||||
taskId: string;
|
||||
message?: string;
|
||||
error?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 手动压缩对话历史
|
||||
* POST /api/dialog/compact
|
||||
*/
|
||||
export async function compactDialog(
|
||||
taskId: string,
|
||||
): Promise<CompactDialogResponse> {
|
||||
console.log(`[API] 压缩对话: taskId=${taskId}`);
|
||||
return request<CompactDialogResponse>("/api/dialog/compact", {
|
||||
method: "POST",
|
||||
body: { taskId },
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 创建成功的工具结果
|
||||
*/
|
||||
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 },
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取用户信息
|
||||
* GET /system/user/getInfo
|
||||
*/
|
||||
export async function getUserInfo(): Promise<UserInfoResponse> {
|
||||
console.log("[API] 获取用户信息");
|
||||
return request<UserInfoResponse>("/system/user/getInfo", {
|
||||
method: "GET",
|
||||
});
|
||||
}
|
||||
|
||||
/** 余额查询响应 */
|
||||
export interface CreditBalanceResponse {
|
||||
success: boolean;
|
||||
balance?: number;
|
||||
error?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询用户资源点余额
|
||||
* GET /api/dialog/balance?userId=xxx
|
||||
*/
|
||||
export async function getCreditBalance(
|
||||
userId: string,
|
||||
): Promise<CreditBalanceResponse> {
|
||||
console.log("[API] 查询余额: userId=", userId);
|
||||
return request<CreditBalanceResponse>(
|
||||
`/api/dialog/balance?userId=${userId}`,
|
||||
{
|
||||
method: "GET",
|
||||
timeout: 5000,
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 验证邀请码
|
||||
* POST /api/invitation/verify
|
||||
*/
|
||||
export async function verifyInvitationCode(
|
||||
code: string,
|
||||
): Promise<InvitationVerifyResponse> {
|
||||
// console.log('[API] 验证邀请码 - 开始');
|
||||
console.log("[API] 邀请码:", code);
|
||||
const body: InvitationVerifyRequest = { code };
|
||||
console.log("[API] 请求体:", JSON.stringify(body));
|
||||
|
||||
try {
|
||||
const response = await request<InvitationVerifyResponse>(
|
||||
"/api/invitation/verify",
|
||||
{
|
||||
method: "POST",
|
||||
body,
|
||||
},
|
||||
);
|
||||
console.log("[API] 验证邀请码 - 响应:", JSON.stringify(response));
|
||||
return response;
|
||||
} catch (error) {
|
||||
console.error("[API] 验证邀请码 - 错误:", error);
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 查询邀请码验证状态
|
||||
* GET /api/invitation/status
|
||||
*/
|
||||
export async function checkInvitationStatus(): Promise<InvitationStatusResponse> {
|
||||
console.log("[API] 查询邀请码验证状态");
|
||||
return request<InvitationStatusResponse>("/api/invitation/status", {
|
||||
method: "GET",
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置邀请码验证状态(退出登录时调用)
|
||||
* POST /api/invitation/reset
|
||||
*/
|
||||
export async function resetInvitationVerification(): Promise<{
|
||||
code: number;
|
||||
msg: string;
|
||||
}> {
|
||||
console.log("[API] 重置邀请码验证状态");
|
||||
try {
|
||||
const response = await request<{ code: number; msg: string }>(
|
||||
"/api/invitation/reset",
|
||||
{
|
||||
method: "POST",
|
||||
},
|
||||
);
|
||||
console.log("[API] 重置邀请码验证状态 - 响应:", JSON.stringify(response));
|
||||
return response;
|
||||
} catch (error) {
|
||||
console.warn("[API] 重置邀请码验证状态 - 错误:", error);
|
||||
// 即使失败也不影响退出登录流程
|
||||
throw error;
|
||||
}
|
||||
}
|
||||
210
src/services/changeTracker.ts
Normal file
@ -0,0 +1,210 @@
|
||||
/**
|
||||
* 文件变更追踪服务
|
||||
* 功能:收集和管理 AI 修改文件的变更记录
|
||||
* 依赖:types/fileChanges
|
||||
* 使用场景:在文件操作时记录变更,供用户审查
|
||||
*/
|
||||
|
||||
import { FileChange, ChangeSession } from '../types/fileChanges';
|
||||
import * as vscode from 'vscode';
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
|
||||
class ChangeTrackerService {
|
||||
private currentSession: ChangeSession | null = null;
|
||||
private changeListeners: Array<(session: ChangeSession) => void> = [];
|
||||
|
||||
/**
|
||||
* 开始新的变更会话
|
||||
*/
|
||||
startSession(sessionId: string): void {
|
||||
// 如果已有 session(无论状态),重用并重置为 active
|
||||
if (this.currentSession) {
|
||||
this.currentSession.status = 'active';
|
||||
return;
|
||||
}
|
||||
|
||||
this.currentSession = {
|
||||
sessionId,
|
||||
startTime: Date.now(),
|
||||
changes: [],
|
||||
status: 'active'
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 记录文件变更
|
||||
*/
|
||||
trackChange(filePath: string, oldContent: string, newContent: string): string {
|
||||
if (!this.currentSession) {
|
||||
this.startSession(`session_${Date.now()}`);
|
||||
}
|
||||
|
||||
const changeId = `change_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
|
||||
|
||||
// 判断变更类型
|
||||
let changeType: 'create' | 'modify' | 'delete';
|
||||
if (oldContent === '' && newContent !== '') {
|
||||
changeType = 'create';
|
||||
} else if (oldContent !== '' && newContent === '') {
|
||||
changeType = 'delete';
|
||||
} else {
|
||||
changeType = 'modify';
|
||||
}
|
||||
|
||||
const change: FileChange = {
|
||||
filePath,
|
||||
oldContent,
|
||||
newContent,
|
||||
timestamp: Date.now(),
|
||||
changeType,
|
||||
changeId
|
||||
};
|
||||
|
||||
this.currentSession!.changes.push(change);
|
||||
this.notifyListeners();
|
||||
|
||||
return changeId;
|
||||
}
|
||||
|
||||
/**
|
||||
* 结束当前会话
|
||||
*/
|
||||
endSession(): ChangeSession | null {
|
||||
if (this.currentSession && this.currentSession.changes.length > 0) {
|
||||
this.currentSession.status = 'completed';
|
||||
const session = this.currentSession;
|
||||
this.notifyListeners();
|
||||
return session;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前会话
|
||||
*/
|
||||
getCurrentSession(): ChangeSession | null {
|
||||
return this.currentSession;
|
||||
}
|
||||
|
||||
/**
|
||||
* 清空当前会话
|
||||
*/
|
||||
clearSession(): void {
|
||||
this.currentSession = null;
|
||||
this.notifyListeners();
|
||||
}
|
||||
|
||||
/**
|
||||
* 移除指定的变更
|
||||
*/
|
||||
removeChange(changeId: string): boolean {
|
||||
if (!this.currentSession) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const index = this.currentSession.changes.findIndex(c => c.changeId === changeId);
|
||||
if (index !== -1) {
|
||||
this.currentSession.changes.splice(index, 1);
|
||||
this.notifyListeners();
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 监听变更
|
||||
*/
|
||||
onChangeUpdate(listener: (session: ChangeSession) => void): void {
|
||||
this.changeListeners.push(listener);
|
||||
}
|
||||
|
||||
/**
|
||||
* 通知所有监听器
|
||||
*/
|
||||
private notifyListeners(): void {
|
||||
if (this.currentSession) {
|
||||
this.changeListeners.forEach(listener => listener(this.currentSession!));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 采纳变更(保存文件)
|
||||
*/
|
||||
async acceptChange(changeId: string): Promise<boolean> {
|
||||
if (!this.currentSession) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const change = this.currentSession.changes.find(c => c.changeId === changeId);
|
||||
if (!change) {
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
const workspaceFolder = vscode.workspace.workspaceFolders?.[0];
|
||||
if (!workspaceFolder) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const absolutePath = path.join(workspaceFolder.uri.fsPath, change.filePath);
|
||||
|
||||
// 如果是删除操作,删除文件
|
||||
if (change.changeType === 'delete') {
|
||||
if (fs.existsSync(absolutePath)) {
|
||||
await fs.promises.unlink(absolutePath);
|
||||
}
|
||||
} else {
|
||||
// 创建或修改文件
|
||||
await fs.promises.writeFile(absolutePath, change.newContent, 'utf-8');
|
||||
}
|
||||
|
||||
this.removeChange(changeId);
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('[ChangeTracker] 采纳变更失败:', error);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 拒绝变更(恢复旧内容)
|
||||
*/
|
||||
async rejectChange(changeId: string): Promise<boolean> {
|
||||
if (!this.currentSession) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const change = this.currentSession.changes.find(c => c.changeId === changeId);
|
||||
if (!change) {
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
const workspaceFolder = vscode.workspace.workspaceFolders?.[0];
|
||||
if (!workspaceFolder) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const absolutePath = path.join(workspaceFolder.uri.fsPath, change.filePath);
|
||||
|
||||
// 如果是新建文件,删除它
|
||||
if (change.changeType === 'create') {
|
||||
if (fs.existsSync(absolutePath)) {
|
||||
await fs.promises.unlink(absolutePath);
|
||||
}
|
||||
} else {
|
||||
// 恢复旧内容
|
||||
await fs.promises.writeFile(absolutePath, change.oldContent, 'utf-8');
|
||||
}
|
||||
|
||||
this.removeChange(changeId);
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('[ChangeTracker] 拒绝变更失败:', error);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const changeTracker = new ChangeTrackerService();
|
||||
269
src/services/creditsService.ts
Normal file
@ -0,0 +1,269 @@
|
||||
/**
|
||||
* 资源点余额管理服务
|
||||
* 负责缓存余额、主动查询、发送前检测
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
import * as https from 'https';
|
||||
import * as http from 'http';
|
||||
import { URL } from 'url';
|
||||
import { getStrangeLoopApiUrl } from '../config/settings';
|
||||
import { getCachedUserInfo } from './userService';
|
||||
|
||||
/** 低余额阈值 */
|
||||
const LOW_CREDIT_THRESHOLD = 5;
|
||||
|
||||
/** 缓存的余额 */
|
||||
let cachedBalance: number | null = null;
|
||||
|
||||
/** 最后更新时间 */
|
||||
let lastUpdateTime: number = 0;
|
||||
|
||||
/** 缓存有效期(5分钟) */
|
||||
const CACHE_TTL_MS = 5 * 60 * 1000;
|
||||
|
||||
/** ExtensionContext 用于持久化存储 */
|
||||
let extensionContext: vscode.ExtensionContext | null = null;
|
||||
|
||||
/** 余额更新回调函数 */
|
||||
let onBalanceUpdateCallback: ((balance: number) => void) | null = null;
|
||||
|
||||
/**
|
||||
* 初始化 Credits 服务(设置 context)
|
||||
*/
|
||||
export function initCreditsService(context: vscode.ExtensionContext): void {
|
||||
extensionContext = context;
|
||||
// 从持久化存储加载余额
|
||||
const savedBalance = extensionContext.globalState.get<number>('icCoderCreditsBalance');
|
||||
if (savedBalance !== undefined) {
|
||||
cachedBalance = savedBalance;
|
||||
lastUpdateTime = Date.now();
|
||||
console.log('[CreditsService] 从持久化存储加载余额:', savedBalance);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置余额更新回调
|
||||
*/
|
||||
export function setBalanceUpdateCallback(callback: (balance: number) => void): void {
|
||||
onBalanceUpdateCallback = callback;
|
||||
}
|
||||
|
||||
/**
|
||||
* 保存余额到持久化存储
|
||||
*/
|
||||
async function saveBalance(balance: number): Promise<void> {
|
||||
if (extensionContext) {
|
||||
await extensionContext.globalState.update('icCoderCreditsBalance', balance);
|
||||
console.log('[CreditsService] 余额已保存到持久化存储:', balance);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新缓存的余额(从 SSE credit_update 事件调用)
|
||||
*/
|
||||
export function updateCachedBalance(balance: number): void {
|
||||
cachedBalance = balance;
|
||||
lastUpdateTime = Date.now();
|
||||
console.log('[CreditsService] 余额已更新:', balance);
|
||||
// 异步保存到持久化存储
|
||||
saveBalance(balance).catch(err => {
|
||||
console.error('[CreditsService] 保存余额失败:', err);
|
||||
});
|
||||
// 通知前端更新余额显示
|
||||
if (onBalanceUpdateCallback) {
|
||||
onBalanceUpdateCallback(balance);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取缓存的余额
|
||||
*/
|
||||
export function getCachedBalance(): number | null {
|
||||
return cachedBalance;
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查缓存是否有效
|
||||
*/
|
||||
function isCacheValid(): boolean {
|
||||
if (cachedBalance === null) return false;
|
||||
return Date.now() - lastUpdateTime < CACHE_TTL_MS;
|
||||
}
|
||||
|
||||
/**
|
||||
* StrangeLoop 余额响应类型
|
||||
*/
|
||||
interface StrangeLoopBalanceResponse {
|
||||
userId?: number;
|
||||
availableCredits?: number;
|
||||
totalCredits?: number;
|
||||
error?: string;
|
||||
message?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 主动查询余额(直接调用 StrangeLoop 接口)
|
||||
*/
|
||||
export async function fetchBalance(): Promise<number | null> {
|
||||
try {
|
||||
// 获取 JWT token
|
||||
const session = await vscode.authentication.getSession('iccoder', [], { silent: true });
|
||||
if (!session?.accessToken) {
|
||||
console.warn('[CreditsService] 无法查询余额:未登录');
|
||||
return null;
|
||||
}
|
||||
|
||||
return await fetchBalanceWithToken(session.accessToken);
|
||||
} catch (error) {
|
||||
console.error('[CreditsService] 查询余额异常:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 使用指定 token 查询余额(登录过程中使用)
|
||||
*/
|
||||
export async function fetchBalanceWithToken(token: string): Promise<number | null> {
|
||||
try {
|
||||
console.log('[CreditsService] 开始查询余额,token 长度:', token.length);
|
||||
|
||||
// 直接调用 StrangeLoop 的 /api/credit/balance 接口
|
||||
const response = await callStrangeLoopBalance(token);
|
||||
|
||||
if (response.availableCredits !== undefined) {
|
||||
const balance = response.availableCredits;
|
||||
updateCachedBalance(balance);
|
||||
console.log('[CreditsService] 余额查询成功:', balance);
|
||||
return balance;
|
||||
} else {
|
||||
console.warn('[CreditsService] 查询余额失败:', response.error || response.message);
|
||||
return null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('[CreditsService] 查询余额异常:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 调用 StrangeLoop 余额接口
|
||||
*/
|
||||
async function callStrangeLoopBalance(token: string): Promise<StrangeLoopBalanceResponse> {
|
||||
const urlStr = getStrangeLoopApiUrl('/strangeloop/api/credit/balance');
|
||||
const url = new URL(urlStr);
|
||||
|
||||
const isHttps = url.protocol === 'https:';
|
||||
const httpModule = isHttps ? https : http;
|
||||
|
||||
// 余额查询使用固定短超时,避免阻塞发送前检查
|
||||
const BALANCE_TIMEOUT_MS = 5000;
|
||||
|
||||
const requestOptions: http.RequestOptions = {
|
||||
hostname: url.hostname,
|
||||
port: url.port || (isHttps ? 443 : 80),
|
||||
path: url.pathname + url.search,
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${token}`
|
||||
},
|
||||
timeout: BALANCE_TIMEOUT_MS
|
||||
};
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
const req = httpModule.request(requestOptions, (res) => {
|
||||
let data = '';
|
||||
|
||||
res.on('data', (chunk) => {
|
||||
data += chunk;
|
||||
});
|
||||
|
||||
res.on('end', () => {
|
||||
console.log('[CreditsService] 响应状态码:', res.statusCode);
|
||||
console.log('[CreditsService] 响应内容:', data);
|
||||
|
||||
try {
|
||||
const json = JSON.parse(data);
|
||||
if (res.statusCode && res.statusCode >= 200 && res.statusCode < 300) {
|
||||
resolve(json as StrangeLoopBalanceResponse);
|
||||
} else if (res.statusCode === 401 || res.statusCode === 403) {
|
||||
// 登录过期或无权限
|
||||
resolve({ error: '登录已过期,请重新登录' });
|
||||
} else {
|
||||
resolve({ error: json.error || json.message || json.msg || `HTTP ${res.statusCode}` });
|
||||
}
|
||||
} catch (e) {
|
||||
resolve({ error: `解析响应失败: ${data}` });
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
req.on('error', (error) => {
|
||||
reject(error);
|
||||
});
|
||||
|
||||
req.on('timeout', () => {
|
||||
req.destroy();
|
||||
reject(new Error('请求超时'));
|
||||
});
|
||||
|
||||
req.end();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前余额(优先使用缓存,过期则主动查询)
|
||||
*/
|
||||
export async function getBalance(): Promise<number | null> {
|
||||
if (isCacheValid()) {
|
||||
return cachedBalance;
|
||||
}
|
||||
return await fetchBalance();
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查余额是否足够发送消息
|
||||
* @returns { allowed: boolean, balance: number | null, message?: string }
|
||||
*/
|
||||
export async function checkBalanceBeforeSend(): Promise<{
|
||||
allowed: boolean;
|
||||
balance: number | null;
|
||||
message?: string;
|
||||
}> {
|
||||
const userInfo = getCachedUserInfo();
|
||||
if (!userInfo) {
|
||||
// 未登录,允许发送(后端会处理)
|
||||
return { allowed: true, balance: null };
|
||||
}
|
||||
|
||||
const balance = await getBalance();
|
||||
|
||||
if (balance === null) {
|
||||
// 无法获取余额,允许发送(后端会处理)
|
||||
console.warn('[CreditsService] 无法获取余额,允许发送');
|
||||
return { allowed: true, balance: null };
|
||||
}
|
||||
|
||||
if (balance < LOW_CREDIT_THRESHOLD) {
|
||||
return {
|
||||
allowed: false,
|
||||
balance,
|
||||
message: `资源点余额不足!当前余额 ${balance.toFixed(2)} 点,低于最低要求 ${LOW_CREDIT_THRESHOLD} 点。请充值后再试。`
|
||||
};
|
||||
}
|
||||
|
||||
return { allowed: true, balance };
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除缓存(登出时调用)
|
||||
*/
|
||||
export async function clearBalanceCache(): Promise<void> {
|
||||
cachedBalance = null;
|
||||
lastUpdateTime = 0;
|
||||
if (extensionContext) {
|
||||
await extensionContext.globalState.update('icCoderCreditsBalance', undefined);
|
||||
}
|
||||
console.log('[CreditsService] 余额缓存已清除');
|
||||
}
|
||||