# 功能测试文档 — 工艺流程 (Process Routing)

> 模块路径：生产配置 → 工艺模型 → **工艺流程**  
> 路由：`/production_configuration/technology_model/technology_flow`  
> API BASE：`production_configuration/technology_model/technology_flow/`  
> i18n 前缀：`page.production_master_data.process_model.process_routing`  
> 文档版本：v1.0  
> 适用代码版本：基于 [process-routing/index.vue](file:///d:/code/mes/mes-ui/src/views/production-master-data/process-model/process-routing/index.vue)  
> 测试目标：验证工艺流程页面的列表、查询、新增、编辑、删除、流程卡管理入口等核心操作

---

## 0. 文档使用说明

- 测试人员按顺序执行 **T-XX** 编号的测试用例
- 每个用例的 **预期结果** 描述必须与实际界面/接口响应一致才可标记为通过
- 失败的用例在 **问题描述** 列填写具体错误信息、截图编号、操作环境
- 所有"实际结果"必须如实记录，禁止空填或留白
- 整体测试结论位于文末 **测试总结** 处

---

## 1. 测试环境配置要求

| 项目 | 要求 |
| --- | --- |
| 操作系统 | Windows 10 / 11 64-bit |
| Node.js | **18.16.0**（与项目 `.node-version` / `package.json#engines` 一致） |
| 包管理器 | **pnpm 10.33.0**（与 `package.json#packageManager` 一致） |
| 浏览器 | Chrome 100+ / Edge 100+ |
| 后端服务 | Webman 后端已启动且数据库已初始化 |
| 数据库 | 工艺流程、流程类别、产品、权限等基础数据已存在 |
| 启动命令 | `pnpm install` → `pnpm dev`，访问 `http://localhost:8080` |
| 测试账号 | 具备「生产配置-工艺模型-工艺流程」读写权限的账号 |
| 浏览器语言 | 中英文均需验证（默认以中文为准） |

---

## 2. 测试前置条件

1. 已使用具备 `production_configuration/technology_model/technology_flow` 下 create / edit / delete 权限的账号登录
2. **流程类别** 至少存在 1 条数据（否则新增时的「流程类别」下拉为空）
3. **产品列表** 至少存在 1 条数据（否则新增时的「关联产品」下拉为空）
4. 浏览器开发者工具 Network 面板可正常观察接口请求
5. 已确认 `src/locales/zh-chs.json` 与 `src/locales/en.json` 中存在 `page.production_master_data.process_model.process_routing` 节点

---

## 3. 测试用例

### 3.1 列表与查询

#### T-01：页面正常加载
- **操作步骤**
  1. 登录系统
  2. 进入「生产配置 → 工艺模型 → 工艺流程」
- **预期结果**
  - URL 跳转到 `/production_configuration/technology_model/technology_flow`
  - 页面顶部展示搜索区（编码、名称、查询、重置）
  - 下方展示表格列：序号 / 工艺流程编码 / 工艺流程名称 / 流程类别 / 关联产品 / 版本 / 状态 / 备注 / 操作
  - 工具栏右上角显示帮助按钮，鼠标悬停提示「工艺流程用于设置生产工艺流程并管理流程卡…」
  - 控制台无报错
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-02：默认分页加载列表
- **操作步骤**
  1. 访问工艺流程页面
- **预期结果**
  - 列表自动加载（无需手动点击查询）
  - 加载时表格显示 loading 遮罩
  - 加载完成显示数据行（如有数据）
  - 分页组件显示「共 X 条」并按 10 条/页 显示
  - 发起请求 `GET production_configuration/technology_model/technology_flow/list?method=production_master_data_process_model_process_routing_list&page_no=1&page_size=10&code=&name=`
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-03：按编码精确搜索
- **操作步骤**
  1. 在「工艺流程编码」输入框输入已存在的完整编码
  2. 点击「查询」按钮
- **预期结果**
  - 列表仅展示编码完全匹配的数据行
  - 列表刷新到第 1 页
  - 接口请求参数 `code=<已输入值>`
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-04：按名称模糊搜索
- **操作步骤**
  1. 在「工艺流程名称」输入框输入名称片段
  2. 点击「查询」按钮
- **预期结果**
  - 列表仅展示名称包含该片段的数据行
  - 接口请求参数 `name=<已输入值>`
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-05：按回车键触发查询
- **操作步骤**
  1. 在「工艺流程编码」或「工艺流程名称」输入框聚焦
  2. 输入关键字后按键盘 `Enter`
- **预期结果**
  - 等同于点击「查询」按钮，触发列表刷新
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-06：重置搜索条件
- **操作步骤**
  1. 在搜索框输入任意条件并点击「查询」
  2. 点击「重置」按钮
- **预期结果**
  - 两个搜索输入框被清空
  - 列表自动以空条件重新加载
  - 页码回到第 1 页
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-07：分页切换
- **操作步骤**
  1. 准备超过 10 条工艺流程数据
  2. 在分页器中切换到第 2 页或修改每页条数
- **预期结果**
  - 列表按新页码 / 每页条数重新加载
  - 接口请求参数 `page_no` / `page_size` 与界面一致
  - 分页总数保持正确
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-08：空数据展示
- **操作步骤**
  1. 在没有任何工艺流程数据时访问页面，或筛选一个不存在的数据
- **预期结果**
  - 表格区域显示 Element UI 空数据占位（无红色错误）
  - 分页器显示「共 0 条」
  - 不会弹出错误提示
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-09：i18n 中文切换
- **操作步骤**
  1. 在用户设置中切换语言到「简体中文」
  2. 访问工艺流程页面
- **预期结果**
  - 所有表头、按钮、提示文本为中文（"工艺流程编码"、"新增"、"删除"等）
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-10：i18n 英文切换
- **操作步骤**
  1. 切换语言到「English」
  2. 访问工艺流程页面
- **预期结果**
  - 所有表头、按钮、提示文本为英文（"Routing Code"、"Add"、"Delete" 等）
  - 切换瞬间不需要刷新页面即生效
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

### 3.2 新增

#### T-11：打开新增弹窗
- **操作步骤**
  1. 点击工具栏的「新增」按钮
- **预期结果**
  - 弹出标题为「新增工艺流程」的对话框（宽 40%）
  - 表单为空且编码字段可编辑
  - 默认值：版本 = `1.0`、状态 = 启用
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-12：新增必填校验 — 编码
- **操作步骤**
  1. 打开新增弹窗
  2. 编码留空，其它字段填写完整
  3. 点击「确定」
- **预期结果**
  - 编码输入框下方红色提示「请输入工艺流程编码」
  - 接口未发起，弹窗保持打开
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-13：新增必填校验 — 名称
- **操作步骤**
  1. 打开新增弹窗
  2. 名称留空，其它字段填写完整
  3. 点击「确定」
- **预期结果**
  - 名称输入框下方红色提示「请输入工艺流程名称」
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-14：新增必填校验 — 流程类别
- **操作步骤**
  1. 打开新增弹窗
  2. 不选择「流程类别」
  3. 点击「确定」
- **预期结果**
  - 流程类别下拉框下方红色提示「请选择流程类别」
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-15：新增必填校验 — 版本
- **操作步骤**
  1. 打开新增弹窗
  2. 清空「版本」（默认 `1.0`）
  3. 点击「确定」
- **预期结果**
  - 版本输入框下方红色提示「请输入版本号」
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-16：新增字段长度校验
- **操作步骤**
  1. 打开新增弹窗
  2. 在「编码」输入超过 100 个字符
  3. 点击「确定」
- **预期结果**
  - 编码输入框下方红色提示「长度在 1 到 100 个字符」
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-17：新增成功
- **操作步骤**
  1. 打开新增弹窗
  2. 填写完整有效数据：编码、名称、流程类别、关联产品、版本、状态、备注
  3. 点击「确定」
- **预期结果**
  - 接口请求 `POST production_configuration/technology_model/technology_flow/create` 状态码 200，`code=0`
  - 页面弹出绿色提示「操作成功」
  - 弹窗自动关闭
  - 列表自动刷新，新数据展示在表格中
  - 页码回到第 1 页
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-18：新增重复编码
- **操作步骤**
  1. 准备一个已存在的编码
  2. 在新增弹窗中输入相同编码
  3. 点击「确定」
- **预期结果**
  - 后端返回业务错误
  - 页面弹出红色错误提示（如「编码已存在」）
  - 弹窗保持打开，用户可修改后重试
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-19：取消新增
- **操作步骤**
  1. 打开新增弹窗，填写部分数据
  2. 点击「取消」按钮或右上角 X
- **预期结果**
  - 弹窗关闭
  - 不发起任何接口请求
  - 再次打开新增弹窗，表单恢复为空（默认值除外）
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-20：新增提交中重复点击防护
- **操作步骤**
  1. 打开新增弹窗，填写有效数据
  2. 连续快速点击「确定」两次
- **预期结果**
  - 第一次点击后按钮进入 loading 状态，禁用重复提交
  - 接口仅被调用 1 次
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

### 3.3 编辑

#### T-21：打开编辑弹窗
- **操作步骤**
  1. 在列表中点击某行的「编辑」按钮
- **预期结果**
  - 弹出标题为「编辑工艺流程」的对话框
  - 表单自动回填该行数据
  - 「编码」字段为禁用状态（不可编辑）
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-22：编辑必填校验
- **操作步骤**
  1. 打开编辑弹窗
  2. 清空「名称」
  3. 点击「确定」
- **预期结果**
  - 名称输入框下方红色提示「请输入工艺流程名称」
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-23：编辑成功
- **操作步骤**
  1. 打开编辑弹窗
  2. 修改名称、流程类别、版本、状态、备注等字段
  3. 点击「确定」
- **预期结果**
  - 接口请求 `PUT production_configuration/technology_model/technology_flow/edit` 状态码 200，`code=0`
  - 页面弹出绿色提示「操作成功」
  - 弹窗关闭
  - 列表自动刷新，目标行显示新值
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-24：编辑时编码不可修改
- **操作步骤**
  1. 打开编辑弹窗
  2. 尝试修改「编码」字段
- **预期结果**
  - 编码字段处于禁用状态，无法输入
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-25：取消编辑
- **操作步骤**
  1. 打开编辑弹窗，修改若干字段
  2. 点击「取消」按钮
- **预期结果**
  - 弹窗关闭
  - 不发起任何接口请求
  - 列表数据保持原样
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

### 3.4 删除

#### T-26：删除二次确认弹窗
- **操作步骤**
  1. 点击某行的「删除」按钮
- **预期结果**
  - 弹出警告提示「确定要删除该工艺流程吗?」
  - 提示框有「确定」与「取消」两个按钮
  - 列表中的该行仍存在
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-27：删除 — 取消
- **操作步骤**
  1. 点击「删除」按钮
  2. 在确认弹窗中点击「取消」
- **预期结果**
  - 弹窗关闭
  - 不发起删除接口
  - 数据行保持原样
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-28：删除成功
- **操作步骤**
  1. 点击「删除」按钮
  2. 在确认弹窗中点击「确定」
- **预期结果**
  - 接口请求 `DELETE production_configuration/technology_model/technology_flow/delete` 状态码 200，`code=0`
  - 页面弹出绿色提示「操作成功」
  - 列表自动刷新，目标行消失
  - 删除当前页最后一行时，自动跳转到合理页码
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-29：删除 — 关联数据拒绝
- **操作步骤**
  1. 准备一条已被产品、批次或其它模块引用的工艺流程
  2. 尝试删除
- **预期结果**
  - 后端返回业务错误
  - 页面弹出红色错误提示（如「该工艺流程已被引用，不可删除」）
  - 列表数据保持原样
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

### 3.5 流程卡管理入口

#### T-30：流程卡管理按钮存在
- **操作步骤**
  1. 在列表中查看任意一行的操作列
- **预期结果**
  - 操作列包含「编辑」、「流程卡管理」、「删除」3 个按钮
  - 「流程卡管理」按钮为黄色文字 + `el-icon-tickets` 图标
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-31：点击流程卡管理
- **操作步骤**
  1. 点击某行的「流程卡管理」按钮
- **预期结果**
  - 当前阶段：弹出信息提示「流程卡管理: <工艺流程名称>」（占位实现）
  - 后续阶段：应打开独立的流程卡管理抽屉 / 弹窗
  - 不影响列表状态
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

### 3.6 权限控制

#### T-32：无「新增」权限
- **操作步骤**
  1. 使用无 `/production_configuration/technology_model/technology_flow/create` 权限的账号登录
  2. 访问工艺流程页面
- **预期结果**
  - 工具栏不显示「新增」按钮
  - 列表正常加载
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-33：无「编辑」权限
- **操作步骤**
  1. 使用无 `…/edit` 权限的账号登录
  2. 访问工艺流程页面
- **预期结果**
  - 行内「编辑」按钮不显示
  - 「新增」与「删除」按钮仍可正常显示（按权限配置）
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-34：无「删除」权限
- **操作步骤**
  1. 使用无 `…/delete` 权限的账号登录
  2. 访问工艺流程页面
- **预期结果**
  - 行内「删除」按钮不显示
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-35：未登录访问
- **操作步骤**
  1. 退出登录后，直接在地址栏访问 `/production_configuration/technology_model/technology_flow`
- **预期结果**
  - 自动跳转到登录页
  - 不会出现 404 或白屏
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

### 3.7 错误处理

#### T-36：网络异常
- **操作步骤**
  1. 在浏览器开发者工具 Network 面板中，离线（Offline）
  2. 刷新工艺流程页面
- **预期结果**
  - 页面顶部红色错误提示（如「请求超时」或「网络异常」）
  - loading 状态关闭
  - 表格维持之前的数据或显示空数据
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-37：后端 500 错误
- **操作步骤**
  1. 模拟后端列表接口返回 500
  2. 刷新工艺流程页面
- **预期结果**
  - 拦截器统一弹出红色错误提示
  - 表格显示空数据
  - 控制台无未捕获异常
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

#### T-38：参数缺失
- **操作步骤**
  1. 模拟后端创建接口缺参返回 `code=500`
  2. 在新增弹窗点击「确定」
- **预期结果**
  - 拦截器弹出后端返回的错误信息
  - 弹窗不关闭
  - 表单数据保持原样
- **实际结果**：__________
- **测试状态**：☐ 通过 ☐ 失败
- **问题描述**：__________

---

## 4. 测试总结

| 维度 | 统计 |
| --- | --- |
| 用例总数 | 38 |
| 通过数 | __________ |
| 失败数 | __________ |
| 阻塞数 | __________ |
| 跳过数 | __________ |
| 整体结论 | ☐ 通过 ☐ 有条件通过 ☐ 不通过 |

### 4.1 遗留问题清单

| 编号 | 用例编号 | 严重程度 | 描述 | 负责人 | 计划修复日期 |
| --- | --- | --- | --- | --- | --- |
| 1 |  |  |  |  |  |
| 2 |  |  |  |  |  |
| 3 |  |  |  |  |  |

### 4.2 测试执行信息

- **测试执行人**：__________
- **测试起止时间**：__________
- **测试环境版本**：Node `18.16.0` / pnpm `10.33.0` / 浏览器 `__________`
- **后端版本 / 提交**：__________
- **测试账号**：__________

---

## 5. 附录

### 5.1 关键文件

| 类型 | 路径 |
| --- | --- |
| 主页面 | [process-routing/index.vue](file:///d:/code/mes/mes-ui/src/views/production-master-data/process-model/process-routing/index.vue) |
| API 文件 | [process-routing.js](file:///d:/code/mes/mes-ui/src/api/production-master-data/process-routing.js) |
| 路由模块 | [production-master-data.js](file:///d:/code/mes/mes-ui/src/router/modules/production-master-data.js) |
| 中文语言包 | [zh-chs.json#process_routing](file:///d:/code/mes/mes-ui/src/locales/zh-chs.json) |
| 英文语言包 | [en.json#process_routing](file:///d:/code/mes/mes-ui/src/locales/en.json) |

### 5.2 关键接口

| 操作 | Method | URL |
| --- | --- | --- |
| 查询列表 | GET | `production_configuration/technology_model/technology_flow/list` |
| 新增 | POST | `production_configuration/technology_model/technology_flow/create` |
| 编辑 | PUT | `production_configuration/technology_model/technology_flow/edit` |
| 删除 | DELETE | `production_configuration/technology_model/technology_flow/delete` |

公共参数：`method=production_master_data_process_model_process_routing_<action>`，`platform=background`

### 5.3 字段说明

| 字段 | 类型 | 必填 | 说明 |
| --- | --- | --- | --- |
| code | string | 是 | 工艺流程编码，唯一，创建后不可修改 |
| name | string | 是 | 工艺流程名称 |
| category_id | int | 是 | 流程类别 ID（关联工艺流程类别） |
| product_id | int | 否 | 关联产品 ID（关联产品列表） |
| version | string | 是 | 版本号，默认 `1.0` |
| status | int | 是 | 1=启用，0=禁用 |
| remark | string | 否 | 备注 |