---
id: blueprint-view
name: 蓝图可视化
status: in_progress
progress: 10
---

## 概述
读取项目 .blueprint/ 目录中的 manifest.yaml 和 modules/*.md，用 React Flow 渲染项目全景架构图。点击模块节点展示详情和任务卡列表。

## 任务卡

### ✅ .blueprint/ 数据结构设计
- status: done
- files: .blueprint/manifest.yaml, .blueprint/CONVENTIONS.md

定义 manifest.yaml 格式、模块文件格式、任务卡格式、CONVENTIONS 规则。

### 📋 蓝图读取 Command
- status: todo
- complexity: M
- files: src-tauri/src/commands/blueprint.rs (待创建)
- acceptance: 实现 get_blueprint tauri command，读取指定项目路径下的 .blueprint/manifest.yaml 和 modules/*.md，解析后返回结构化数据

### 📋 React Flow 节点图渲染
- status: todo
- complexity: L
- files: src/components/dashboard/BlueprintModal.tsx (待创建)
- depends: blueprint-reader
- acceptance: 将 manifest.yaml 的 modules 渲染为自定义节点（带状态色标、进度条），edges 渲染为连线，areas 渲染为分组背景

### 📋 模块详情面板
- status: todo
- complexity: M
- files: src/components/dashboard/BlueprintModal.tsx
- depends: blueprint-reader
- acceptance: 点击节点后在底部/侧边展示模块描述和任务卡列表，任务卡按状态分组显示

### 📋 项目卡片蓝图入口
- status: todo
- complexity: S
- files: src/components/dashboard/ProjectCard.tsx
- acceptance: 项目卡片新增「蓝图」按钮，点击打开 BlueprintModal，检测到无 .blueprint/ 时显示引导提示

### 💭 统计汇总条
- status: concept
- notes: 模态框顶部展示项目完成度统计条（已完成 X / 进行中 X / 规划中 X / 构思中 X）