jim800121chen
c54f16fca0
local-tool/: visionA-local desktop app
- M1: Wails shell + Go server + Next.js UI + Mock mode (macOS dmg ready)
- M2: i18n (zh-TW/en) + Settings 4-tab refactor
- M3: Embedded Python 3.12 runtime (python-build-standalone) + KneronPLUS wheels
- M4: Windows Inno Setup script (build on Windows runner)
- M5: Linux AppImage script + udev rule (build on Linux runner)
- M6: ffmpeg (GPL, pending legal review) + yt-dlp bundled
- Lifecycle: watchServer health check, fatal native dialog,
Wails IPC raise endpoint, stale process cleanup
.autoflow/: full PRD / Design Spec / Architecture / Testing docs
(4 rounds tri-party discussion + cross review)
.github/workflows/: macOS / Windows / Linux build CI
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
110 lines
4.8 KiB
Markdown
110 lines
4.8 KiB
Markdown
# 02 — 頁面與元件變更對照
|
||
|
||
對照原 `/Users/jimchen/Innovedus/edge-ai-platform/edge-ai-platform/frontend` 盤點結果。
|
||
|
||
## 2.1 頁面層級
|
||
|
||
| 原路由 | 決定 | visionA-local 對應 | 說明 |
|
||
|--------|------|---------------------|------|
|
||
| `/`（Dashboard） | ✅ **保留但重新設計** | `/` | 原為叢集總覽，改為「快速開始 + 單機狀態」 |
|
||
| `/models` | ✅ 保留 | `/models` | 移除 cluster 相關欄位 |
|
||
| `/devices` | ✅ 保留 | `/devices` | 移除 cluster 分組、flash 按鈕 |
|
||
| `/clusters` | ❌ **整個刪除** | — | 決策已定 |
|
||
| `/workspace/[deviceId]` | ✅ 保留 | `/workspace?device=...` 或 `/workspace/[deviceId]` | 新增裝置選擇器 top bar |
|
||
| `/workspace/cluster` | ❌ **整個刪除** | — | |
|
||
| `/settings` | ✅ **保留但重構** | `/settings/[tab]` | 從長捲頁改為分頁式 |
|
||
|
||
## 2.2 元件目錄
|
||
|
||
### 保留（全數）
|
||
|
||
| 原目錄 | 元件 | 備註 |
|
||
|--------|------|------|
|
||
| `components/camera/` | camera-feed、camera-controls、camera-overlay、source-selector、camera-inference-view、batch-image-thumbnails | 全保留 |
|
||
| `components/devices/` | device-card、device-list、device-health-card、device-connection-log、device-status | 移除 flash-dialog、flash-progress |
|
||
| `components/models/` | model-card、model-grid、model-filters、model-upload-dialog、model-detail、model-comparison-dialog | 全保留 |
|
||
| `components/inference/` | inference-panel、classification-result、confidence-slider、performance-metrics、video-progress | 全保留 |
|
||
| `components/dashboard/` | stat-card、activity-timeline、connected-devices-list | 拿掉 cluster 欄位 |
|
||
| `components/layout/` | sidebar、header、connection-status、help-button | 改寫，見 §2.3 |
|
||
| `components/ui/` | shadcn 元件組 | 全保留 |
|
||
| onboarding-dialog.tsx、guided-tour.tsx | 強化（見 04-first-run） |
|
||
| server-log-viewer.tsx、server-status-dashboard.tsx | 移至 Settings > 進階 |
|
||
| theme-sync.tsx、lang-sync.tsx、store-hydration.tsx | 全保留 |
|
||
|
||
### 刪除
|
||
|
||
| 原目錄／檔案 | 原因 |
|
||
|------------|------|
|
||
| `components/cluster/`（全目錄） | Cluster 功能砍掉 |
|
||
| `components/devices/flash-dialog.tsx`、`flash-progress.tsx` | 韌體燒錄 Q9 決策砍掉 |
|
||
| `components/relay-token-sync.tsx` | Relay 功能砍掉 |
|
||
| `app/clusters/`（全目錄） | 對應頁面砍掉 |
|
||
| `app/workspace/cluster/`（全目錄） | 同上 |
|
||
|
||
### 修改
|
||
|
||
| 元件 | 修改內容 |
|
||
|------|---------|
|
||
| `layout/sidebar.tsx` | 刪除 clusters 導航項；把 workspace 提升為主導航；logo 字樣改「visionA-local」；底部加 Server 狀態卡 |
|
||
| `layout/header.tsx` | 新增 Mock badge 顯示邏輯；刪除 relay mode switcher；連線狀態改為「Server running / idle / error」 |
|
||
| `layout/connection-status.tsx` | 語意從「Relay tunnel」改為「Local server」 |
|
||
| `dashboard/stat-card.tsx` | 移除 cluster 統計；重新設計 stat 組合（見 03-wireframes） |
|
||
| `dashboard/activity-timeline.tsx` | 過濾掉 cluster-related event |
|
||
| `app/settings/page.tsx` | 改為分頁 layout |
|
||
| `app/page.tsx` | 整頁重寫（見 03-wireframes Dashboard 章） |
|
||
|
||
## 2.3 Layout 改寫重點
|
||
|
||
### sidebar.tsx
|
||
|
||
```tsx
|
||
// 移除
|
||
- { href: '/clusters', label: 'Clusters', icon: Network }
|
||
- <RelayTokenSync />
|
||
|
||
// 新增
|
||
+ { href: '/workspace', label: 'Workspace', icon: Play }
|
||
+ <ServerStatusBadge /> // 底部常駐
|
||
```
|
||
|
||
### header.tsx
|
||
|
||
```tsx
|
||
// 移除
|
||
- <RelayModeSwitcher />
|
||
|
||
// 新增
|
||
+ {isMockMode && <MockBadge />}
|
||
+ <PageTitle /> // 取代原來的 logo-in-header（logo 只在 sidebar 顯示）
|
||
```
|
||
|
||
## 2.4 新元件
|
||
|
||
| 元件 | 放置位置 | 用途 |
|
||
|------|---------|------|
|
||
| `FirstRunWizard` | `components/first-run/` | 三步引導流程 |
|
||
| `ModeSelector` | `components/first-run/` | 真實/Mock 模式選擇卡 |
|
||
| `HardwareDetectionStep` | `components/first-run/` | USB 掃描進度與結果 |
|
||
| `MockBadge` | `components/layout/` | Header 右側 Mock 指示 |
|
||
| `ServerStatusBadge` | `components/layout/` | Sidebar 底部 server 狀態 |
|
||
| `EmptyWorkspace` | `components/workspace/` | 無裝置引導畫面 |
|
||
| `SettingsTabs` | `components/settings/` | 分頁 layout |
|
||
| `QuickStartCard` | `components/dashboard/` | Dashboard 首屏的 CTA 卡組 |
|
||
| `LanguageSwitcher` | `components/settings/` | i18n 切換 |
|
||
| `SignatureWarningNotice` | `components/first-run/` | 解釋 Gatekeeper/SmartScreen 警告（疑問 #5） |
|
||
|
||
## 2.5 被移除元件回收清單
|
||
|
||
以下程式碼可以從原專案直接刪除（不需要轉移到 local_tool）：
|
||
|
||
```
|
||
components/cluster/**/*
|
||
components/relay-token-sync.tsx
|
||
components/devices/flash-dialog.tsx
|
||
components/devices/flash-progress.tsx
|
||
app/clusters/**/*
|
||
app/workspace/cluster/**/*
|
||
```
|
||
|
||
提醒：Architect 的 round 1 分析已列出對應的後端刪除清單，請確認 API 層與前端同步刪乾淨。
|