jim800121chen
fb7da5d180
依 autoflow-agent workspace v2 設計把 PRD / 設計 / 架構 / 交付類 共享文件從個人層 .autoflow/（ignored）搬到 docs/autoflow/（進 git）， 讓團隊可共享產品與架構文件，個人層只留 progress / review / testing 等 per-branch 筆記。 - 02-prd/ 21 個檔（PRD、features、market-analysis 等） - 03-design/ 18 個檔（design-spec、wireframes、flows 等） - 04-architecture/ 31 個檔（TDD、design-doc、ADR×14、API 規格等） - 07-delivery/ 3 個檔（project-summary、phase-0.6-handover、stage-deployment-setup） 合計 73 檔。原檔已從 .autoflow/ 移除（migration 工具執行 git mv， 但因 .autoflow/ 在 .gitignore 中、git 將此操作視為新增、無 rename history）。
7.1 KiB
7.1 KiB
Wireframe — /account
文字版 wireframe。Phase 0 單頁 stub，Phase 1 拆多頁。
佈局（Desktop）
┌────────────────────────────────────────────────────────────────┐
│ [Sidebar] [Header] │
│ ────────────────────────────────────────────────────────────── │
│ │
│ 帳號設定 │
│ 管理你的個人資料與偏好 │
│ │
│ ┌───────────────────────────────────────────────────────┐ │
│ │ Card: 個人資料 │ │
│ │ │ │
│ │ Email jim@example.com (readonly, bg-muted) │ │
│ │ │ │
│ │ 顯示名稱 [Jim Chen____________] [儲存 Button] │ │
│ │ │ │
│ └───────────────────────────────────────────────────────┘ │
│ │
│ ┌───────────────────────────────────────────────────────┐ │
│ │ Card: 已配對的裝置 │ │
│ │ │ │
│ │ ┌────────────────────────────────────────────────────┐│ │
│ │ │ Kneron KL520 — office-mac ││ │
│ │ │ 配對於 2026-04-18 最後心跳 2 分鐘前 ││ │
│ │ │ [🟢 在線] [解除配對] ││ │
│ │ └────────────────────────────────────────────────────┘│ │
│ │ ┌────────────────────────────────────────────────────┐│ │
│ │ │ Kneron KL720 — home-pi ││ │
│ │ │ 配對於 2026-04-21 最後心跳 5 天前 ││ │
│ │ │ [⚪ 離線] [解除配對] ││ │
│ │ └────────────────────────────────────────────────────┘│ │
│ │ │ │
│ │ [+ 配對新裝置] → /devices/pair │ │
│ └───────────────────────────────────────────────────────┘ │
│ │
│ ┌───────────────────────────────────────────────────────┐ │
│ │ Card: 偏好設定 │ │
│ │ (此區段可能與 /settings 重複，Phase 0 暫 skip 或只做一個)│ │
│ └───────────────────────────────────────────────────────┘ │
│ │
│ ┌───────────────────────────────────────────────────────┐ │
│ │ Card: 危險區（Danger Zone） │ │
│ │ border: border-destructive/50 │ │
│ │ │ │
│ │ 登出此瀏覽器 [登出] │ │
│ │ ───────── │ │
│ │ 刪除帳號 [刪除帳號 (destructive)] │ │
│ │ 一旦刪除，此操作無法復原 │ │
│ └───────────────────────────────────────────────────────┘ │
│ │
└────────────────────────────────────────────────────────────────┘
互動（Phase 0 簡化）
| 操作 | Phase 0 行為 | Phase 1 行為 |
|---|---|---|
| 儲存顯示名稱 | toast「此功能開發中」 | 真實 API 呼叫 |
| 解除配對 | AlertDialog 確認後 → toast「此功能開發中」 | 呼叫 DELETE /api/devices/:id |
| 配對新裝置 | 跳 /devices/pair |
同 |
| 登出 | useAuthStore.logout() → 跳 /login |
同 + 呼叫 server logout |
| 刪除帳號 | AlertDialog → toast「此功能開發中」 | 完整流程 |
資料來源
Phase 0（Mock 資料）：
user.email：從useAuthStore讀user.displayName：從localStorage.displayName讀（若無，預設 Email 前綴）- 配對裝置列表：從
useDeviceStore讀
Phase 1：
- 改為
GET /api/account/me拉真實資料 - 裝置列表
GET /api/devices?owner=me
響應式
- Desktop：Card 單欄
max-w-3xl - Tablet：同 Desktop
- Mobile：Card 撐滿，
px-4
Phase 1 TODO
拆成以下子路由：
| 子路由 | 內容 |
|---|---|
/account/profile |
Email、顯示名稱、頭像、密碼變更 |
/account/devices |
已配對裝置管理 |
/account/api-keys |
Personal Access Tokens（for CLI / API 使用） |
/account/sessions |
登入過的裝置 / 瀏覽器，可撤銷 |
/account/preferences |
語言、主題、通知偏好（與 /settings 合併？） |
/account/billing |
訂閱方案、付款方式、發票 |
/account/danger |
刪除帳號、匯出資料（GDPR） |
導航：Tabs 或 Sidebar 副選單皆可。