makemd/docs/03_Frontend/Pages_Flow.md

Pages Flow (Crawlful Hub)

定位：Crawlful Hub 前端页面流转文档 - 描述各模块页面间的跳转关系和数据流。 更新日期: 2026-03-18 最高优先级参考: Business_ClosedLoops.md

---

1. 页面流转总览

登录页
  │
  ▼
仪表盘 (Dashboard)
  │
  ├──► 商品管理
  │     ├── 商品列表 ──► 商品详情
  │     │                 ├── 编辑商品
  │     │                 └── 审核商品
  │     ├── 创建商品
  │     └── 商品审核
  │
  ├──► 订单管理
  │     ├── 订单列表 ──► 订单详情
  │     │                 └── 状态流转
  │     └── 订单审核
  │
  ├──► 财务管理
  │     ├── 财务概览
  │     ├── 交易流水
  │     └── 利润对账
  │
  ├──► 库存管理
  │     ├── 库存概览
  │     ├── 仓库管理
  │     └── 库存预测
  │
  ├──► 营销广告
  │     ├── 营销概览
  │     ├── 广告管理
  │     └── 竞品监控
  │
  ├──► 供应商管理
  │     ├── 供应商列表 ──► 供应商详情
  │     └── 供应商审核
  │
  ├──► 报表分析
  │     ├── 利润报表
  │     └── 绩效报表
  │
  └──► 系统设置
        ├── 个人设置
        ├── 租户设置
        └── 用户管理

---

2. 商品管理模块

2.1 页面流转图

商品列表页 (/products)
  │
  ├──► 创建商品 (/products/create) ──► 返回列表
  │
  ├──► 商品详情 (/products/:id)
  │     ├── 编辑 ──► 编辑页 (/products/:id/edit)
  │     └── 审核 ──► 审核弹窗
  │
  └──► 商品审核 (/products/review)

2.2 页面说明

页面	路径	功能	权限
商品列表	/products	展示所有商品，支持筛选、排序、分页	product:read
商品详情	/products/:id	展示商品详细信息，支持编辑、删除	product:read
创建商品	/products/create	表单创建新商品	product:create
编辑商品	/products/:id/edit	编辑商品信息	product:update
商品审核	/products/review	审核待上架商品	product:review

2.3 数据流

商品列表页
  │
  ├── 加载数据: GET /api/v1/products
  │
  ├── 筛选操作
  │     ├── 平台筛选
  │     ├── 状态筛选
  │     └── 关键词搜索
  │
  ├── 分页操作
  │     └── GET /api/v1/products?page={n}
  │
  └── 批量操作
        ├── 批量审核
        └── 批量删除

---

3. 订单管理模块

3.1 页面流转图

订单列表页 (/orders)
  │
  ├──► 订单详情 (/orders/:id)
  │     ├── 状态流转
  │     ├── 编辑信息
  │     └── 查看账单
  │
  └──► 订单审核 (/orders/audit)

3.2 页面说明

页面	路径	功能	权限
订单列表	/orders	展示所有订单，支持筛选	order:read
订单详情	/orders/:id	展示订单详细信息	order:read
订单审核	/orders/audit	批量审核订单	order:audit

3.3 状态流转

订单详情页
  │
  ├── 当前状态: PULLED
  │     └── 操作: 审核 ──► PENDING_REVIEW
  │
  ├── 当前状态: PENDING_REVIEW
  │     └── 操作: 确认 ──► CONFIRMED
  │
  ├── 当前状态: CONFIRMED
  │     └── 操作: 分配 ──► ALLOCATED
  │
  ├── 当前状态: ALLOCATED
  │     └── 操作: 准备发货 ──► READY_TO_SHIP
  │
  ├── 当前状态: READY_TO_SHIP
  │     └── 操作: 发货 ──► SHIPPED
  │
  ├── 当前状态: SHIPPED
  │     └── 操作: 送达 ──► DELIVERED
  │
  └── 当前状态: DELIVERED
        └── 操作: 关闭 ──► CLOSED

---

4. 财务管理模块

4.1 页面流转图

财务概览 (/finance)
  │
  ├──► 交易流水 (/finance/transactions)
  │     └── 查看详情
  │
  └──► 利润对账 (/finance/reconciliation)
        └── 查看对账结果

4.2 页面说明

页面	路径	功能	权限
财务概览	/finance	展示财务关键指标	finance:read
交易流水	/finance/transactions	查看所有交易记录	finance:read
利润对账	/finance/reconciliation	执行利润对账	finance:reconcile

4.3 数据流

财务概览页
  │
  ├── 加载统计数据: GET /api/v1/finance/stats
  │
  ├── 图表数据
  │     ├── 营收趋势图
  │     ├── 利润分布图
  │     └── 平台占比图
  │
  └── 快捷操作
        ├── 查看交易流水
        └── 执行利润对账

---

5. 库存管理模块

5.1 页面流转图

库存概览 (/inventory)
  │
  ├──► 仓库管理 (/inventory/warehouses)
  │     ├── 创建仓库
  │     └── 编辑仓库
  │
  └──► 库存预测 (/inventory/forecast)
        └── 查看预测结果

5.2 页面说明

页面	路径	功能	权限
库存概览	/inventory	展示库存总览	inventory:read
仓库管理	/inventory/warehouses	管理仓库信息	inventory:manage
库存预测	/inventory/forecast	查看库存预测	inventory:read

---

6. 营销广告模块

6.1 页面流转图

营销概览 (/marketing)
  │
  ├──► 广告管理 (/marketing/ads)
  │     ├── 创建广告
  │     └── 广告报表
  │
  └──► 竞品监控 (/marketing/competitors)
        └── 竞品详情

6.2 页面说明

页面	路径	功能	权限
营销概览	/marketing	展示营销关键指标	marketing:read
广告管理	/marketing/ads	管理广告投放	marketing:manage
竞品监控	/marketing/competitors	监控竞品动态	marketing:read

---

7. 供应商管理模块

7.1 页面流转图

供应商列表 (/suppliers)
  │
  ├──► 创建供应商
  │
  └──► 供应商详情 (/suppliers/:id)
        ├── 编辑信息
        └── 查看交易记录

7.2 页面说明

页面	路径	功能	权限
供应商列表	/suppliers	展示所有供应商	supplier:read
供应商详情	/suppliers/:id	展示供应商详细信息	supplier:read

---

8. 报表分析模块

8.1 页面流转图

报表中心 (/reports)
  │
  ├──► 利润报表 (/reports/profit)
  │
  └──► 绩效报表 (/reports/performance)

8.2 页面说明

页面	路径	功能	权限
报表中心	/reports	展示所有报表入口	report:read
利润报表	/reports/profit	查看利润分析报表	report:read
绩效报表	/reports/performance	查看绩效分析报表	report:read

---

9. 系统设置模块

9.1 页面流转图

设置首页 (/settings)
  │
  ├──► 个人设置 (/settings/profile)
  │
  ├──► 租户设置 (/settings/tenant)
  │
  └──► 用户管理 (/settings/users)
        ├── 创建用户
        └── 编辑用户

9.2 页面说明

页面	路径	功能	权限
设置首页	/settings	设置导航	-
个人设置	/settings/profile	修改个人信息	-
租户设置	/settings/tenant	管理租户配置	tenant:manage
用户管理	/settings/users	管理系统用户	user:manage

---

10. 全局交互

10.1 导航菜单

侧边栏菜单
  │
  ├── 仪表盘
  ├── 商品管理
  ├── 订单管理
  ├── 财务管理
  ├── 库存管理
  ├── 营销广告
  ├── 供应商
  ├── 报表分析
  └── 系统设置

10.2 面包屑导航

首页 / 商品管理 / 商品详情
首页 / 订单管理 / 订单审核
首页 / 财务管理 / 利润对账

10.3 快捷操作

操作	触发方式	说明
全局搜索	Ctrl + K	快速搜索商品、订单
通知中心	顶部图标	查看系统通知
个人菜单	头像下拉	个人设置、退出登录

---

11. 相关文档

• Frontend Design
• UI Components
• Business ClosedLoops

---

本文档基于业务闭环设计，最后更新: 2026-03-18