feat(auth): 添加登录状态检查，

- 未登录时不会自动打开面板命令打开也会显示需要登录 - 登录之后就回自动打开对话面板
feat: 集成 VSCode Authentication API 实现用户登录
2025-12-29 18:52:56 +08:00 · 2025-12-29 18:25:21 +08:00 · 2025-12-29 16:32:18 +08:00 · 2025-12-29 15:59:41 +08:00 · 2025-12-29 15:52:22 +08:00 · 2025-12-29 15:38:00 +08:00
16 changed files with 1933 additions and 234 deletions
--- a/12
+++ b/12
@ -0,0 +1,12 @@
+Copyright (c) 2025 IC Coder Team. All rights reserved.
+
+本软件及其相关文档文件（以下简称"软件"）的版权归 IC Coder 所有。
+
+未经版权所有者事先书面许可，不得以任何形式或方式（电子、机械、复印、录制或其他方式）
+复制、分发、传播、展示、修改或创建本软件的衍生作品。
+
+本软件按"原样"提供，不提供任何明示或暗示的保证，包括但不限于适销性、特定用途适用性
+和非侵权性的保证。在任何情况下，作者或版权持有人均不对任何索赔、损害或其他责任负责，
+无论是在合同诉讼、侵权行为还是其他方面。
+
+如需商业使用或获取许可，请联系：[pyjtkj@pyjtkj.com]
--- a/PUBLISH.md
+++ b/PUBLISH.md
@ -0,0 +1,356 @@
+# 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
+```
+
+### 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
+# 发布指定版本
+pnpm vsce publish 0.0.3
+```
+
+### 更新流程建议
+
+1. 修改代码并测试
+2. 更新 `CHANGELOG.md` 记录变更
+3. 提交代码到 Git
+4. 执行发布命令
+5. 验证市场上的插件是否正常
+
+---
+
+## 常见问题
+
+### 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
--- a/docs/authentication-implementation.md
+++ b/docs/authentication-implementation.md
@ -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
--- a/media/ICCoder主页标志.png
+++ b/media/ICCoder主页标志.png
--- a/media/图案（方底）.png
+++ b/media/图案（方底）.png
--- a/media/侧边栏logo.png
+++ b/media/侧边栏logo.png
--- a/package.json
+++ b/package.json
@ -1,13 +1,13 @@
 {
-  "name": "ic-coder-plugin",
-  "displayName": "IC Coder plugin",
+  "name": "iccoder",
+  "displayName": "IC Coder",
  "description": "Agentic Verilog Coding Platform for Real-World FPGAs",
  "version": "0.0.2",
-  "publisher": "ic-coder-team",
+  "publisher": "ICCoder",
  "engines": {
    "vscode": "^1.80.0"
  },
-  "icon": "media/图案（方底）.png",
+  "icon": "media/icon.png",
  "categories": [
    "Other"
  ],
@ -19,6 +19,7 @@
    "eda",
    "assistant"
  ],
+  "license": "SEE LICENSE IN LICENSE",
  "activationEvents": [
    "onCommand:ic-coder.openPanel",
    "onView:ic-coder-sidebar",
@ -43,36 +44,6 @@
        "command": "ic-coder.openVCDViewer",
        "title": "打开 VCD 波形查看器",
        "category": "IC Coder"
-      },
-      {
-        "command": "ic-coder.viewHistory",
-        "title": "查看会话历史",
-        "category": "IC Coder"
-      },
-      {
-        "command": "ic-coder.newSession",
-        "title": "新建会话",
-        "category": "IC Coder"
-      },
-      {
-        "command": "ic-coder.exportSession",
-        "title": "导出当前会话",
-        "category": "IC Coder"
-      },
-      {
-        "command": "ic-coder.deleteSession",
-        "title": "删除会话",
-        "category": "IC Coder"
-      },
-      {
-        "command": "ic-coder.clearHistory",
-        "title": "清空会话历史",
-        "category": "IC Coder"
-      },
-      {
-        "command": "ic-coder.searchSession",
-        "title": "搜索会话",
-        "category": "IC Coder"
      }
    ],
    "viewsContainers": {
@ -80,7 +51,7 @@
        {
          "id": "ic-coder-sidebar",
          "title": "IC Coder",
-          "icon": "media/侧边栏logo.png"
+          "icon": "media/sidebar-icon.png"
        }
      ]
    },
@ -93,6 +64,12 @@
        }
      ]
    },
+    "authentication": [
+      {
+        "id": "iccoder",
+        "label": "IC Coder"
+      }
+    ],
    "configuration": {
      "title": "IC Coder",
      "properties": {
--- a/src/constants/toolIcons.ts
+++ b/src/constants/toolIcons.ts
@ -50,3 +50,23 @@ export const SearchCode = `
    </svg>
  </span>
 `;
+
+/**
+ * 发送按钮图标 SVG（向上箭头）
+ */
+export const sendIconSvg = `
+  <svg class="send-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
+    <path d="M507.904 882.688c-18.432 0-33.28-14.848-33.28-33.28v-655.36c0-18.432 14.848-33.28 33.28-33.28s33.28 14.848 33.28 33.28v654.848c0 18.432-14.848 33.792-33.28 33.792z" fill="currentColor"></path>
+    <path d="M787.968 502.784c-8.704 0-16.896-3.072-23.552-9.728L507.904 236.544 251.392 493.056c-12.8 12.8-34.304 12.8-47.104 0-12.8-12.8-12.8-34.304 0-47.104l280.064-280.064c6.144-6.144 14.848-9.728 23.552-9.728s17.408 3.584 23.552 9.728l280.064 280.064c12.8 12.8 12.8 34.304 0 47.104-6.656 6.656-15.36 9.728-23.552 9.728z" fill="currentColor"></path>
+  </svg>
+`;
+
+/**
+ * 暂停按钮图标 SVG（圆形边框内的方块）
+ */
+export const stopIconSvg = `
+  <svg class="stop-icon" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg">
+    <path d="M512 936a424.1 424.1 0 0 1-165.05-814.66 424.1 424.1 0 0 1 330.1 781.33A421.38 421.38 0 0 1 512 936z m0-768c-189.68 0-344 154.32-344 344s154.32 344 344 344 344-154.32 344-344-154.32-344-344-344z" fill="currentColor"></path>
+    <path d="M349.75 349.75m57.15 0l210.2 0q57.15 0 57.15 57.15l0 210.2q0 57.15-57.15 57.15l-210.2 0q-57.15 0-57.15-57.15l0-210.2q0-57.15 57.15-57.15Z" fill="currentColor"></path>
+  </svg>
+`;
--- a/src/extension.ts
+++ b/src/extension.ts
@ -3,12 +3,30 @@ import { ICViewProvider } from "./views/ICViewProvider";
 import { showICHelperPanel } from "./panels/ICHelperPanel";
 import { VCDViewerPanel } from "./panels/VCDViewerPanel";
 import { ChatHistoryManager } from "./utils/chatHistoryManager";
+import { ICCoderAuthenticationProvider } from "./services/icCoderAuthProvider";

 export function activate(context: vscode.ExtensionContext) {
  console.log("🎉 IC Coder 插件已激活！");

-  // 自动打开聊天面板
-  vscode.commands.executeCommand("ic-coder.openChat");
+  // 注册 Authentication Provider
+  const authProvider = new ICCoderAuthenticationProvider(context);
+  context.subscriptions.push(
+    vscode.authentication.registerAuthenticationProvider(
+      "iccoder",
+      "IC Coder",
+      authProvider
+    )
+  );
+
+  // 检查登录状态，如果已登录则自动打开聊天面板
+  vscode.authentication.getSession("iccoder", [], { createIfNone: false })
+    .then((session) => {
+      if (session) {
+        vscode.commands.executeCommand("ic-coder.openChat");
+      }
+    }, () => {
+      // 未登录，不做任何操作
+    });

  // 注册命令：打开助手面板
  const openPanelCommand = vscode.commands.registerCommand(
@ -54,6 +72,40 @@ export function activate(context: vscode.ExtensionContext) {
    }
  );

+  // 注册命令：用户登录
+  const loginCommand = vscode.commands.registerCommand(
+    "ic-coder.login",
+    async () => {
+      try {
+        await vscode.authentication.getSession("iccoder", [], { createIfNone: 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) {
+          // 通过创建新会话并清除偏好来实现登出
+          await vscode.authentication.getSession("iccoder", [], {
+            clearSessionPreference: true,
+            forceNewSession: true
+          });
+          vscode.window.showInformationMessage("已退出登录");
+        } else {
+          vscode.window.showInformationMessage("当前未登录");
+        }
+      } catch (error) {
+        vscode.window.showInformationMessage("当前未登录");
+      }
+    }
+  );
+
  // 注册命令：查看会话历史
  // TODO: 这些命令需要根据新的任务架构重新实现
  // 暂时注释掉，等待重新实现
@ -102,7 +154,7 @@ 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
@ -113,6 +165,8 @@ export function activate(context: vscode.ExtensionContext) {
    openPanelCommand,
    openChatCommand,
    openVCDViewerCommand,
+    loginCommand,
+    logoutCommand,
    // TODO: 等待重新实现这些命令
    // viewHistoryCommand,
    // newSessionCommand,
--- a/src/panels/ICHelperPanel.ts
+++ b/src/panels/ICHelperPanel.ts
@ -21,6 +21,26 @@ export async function showICHelperPanel(
  context: vscode.ExtensionContext,
  viewColumn?: vscode.ViewColumn
 ) {
+  // 检查用户是否已登录
+  try {
+    const session = await vscode.authentication.getSession("iccoder", [], { createIfNone: false });
+    if (!session) {
+      vscode.window.showWarningMessage("请先登录后再使用 IC Coder", "立即登录").then((selection) => {
+        if (selection === "立即登录") {
+          vscode.commands.executeCommand("ic-coder.login");
+        }
+      });
+      return;
+    }
+  } catch (error) {
+    vscode.window.showWarningMessage("请先登录后再使用 IC Coder", "立即登录").then((selection) => {
+      if (selection === "立即登录") {
+        vscode.commands.executeCommand("ic-coder.login");
+      }
+    });
+    return;
+  }
+
  // 创建WebView面板
  const panel = vscode.window.createWebviewPanel(
    "icCoder", // 面板ID
@ -34,19 +54,21 @@ export async function showICHelperPanel(
  );

  // 为面板生成唯一ID
-  const panelId = `panel_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+  const panelId = `panel_${Date.now()}_${Math.random()
+    .toString(36)
+    .substr(2, 9)}`;
  (panel as any).__uniqueId = panelId;

  // 设置标签页图标
  panel.iconPath = vscode.Uri.joinPath(
    context.extensionUri,
    "media",
-    "图案（方底）.png"
+    "icon.png"
  );

  // 获取页面内图标URI
  const iconUri = panel.webview.asWebviewUri(
-    vscode.Uri.joinPath(context.extensionUri, "media", "图案（方底）.png")
+    vscode.Uri.joinPath(context.extensionUri, "media", "icon.png")
  );

  // 设置HTML内容
@ -63,11 +85,19 @@ export async function showICHelperPanel(
          // 仅在用户发送消息时，确保面板有任务上下文
          // 如果没有，则创建新任务（仅在首次发送消息时）
          if (!historyManager.getPanelTask(panelId)) {
-            const workspacePath = vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
+            const workspacePath =
+              vscode.workspace.workspaceFolders?.[0]?.uri.fsPath;
            if (workspacePath) {
              try {
-                const taskMeta = await historyManager.createTask(workspacePath, "新对话");
-                historyManager.setPanelTask(panelId, taskMeta.taskId, workspacePath);
+                const taskMeta = await historyManager.createTask(
+                  workspacePath,
+                  "新对话"
+                );
+                historyManager.setPanelTask(
+                  panelId,
+                  taskMeta.taskId,
+                  workspacePath
+                );
              } catch (error) {
                console.error("创建任务失败:", error);
              }
@ -123,12 +153,20 @@ export async function showICHelperPanel(
          break;
        case "loadConversationHistory":
          // 加载会话历史（支持分页）
-          loadConversationHistory(panel, message.offset || 0, message.limit || 10);
+          loadConversationHistory(
+            panel,
+            message.offset || 0,
+            message.limit || 10
+          );
          break;
        case "selectConversation":
          // 选择会话
          if (message.conversationId) {
-            selectConversation(panel, message.conversationId, context.extensionPath);
+            selectConversation(
+              panel,
+              message.conversationId,
+              context.extensionPath
+            );
          }
          break;
        // 新增：处理用户回答
@ -407,10 +445,15 @@ async function selectConversation(
    }

    // 加载任务会话
-    const taskSession = await historyManager.loadTaskSession(workspacePath, taskId);
+    const taskSession = await historyManager.loadTaskSession(
+      workspacePath,
+      taskId
+    );

    if (!taskSession) {
-      vscode.window.showErrorMessage(`加载任务 ${taskId} 失败: 任务不存在或数据损坏`);
+      vscode.window.showErrorMessage(
+        `加载任务 ${taskId} 失败: 任务不存在或数据损坏`
+      );
      return;
    }

@ -427,7 +470,7 @@ async function selectConversation(

    // 清空当前聊天界面
    panel.webview.postMessage({
-      command: "clearChat"
+      command: "clearChat",
    });

    // 将会话历史消息转换为 segments 格式并发送到前端显示
@ -442,17 +485,17 @@ async function selectConversation(
        if (segments.length > 0) {
          panel.webview.postMessage({
            command: "receiveSegments",
-            segments: [...segments]
+            segments: [...segments],
          });
          segments.length = 0;
        }

        // 发送用户消息
-        const textContent = message.contents?.find(c => c.type === 'TEXT');
-        if (textContent && 'text' in textContent) {
+        const textContent = message.contents?.find((c) => c.type === "TEXT");
+        if (textContent && "text" in textContent) {
          panel.webview.postMessage({
            command: "addUserMessage",
-            text: textContent.text
+            text: textContent.text,
          });
        }
        i++;
@ -461,7 +504,7 @@ async function selectConversation(
        if (message.segments && message.segments.length > 0) {
          panel.webview.postMessage({
            command: "receiveSegments",
-            segments: message.segments
+            segments: message.segments,
          });
          i++;
        } else {
@ -469,30 +512,35 @@ async function selectConversation(
          // 收集连续的 AI 消息、工具调用和工具结果
          if (message.text) {
            segments.push({
-              type: 'text',
-              content: message.text
+              type: "text",
+              content: message.text,
            });
          }

          // 检查是否有工具调用
-          if (message.toolExecutionRequests && message.toolExecutionRequests.length > 0) {
+          if (
+            message.toolExecutionRequests &&
+            message.toolExecutionRequests.length > 0
+          ) {
            for (const toolReq of message.toolExecutionRequests) {
              // 查找对应的工具执行结果
-              let toolResult = '';
+              let toolResult = "";
              if (i + 1 < taskSession.messages.length) {
                const nextMsg = taskSession.messages[i + 1];
-                if (nextMsg.type === MessageType.TOOL_EXECUTION_RESULT &&
-                    nextMsg.id === toolReq.id) {
+                if (
+                  nextMsg.type === MessageType.TOOL_EXECUTION_RESULT &&
+                  nextMsg.id === toolReq.id
+                ) {
                  toolResult = nextMsg.text;
                  i++; // 跳过工具结果消息
                }
              }

              segments.push({
-                type: 'tool',
+                type: "tool",
                toolName: toolReq.name,
                askId: toolReq.id,
-                toolResult: toolResult
+                toolResult: toolResult,
              });
            }
          }
@ -511,26 +559,31 @@ async function selectConversation(
              }
              if (nextMsg.text) {
                segments.push({
-                  type: 'text',
-                  content: nextMsg.text
+                  type: "text",
+                  content: nextMsg.text,
                });
              }
-              if (nextMsg.toolExecutionRequests && nextMsg.toolExecutionRequests.length > 0) {
+              if (
+                nextMsg.toolExecutionRequests &&
+                nextMsg.toolExecutionRequests.length > 0
+              ) {
                for (const toolReq of nextMsg.toolExecutionRequests) {
-                  let toolResult = '';
+                  let toolResult = "";
                  if (i + 1 < taskSession.messages.length) {
                    const resultMsg = taskSession.messages[i + 1];
-                    if (resultMsg.type === MessageType.TOOL_EXECUTION_RESULT &&
-                        resultMsg.id === toolReq.id) {
+                    if (
+                      resultMsg.type === MessageType.TOOL_EXECUTION_RESULT &&
+                      resultMsg.id === toolReq.id
+                    ) {
                      toolResult = resultMsg.text;
                      i++; // 跳过工具结果消息
                    }
                  }
                  segments.push({
-                    type: 'tool',
+                    type: "tool",
                    toolName: toolReq.name,
                    askId: toolReq.id,
-                    toolResult: toolResult
+                    toolResult: toolResult,
                  });
                }
              }
@ -552,11 +605,13 @@ async function selectConversation(
    if (segments.length > 0) {
      panel.webview.postMessage({
        command: "receiveSegments",
-        segments: segments
+        segments: segments,
      });
    }

-    vscode.window.showInformationMessage(`已加载会话: ${taskSession.meta.taskName}`);
+    vscode.window.showInformationMessage(
+      `已加载会话: ${taskSession.meta.taskName}`
+    );
  } catch (error) {
    console.error("选择会话失败:", error);
    vscode.window.showErrorMessage(`加载会话失败: ${error}`);
--- a/src/services/icCoderAuthProvider.ts
+++ b/src/services/icCoderAuthProvider.ts
@ -0,0 +1,437 @@
+import * as vscode from "vscode";
+import * as http from "http";
+import * as path from "path";
+import * as fs from "fs";
+
+/**
+ * IC Coder Authentication Provider
+ * 集成到 VSCode 账户系统
+ */
+export class ICCoderAuthenticationProvider
+  implements vscode.AuthenticationProvider
+{
+  private static readonly AUTH_TYPE = "iccoder";
+  private static readonly AUTH_NAME = "IC Coder";
+  private static readonly LOGIN_URL = "http://192.168.1.108:2005/login";
+  private static loginServer: http.Server | null = null;
+  private static currentPort: number | null = null;
+
+  private _onDidChangeSessions =
+    new vscode.EventEmitter<vscode.AuthenticationProviderAuthenticationSessionsChangeEvent>();
+  public readonly onDidChangeSessions = this._onDidChangeSessions.event;
+
+  private _sessions: vscode.AuthenticationSession[] = [];
+
+  constructor(private readonly context: vscode.ExtensionContext) {
+    // 从存储中恢复会话
+    this.loadSessions();
+  }
+
+  /**
+   * 从存储中加载会话
+   */
+  private async loadSessions(): Promise<void> {
+    const storedSessions = this.context.globalState.get<
+      vscode.AuthenticationSession[]
+    >("icCoderSessions", []);
+    this._sessions = storedSessions;
+  }
+
+  /**
+   * 保存会话到存储
+   */
+  private async saveSessions(): Promise<void> {
+    await this.context.globalState.update("icCoderSessions", this._sessions);
+  }
+
+  /**
+   * 获取会话列表
+   */
+  async getSessions(
+    scopes?: readonly string[]
+  ): Promise<vscode.AuthenticationSession[]> {
+    return [...this._sessions];
+  }
+
+  /**
+   * 创建会话（登录）
+   */
+  async createSession(
+    scopes: readonly string[]
+  ): Promise<vscode.AuthenticationSession> {
+    try {
+      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: [],
+      });
+
+      vscode.window.showInformationMessage("登录成功！窗口将自动刷新...");
+
+      // 延迟 1 秒后重新加载窗口，让用户看到成功消息
+      setTimeout(() => {
+        vscode.commands.executeCommand("workbench.action.reloadWindow");
+      }, 1000);
+
+      return session;
+    } catch (error) {
+      vscode.window.showErrorMessage(
+        `登录失败: ${error instanceof Error ? error.message : String(error)}`
+      );
+      throw error;
+    }
+  }
+
+  /**
+   * 删除会话（登出）
+   */
+  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: [],
+      });
+
+      vscode.window.showInformationMessage("已退出登录！窗口将自动刷新...");
+
+      // 延迟 1 秒后重新加载窗口，让用户看到成功消息
+      setTimeout(() => {
+        vscode.commands.executeCommand("workbench.action.reloadWindow");
+      }, 1000);
+    }
+  }
+
+  /**
+   * 生成会话 ID
+   */
+  private generateSessionId(): string {
+    return `iccoder-${Date.now()}-${Math.random().toString(36).substring(7)}`;
+  }
+
+  /**
+   * 登录逻辑（打开浏览器并等待回调）
+   */
+  private async login(): Promise<string> {
+    // 如果已有服务器在运行，先关闭
+    if (ICCoderAuthenticationProvider.loginServer) {
+      ICCoderAuthenticationProvider.loginServer.close();
+      ICCoderAuthenticationProvider.loginServer = null;
+    }
+
+    // 创建本地服务器监听回调
+    const { server, port } = await this.createCallbackServer();
+    ICCoderAuthenticationProvider.loginServer = server;
+    ICCoderAuthenticationProvider.currentPort = port;
+
+    // 构建登录 URL
+    const callbackUrl = `http://localhost:${port}/callback`;
+    const loginUrl = `${
+      ICCoderAuthenticationProvider.LOGIN_URL
+    }?redirect_uri=${encodeURIComponent(callbackUrl)}`;
+
+    console.log("🔐 登录服务器已启动，监听端口:", port);
+    console.log("🌐 登录 URL:", loginUrl);
+
+    // 打开浏览器登录
+    await vscode.env.openExternal(vscode.Uri.parse(loginUrl));
+
+    vscode.window.showInformationMessage(
+      "请在浏览器中完成登录，登录成功后将自动返回..."
+    );
+
+    // 等待 token（通过 Promise）
+    return new Promise((resolve, reject) => {
+      const timeout = setTimeout(() => {
+        if (ICCoderAuthenticationProvider.loginServer) {
+          ICCoderAuthenticationProvider.loginServer.close();
+          ICCoderAuthenticationProvider.loginServer = null;
+          reject(new Error("登录超时"));
+        }
+      }, 5 * 60 * 1000);
+
+      // 将 resolve 和 reject 保存到服务器上下文
+      (server as any)._loginResolve = resolve;
+      (server as any)._loginReject = reject;
+      (server as any)._loginTimeout = timeout;
+    });
+  }
+
+  /**
+   * 创建本地回调服务器
+   */
+  private createCallbackServer(): Promise<{
+    server: http.Server;
+    port: number;
+  }> {
+    return new Promise((resolve, reject) => {
+      // 读取 icon.png 并转换为 Base64
+      const iconPath = path.join(
+        this.context.extensionPath,
+        "media",
+        "icon.png"
+      );
+      let iconBase64 = "";
+      try {
+        const iconBuffer = fs.readFileSync(iconPath);
+        iconBase64 = `data:image/png;base64,${iconBuffer.toString("base64")}`;
+      } catch (error) {
+        console.warn("无法读取 icon.png:", error);
+      }
+
+      const server = http.createServer(async (req, res) => {
+        try {
+          console.log("📥 收到回调请求:", req.url);
+
+          const url = new URL(
+            req.url!,
+            `http://localhost:${ICCoderAuthenticationProvider.currentPort}`
+          );
+          console.log("📍 路径:", url.pathname);
+          console.log("📋 所有参数:", Object.fromEntries(url.searchParams));
+
+          if (url.pathname === "/callback") {
+            const token = url.searchParams.get("token");
+            console.log("🔑 Token:", token ? "已获取" : "未找到");
+
+            if (token) {
+              // 返回成功页面
+              res.writeHead(200, {
+                "Content-Type": "text/html; charset=utf-8",
+              });
+              res.end(this.getSuccessPage(iconBase64));
+
+              // 关闭服务器
+              server.close();
+              ICCoderAuthenticationProvider.loginServer = null;
+
+              // 清除超时
+              if ((server as any)._loginTimeout) {
+                clearTimeout((server as any)._loginTimeout);
+              }
+
+              // 返回 token
+              if ((server as any)._loginResolve) {
+                (server as any)._loginResolve(token);
+              }
+            } else {
+              res.writeHead(400, {
+                "Content-Type": "text/html; charset=utf-8",
+              });
+              res.end(`
+                <!DOCTYPE html>
+                <html>
+                <head><meta charset="utf-8"><title>登录失败</title></head>
+                <body><h1>❌ 登录失败</h1><p>未获取到有效的 Token</p></body>
+                </html>
+              `);
+
+              if ((server as any)._loginReject) {
+                (server as any)._loginReject(new Error("未获取到有效的 Token"));
+              }
+            }
+          } else {
+            res.writeHead(404);
+            res.end("Not Found");
+          }
+        } catch (error) {
+          res.writeHead(500);
+          res.end("Internal Server Error");
+          if ((server as any)._loginReject) {
+            (server as any)._loginReject(error);
+          }
+        }
+      });
+
+      // 监听端口（使用 0 表示自动分配可用端口）
+      server.listen(0, () => {
+        const address = server.address();
+        const port =
+          typeof address === "object" && address ? address.port : 3000;
+        resolve({ server, port });
+      });
+
+      // 处理错误
+      server.on("error", (error: NodeJS.ErrnoException) => {
+        reject(error);
+      });
+    });
+  }
+
+  /**
+   * 获取登录成功页面 HTML
+   */
+  private getSuccessPage(iconBase64: string): string {
+    return `
+      <!DOCTYPE html>
+      <html>
+      <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>登录成功 - IC Coder</title>
+        <style>
+          * { margin: 0; padding: 0; box-sizing: border-box; }
+          body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            min-height: 100vh;
+            background: linear-gradient(135deg, #dbeafe 0%, #93c5fd 100%);
+            overflow: hidden;
+            position: relative;
+          }
+          .bg-circle {
+            position: absolute;
+            border-radius: 50%;
+            background: rgba(255, 255, 255, 0.1);
+            animation: float 20s infinite ease-in-out;
+          }
+          .bg-circle:nth-child(1) { width: 300px; height: 300px; top: -150px; left: -150px; }
+          .bg-circle:nth-child(2) { width: 200px; height: 200px; bottom: -100px; right: -100px; animation-delay: 5s; }
+          .bg-circle:nth-child(3) { width: 150px; height: 150px; top: 50%; right: 10%; animation-delay: 10s; }
+          @keyframes float {
+            0%, 100% { transform: translate(0, 0) scale(1); }
+            33% { transform: translate(30px, -30px) scale(1.1); }
+            66% { transform: translate(-20px, 20px) scale(0.9); }
+          }
+          .container {
+            position: relative;
+            z-index: 10;
+            text-align: center;
+            background: rgba(255, 255, 255, 0.95);
+            backdrop-filter: blur(10px);
+            padding: 60px 50px;
+            border-radius: 24px;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+            max-width: 500px;
+            animation: slideUp 0.6s ease-out;
+          }
+          @keyframes slideUp {
+            from { opacity: 0; transform: translateY(30px); }
+            to { opacity: 1; transform: translateY(0); }
+          }
+          .success-icon {
+            width: 80px;
+            height: 80px;
+            margin: 0 auto 30px;
+            background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
+            border-radius: 50%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            animation: scaleIn 0.5s ease-out 0.2s both;
+          }
+          @keyframes scaleIn {
+            from { transform: scale(0); opacity: 0; }
+            to { transform: scale(1); opacity: 1; }
+          }
+          .checkmark {
+            width: 40px;
+            height: 40px;
+            border: 4px solid white;
+            border-radius: 50%;
+            position: relative;
+          }
+          .checkmark::after {
+            content: '';
+            position: absolute;
+            left: 8px;
+            top: 3px;
+            width: 12px;
+            height: 20px;
+            border: solid white;
+            border-width: 0 4px 4px 0;
+            transform: rotate(45deg);
+          }
+          h1 {
+            color: #2d3748;
+            font-size: 32px;
+            font-weight: 700;
+            margin-bottom: 16px;
+            animation: fadeIn 0.6s ease-out 0.3s both;
+          }
+          p {
+            color: #718096;
+            font-size: 18px;
+            line-height: 1.6;
+            margin-bottom: 30px;
+            animation: fadeIn 0.6s ease-out 0.4s both;
+          }
+          @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
+          }
+          .brand {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 10px;
+            margin-top: 20px;
+            padding-top: 20px;
+            border-top: 1px solid #e2e8f0;
+            animation: fadeIn 0.6s ease-out 0.5s both;
+          }
+          .brand-logo {
+            width: 32px;
+            height: 32px;
+            border-radius: 6px;
+            overflow: hidden;
+          }
+          .brand-logo img {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+          }
+          .brand-text {
+            color: #4a5568;
+            font-size: 16px;
+            font-weight: 600;
+          }
+        </style>
+      </head>
+      <body>
+        <div class="bg-circle"></div>
+        <div class="bg-circle"></div>
+        <div class="bg-circle"></div>
+        <div class="container">
+          <div class="success-icon">
+            <div class="checkmark"></div>
+          </div>
+          <h1>登录成功！</h1>
+          <p>您已成功登录 IC Coder<br>现在可以返回 VSCode 继续使用</p>
+          <div class="brand">
+            <div class="brand-logo">
+              <img src="${iconBase64}" alt="IC Coder" />
+            </div>
+            <span class="brand-text">IC Coder</span>
+          </div>
+        </div>
+      </body>
+      </html>
+    `;
+  }
+}
--- a/src/views/ICViewProvider.ts
+++ b/src/views/ICViewProvider.ts
@ -32,12 +32,12 @@ export function showICHelperPanel(context: vscode.ExtensionContext) {
  panel.iconPath = vscode.Uri.joinPath(
    context.extensionUri,
    "media",
-    "图案（方底）.png"
+    "icon.png"
  );

  // 获取页面内图标URI
  const iconUri = panel.webview.asWebviewUri(
-    vscode.Uri.joinPath(context.extensionUri, "media", "图案（方底）.png")
+    vscode.Uri.joinPath(context.extensionUri, "media", "icon.png")
  );
  // 设置HTML内容
  panel.webview.html = getWebviewContent(iconUri.toString());
@ -59,7 +59,12 @@ export function showICHelperPanel(context: vscode.ExtensionContext) {
          handleRenameFile(panel, message.oldPath, message.newPath);
          break;
        case "replaceInFile":
-          handleReplaceInFile(panel, message.filePath, message.searchText, message.replaceText);
+          handleReplaceInFile(
+            panel,
+            message.filePath,
+            message.searchText,
+            message.replaceText
+          );
          break;
        case "insertCode":
          insertCodeToEditor(message.code);
@ -77,7 +82,11 @@ export function showICHelperPanel(context: vscode.ExtensionContext) {
          break;
        // 新增：处理用户回答
        case "submitAnswer":
-          handleUserAnswer(message.askId, message.selected, message.customInput);
+          handleUserAnswer(
+            message.askId,
+            message.selected,
+            message.customInput
+          );
          break;
        // 新增：中止对话
        case "abortDialog":
@ -94,7 +103,23 @@ export function showICHelperPanel(context: vscode.ExtensionContext) {
 * 侧边栏视图提供者
 */
 export class ICViewProvider implements vscode.WebviewViewProvider {
-  constructor(private readonly extensionUri: vscode.Uri) {}
+  constructor(
+    private readonly extensionUri: vscode.Uri,
+    private readonly context: vscode.ExtensionContext
+  ) {}
+
+  /**
+   * 检查登录状态（使用 Authentication API）
+   */
+  private async checkLoginStatus(): Promise<boolean> {
+    try {
+      const session = await vscode.authentication.getSession("iccoder", [], { createIfNone: false });
+      return !!session;
+    } catch (error) {
+      console.log("检查登录状态失败:", error);
+      return false;
+    }
+  }

  resolveWebviewView(webviewView: vscode.WebviewView) {
    webviewView.webview.options = {
@ -102,19 +127,30 @@ export class ICViewProvider implements vscode.WebviewViewProvider {
      localResourceRoots: [vscode.Uri.joinPath(this.extensionUri, "media")],
    };

-    webviewView.webview.html = this.getWebviewContent(webviewView.webview);
+    // 检查是否已登录（使用 Authentication API）
+    this.checkLoginStatus().then((isLoggedIn) => {
+      webviewView.webview.html = this.getWebviewContent(
+        webviewView.webview,
+        isLoggedIn
+      );
+    });

    // 处理侧边栏的消息
    webviewView.webview.onDidReceiveMessage((message) => {
      if (message.command === "openChat") {
        vscode.commands.executeCommand("ic-coder.openChat");
+      } else if (message.command === "login") {
+        vscode.commands.executeCommand("ic-coder.login");
      }
    });
  }

-  private getWebviewContent(webview: vscode.Webview): string {
+  private getWebviewContent(
+    webview: vscode.Webview,
+    isLoggedIn: boolean
+  ): string {
    const logoUri = webview.asWebviewUri(
-      vscode.Uri.joinPath(this.extensionUri, "media", "ICCoder主页标志.png")
+      vscode.Uri.joinPath(this.extensionUri, "media", "icon.png")
    );

    return `
@ -175,7 +211,11 @@ export class ICViewProvider implements vscode.WebviewViewProvider {
        <div class="container">
          <img src="${logoUri}" alt="IC Coder" width="120" />
          <h2>欢迎使用 IC Coder</h2>
-          <button class="btn" onclick="openChat()">开始创作</button>
+          ${
+            isLoggedIn
+              ? '<button class="btn" onclick="openChat()">开始创作</button>'
+              : '<button class="btn" onclick="login()">登录账户</button>'
+          }
        </div>

        <script>
@ -185,6 +225,11 @@ export class ICViewProvider implements vscode.WebviewViewProvider {
            vscode.postMessage({ command: 'openChat' });
          }

+          // 登录功能
+          function login() {
+            vscode.postMessage({ command: 'login' });
+          }
+
          function generateCode(type) {
            const code = getCodeTemplate(type);
            vscode.postMessage({
--- a/src/views/inputArea.ts
+++ b/src/views/inputArea.ts
@ -19,6 +19,20 @@ import {
  getContextCompressStyles,
  getContextCompressScript
 } from "./contextCompress";
+import {
+  getPlanToggleContent,
+  getPlanToggleStyles,
+  getPlanToggleScript
+} from "./planToggle";
+import {
+  getOptimizeButtonContent,
+  getOptimizeButtonStyles,
+  getOptimizeButtonScript
+} from "./optimizeButton";
+import {
+  sendIconSvg,
+  stopIconSvg
+} from "../constants/toolIcons";

 /**
 * 获取输入区域的 HTML 内容
@ -31,16 +45,7 @@ export function getInputAreaContent(): string {
          <!-- 顶部工具栏 -->
          <div class="input-top-toolbar">
            ${getContextButtonContent()}
-
-            <!-- Plan 开关 -->
-            <div class="tooltip">
-              <label class="plan-toggle">
-                <input type="checkbox" id="planToggle" onchange="handlePlanToggle()">
-                <span class="plan-toggle-slider"></span>
-                <span class="plan-toggle-label">Plan</span>
-              </label>
-              <span class="tooltiptext" id="planTooltip">启用 Plan 模式</span>
-            </div>
+            ${getPlanToggleContent()}
          </div>
          <textarea
            id="messageInput"
@ -54,16 +59,11 @@ export function getInputAreaContent(): string {
            </div>
            <div class="input-actions">
              ${getContextCompressContent()}
-
-              <!-- 一键优化按钮 -->
-              <div class="tooltip">
-                <button id="optimizeButton" class="optimize-button" onclick="handleOptimize()">
-                  <svg t="1765867478136" id="optimizeIcon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2314"><path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" p-id="2315" fill="#409eff"></path></svg>
-                </button>
-                <span class="tooltiptext" id="optimizeTooltip">一键优化</span>
-              </div>
-
-              <button onclick="sendMessage()">发送</button>
+              ${getOptimizeButtonContent()}
+              <button id="sendButton" onclick="handleSendOrStop()">
+                ${sendIconSvg}
+                <span style="display: none;">${stopIconSvg}</span>
+              </button>
            </div>
          </div>
        </div>
@ -81,6 +81,8 @@ export function getInputAreaStyles(): string {
    ${getModelSelectorStyles()}
    ${getContextButtonStyles()}
    ${getContextCompressStyles()}
+    ${getPlanToggleStyles()}
+    ${getOptimizeButtonStyles()}
    .input-area {
      border-top: 1px solid var(--vscode-panel-border);
      padding-top: 15px;
@ -118,49 +120,6 @@ export function getInputAreaStyles(): string {
      margin-bottom: 8px;
      gap: 12px;
    }
-    .plan-toggle {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      cursor: pointer;
-      user-select: none;
-    }
-    .plan-toggle input[type="checkbox"] {
-      display: none;
-    }
-    .plan-toggle-slider {
-      position: relative;
-      width: 36px;
-      height: 20px;
-      background: var(--vscode-input-background);
-      border: 1px solid var(--vscode-input-border);
-      border-radius: 10px;
-      transition: all 0.3s ease;
-    }
-    .plan-toggle-slider::before {
-      content: "";
-      position: absolute;
-      width: 14px;
-      height: 14px;
-      left: 2px;
-      top: 2px;
-      background: var(--vscode-foreground);
-      border-radius: 50%;
-      transition: all 0.3s ease;
-    }
-    .plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider {
-      background: #409eff;
-      border-color: #409eff;
-    }
-    .plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider::before {
-      transform: translateX(16px);
-      background: white;
-    }
-    .plan-toggle-label {
-      font-size: 13px;
-      font-weight: 500;
-      color: var(--vscode-foreground);
-    }
    .input-bottom-row {
      display: flex;
      align-items: center;
@ -269,30 +228,30 @@ export function getInputAreaStyles(): string {
      border: none;
      border-radius: 4px;
      cursor: pointer;
-    }
-    .optimize-button {
-      padding: 8px;
-      background: transparent;
-      color: var(--vscode-foreground);
-      border: none;
-      cursor: pointer;
+      transition: background 0.2s ease;
      display: flex;
      align-items: center;
      justify-content: center;
-      transition: opacity 0.2s ease;
-      width: 32px;
-      height: 32px;
    }
-    .optimize-button:hover {
-      opacity: 0.7;
+    button:hover {
+      background: var(--vscode-button-hoverBackground);
    }
-    .optimize-button svg {
-      width: 16px;
-      height: 16px;
+    /* 发送按钮状态样式 */
+    #sendButton {
+      position: relative;
+      min-width: 32px;
+      padding: 6px 8px;
    }
-    .optimize-button-wrapper {
-      display: flex;
-      align-items: flex-end;
+    #sendButton svg {
+      width: 14px;
+      height: 14px;
+      display: block;
+    }
+    #sendButton.sending {
+      background: var(--vscode-button-background);
+    }
+    #sendButton.sending:hover {
+      background: var(--vscode-button-hoverBackground);
    }
  `;
 }
@ -306,6 +265,11 @@ export function getInputAreaScript(): string {
    ${getModelSelectorScript()}
    ${getContextButtonScript()}
    ${getContextCompressScript()}
+    ${getPlanToggleScript()}
+    ${getOptimizeButtonScript()}
+
+    // 对话状态管理
+    let isConversationActive = false;

    // 自动调整 textarea 高度
    function autoResizeTextarea() {
@ -326,6 +290,38 @@ export function getInputAreaScript(): string {
      messageInput.focus();
    }

+    // 切换发送按钮状态
+    function setSendButtonState(isSending) {
+      const sendButton = document.getElementById('sendButton');
+      const children = sendButton.children;
+      const sendIconContainer = children[0]; // 第一个子元素是发送图标的 SVG
+      const stopIconContainer = children[1]; // 第二个子元素是包含暂停图标的 span
+
+      if (isSending) {
+        sendButton.classList.add('sending');
+        sendIconContainer.style.display = 'none';
+        stopIconContainer.style.display = 'block';
+        isConversationActive = true;
+      } else {
+        sendButton.classList.remove('sending');
+        sendIconContainer.style.display = 'block';
+        stopIconContainer.style.display = 'none';
+        isConversationActive = false;
+      }
+    }
+
+    // 处理发送或停止
+    function handleSendOrStop() {
+      if (isConversationActive) {
+        // 当前正在对话，执行停止操作
+        vscode.postMessage({ command: 'abortDialog' });
+        setSendButtonState(false);
+      } else {
+        // 当前未在对话，执行发送操作
+        sendMessage();
+      }
+    }
+
    function sendMessage() {
      const text = messageInput.value.trim();
      if (!text) return;
@ -334,6 +330,10 @@ export function getInputAreaScript(): string {
      const model = getCurrentModel(); // 从模型选择器组件获取当前模型

      addMessage(text, 'user');
+
+      // 切换按钮为暂停状态
+      setSendButtonState(true);
+
      vscode.postMessage({ command: 'sendMessage', text: text, mode: mode, model: model });
      messageInput.value = '';
      autoResizeTextarea(); // 重置输入框高度
@ -342,77 +342,5 @@ export function getInputAreaScript(): string {
      // 重置优化状态
      resetOptimizeButton();
    }
-
-    // Plan 开关处理函数
-    function handlePlanToggle() {
-      const planToggle = document.getElementById('planToggle');
-      const planTooltip = document.getElementById('planTooltip');
-
-      if (planToggle && planTooltip) {
-        if (planToggle.checked) {
-          // 开启 Plan 模式
-          planTooltip.textContent = '关闭 Plan 模式';
-        } else {
-          // 关闭 Plan 模式
-          planTooltip.textContent = '启用 Plan 模式';
-        }
-      }
-    }
-
-    let isOptimized = false; // 标记是否已优化
-    let originalText = ''; // 保存原始文本用于撤回
-
-    function handleOptimize() {
-      if (isOptimized) {
-        // 撤回操作
-        messageInput.value = originalText;
-        resetOptimizeButton();
-      } else {
-        // 优化操作
-        originalText = messageInput.value; // 保存原始文本
-
-        // 使用死数据替换输入框内容
-        const optimizedTexts = [
-          '请帮我优化这段代码，提高性能和可读性',
-          '请分析这个问题并给出最佳解决方案',
-          '请帮我重构这段代码，使其更加简洁高效',
-          '请检查代码中的潜在问题并提供改进建议'
-        ];
-        const randomText = optimizedTexts[Math.floor(Math.random() * optimizedTexts.length)];
-        messageInput.value = randomText;
-
-        // 切换到撤回状态
-        isOptimized = true;
-        updateOptimizeButton();
-      }
-
-      messageInput.focus();
-      autoResizeTextarea();
-    }
-
-    function updateOptimizeButton() {
-      const optimizeIcon = document.getElementById('optimizeIcon');
-      const optimizeTooltip = document.getElementById('optimizeTooltip');
-
-      if (optimizeIcon && optimizeTooltip) {
-        // 切换为撤回图标
-        optimizeIcon.innerHTML = '<path d="M581.056 288.32H232.96l108.352-102.208c15.552-15.744 19.456-31.104 4.16-46.208-16.064-15.872-32.576-15.808-48.64 0l-145.92 144.768c-8.768 8.832-23.488 20.608-22.08 32.448l0.64 4.8-0.64 4.864c-1.344 11.776 6.4 18.24 14.848 26.816l147.648 145.216c16.064 15.808 38.08 20.992 54.144 5.12 15.296-15.104 3.84-38.208-11.328-53.504L233.152 353.6 581.056 352c126.464 0 250.944 111.488 250.944 236.16C832 712.832 707.52 832 581.056 832H246.4c-22.592 0-29.696 9.6-29.696 32.256s7.04 31.744 29.696 31.744H581.12C755.136 896 896 757.696 896 588.16c0-169.408-140.8-299.84-314.944-299.84z" fill="currentColor"/><path d="M323.392 192a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM320.192 514.048a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM237.824 896a32 32 0 1 1 0-64 32 32 0 0 1 0 64z" fill="currentColor"/>';
-        optimizeTooltip.textContent = '撤回';
-      }
-    }
-
-    function resetOptimizeButton() {
-      const optimizeIcon = document.getElementById('optimizeIcon');
-      const optimizeTooltip = document.getElementById('optimizeTooltip');
-
-      if (optimizeIcon && optimizeTooltip) {
-        // 切换回优化图标（星星图标）
-        optimizeIcon.innerHTML = '<path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" fill="#409eff"/>';
-        optimizeTooltip.textContent = '一键优化';
-      }
-      
-      isOptimized = false;
-      originalText = '';
-    }
  `;
 }
--- a/src/views/optimizeButton.ts
+++ b/src/views/optimizeButton.ts
@ -0,0 +1,117 @@
+/**
+ * 一键优化按钮组件
+ */
+
+/**
+ * 获取一键优化按钮的 HTML 内容
+ */
+export function getOptimizeButtonContent(): string {
+  return `
+    <!-- 一键优化按钮 -->
+    <div class="tooltip">
+      <button id="optimizeButton" class="optimize-button" onclick="handleOptimize()">
+        <svg t="1765867478136" id="optimizeIcon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2314"><path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" p-id="2315" fill="#409eff"></path></svg>
+      </button>
+      <span class="tooltiptext" id="optimizeTooltip">一键优化</span>
+    </div>
+  `;
+}
+
+/**
+ * 获取一键优化按钮的样式
+ */
+export function getOptimizeButtonStyles(): string {
+  return `
+    /* 一键优化按钮样式 */
+    .optimize-button {
+      padding: 8px;
+      background: transparent;
+      color: var(--vscode-foreground);
+      border: none;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      transition: opacity 0.2s ease;
+      width: 32px;
+      height: 32px;
+    }
+
+    .optimize-button:hover {
+      opacity: 0.7;
+    }
+
+    .optimize-button svg {
+      width: 16px;
+      height: 16px;
+    }
+
+    .optimize-button-wrapper {
+      display: flex;
+      align-items: flex-end;
+    }
+  `;
+}
+
+/**
+ * 获取一键优化按钮的脚本
+ */
+export function getOptimizeButtonScript(): string {
+  return `
+    let isOptimized = false; // 标记是否已优化
+    let originalText = ''; // 保存原始文本用于撤回
+
+    function handleOptimize() {
+      if (isOptimized) {
+        // 撤回操作
+        messageInput.value = originalText;
+        resetOptimizeButton();
+      } else {
+        // 优化操作
+        originalText = messageInput.value; // 保存原始文本
+
+        // 使用死数据替换输入框内容
+        const optimizedTexts = [
+          '请帮我优化这段代码，提高性能和可读性',
+          '请分析这个问题并给出最佳解决方案',
+          '请帮我重构这段代码，使其更加简洁高效',
+          '请检查代码中的潜在问题并提供改进建议'
+        ];
+        const randomText = optimizedTexts[Math.floor(Math.random() * optimizedTexts.length)];
+        messageInput.value = randomText;
+
+        // 切换到撤回状态
+        isOptimized = true;
+        updateOptimizeButton();
+      }
+
+      messageInput.focus();
+      autoResizeTextarea();
+    }
+
+    function updateOptimizeButton() {
+      const optimizeIcon = document.getElementById('optimizeIcon');
+      const optimizeTooltip = document.getElementById('optimizeTooltip');
+
+      if (optimizeIcon && optimizeTooltip) {
+        // 切换为撤回图标
+        optimizeIcon.innerHTML = '<path d="M581.056 288.32H232.96l108.352-102.208c15.552-15.744 19.456-31.104 4.16-46.208-16.064-15.872-32.576-15.808-48.64 0l-145.92 144.768c-8.768 8.832-23.488 20.608-22.08 32.448l0.64 4.8-0.64 4.864c-1.344 11.776 6.4 18.24 14.848 26.816l147.648 145.216c16.064 15.808 38.08 20.992 54.144 5.12 15.296-15.104 3.84-38.208-11.328-53.504L233.152 353.6 581.056 352c126.464 0 250.944 111.488 250.944 236.16C832 712.832 707.52 832 581.056 832H246.4c-22.592 0-29.696 9.6-29.696 32.256s7.04 31.744 29.696 31.744H581.12C755.136 896 896 757.696 896 588.16c0-169.408-140.8-299.84-314.944-299.84z" fill="currentColor"/><path d="M323.392 192a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM320.192 514.048a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM237.824 896a32 32 0 1 1 0-64 32 32 0 0 1 0 64z" fill="currentColor"/>';
+        optimizeTooltip.textContent = '撤回';
+      }
+    }
+
+    function resetOptimizeButton() {
+      const optimizeIcon = document.getElementById('optimizeIcon');
+      const optimizeTooltip = document.getElementById('optimizeTooltip');
+
+      if (optimizeIcon && optimizeTooltip) {
+        // 切换回优化图标（星星图标）
+        optimizeIcon.innerHTML = '<path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" fill="#409eff"/>';
+        optimizeTooltip.textContent = '一键优化';
+      }
+
+      isOptimized = false;
+      originalText = '';
+    }
+  `;
+}
--- a/src/views/planToggle.ts
+++ b/src/views/planToggle.ts
@ -0,0 +1,100 @@
+/**
+ * Plan 开关组件
+ */
+
+/**
+ * 获取 Plan 开关的 HTML 内容
+ */
+export function getPlanToggleContent(): string {
+  return `
+    <div class="tooltip">
+      <label class="plan-toggle">
+        <input type="checkbox" id="planToggle" onchange="handlePlanToggle()">
+        <span class="plan-toggle-slider"></span>
+        <span class="plan-toggle-label">Plan</span>
+      </label>
+      <span class="tooltiptext" id="planTooltip">启用 Plan 模式</span>
+    </div>
+  `;
+}
+
+/**
+ * 获取 Plan 开关的样式
+ */
+export function getPlanToggleStyles(): string {
+  return `
+    /* Plan 开关样式 */
+    .plan-toggle {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      cursor: pointer;
+      user-select: none;
+    }
+
+    .plan-toggle input[type="checkbox"] {
+      display: none;
+    }
+
+    .plan-toggle-slider {
+      position: relative;
+      width: 36px;
+      height: 20px;
+      background: var(--vscode-input-background);
+      border: 1px solid var(--vscode-input-border);
+      border-radius: 10px;
+      transition: all 0.3s ease;
+    }
+
+    .plan-toggle-slider::before {
+      content: "";
+      position: absolute;
+      width: 14px;
+      height: 14px;
+      left: 2px;
+      top: 2px;
+      background: var(--vscode-foreground);
+      border-radius: 50%;
+      transition: all 0.3s ease;
+    }
+
+    .plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider {
+      background: #409eff;
+      border-color: #409eff;
+    }
+
+    .plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider::before {
+      transform: translateX(16px);
+      background: white;
+    }
+
+    .plan-toggle-label {
+      font-size: 13px;
+      font-weight: 500;
+      color: var(--vscode-foreground);
+    }
+  `;
+}
+
+/**
+ * 获取 Plan 开关的脚本
+ */
+export function getPlanToggleScript(): string {
+  return `
+    // Plan 开关处理函数
+    function handlePlanToggle() {
+      const planToggle = document.getElementById('planToggle');
+      const planTooltip = document.getElementById('planTooltip');
+
+      if (planToggle && planTooltip) {
+        if (planToggle.checked) {
+          // 开启 Plan 模式
+          planTooltip.textContent = '关闭 Plan 模式';
+        } else {
+          // 关闭 Plan 模式
+          planTooltip.textContent = '启用 Plan 模式';
+        }
+      }
+    }
+  `;
+}
--- a/src/views/webviewContent.ts
+++ b/src/views/webviewContent.ts
@ -347,6 +347,27 @@ export function getWebviewContent(iconUri?: string): string {
      background: var(--vscode-charts-red);
      animation: none;
    }
+
+    /* 快捷操作按钮样式 */
+    .quick-actions {
+      display: flex;
+      gap: 10px;
+      margin-bottom: 15px;
+      flex-wrap: wrap;
+    }
+    .quick-btn {
+      padding: 8px 16px;
+      background: var(--vscode-button-secondaryBackground);
+      color: var(--vscode-button-secondaryForeground);
+      border: 1px solid var(--vscode-button-border);
+      border-radius: 6px;
+      cursor: pointer;
+      font-size: 13px;
+      transition: all 0.2s;
+    }
+    .quick-btn:hover {
+      background: var(--vscode-button-secondaryHoverBackground);
+    }
  </style>
 </head>
 <body>
@ -437,6 +458,10 @@ export function getWebviewContent(iconUri?: string): string {
          // 实时更新分段消息（按后端返回顺序）
          console.log('[WebView] 实时更新段落, segments:', message.segments);
          updateSegmentsRealtime(message.segments, message.isComplete);
+          // 如果对话完成，恢复发送按钮状态
+          if (message.isComplete && typeof setSendButtonState === 'function') {
+            setSendButtonState(false);
+          }
          break;

        case 'receiveSegments':
Author	SHA1	Message	Date
Roe-xin	f9c9fa1840	feat(auth): 添加登录状态检查， - 未登录时不会自动打开面板命令打开也会显示需要登录 - 登录之后就回自动打开对话面板	2025-12-29 18:52:56 +08:00
Roe-xin	53e91fc5a0	feat: 集成 VSCode Authentication API 实现用户登录 - 新增 Authentication Provider，登录信息显示在左下角 - 支持浏览器登录并自动回调 - 登录/登出后自动刷新窗口 - 侧边栏根据登录状态显示不同按钮	2025-12-29 18:25:21 +08:00
Roe-xin	4288607ee2	feat(icon): 更新面板和视图中的图标路径为统一的 icon.png	2025-12-29 16:32:18 +08:00
Roe-xin	d4d86df7de	fix(PUBLISH.md): 修正打包命令，添加 --no-dependencies 选项以避免依赖问题	2025-12-29 15:59:41 +08:00
Roe-xin	4b8d255207	feat(media): 添加主页和侧边栏图标，并更新 package.json 中的图标路径	2025-12-29 15:52:22 +08:00
Roe-xin	a5dba25a8e	fix(package): 修正 package.json 中的名称字段为小写	2025-12-29 15:38:00 +08:00
Roe-xin	719d1396b0	feat(license): 添加 LICENSE 文件并更新 package.json 中的许可证信息	2025-12-29 15:35:57 +08:00
Roe-xin	5b6ac43e13	feat(sendButton): 添加发送和暂停按钮图标及其状态管理功能	2025-12-29 14:41:15 +08:00
Roe-xin	f7c2d86a46	feat(optimizeButton): 添加一键优化按钮组件及其集成到输入区域	2025-12-29 12:04:38 +08:00
Roe-xin	83db55c790	feat(planToggle): 添加 Plan 开关组件及其集成到输入区域	2025-12-29 12:00:43 +08:00