dev-manager-tauri/.blueprint/modules/ui-restructure.md
lanrtop bc07dd41bf feat(ui): 功能区重构阶段一——六组导航 + 资源/工具一级页 + 卡片操作分层
信息架构按三公理重排(名实一致/层级对齐/频率分层,设计见 ui-restructure 模块):
- Sidebar 六组:总览/项目/资源/洞察/工具/设置
- 新增资源页(服务器/软件仓库/云产品/API密钥/源码库 5 tab),从"项目管理"
  拆出寄生的资源类 tabs;新增工具页(开发环境/WSL代理 合并)
- Dashboard 看板只留产品组/独立项目;洞察页阶段一暂挂健康中心(N3 扩充)
- ProjectCard 底部 10 个平铺操作收敛为:🗺️蓝图/🎓导师/编辑/动态 + ⋯更多下拉
  (带文字标签收纳 Claude配置/备忘/服务器/CICD/环境扫描/工具管理)

零后端变更:纯组件挂载点迁移,面板组件与 queryKey 原样复用。
阶段二(N3 洞察页扩充 / N4 Gitea 实例迁设置 / N5 仓库注册表归位)已拆卡待启动。
2026-07-02 14:33:55 +09:00

78 lines
5.1 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 功能区 UI 信息架构重构
对照宪章"名实一致"做的一次 UI 自洽重构。核心问题:资源类功能寄生在"项目管理"页、
BlueprintModal 巨型容器混装全局/跨项目/单项目三层内容、ProjectCard 十个操作无分层、
Gitea 全局实例配置错位在单项目弹窗内。
## 三条公理
1. **名实一致**:页面叫什么就只放什么
2. **层级对齐**:全局配置 → 设置页;跨项目 → 一级导航;单项目 → 项目弹窗/卡片
3. **频率分层**:高频直达,低频收进"更多"
## 目标信息架构(六组一级导航)
```
🏠 总览 行动项跨项目进行中、可派发、Buff 项目、启动警报
📁 项目 产品组看板 / 独立项目 / 管理(项目·产品组·模板·标签·仓库注册表)
🖥️ 资源 服务器 / 软件仓库 / 云产品 / API 密钥 / 源码库
♻️ 洞察 飞轮梦核·归档·git 质量)/ 健康中心 / CONVENTIONS 全局治理
🔧 工具 开发环境扫描 / WSL 代理
⚙️ 设置 编辑器·更新·MCP + Gitea 实例管理
```
设计文档全文见 2026-07-02 会话 /architect 输出(方案 A零后端变更纯前端挂载点迁移分两阶段
## 任务卡2026-07-02 /splitter 拆解)
### ✅ N1. 资源/工具一级页 + Sidebar 六组重组 + Dashboard 瘦身
- status: done
- complexity: M
- files: src/components/resources/ResourcesPage.tsx新增, src/components/tools/ToolsPage.tsx新增, src/components/layout/Sidebar.tsx, src/components/dashboard/Dashboard.tsx, src/App.tsx
- acceptance: Sidebar 显示六组导航(总览/项目/资源/洞察/工具/设置);资源页 5 tab服务器/软件仓库/云产品/API密钥/源码库)复用现有面板组件且 queryKey 不变;工具页 2 tab开发环境/WSL代理洞察暂挂现健康中心内容N3 再扩充Dashboard 看板只剩产品组/独立项目两个 tabtypecheck 通过
### ✅ N2. ProjectCard 操作分层4 明按钮 + ⋯ 更多下拉)
- status: done
- complexity: M
- files: src/components/dashboard/ProjectCard.tsx
- acceptance: 底部操作区只显示 🗺️ 蓝图 / 🎓 导师 / 编辑 / 动态 四个明按钮 + ⋯ 更多下拉(收纳 🤖 Claude 配置、📝 个人备忘、🖥️ 关联服务器、🚀 CI/CD、🔬 环境扫描、🧰 工具管理带文字标签下拉点击外部自动关闭所有原功能可达typecheck 通过
### 📋 N3. 洞察页:飞轮跨项目内容迁出 BlueprintModal + 健康中心并入
- status: todo
- complexity: M
- depends: N1
- files: src/components/insight/InsightPage.tsx新增, src/components/dashboard/BlueprintModal.tsx, src/components/health/HealthPage.tsx
- acceptance: 洞察页 3 tab飞轮 / 健康 / 全局治理FlywheelPanel 的跨项目内容(梦核提示词、归档候选、全项目 Git 质量表、全量导入按钮)迁至飞轮 tabCONVENTIONS 版本管理与应用梦核建议迁至全局治理 tabBlueprintModal 侧板只保留单项目内容typecheck 通过
### 📋 N4. Gitea 实例管理迁设置页GiteaPanel 拆全局/项目级两半)
- status: todo
- complexity: S
- depends: N1
- files: src/components/dashboard/GiteaPanel.tsx, src/components/settings/SettingsPage.tsx
- acceptance: 实例管理区(添加/测试/删除拆为独立组件挂到设置页BlueprintModal 治理面板只保留项目级绑定与 webhook 区(无实例时提示去设置页添加);两处共用 ["gitea-instances"] queryKeytypecheck 通过
### 📋 N5. 仓库注册表并入项目页管理 tab + 总览收敛为行动项
- status: todo
- complexity: S
- depends: N1
- files: src/components/manage/ManagePage.tsx, src/components/layout/Sidebar.tsx, src/components/overview/OverviewPage.tsx, src/components/dashboard/RepoRegistryModal.tsx
- acceptance: ManagePage 新增"仓库"tab 复用 RepoRegistry 列表内容Sidebar 底部"仓库管理"按钮移除;总览页标题与文案对齐"行动项"定位(进行中任务/Buff 项目/警报不新增统计类内容typecheck 通过
## 决策记录
- 选六组导航全面重组而非最小纠偏:资源拆分只解决问题 1弹窗过载问题 2必须有"洞察页"作为跨项目内容的去处才能解
- 零后端变更是硬约束所有迁移只挪组件挂载点queryKey 保持不变React Query 缓存天然共享,避免状态重复)
- 分两阶段落地N1+N2 先行):给肌肉记忆留适应期,也让阶段二可以基于阶段一的真实使用反馈微调
## 复盘笔记
【复盘】N1+N2 阶段一:导航重组 + 卡片分层2026-07-02
任务类型: 前端组件
复杂度: M×2
实际轮数: 1轮预估 1 轮)
是否返工: 否
有效策略: 零后端约束使迁移退化为纯挂载点搬运——新容器页只做 tab 壳,面板组件与 queryKey 原样复用typecheck 一次通过
遗留风险: ① 洞察页暂挂健康中心N3 未做前名实略不符,导航先行占位);② ProjectCard 更多菜单向上弹出卡片在视口顶部时可能被裁剪overflow 场景待实际使用观察)
auto_applied_rules: R01
rule_effectiveness: R01=未触发(无新 command纯前端