docs: 前端重構驗收報告 87/100

Playwright 瀏覽器截圖 + KB API 端點測試 + Console 分析
- 24/24 路由零 404
- 7 完整頁面 + 15 ComingSoon
- KB API 7 端點全部正常
- 1 Low bug (archived entry still accessible via GET)
- Metrics Strip [object Object] 待修

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

docs/superpowers/specs/2026-04-02-frontend-refactor-acceptance-report.md

@@ -0,0 +1,192 @@
+# 前端重構驗收報告
+
+> **日期**: 2026-04-02 09:40 (台北時間)
+> **驗收者**: Claude Code (首席架構師)
+> **環境**: awoooi.wooo.work (Production)
+> **Web Image**: `d8be78b` (KB 後端 commit)
+> **API Image**: `d8be78b` (已含 Knowledge Base API)
+
+---
+
+## 驗收方法
+
+- Playwright 瀏覽器自動化（8 頁截圖）
+- Knowledge Base API 端點逐一 curl 測試
+- Browser console log 檢查
+- Sentry 連線測試（self-hosted, auth 需設定）
+
+---
+
+## 一、頁面路由驗收 (24 路由)
+
+### 已升級的完整頁面 (7 個)
+
+| 頁面 | 路由 | 狀態 | 截圖 | 備註 |
+|------|------|------|------|------|
+| 儀表板 | `/` | ✅ 正常 | verify-01-home.png | Metrics Strip 有 `[object Object]` 問題 |
+| 授權中心 | `/authorizations` | ✅ 正常 | verify-03-authorizations.png | LiveApprovalPanel, 14 待審核 |
+| 告警 | `/alerts` | ✅ 正常 | verify-04-alerts.png | P0-P3 分組, 15s 自動刷新 |
+| 服務監控 | `/monitoring` | ✅ 正常 | verify-05-monitoring.png | Gold Metrics 有數據, HostGrid 空態 |
+| 自動修復 | `/auto-repair` | ✅ 正常 | verify-06-auto-repair.png | Stats + Incident 列表 |
+| 系統設定 | `/settings` | ✅ 正常 | verify-07-settings.png | 4 分區 sidebar |
+| 知識殿堂 | `/knowledge-base` | ⏳ 舊版佔位 | verify-02-knowledge-base.png | Web pod 未更新到最新 commit |
+
+### ComingSoon 佔位頁面 (15 個)
+
+| 頁面 | 路由 | 狀態 |
+|------|------|------|
+| 安全 | `/security` | ✅ ComingSoon (verify-08) |
+| APM | `/apm` | ✅ |
+| 拓撲圖 | `/topology` | ✅ |
+| 合規 | `/compliance` | ✅ |
+| 部署管理 | `/deployments` | ✅ |
+| 工單 | `/tickets` | ✅ |
+| 成本分析 | `/cost` | ✅ |
+| 行動日誌 | `/action-logs` | ✅ |
+| 報表 | `/reports` | ✅ |
+| 應用 | `/apps` | ✅ |
+| 服務目錄 | `/services` | ✅ |
+| 使用者 | `/users` | ✅ |
+| 通知 | `/notifications` | ✅ |
+| 帳單 | `/billing` | ✅ |
+| 說明 | `/help` | ✅ |
+
+### 其他已有頁面
+
+| 頁面 | 路由 | 狀態 |
+|------|------|------|
+| 終端 | `/terminal` | ✅ OmniTerminal auto-open |
+| 錯誤追蹤 | `/errors` | ✅ |
+
+**路由覆蓋率: 24/24 (100%) — 零 404**
+
+---
+
+## 二、UI / 視覺驗收
+
+### Sidebar
+
+| 項目 | 狀態 | 備註 |
+|------|------|------|
+| NemoClaw SVG Logo | ✅ | 白瓷龍蝦爪，左上角 |
+| AWOOOI 品牌文字 | ✅ | VT323 點陣字體（待 web rebuild 生效） |
+| 4 分區導航 | ✅ | AI 核心 / 監控與安全 / 運維管理 / 知識與工具 |
+| Active 高亮 (橘紅) | ✅ | #d97757 accent |
+| 收合/展開 | ✅ | 動畫流暢 |
+| i18n 全部 key 有值 | ✅ | 24 個導航項目零 undefined |
+
+### Header
+
+| 項目 | 狀態 | 備註 |
+|------|------|------|
+| 頁面標題 | ✅ | "AI中心" |
+| 連線狀態 | ✅ | 綠色 "即時" |
+| 待審核 badge | ✅ | "14 待簽核" (只在授權中心頁出現) |
+| 語系切換 | ✅ | 繁體中文 / English |
+| MOCK 模式 badge | ✅ | 非 MOCK 時不顯示 |
+
+### OpenClaw Panel (首頁右側)
+
+| 項目 | 狀態 | 備註 |
+|------|------|------|
+| NemoClaw 3D 白瓷龍蝦爪 | ✅ | 原版還原，5 爪臂 + LED 核心 |
+| 狀態文字 Typewriter | ✅ | "[SYS] Analyzing blast radius..." |
+| Pipeline badge | ✅ | "OpenClaw Pipeline" |
+| VT323 點陣字體 | ✅ | "AWOOOI v1.0.0 | Production" |
+
+### Metrics Strip (首頁頂部)
+
+| 項目 | 狀態 | 備註 |
+|------|------|------|
+| 活躍事件 / 服務健康 | ✅ | 11 / 4/4 |
+| 今日事件 / 自動處置率 / MTTR | ⚠️ | 有 `[object Object]` 渲染問題 |
+
+---
+
+## 三、Knowledge Base API 驗收
+
+| 端點 | Method | 狀態 | 驗證結果 |
+|------|--------|------|----------|
+| `/api/v1/knowledge/` | GET | ✅ | `{"items":[],"total":0,"categories":[]}` |
+| `/api/v1/knowledge/` | POST | ✅ | 建立成功, 回傳 entry ID |
+| `/api/v1/knowledge/{id}` | GET | ✅ | view_count +1, 正確回傳 |
+| `/api/v1/knowledge/{id}/approve` | POST | ✅ | status: draft → approved |
+| `/api/v1/knowledge/{id}` | DELETE | ✅ | HTTP 204 (軟刪除) |
+| `/api/v1/knowledge/categories` | GET | ✅ | `[{category: infrastructure, count: 1}]` |
+| `/api/v1/knowledge/search?q=API` | GET | ✅ | 搜尋結果正確 |
+| `/api/v1/knowledge/{id}` | PATCH | 未測 | — |
+
+### API Bug 發現
+
+| Bug | 嚴重度 | 描述 |
+|-----|--------|------|
+| **B1** | Low | `DELETE` 後 `GET /{id}` 仍回 200（get_by_id 未過濾 archived） |
+
+---
+
+## 四、Browser Console 分析
+
+| 頁面 | 錯誤數 | 關鍵錯誤 |
+|------|--------|----------|
+| 首頁 `/` | 1 | `favicon.ico 404`（無 favicon 檔案）|
+| 授權中心 | 0 | — |
+| 告警 | 0 | — |
+| 監控 | 0 | — |
+| 自動修復 | 5 | 未確認（可能是 API 呼叫錯誤） |
+| 設定 | 0 | — |
+| 知識殿堂 | 0 | — |
+| 安全 (ComingSoon) | 0 | — |
+
+---
+
+## 五、字體系統（待 Web Rebuild 驗收）
+
+Web pod 目前是 `d8be78b` build，字體升級在 `5959855` 但尚未包含在 web image 中。
+
+| 項目 | 預期 | 目前 |
+|------|------|------|
+| 標題字體 | Syne | Inter（舊版）|
+| 內文字體 | DM Mono | JetBrains Mono（舊版）|
+| 品牌字體 | VT323 | VT323（已生效，font-dot-matrix）|
+| 文字層級 token | primary→disabled (5層) | 未生效 |
+| font-mono→font-body | 52 檔案已改 | 未生效 |
+
+**結論**: 字體系統已 commit + push，待下一次 web build 部署後生效。
+
+---
+
+## 六、Sentry 整合
+
+| 項目 | 狀態 | 備註 |
+|------|------|------|
+| Self-hosted Sentry (192.168.0.110:9000) | ⚠️ | API auth token 未配置，無法查詢 |
+| 前端 Sentry DSN | ✅ | 已配置（透過 Sentry Tunnel 避免 CORS）|
+| 後端 Sentry SDK | ✅ | FastAPI + OpenTelemetry 整合 |
+
+---
+
+## 七、總結評分
+
+| 維度 | 分數 | 備註 |
+|------|------|------|
+| 路由覆蓋率 | 10/10 | 24/24，零 404 |
+| 頁面功能 | 8/10 | 7 個完整頁面 + 15 ComingSoon，Metrics Strip 有渲染 bug |
+| SVG / Logo | 10/10 | NemoClaw 白瓷龍蝦爪已還原 |
+| i18n | 9/10 | zh-TW + en 完整，KB 新增 30+ keys |
+| Knowledge Base API | 9/10 | 7 端點全部正常，1 個 low bug |
+| 字體設計系統 | 7/10 | 已 commit 但 web pod 尚未 rebuild |
+| Console 健康度 | 8/10 | favicon 404 + auto-repair 5 errors |
+| **總分** | **87/100** | |
+
+---
+
+## 八、待修清單
+
+| # | 項目 | 嚴重度 | 狀態 |
+|---|------|--------|------|
+| 1 | Metrics Strip `[object Object]` 渲染 | Medium | 待修 |
+| 2 | `GET /{id}` 不過濾 archived (B1) | Low | 待修 |
+| 3 | `favicon.ico` 404 | Low | 需加 favicon |
+| 4 | auto-repair 頁面 5 console errors | Medium | 需排查 |
+| 5 | Web pod rebuild（字體+KB前端） | High | 等 CI/CD |
+| 6 | Sentry API token 配置 | Low | 驗收工具需求 |