docs: enrich Docker/OtherFeatures/ClaudeCode pages and add plan doc

- Docker.vue: add docker run command, ghcr.io image, local build method
- OtherFeatures.vue: add usage dashboard, upgrade notifications, DeepSeek patch
- ClaudeCode.vue: add DEBUG=claude:* tip
- Add implementation plan doc

Author: zhushanwen321

docs/plans/2026-05-18-docs-site-sync-with-readme.md

@@ -0,0 +1,174 @@
+# 文档站与 README 同步 - 实施计划
+
+> 日期: 2026-05-18
+> 基准: `llm-simple-router-workspace/refactor-perf-bug-fix/README.md`
+> 目标: `zhushanwen321.github.io` 文档站
+
+## 背景
+
+README 包含完整的 LLM Simple Router 使用文档，但文档站存在 3 个缺失页面、1 个内容严重不足页面、1 个路由 bug、以及若干内容同步差距。
+
+## 任务拆分
+
+### Task 1: 修复 router/index.ts 重复路由 bug
+
+**文件**: `src/router/index.ts`
+**改动**: 删除 5 个重复的 `/social` 路由定义，只保留 1 个
+**预估**: 1 行保留 + 删除 10 行
+
+### Task 2: 扩展 i18n 基础设施
+
+**文件**:
+- `src/composables/useLocale.ts` — 添加 3 个 SIDEBAR_KEY: `codex`, `piConfig`, `processManagement`
+- `src/locales/zh.ts` — 添加 3 个中文翻译
+- `src/locales/en.ts` — 添加 3 个英文翻译
+- `src/config/sidebar.ts` — 在 `clientConfig` 组添加 Codex/Pi 条目，在 `deploy` 组添加进程管理条目
+
+**新增 key**:
+```
+sidebar.codex         = "Codex 配置" / "Codex Setup"
+sidebar.piConfig      = "Pi 配置"   / "Pi Setup"
+sidebar.processMgmt   = "进程管理"   / "Process Management"
+```
+
+**预估**: 每文件改动 ~6 行
+
+### Task 3: 新增 Codex 配置页
+
+**新建文件**: `src/views/project/llm-simple-router/config/Codex.vue`
+**路由**: `guide/config/codex`
+**内容来源**: README 第 5 节 "配置 Codex"
+
+内容要点:
+- `~/.codex/config.toml` 完整模板
+- `wire_api = "responses"` 说明（OpenAI Responses API 格式）
+- `ROUTER_KEY` 环境变量设置
+- 中英双语
+- 复用 CodeBlock 组件
+
+**预估**: ~80 行
+
+### Task 4: 新增 Pi Coding Agent 配置页
+
+**新建文件**: `src/views/project/llm-simple-router/config/Pi.vue`
+**路由**: `guide/config/pi`
+**内容来源**: README 第 6 节 "配置 Pi Coding Agent"
+
+内容要点:
+- `~/.pi/agent/models.json` 完整配置模板
+- `api: "anthropic-messages"` 连接方式说明
+- DeepSeek 模型 compat 配置 (`thinkingFormat: "deepseek"`, `thinkingLevelMap`)
+- 模型参数说明（contextWindow, maxTokens, reasoning）
+- 中英双语
+- 复用 CodeBlock 组件
+
+**预估**: ~100 行
+
+### Task 5: 新增进程管理页
+
+**新建文件**: `src/views/project/llm-simple-router/config/ProcessManagement.vue`
+**路由**: `guide/config/process-management`
+**内容来源**: README "进程管理" 章节
+
+内容要点:
+- PM2: 安装、启动、查看日志、开机自启、升级流程
+- systemd: 服务文件模板 (`/etc/systemd/system/llm-simple-router.service`)、启用/启动/查看命令
+- npx 手动启动: 注意事项（Ctrl+C 不会恢复）
+- 三种方式的升级流程对比
+- 中英双语
+- 复用 CodeBlock 组件
+
+**预估**: ~130 行
+
+### Task 6: 充实 Docker.vue
+
+**文件**: `src/views/project/llm-simple-router/config/Docker.vue`
+**内容来源**: README "Docker 部署" 章节
+
+补充内容:
+- `docker run` 完整命令（端口映射、volume、环境变量、restart 策略、镜像地址）
+- `ghcr.io/zhushanwen321/llm-simple-router:latest` 镜像说明
+- 本地构建方式（注释 image、取消 build 注释）
+- 数据目录说明
+
+**预估**: 从 ~30 行扩展到 ~90 行
+
+### Task 7: 补充 OtherFeatures.vue
+
+**文件**: `src/views/project/llm-simple-router/features/OtherFeatures.vue`
+**内容来源**: README "其他功能" 表格中用量大盘、升级通知、代理增强描述
+
+补充内容:
+- 用量大盘：按时间/模型/密钥维度，5 小时滑动窗口
+- 升级通知：新版本自动提醒 + 一键升级
+- DeepSeek reasoning_thinking 补丁说明
+- proxy_enhance 截图引用
+
+**预估**: +40 行
+
+### Task 8: 补充 ClaudeCode.vue 调试信息
+
+**文件**: `src/views/project/llm-simple-router/config/ClaudeCode.vue`
+
+补充内容:
+- `DEBUG=claude:*` 环境变量说明（Tips 部分）
+- 当前已有 `--verbose --debug` 参数说明，只需补充 DEBUG 环境变量
+
+**预估**: +4 行
+
+### Task 9: 注册新路由到 router/index.ts
+
+**文件**: `src/router/index.ts`
+
+在 `llm-simple-router` children 中添加 3 个新路由:
+- `guide/config/codex` → Codex.vue
+- `guide/config/pi` → Pi.vue
+- `guide/config/process-management` → ProcessManagement.vue
+
+**预估**: +12 行
+
+## 执行顺序
+
+```
+Task 1 (路由 bug) → 独立，优先
+Task 2 (i18n 基础) → Task 3/4/5 的前置依赖
+Task 3 (Codex 页)  ┐
+Task 4 (Pi 页)     ├→ 依赖 Task 2，三者可并行
+Task 5 (进程管理)   ┘
+Task 6 (Docker)    → 独立
+Task 7 (Other)     → 独立
+Task 8 (ClaudeCode) → 独立
+Task 9 (路由注册)   → 依赖 Task 3/4/5 的文件创建
+```
+
+建议执行批次:
+- **批次 1**: Task 1 + Task 2 (基础设施)
+- **批次 2**: Task 3 + Task 4 + Task 5 (新建页面，可并行 subagent)
+- **批次 3**: Task 6 + Task 7 + Task 8 (内容补充，可并行 subagent)
+- **批次 4**: Task 9 (路由注册) → 然后 build 验证
+
+## 涉及文件清单
+
+| 操作 | 文件 |
+|------|------|
+| 修改 | `src/router/index.ts` |
+| 修改 | `src/composables/useLocale.ts` |
+| 修改 | `src/locales/zh.ts` |
+| 修改 | `src/locales/en.ts` |
+| 修改 | `src/config/sidebar.ts` |
+| 新建 | `src/views/project/llm-simple-router/config/Codex.vue` |
+| 新建 | `src/views/project/llm-simple-router/config/Pi.vue` |
+| 新建 | `src/views/project/llm-simple-router/config/ProcessManagement.vue` |
+| 修改 | `src/views/project/llm-simple-router/config/Docker.vue` |
+| 修改 | `src/views/project/llm-simple-router/features/OtherFeatures.vue` |
+| 修改 | `src/views/project/llm-simple-router/config/ClaudeCode.vue` |
+
+**总计**: 3 个新文件 + 8 个修改文件
+
+## 验证标准
+
+1. `npm run build` 无 TypeScript 编译错误
+2. 所有 sidebar 链接可点击跳转
+3. 新页面中英文切换正常
+4. 已有页面内容无回归
+5. 截图资源正确加载

images/avatar.jpg

@@ -61,6 +61,7 @@ const settingsFull = `{
         <li><code>settings.json</code> 中的环境变量对所有项目生效</li>
         <li>如果只想对当前项目生效，可放在 <code>.claude/settings.json</code>（项目根目录下）</li>
         <li>调试时可加参数：<code>claude --dangerously-skip-permissions --verbose --debug</code></li>
+        <li>设置 <code>export DEBUG=claude:*</code> 可查看 Claude Code 详细内部日志</li>
       </ul>
     </template>
     <template v-else>
@@ -81,6 +82,7 @@ const settingsFull = `{
         <li>Environment variables in <code>settings.json</code> apply to all projects</li>
         <li>To limit to the current project only, place them in <code>.claude/settings.json</code> (project root)</li>
         <li>For debugging, add flags: <code>claude --dangerously-skip-permissions --verbose --debug</code></li>
+        <li>Set <code>export DEBUG=claude:*</code> to view detailed Claude Code internal logs</li>
       </ul>
     </template>
   </div>

images/飞书交流群.png

@@ -5,25 +5,85 @@ import CodeBlock from '../../../../components/CodeBlock.vue'
 
 const { locale } = useI18n()
 const isZh = computed(() => locale.value === 'zh')
+
+const quickStartCmd = 'docker compose up -d'
+
+const dockerRunCmd = `docker run -d \\
+  --name llm-router \\
+  -p 9981:9981 \\
+  -v ~/.llm-simple-router:/app/data \\
+  -e DB_PATH=/app/data/router.db \\
+  -e TZ=Asia/Shanghai \\
+  --restart unless-stopped \\
+  ghcr.io/zhushanwen321/llm-simple-router:latest`
+
+const localBuildCmd = 'docker compose up -d --build'
 </script>
 
 <template>
   <div class="prose prose-invert max-w-none">
     <template v-if="isZh">
       <h1>Docker 部署</h1>
+
       <h2>快速启动</h2>
-      <CodeBlock code="docker compose up -d" language="bash" />
+      <CodeBlock :code="quickStartCmd" language="bash" />
       <p>环境变量通过 Setup 页面设置，不需要 <code>.env</code> 文件。</p>
+
       <h2>数据持久化</h2>
-      <p>Docker 部署时，数据存储在容器内的 <code>/root/.llm-simple-router/</code> 目录。通过 Docker volume 挂载确保数据持久化，容器重启后数据不丢失。</p>
+      <p>
+        Docker 部署时，数据存储在容器内的 <code>/root/.llm-simple-router/</code>
+        目录。通过 Docker volume 挂载确保数据持久化，容器重启后数据不丢失。
+      </p>
+
+      <h2>直接拉取镜像（推荐）</h2>
+      <p>
+        使用 <code>docker compose</code> 是最简单的方式，如上所述执行
+        <code>docker compose up -d</code> 即可。也可以直接使用 <code>docker run</code> 命令：
+      </p>
+      <CodeBlock :code="dockerRunCmd" language="bash" />
+      <p>
+        数据目录映射到宿主机的 <code>~/.llm-simple-router/</code>，其他环境变量（如 API Key、模型配置等）启动后通过
+        Setup 页面设置。
+      </p>
+
+      <h2>本地构建</h2>
+      <p>
+        如果需要自行构建镜像，编辑 <code>docker-compose.yml</code>，注释掉 <code>image</code> 行，取消
+        <code>build</code> 部分的注释，然后执行：
+      </p>
+      <CodeBlock :code="localBuildCmd" language="bash" />
     </template>
+
     <template v-else>
       <h1>Docker Deployment</h1>
+
       <h2>Quick Start</h2>
-      <CodeBlock code="docker compose up -d" language="bash" />
+      <CodeBlock :code="quickStartCmd" language="bash" />
       <p>Environment vars are set via the Setup page, no <code>.env</code> file needed.</p>
+
       <h2>Data Persistence</h2>
-      <p>In Docker, data is stored at <code>/root/.llm-simple-router/</code> inside the container. Use Docker volume mounts for data persistence so data is not lost on container restart.</p>
+      <p>
+        In Docker, data is stored at <code>/root/.llm-simple-router/</code> inside the container. Use
+        Docker volume mounts for data persistence so data is not lost on container restart.
+      </p>
+
+      <h2>Pull Image Directly (Recommended)</h2>
+      <p>
+        Using <code>docker compose</code> is the simplest approach — just run
+        <code>docker compose up -d</code> as shown above. You can also use <code>docker run</code> directly:
+      </p>
+      <CodeBlock :code="dockerRunCmd" language="bash" />
+      <p>
+        The data directory is mapped to <code>~/.llm-simple-router/</code> on the host. Other environment
+        variables (API keys, model configs, etc.) can be configured via the Setup page after startup.
+      </p>
+
+      <h2>Local Build</h2>
+      <p>
+        To build the image yourself, edit <code>docker-compose.yml</code>: comment out the
+        <code>image</code> line and uncomment the <code>build</code> section, then run:
+      </p>
+      <CodeBlock :code="localBuildCmd" language="bash" />
     </template>
   </div>
 </template>

src/views/project/llm-simple-router/config/ClaudeCode.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
+import ScreenShot from '../../../../components/ScreenShot.vue'
 const { locale } = useI18n()
 const isZh = computed(() => locale.value === 'zh')
 </script>
@@ -40,6 +41,20 @@ const isZh = computed(() => locale.value === 'zh')
         Provider 级别支持 SOCKS5 / HTTPS 代理，在 Provider 编辑弹窗中配置。
         详见 <router-link to="/project/llm-simple-router/guide/features/providers">供应商管理</router-link>。
       </p>
+
+      <h2>用量大盘</h2>
+      <p>在 Dashboard 页面查看按时间、模型、密钥等维度的用量统计。内置 5 小时滑动窗口，适配 Coding Plan 的计量周期。</p>
+      <p>支持查看 Token 消耗趋势、请求成功率、按 Provider 分组的详细数据。</p>
+
+      <h2>升级通知</h2>
+      <p>新版本发布时自动在管理后台弹出升级提醒。点击一键升级后重启服务即可完成更新。</p>
+      <p>升级不会丢失数据，所有配置和日志保存在 <code>~/.llm-simple-router/</code> 目录中。</p>
+
+      <h2>DeepSeek 推理补丁</h2>
+      <p>Router 内置 DeepSeek <code>reasoning_thinking</code> 补丁，自动处理 DeepSeek 模型的推理输出格式。支持 DS 和其他模型在同一个映射表中混用切换。</p>
+      <p>使用 OpenAI SDK 或 Claude Code 调用 DeepSeek 模型时，无需关心推理格式的差异。</p>
+
+      <ScreenShot src="/images/llm-simple-router/proxy_enhance.png" caption="代理增强（实验性）" />
     </template>
 
     <template v-else>
@@ -76,6 +91,20 @@ const isZh = computed(() => locale.value === 'zh')
         Per-Provider SOCKS5/HTTPS proxy — configure in the Provider edit dialog.
         See <router-link to="/project/llm-simple-router/guide/features/providers">Provider Management</router-link>.
       </p>
+
+      <h2>Usage Dashboard</h2>
+      <p>View usage statistics by time, model, and key in the Dashboard page. Built-in 5-hour sliding window adapts to Coding Plan billing cycles.</p>
+      <p>Supports token consumption trends, request success rates, and detailed per-Provider data.</p>
+
+      <h2>Upgrade Notifications</h2>
+      <p>Automatic upgrade notification popup in admin panel when a new version is released. One-click upgrade and service restart to complete the update.</p>
+      <p>Upgrades do not lose data — all config and logs are preserved in <code>~/.llm-simple-router/</code>.</p>
+
+      <h2>DeepSeek Reasoning Patch</h2>
+      <p>Built-in DeepSeek <code>reasoning_thinking</code> patch automatically handles DeepSeek model reasoning output format. Supports mixing DS and other models in the same mapping table.</p>
+      <p>No need to worry about reasoning format differences when calling DeepSeek models via OpenAI SDK or Claude Code.</p>
+
+      <ScreenShot src="/images/llm-simple-router/proxy_enhance.png" caption="Proxy Enhancement (Experimental)" />
     </template>
   </div>
 </template>

src/views/project/llm-simple-router/config/Docker.vue

@@ -1 +1 @@
-{"root":["./src/main.ts","./src/vite-env.d.ts","./src/composables/uselocale.ts","./src/config/sidebar.ts","./src/i18n/index.ts","./src/locales/en.ts","./src/locales/zh.ts","./src/router/index.ts","./src/app.vue","./src/components/codeblock.vue","./src/components/docfooter.vue","./src/components/mermaid.vue","./src/components/navbar.vue","./src/components/screenshot.vue","./src/components/sidebar.vue","./src/layouts/doclayout.vue","./src/views/project/llm-simple-router/faq.vue","./src/views/project/llm-simple-router/overview.vue","./src/views/project/llm-simple-router/architecture/architecture.vue","./src/views/project/llm-simple-router/config/claudecode.vue","./src/views/project/llm-simple-router/config/docker.vue","./src/views/project/llm-simple-router/config/env.vue","./src/views/project/llm-simple-router/features/autoretry.vue","./src/views/project/llm-simple-router/features/concurrency.vue","./src/views/project/llm-simple-router/features/modelmapping.vue","./src/views/project/llm-simple-router/features/monitor.vue","./src/views/project/llm-simple-router/features/multikey.vue","./src/views/project/llm-simple-router/features/otherfeatures.vue","./src/views/project/llm-simple-router/features/providers.vue","./src/views/project/llm-simple-router/getting-started/index.vue","./src/views/project/llm-simple-router/logging/pipeline.vue","./src/views/social/socialpage.vue"],"version":"5.7.3"}
+{"root":["./src/main.ts","./src/vite-env.d.ts","./src/composables/uselocale.ts","./src/config/sidebar.ts","./src/i18n/index.ts","./src/locales/en.ts","./src/locales/zh.ts","./src/router/index.ts","./src/app.vue","./src/components/codeblock.vue","./src/components/docfooter.vue","./src/components/mermaid.vue","./src/components/navbar.vue","./src/components/screenshot.vue","./src/components/sidebar.vue","./src/layouts/doclayout.vue","./src/views/project/llm-simple-router/faq.vue","./src/views/project/llm-simple-router/overview.vue","./src/views/project/llm-simple-router/architecture/architecture.vue","./src/views/project/llm-simple-router/config/claudecode.vue","./src/views/project/llm-simple-router/config/codex.vue","./src/views/project/llm-simple-router/config/docker.vue","./src/views/project/llm-simple-router/config/env.vue","./src/views/project/llm-simple-router/config/pi.vue","./src/views/project/llm-simple-router/config/processmanagement.vue","./src/views/project/llm-simple-router/features/autoretry.vue","./src/views/project/llm-simple-router/features/concurrency.vue","./src/views/project/llm-simple-router/features/modelmapping.vue","./src/views/project/llm-simple-router/features/monitor.vue","./src/views/project/llm-simple-router/features/multikey.vue","./src/views/project/llm-simple-router/features/otherfeatures.vue","./src/views/project/llm-simple-router/features/providers.vue","./src/views/project/llm-simple-router/getting-started/index.vue","./src/views/project/llm-simple-router/logging/pipeline.vue","./src/views/social/socialpage.vue"],"version":"5.7.3"}