2026-05-26 09:32:32 +00:00
|
|
|
|
# Gateway Frontend
|
|
|
|
|
|
|
|
|
|
|
|
一般使用者前台 + 簡易管理後台，對應本 repo 的 Gateway API。
|
|
|
|
|
|
|
|
|
|
|
|
## 技術
|
|
|
|
|
|
|
|
|
|
|
|
- Vite + React + TypeScript + React Router
|
|
|
|
|
|
- 無 UI 框架，表單與頁面導覽即可日常使用
|
|
|
|
|
|
|
|
|
|
|
|
## 啟動（推薦一鍵後端）
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 終端 1：後端全套（首次約 1–2 分鐘，等 ZITADEL 起來）
|
|
|
|
|
|
make dev-up
|
|
|
|
|
|
|
|
|
|
|
|
# 終端 2：前端
|
|
|
|
|
|
make frontend-dev
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
開啟 http://localhost:5173 · 註冊 OTP 到 http://localhost:8025（MailHog）
|
|
|
|
|
|
|
|
|
|
|
|
關閉：`make dev-down`
|
|
|
|
|
|
|
|
|
|
|
|
## 頁面結構
|
|
|
|
|
|
|
|
|
|
|
|
### 使用者前台
|
|
|
|
|
|
|
|
|
|
|
|
| 路徑 | 功能 |
|
|
|
|
|
|
|------|------|
|
|
|
|
|
|
| `/login` | 登入 |
|
|
|
|
|
|
| `/register` | 註冊（寄 Email OTP） |
|
|
|
|
|
|
| `/register/confirm` | 輸入 6 碼完成註冊 |
|
|
|
|
|
|
| `/app` | 首頁（個人摘要、驗證狀態、角色） |
|
|
|
|
|
|
| `/app/profile` | 編輯顯示名稱、語系、幣別、電話 |
|
|
|
|
|
|
| `/app/security` | 商業 Email/手機驗證、TOTP 綁定 |
|
|
|
|
|
|
|
|
|
|
|
|
### 管理後台（需 `tenant_admin` 或 `tenant_owner`）
|
|
|
|
|
|
|
|
|
|
|
|
| 路徑 | 功能 |
|
|
|
|
|
|
|------|------|
|
|
|
|
|
|
| `/admin` | 總覽、Policy 重載 |
|
|
|
|
|
|
| `/admin/roles` | 角色列表、新增、改名、刪除 |
|
|
|
|
|
|
| `/admin/users` | 依 UID 查詢 / 指派 / 撤銷角色 |
|
|
|
|
|
|
|
|
|
|
|
|
有管理權限時，使用者前台頂部會出現「管理後台」連結。
|
|
|
|
|
|
|
|
|
|
|
|
## 本機預設
|
|
|
|
|
|
|
|
|
|
|
|
- 租戶：`k6-tenant`
|
|
|
|
|
|
- 邀請碼：`K6INVITE`（需先 `make k6-seed-fixtures` 或對應 Mongo 資料）
|
|
|
|
|
|
- OTP：開發環境到 MailHog http://localhost:8025 查看
|
|
|
|
|
|
|
|
|
|
|
|
### 取得管理員權限
|
|
|
|
|
|
|
2026-05-28 06:45:11 +00:00
|
|
|
|
`make dev-up` 會自動建立原始管理員並寫入 Mongo：
|
|
|
|
|
|
|
|
|
|
|
|
| 欄位 | 值 |
|
|
|
|
|
|
|------|-----|
|
|
|
|
|
|
| Email | `admin@k6.local` |
|
|
|
|
|
|
| 密碼 | `Admin-Pass-1!` |
|
|
|
|
|
|
| 租戶 | `k6-tenant` |
|
|
|
|
|
|
| 角色 | `tenant_admin` |
|
|
|
|
|
|
|
|
|
|
|
|
登入後頂部會出現「管理後台」，或在首頁 `/app` 的「權限管理」卡片進入。
|
|
|
|
|
|
|
|
|
|
|
|
手動重跑 seed（冪等）：
|
|
|
|
|
|
|
2026-05-26 09:32:32 +00:00
|
|
|
|
```bash
|
2026-05-28 06:45:11 +00:00
|
|
|
|
make dev-seed-admin
|
2026-05-26 09:32:32 +00:00
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 環境變數
|
|
|
|
|
|
|
|
|
|
|
|
| 變數 | 說明 |
|
|
|
|
|
|
|------|------|
|
|
|
|
|
|
| `VITE_API_BASE` | API 根網址；留空則走 Vite proxy `/api` → `:8888` |
|
|
|
|
|
|
|
|
|
|
|
|
## 建置
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
npm run build # → dist/
|
|
|
|
|
|
```
|
