# 轨道 B：delivery-platform-ui（Vue 3）— 并行实施包

> **对齐**：[BPM 排期 §7](../chuangfei-platform-bpm-and-roadmap.md) · [功能模块 M1–M11](../../chuangfei-platform-product-modules.md) · [并行索引](../PARALLEL_ITERATION_INDEX.md)

---

## 1. 技术基线

| 项 | 选型 |
|----|------|
| 运行时 | **Vue 3** + **Vite**，Composition API + `<script setup>` |
| 状态 | **Pinia** |
| 路由 | **vue-router**（懒加载、meta：权限码、`title`） |
| HTTP | **axios**（拦截器：JWT Bearer 或 Session Cookie） |
| UI | **Element Plus** |
| 契约（可选） | OpenAPI → TS 类型，与后端 **contract-first** |

认证：环境切换 `withCredentials` 与 `Authorization`；登录后写入 Pinia。

---

## 2. I1～I6 前端 Backlog

| 迭代 | 路由/页面 | 关键组件 | API/状态 | E2E | DoD |
|------|-----------|----------|----------|-----|-----|
| **I1** | `/login`、`/` 布局、`/403`/`/404` | `AppLayout`、`LoginForm`、`IdleTimeout` | auth/user store；401 统一处理 | P0 登录与回跳 | RBAC 路由守卫；菜单按权限过滤 |
| **I2** | `/customers`、`/projects` 及详情；`/admin/dictionaries` | `DataTable`、`CustomerForm`、`ProjectForm` | CRUD + 字典缓存 | P0 客户→项目 | 与 M1 P0 字段一致 |
| **I3** | `/contracts`、新建向导、`/contracts/:id` | `ContractWizard`、`ContractLineEditor`、`StatusTag` | 状态机由后端校验，前端禁用非法操作 | P0 草稿→生效 | M2 P0；M10-F01 入口 |
| **I4** | `/deliveries`、`/licenses/sn`、导入 | `DeliveryBatchForm`、`SnBindDialog`、`SnStatusTimeline` | 交付与合同行；孤儿 SN 警告 | P0 交付→SN→回写 | M3/M4 P0 |
| **I5** | `/callbacks`、`/integration/environments`、`product-lines` | `CallbackInboxTable`、`CallbackPayloadViewer`（脱敏） | Inbox 处置；M6 只读/受限写 | P0 列表→详情→状态 | 与 Webhook 联调或 staging |
| **I6** | 全链路导航与修缺陷（参见 [I6_CLOSEOUT.md](../iterations/I6_CLOSEOUT.md)） | 可选 `GlobalSearch` | 错误与空态统一；生产 `VITE_API_BASE` | P0 **BP-01～06+11** 全链路 E2E | UAT 无 P0；手册截图一致 |
| **I7** | `/callbacks*` 仅 **OPS/SYS_ADMIN**；菜单与首页按角色裁剪 | Pinia `hasAnyRole` | 与 `@PreAuthorize` 对齐；`ops/ops` 演示 | 与 Webhook 异步投递联调 | 参见 [I7_DESIGN.md](../iterations/I7_DESIGN.md)、[I7_IMPLEMENTATION_REVIEW.md](../iterations/I7_IMPLEMENTATION_REVIEW.md) |

---

## 3. 页面 ↔ 模块（摘要）

| 模块 | 典型路由 | MVP 迭代 |
|------|----------|----------|
| M11 | 登录、用户/角色（I2）、Mid SSO | I1、Mid |
| M1 | 客户、项目 | I2 |
| M2 | 合同 | I3 |
| M3/M4 | 交付、SN | I4 |
| M5/M6 | Callback、集成配置 | I5 |
| M7～M9 | 设备、待办、报表 | Mid |
| M10 | 审计展示/导出 | I3+ / Mid / V2 |

---

## 4. Mock 与契约先行

| 工作包 | 可先 mock？ | 建议 |
|--------|-------------|------|
| I1 壳层 + RBAC | ✅ | MSW / vite-plugin-mock |
| M1 CRUD | ✅ | I3 前客户/项目 DTO 冻结 |
| M2 合同 | ⚠️ | 状态迁移 **OpenAPI 冻结**（I2 末） |
| M3/M4 | ⚠️ | 门禁与 M11-F20 契约先行 |
| M5/M6 | ⚠️ | Payload 以 Webhook/API DTO 为准 |

**契约顺序**：Auth → Customer/Project → Contract → Delivery/SN → Callback/Integration。

---

## 5. V1.1 / Mid / V2.0（摘要）

- **I7～I8**：按钮级 `v-permission`；导出脱敏；运维只读仪表盘；批量导入进度。
- **Mid I9～I13**：设备/换机；待办与通知配置；对账与 Callback 报表；**SSO**（`/oauth/callback` 等）；合同变更对比可选。
- **V2.0**：M10 导出包、MFA、SECURITY_ADMIN、数据范围、CRM 同步状态页。

---

## 6. E2E 建议

| 层级 | 工具向 |
|------|--------|
| Smoke | Playwright / Cypress：登录 + 各迭代主路由 |
| P0 业务 | I6 全链路 + V1.1 导入导出 |
| Mid | SSO、待办、报表（staging IdP 或 mock OIDC） |

---

## 7. 修订记录

| 日期 | 说明 |
|------|------|
| 2026-04-06 | 由并行 Task 产出并入库。 |