# 页面信息架构与导航（IA）

> 本文档定义 wordcloud 前端各页面之间的**层级关系**与**导航路径**，是将来接入 URL 路由
> （react-router）的依据。先梳理清楚路径模型，再谈实现。
>
> 相关：`frontend/src/App.tsx`（当前无路由，用 `AppPage` state 切页）。

## 1. 页面清单

| 页面 | 组件 | 职责 | 访问等级 |
|------|------|------|----------|
| 模板库 | `TemplateHome` | 主入口：选模板 / 新建画布 / 集中展示并列功能 | 公开 |
| 画布设计 | `CanvasStudio` | 把模板 + 贴纸 + 词云装配成成品 | 公开 |
| 词云工具 | `TestWorkbench` | 从名单生成 / 替换词云（画布的子步骤） | 公开 |
| 生产订单 | `OrdersPage` | 下单 / 派单 / 投递（WCD 任务） | **口令登录** |
| 查找名字 | `FindPage` | 跨任务查名字位置 | **口令登录**（与订单令牌互通） |
| 帮助 | `HelpPage` | 使用说明 | 公开 |

## 2. 层级模型

页面不是一层平铺的 tab，而是**两类不同关系**：

```
┌─────────────── 并列功能（独立入口）──────────────┐
│  生产订单   查找名字   帮助                        │
└───────────────────────────────────────────────────┘
        ▲ 全局可达：从任意页面进入，做完可回原处

                  /  模板库（主入口）
                    │
                    │  选择模板 / 新建空白
                    ▼
                画布设计
                    │
                    │  添加 / 替换词云
                    ▼
                 词云工具
```

### 2.1 线性主流程：模板库 → 画布 → 词云

- 一条**单向依赖链**：词云工具是画布的编辑步骤，画布是模板库的编辑步骤。
- 导航用「**面包屑 + 前进/后退**」表达，保持编辑上下文，**不**作为 tab 平铺。
- 词云工具**仅能从画布进入**（不做独立根路径入口、不做根 tab）。

### 2.2 并列功能孤岛：订单 / 查找 / 帮助

- 不依附画布，与模板平级、独立存在。
- 通过**每页常驻薄导航条右侧**的图标入口进入（全局可达）。
- 订单、查找受口令保护；两者共用同一令牌（`wordcloud-orders-token`），登录态互通。

## 3. 导航条规格（每页常驻薄导航条）

所有页面共用一条顶部薄导航：

- **左侧**：Logo + 面包屑（主流程当前路径，如 `模板 › 画布 › 词云`），当前步骤高亮；
- **右侧**：并列功能图标入口（订单 / 查找 / 帮助），从任意页面可达；
- 进入并列功能后，提供「**回到原处**」（回到进入前的工作位置 / 或模板库兜底）。

## 4. 未来 URL 路由映射

当前用 state 切页；接入路由后按此映射：

| 页面 | 路径 | 说明 |
|------|------|------|
| 模板库 | `/` | 主入口 |
| 画布设计 | `/canvas`<br>`/canvas/:projectId` | 有工程时带 id |
| 词云工具 | `/canvas/:projectId/wordcloud` | 挂在画布路径下，表达「子步骤」 |
| 生产订单 | `/orders` | 并列根路径，登录保护 |
| 查找名字 | `/find` | 并列根路径，登录保护 |
| 帮助 | `/help` | 并列根路径 |

好处：URL 本身编码了层级——词云路径带前缀 `/canvas/...`，订单/查找/帮助是根路径，
一眼可知关系；也支持刷新保持、前进后退、可分享链接。

## 5. 已确认决策（记录）

- **D1**：词云工具仅作为画布子步骤，无独立入口。
- **D2**：并列功能（订单/查找/帮助）入口放在「每页常驻薄导航条」，而非只在首页。
- **D3**：将来必做 URL 路由（本模型为其落点）。

## 6. 待探索 / 未定

- 画布多工程时 `/canvas/:projectId` 的工程列表放哪（模板库内 or 独立）。
- 并列功能「回到原处」的精确记忆（记住上一个主流程步骤即可，暂不引入后端会话）。
- 帮助页是否并入模板库首页底部，还是保留独立页面。