[argszero]

Summary

Settings page gains an 「接入方式 / API 端点」card (#endpoint-card, above the API Key card — see endpoints before generating a key), showing the platform's gateway base URLs so users know where to point Cursor / Cline / Roo Code / Claude Code etc.:

• OpenAI 兼容: https://gateway.aitokenpool.local/v1 — Chat Completions · Cursor / Cline / Roo Code / OpenCode / OpenAI SDK
• Anthropic 兼容: https://gateway.aitokenpool.local/anthropic — Messages API · Claude Code / Goose / OpenClaw

Each endpoint row: protocol tag (accent pill) → mono, whole-selectable URL (user-select:all) → copy button (reuses the copyKey fallback chain: clipboard API → execCommand("copy") → "Ctrl+C" hint, with the「已复制 ✓」flash) → tool-list description. URL note「部署后替换为你的网关域名」(prototype placeholder). Card includes the usage steps ① generate API Key → ② set Base URL → ③ paste key.

Endpoints are UI static constants (API_ENDPOINTS, commented that real values come from deploy config, e.g. config.server.base_url, to be wired in the backend). Narrow screens stack rows vertically + URLs wrap.

Docs: docs/user-stories.md v1.19 + ui/README.md「接入端点卡片约定」. Verified by DOM-stub smoke test (16 assertions: constants, HTML card structure + ordering above API Key card, CSS incl. narrow-screen), cargo test, cargo fmt --check.

Rant (verbatim)

Rant: 设置页增加「API 接入端点」展示 — OpenAI 兼容 / Anthropic 兼容 base URL（宿主 2026-08-17 指示）

需求

宿主指出：平台应该有地方展示 OpenAI 兼容 与 Anthropic 兼容 的 base URL。
用户生成了 API Key 后，需要知道把请求发到哪个端点才能接入 Cursor / Cline / Roo Code / Claude Code 等工具。
当前 UI 完全没有网关端点的展示（只有 docs/plan-api-matrix.md 里有上游厂商的 base URL 调研，用户侧看不到平台自身端点）。

设计（ui/ 静态原型，零外部依赖）

1. 设置页新增「接入方式 / API 端点」卡片（放在 API Key 卡片上方，逻辑上先看端点再生成 key）：
   • OpenAI 兼容：https://gateway.aitokenpool.local/v1 —— 说明：Chat Completions，接入 Cursor / Cline / Roo Code / OpenCode / OpenAI SDK；
   • Anthropic 兼容：https://gateway.aitokenpool.local/anthropic —— 说明：Messages API，接入 Claude Code / Goose / OpenClaw；
   • 每个端点一行：协议标签 + 端点 URL（等宽字体）+ 复制按钮（复用现有 copyKey 的降级复制逻辑）+ 说明小字；
   • 端点 URL 旁加小注「部署后替换为你的网关域名」（原型占位说明）。
2. 使用步骤提示（卡片内小段）：
   • ① 在下方生成 API Key → ② 在工具中 Base URL 填上面对应端点 → ③ API Key 填刚生成的 key；
   • 保持极简，不展开写每个工具的配置细节（那些属于 docs）。
3. 样式：与现有卡片风格一致（.card + .api-key-card 同款），端点 URL 用 --mono 等宽 + 可选中（user-select:all 便于复制）；
   • 两个端点可用并排两列（桌面）或上下堆叠（窄屏），复用 .form-row / @media 布局。

验收标准

• 设置页出现「接入方式」卡片，含 OpenAI 兼容与 Anthropic 兼容两个端点，均有复制按钮且复制可用（含 file:// 降级）
• 端点 URL 等宽字体、可整段选中复制；说明与使用步骤小字清晰
• 亮色/深色主题、窄屏布局均正常；无 JS 报错
• 分支 feat/ui-api-endpoints，提交 PR 自 merge，版本号 v1.19

Related

• Rant timestamp: 2026-08-17T20:44:18.473579 (project aitokenpool, status in_progress)
• Branch: feat/ui-api-endpoints (per rant)

Tests

• DOM-stub smoke test — 16/16 assertions pass
• node --check ui/js/app.js
• cargo test — 1 passed
• cargo fmt --check