✨ feat(设备类别管理功能模块):
This commit is contained in:
698
docs/功能测试-设备类别.md
Normal file
698
docs/功能测试-设备类别.md
Normal file
@@ -0,0 +1,698 @@
|
||||
# 设备类别功能测试流程文档
|
||||
|
||||
> **测试对象**:设备管理 → 设备模型 → 设备类别(Equipment Category)
|
||||
> **迁移日期**:2026-06-02
|
||||
> **对应页面**:`src/views/equipment-management/equipment-model/equipment-category/index.vue`
|
||||
> **API 文件**:`src/api/equipment-management/equipment-category.js`
|
||||
> **路由路径**:`/device_management/equipment_model/equipment_category`(旧值暂留)
|
||||
> **i18n 前缀**:`page.equipment_management.equipment_model.equipment_category`
|
||||
|
||||
---
|
||||
|
||||
## 一、测试环境配置
|
||||
|
||||
| 配置项 | 要求 |
|
||||
|--------|------|
|
||||
| 浏览器 | Chrome 最新版、Edge 最新版(兼容 IE 11+) |
|
||||
| 屏幕分辨率 | ≥ 1920×1080 |
|
||||
| Node.js | ≥ 16.x |
|
||||
| 包管理器 | pnpm ≥ 7.x |
|
||||
| 后端服务 | 设备类别相关 API 正常运行(`device_management/equipment_model/equipment_category/*`) |
|
||||
| 测试账号 | 具有设备管理 → 设备类别菜单权限的账号(含 create/edit/delete 权限) |
|
||||
| 测试数据 | 准备至少 5 条测试用设备类别(编码唯一) |
|
||||
| 语言切换 | 先测中文(简体中文),再切到英文验证 i18n |
|
||||
| 权限分配 | 系统管理 → 菜单管理中确认设备类别按钮权限(新增、编辑、删除)已正确配置 |
|
||||
|
||||
---
|
||||
|
||||
## 二、测试前置条件
|
||||
|
||||
1. 后端服务(Webman)已启动,`device_management` 模块的 API 可正常访问
|
||||
2. 前端项目已执行 `pnpm install` 且 `pnpm dev` 正常启动,可访问登录页
|
||||
3. 使用具有「设备管理 → 设备类别」菜单权限的管理员账号登录
|
||||
4. 侧边栏菜单 **设备管理 → 设备模型** 下可见 **设备类别** 子菜单
|
||||
5. 浏览器控制台无 Vue 警告或 i18n key 缺失报错
|
||||
6. 确认 `src/locales/zh-chs.json` 和 `src/locales/en.json` 中存在 `page.equipment_management.equipment_model.equipment_category` 配置
|
||||
7. 数据库中设备类别表为空或仅有少量测试数据,便于验证
|
||||
|
||||
---
|
||||
|
||||
## 三、功能测试用例
|
||||
|
||||
### 3.1 页面加载与数据展示
|
||||
|
||||
#### TC-EC-001:菜单导航与页面加载
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 登录系统 2. 点击侧边栏菜单「设备管理 → 设备模型 → 设备类别」 |
|
||||
| **预期结果** | 页面正常加载,URL 显示 `/device_management/equipment_model/equipment_category`;页面顶部显示搜索栏(设备类别编码、设备类别名称、查询、重置按钮);中部显示设备类别列表表格;底部分页组件显示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-002:列表表格列头与数据展示
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 查看设备类别列表的表头列与各行数据 |
|
||||
| **预期结果** | 表格列依次为:序号、设备类别编码、设备类别名称、备注、操作;操作列包含「编辑」「删除」两个按钮(带图标);当数据为空时显示空数据占位提示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-003:工具栏按钮显示
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 查看表格上方的工具栏 |
|
||||
| **预期结果** | 显示蓝色「新增」按钮(含加号图标),右上角显示问号「帮助」按钮(点击跳转 `/help/equipment-category`) |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-004:表格自适应高度
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 加载页面后查看表格高度 2. 缩小/放大浏览器窗口 3. 折叠/展开侧边栏 |
|
||||
| **预期结果** | 表格高度自动填满 d2-container 剩余空间,窗口变化时无空白或滚动条异常 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.2 搜索功能
|
||||
|
||||
#### TC-EC-005:按编码精确搜索
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在「设备类别编码」输入框输入完整的类别编码(如 `EQ_CAT_001`) 2. 点击「查询」按钮 |
|
||||
| **预期结果** | 表格仅显示编码匹配的数据行;分页总数更新为匹配条数;输入框右侧 X 按钮可清空内容 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-006:按编码模糊搜索
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在「设备类别编码」输入框输入编码的片段(如 `EQ_`) 2. 点击「查询」按钮 |
|
||||
| **预期结果** | 表格显示所有编码包含 `EQ_` 的数据行 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-007:按名称搜索
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在「设备类别名称」输入框输入关键字(如「自动化」) 2. 点击「查询」按钮 |
|
||||
| **预期结果** | 表格仅显示名称包含关键字的设备类别 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-008:组合条件搜索
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 同时输入「设备类别编码」和「设备类别名称」搜索条件 2. 点击「查询」按钮 |
|
||||
| **预期结果** | 表格显示同时满足两个条件的数据行(AND 关系) |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-009:回车键触发搜索
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在搜索输入框中输入关键字 2. 按下键盘回车键 |
|
||||
| **预期结果** | 等同于点击「查询」按钮,表格按搜索条件刷新 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-010:重置搜索
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 输入搜索条件并点击「查询」 2. 点击「重置」按钮 |
|
||||
| **预期结果** | 搜索输入框清空,表格恢复显示全部设备类别数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-011:搜索无结果
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 输入不存在的编码或名称 2. 点击「查询」 |
|
||||
| **预期结果** | 表格显示空数据占位提示,分页总数显示 0 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.3 分页功能
|
||||
|
||||
#### TC-EC-012:分页默认显示
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 加载页面后查看分页组件 |
|
||||
| **预期结果** | 分页默认显示第 1 页,每页 10 条记录,总条数显示当前数据库设备类别总数 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-013:切换每页条数
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在分页组件的「每页显示」下拉中切换为 20、50、100 2. 观察表格变化 |
|
||||
| **预期结果** | 表格按新条数加载数据,分页组件正确显示总页数 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-014:翻页功能
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 准备至少 25 条测试数据 2. 点击「下一页」「上一页」「首页」「末页」按钮 3. 输入页码跳转 |
|
||||
| **预期结果** | 表格按页加载数据,翻页流畅无报错 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.4 新增设备类别
|
||||
|
||||
#### TC-EC-015:打开新增弹框
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 点击表格上方「新增」按钮 |
|
||||
| **预期结果** | 弹出新增设备类别对话框,标题显示"新增设备类别",包含设备类别编码、设备类别名称、备注三个表单项;「确定」「取消」按钮位于底部 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-016:新增表单必填校验
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 不填写任何内容直接点击「确定」 |
|
||||
| **预期结果** | 设备类别编码、设备类别名称输入框下方显示红色校验提示"请输入设备类别编码"、"请输入设备类别名称" |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-017:新增成功 - 正常数据
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 输入编码 `EQ_CAT_TEST_001` 3. 输入名称「测试设备类别001」 4. 输入备注「测试用」 5. 点击「确定」 |
|
||||
| **预期结果** | 弹框关闭,页面右上角显示绿色成功提示"操作成功";表格自动刷新并显示新增的设备类别行 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-018:新增成功 - 仅必填
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 仅填写编码和名称,备注留空 3. 点击「确定」 |
|
||||
| **预期结果** | 新增成功,备注字段允许为空 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-019:新增 - 编码长度校验
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 在编码输入框输入超过 100 个字符 3. 失焦后观察 |
|
||||
| **预期结果** | 输入框下方显示校验提示"长度在 1 到 100 个字符" |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-020:新增 - 编码重复
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 输入已存在的设备类别编码 3. 点击「确定」 |
|
||||
| **预期结果** | 提示后端返回的"编码已存在"等错误信息,新增失败 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-021:取消新增
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 填写部分内容 3. 点击「取消」按钮 |
|
||||
| **预期结果** | 弹框关闭,表格数据无变化,无任何提示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-022:新增 - 备注多行输入
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 在备注框中输入多行文字(超过 2 行) 3. 观察文本框是否自动扩展 |
|
||||
| **预期结果** | 备注为 textarea 类型,输入多行内容后自动扩展(最少 2 行,最多 6 行) |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.5 编辑设备类别
|
||||
|
||||
#### TC-EC-023:打开编辑弹框
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 点击某一设备类别行操作列的「编辑」按钮 |
|
||||
| **预期结果** | 弹出编辑设备类别对话框,标题显示"编辑设备类别",设备类别编码、设备类别名称、备注三个字段正确回填该行的数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-024:编辑成功
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开编辑弹框 2. 修改设备类别名称为"测试设备类别001-改" 3. 点击「确定」 |
|
||||
| **预期结果** | 弹框关闭,提示"操作成功",表格对应行的名称列更新为新值 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-025:编辑后清空必填项
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开编辑弹框 2. 清空设备类别名称输入框 3. 点击「确定」 |
|
||||
| **预期结果** | 设备类别名称下方显示红色校验提示,无法提交 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-026:取消编辑
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开编辑弹框 2. 修改部分字段 3. 点击「取消」按钮 |
|
||||
| **预期结果** | 弹框关闭,表格数据不变 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.6 删除设备类别
|
||||
|
||||
#### TC-EC-027:删除确认弹框
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 点击某一设备类别行操作列的「删除」按钮 |
|
||||
| **预期结果** | 弹出 Element UI 确认提示框,内容为"确定要删除该设备类别吗?",包含「确定」和「取消」按钮,图标为警告三角 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-028:删除成功
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 点击「删除」按钮 2. 在确认框中点击「确定」 |
|
||||
| **预期结果** | 确认框关闭,提示"操作成功",该设备类别从列表中消失,分页总数减 1 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-029:取消删除
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 点击「删除」按钮 2. 在确认框中点击「取消」 |
|
||||
| **预期结果** | 确认框关闭,设备类别数据不变 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-030:删除最后一页最后一条
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 翻到最后一页且只剩 1 条数据 2. 删除该数据 3. 观察分页跳转 |
|
||||
| **预期结果** | 删除成功后自动跳转到新的最后一页,无空白页 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.7 权限控制
|
||||
|
||||
#### TC-EC-031:无新增权限 - 按钮隐藏
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 登录无新增权限(`/device_management/equipment_model/equipment_category/create`)的账号 2. 进入设备类别页面 |
|
||||
| **预期结果** | 工具栏「新增」按钮不显示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-032:无编辑权限 - 按钮隐藏
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 登录无编辑权限(`/device_management/equipment_model/equipment_category/edit`)的账号 2. 进入设备类别页面 |
|
||||
| **预期结果** | 行操作列「编辑」按钮不显示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-033:无删除权限 - 按钮隐藏
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 登录无删除权限(`/device_management/equipment_model/equipment_category/delete`)的账号 2. 进入设备类别页面 |
|
||||
| **预期结果** | 行操作列「删除」按钮不显示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-034:完全无权限 - 仅可查看
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 登录仅有查看权限的账号 2. 进入设备类别页面 |
|
||||
| **预期结果** | 表格正常加载数据;工具栏无「新增」按钮;行操作列无「编辑」「删除」按钮 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.8 国际化(i18n)
|
||||
|
||||
#### TC-EC-035:简体中文 - 页面显示
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 切换系统语言为简体中文 2. 进入设备类别页面 |
|
||||
| **预期结果** | 所有列头、按钮、表单标签、提示信息均显示中文("设备类别编码"、"设备类别名称"、"备注"、"操作"、"新增"、"编辑"、"删除"等) |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-036:英文 - 页面显示
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 切换系统语言为 English 2. 进入设备类别页面 |
|
||||
| **预期结果** | 所有列头、按钮、表单标签、提示信息均显示英文("Equipment Category Code"、"Equipment Category Name"、"Remark"、"Actions"、"Add"、"Edit"、"Delete"等) |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-037:英文 - 弹框显示
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 切换到英文 2. 点击「新增」按钮 |
|
||||
| **预期结果** | 弹框标题显示"Add Equipment Category",表单标签显示"Equipment Category Code"、"Equipment Category Name"、"Remark";底部按钮显示"Confirm"、"Cancel" |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-038:英文 - 删除确认
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 切换到英文 2. 点击某行的「Delete」按钮 |
|
||||
| **预期结果** | 确认框内容显示"Are you sure to delete this equipment category?",按钮显示"Confirm"、"Cancel" |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-039:语言切换实时响应
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在中文下打开新增弹框 2. 不关闭弹框,直接切换系统语言到英文 |
|
||||
| **预期结果** | 弹框内所有文字立即切换为英文,无需刷新页面 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.9 异常与边界场景
|
||||
|
||||
#### TC-EC-040:网络异常 - 列表加载失败
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 停止后端服务 2. 刷新设备类别页面 |
|
||||
| **预期结果** | 页面显示 loading 结束后,弹出错误提示(如"请求失败"或"数据请求异常"),表格显示空数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-041:网络异常 - 新增失败
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 停止后端服务 3. 填写表单并点击「确定」 |
|
||||
| **预期结果** | 提示网络错误信息,弹框不关闭,确定按钮恢复可点击 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-042:特殊字符输入
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 在设备类别名称中输入特殊字符(如 `!@#$%^&*()_+-=[]{}|;':",./<>?`) 3. 点击「确定」 |
|
||||
| **预期结果** | 后端允许特殊字符时新增成功;不允许时显示后端错误提示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-043:超长备注输入
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 在备注中输入超过 500 字符的文本 3. 点击「确定」 |
|
||||
| **预期结果** | textarea 自动扩展(最多 6 行出现滚动条),新增/编辑成功 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-044:备注包含换行符
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增/编辑弹框 2. 在备注中输入多行文字(含回车换行) 3. 提交后再次编辑查看 |
|
||||
| **预期结果** | 备注正确保存换行符,再次打开编辑时能正确显示多行内容 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-045:浏览器刷新页面
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在搜索栏输入条件后查询 2. 按 F5 或点击浏览器刷新按钮 |
|
||||
| **预期结果** | 页面重新加载,搜索条件清空,表格显示全部数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.10 UI 与交互细节
|
||||
|
||||
#### TC-EC-047:搜索区 - 标签文本正确
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 查看搜索区的标签(label) |
|
||||
| **预期结果** | 显示"设备类别编码"、"设备类别名称";输入框 placeholder 显示"请输入设备类别编码"、"请输入设备类别名称" |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-048:搜索区 - 按钮图标正确
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 查看搜索区的按钮 |
|
||||
| **预期结果** | 「查询」按钮为蓝色 primary 样式,左侧带放大镜图标;「重置」按钮为默认样式,左侧带刷新图标 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-049:操作列 - 按钮样式
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 查看行操作列 |
|
||||
| **预期结果** | 「编辑」按钮为蓝色文字带编辑图标;「删除」按钮为红色文字带删除图标;按钮间有一定间距;操作列固定在右侧 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-050:弹框 - 表单交互
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 观察表单布局 |
|
||||
| **预期结果** | 表单 label 宽度 110px;输入框占 90% 宽度;备注为 textarea,可自适应高度(2-6 行);所有表单项垂直排列;弹框宽度为 35% |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-051:弹框 - 确定按钮 loading
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开新增弹框 2. 填写表单 3. 在网络较慢情况下点击「确定」 |
|
||||
| **预期结果** | 「确定」按钮显示 loading 状态,无法重复点击;接口返回后自动关闭弹框 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-052:空数据占位
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 清空设备类别表(或筛选不存在的条件) 2. 查看表格 |
|
||||
| **预期结果** | 表格区域显示 Element UI 默认的空数据占位("暂无数据" 或类似提示) |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### 3.11 数据一致性
|
||||
|
||||
#### TC-EC-053:新增后分页正确
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在有 10 条数据时(每页 10 条) 2. 新增 1 条数据 |
|
||||
| **预期结果** | 新增后分页总数变为 11,自动跳转到第 1 页并显示新数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-054:编辑后数据刷新
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 编辑某行数据并保存 2. 重新搜索该数据 |
|
||||
| **预期结果** | 搜索结果显示编辑后的最新数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
#### TC-EC-055:删除后数据不残留
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 删除某条数据 2. 重新搜索该编码或刷新页面 |
|
||||
| **预期结果** | 搜索结果显示无此数据 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
---
|
||||
|
||||
## 四、兼容性测试
|
||||
|
||||
### TC-EC-056:Chrome 浏览器
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 使用 Chrome 最新版执行 TC-EC-001 ~ TC-EC-055 全部用例 |
|
||||
| **预期结果** | 全部通过 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### TC-EC-057:Edge 浏览器
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 使用 Edge 最新版执行核心用例 TC-EC-001/015/023/027/035/036 |
|
||||
| **预期结果** | 全部通过 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### TC-EC-058:不同分辨率适配
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 切换浏览器窗口分辨率为 1920×1080、1366×768 2. 验证页面布局 |
|
||||
| **预期结果** | 表格、分页、弹框等元素无错位,按钮可正常点击 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
---
|
||||
|
||||
## 五、回归测试
|
||||
|
||||
### TC-EC-059:菜单切换不卡顿
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 在「设备类别」页面停留 5 秒 2. 切换到「设备管理」其他子页面 3. 再切回「设备类别」 |
|
||||
| **预期结果** | 页面切换流畅,无报错,数据正确加载 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
### TC-EC-060:浏览器标签页切换
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试步骤** | 1. 打开「设备类别」页面 2. 切换到其他浏览器标签页 3. 30 秒后切回 |
|
||||
| **预期结果** | 页面数据无丢失,Token 未过期情况下正常显示 |
|
||||
| **实际结果** | |
|
||||
| **测试状态** | ⬜ 通过 / ⬜ 未通过 |
|
||||
| **问题描述** | |
|
||||
|
||||
---
|
||||
|
||||
## 六、测试通过标准
|
||||
|
||||
| 类别 | 描述 |
|
||||
|------|------|
|
||||
| ✅ 全部通过 | 全部测试用例均通过 |
|
||||
| ⚠️ 部分通过 | 个别非核心用例未通过,但不影响主要功能使用 |
|
||||
| ❌ 未通过 | 存在阻塞性缺陷(页面无法加载、核心 CRUD 失败、权限绕过等) |
|
||||
|
||||
---
|
||||
|
||||
## 七、问题记录汇总
|
||||
|
||||
| 问题编号 | 关联测试用例 | 问题描述 | 严重程度 | 处理状态 | 处理人 |
|
||||
|---------|------------|---------|---------|---------|-------|
|
||||
| | | | | | |
|
||||
| | | | | | |
|
||||
|
||||
---
|
||||
|
||||
## 八、测试结论
|
||||
|
||||
| 项目 | 内容 |
|
||||
|------|------|
|
||||
| **测试人员** | |
|
||||
| **测试日期** | |
|
||||
| **测试用例总数** | 60 |
|
||||
| **通过用例数** | |
|
||||
| **未通过用例数** | |
|
||||
| **遗留问题数** | |
|
||||
| **整体结论** | ⬜ 通过 ⬜ 有条件通过 ⬜ 未通过 |
|
||||
| **备注说明** | |
|
||||
|
||||
---
|
||||
|
||||
> **文档维护说明**:本测试文档为设备类别功能独立测试文档。后续该功能代码变更(Bug 修复、新增功能、需求变更)时,需同步更新本测试文档并重新执行相关测试用例。
|
||||
51
src/api/equipment-management/equipment-category.js
Normal file
51
src/api/equipment-management/equipment-category.js
Normal file
@@ -0,0 +1,51 @@
|
||||
import { request } from '@/api/_service'
|
||||
|
||||
const BASE = 'device_management/equipment_model/equipment_category/'
|
||||
|
||||
function apiParams (method, data = {}) {
|
||||
return {
|
||||
method: `equipment_management_equipment_model_equipment_category_${method}`,
|
||||
platform: 'background',
|
||||
...data
|
||||
}
|
||||
}
|
||||
|
||||
export function getEquipmentCategoryList (data) {
|
||||
return request({
|
||||
url: BASE + 'list',
|
||||
method: 'get',
|
||||
params: apiParams('list', data)
|
||||
})
|
||||
}
|
||||
|
||||
export function getEquipmentCategoryALL (data) {
|
||||
return request({
|
||||
url: BASE + 'all',
|
||||
method: 'get',
|
||||
params: apiParams('all', data)
|
||||
})
|
||||
}
|
||||
|
||||
export function createEquipmentCategory (data) {
|
||||
return request({
|
||||
url: BASE + 'create',
|
||||
method: 'post',
|
||||
data: apiParams('create', data)
|
||||
})
|
||||
}
|
||||
|
||||
export function editEquipmentCategory (data) {
|
||||
return request({
|
||||
url: BASE + 'edit',
|
||||
method: 'put',
|
||||
data: apiParams('edit', data)
|
||||
})
|
||||
}
|
||||
|
||||
export function deleteEquipmentCategory (data) {
|
||||
return request({
|
||||
url: BASE + 'delete',
|
||||
method: 'delete',
|
||||
data: apiParams('delete', data)
|
||||
})
|
||||
}
|
||||
@@ -132,6 +132,35 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"equipment_management": {
|
||||
"equipment_model": {
|
||||
"equipment_category": {
|
||||
"search": "Search",
|
||||
"reset": "Reset",
|
||||
"enter_code": "Please enter equipment category code",
|
||||
"enter_name": "Please enter equipment category name",
|
||||
"operation_success": "Operation succeeded",
|
||||
"sort": "No.",
|
||||
"code": "Equipment Category Code",
|
||||
"name": "Equipment Category Name",
|
||||
"remark": "Remark",
|
||||
"operation": "Actions",
|
||||
"add": "Add",
|
||||
"edit": "Edit",
|
||||
"delete": "Delete",
|
||||
"remark_required": "Please enter remark",
|
||||
"remark_length": "Length must be 1 to 100 characters",
|
||||
"add_title": "Add Equipment Category",
|
||||
"edit_title": "Edit Equipment Category",
|
||||
"cancel": "Cancel",
|
||||
"confirm": "Confirm",
|
||||
"tip": "Tip",
|
||||
"confirm_delete": "Are you sure to delete this equipment category?",
|
||||
"validation_fail": "Validation failed",
|
||||
"please_enter": "Please enter {name}"
|
||||
}
|
||||
}
|
||||
},
|
||||
"system_administration": {
|
||||
"user_management": {
|
||||
"role": {
|
||||
|
||||
@@ -132,6 +132,35 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"equipment_management": {
|
||||
"equipment_model": {
|
||||
"equipment_category": {
|
||||
"search": "查询",
|
||||
"reset": "重置",
|
||||
"enter_code": "请输入设备类别编码",
|
||||
"enter_name": "请输入设备类别名称",
|
||||
"operation_success": "操作成功",
|
||||
"sort": "序号",
|
||||
"code": "设备类别编码",
|
||||
"name": "设备类别名称",
|
||||
"remark": "备注",
|
||||
"operation": "操作",
|
||||
"add": "新 增",
|
||||
"edit": "编 辑",
|
||||
"delete": "删 除",
|
||||
"remark_required": "请输入备注",
|
||||
"remark_length": "长度在 1 到 100 个字符",
|
||||
"add_title": "新增设备类别",
|
||||
"edit_title": "编辑设备类别",
|
||||
"cancel": "取消",
|
||||
"confirm": "确定",
|
||||
"tip": "提示",
|
||||
"confirm_delete": "确定要删除该设备类别吗?",
|
||||
"validation_fail": "校验失败",
|
||||
"please_enter": "请输入{name}"
|
||||
}
|
||||
}
|
||||
},
|
||||
"system_administration": {
|
||||
"user_management": {
|
||||
"role": {
|
||||
|
||||
@@ -13,6 +13,12 @@ export default {
|
||||
name: `${pre}index`,
|
||||
meta: { ...meta, title: '设备管理', root: '/device_management' },
|
||||
component: _import('system/function/module-index')
|
||||
},
|
||||
{
|
||||
path: 'equipment_model/equipment_category',
|
||||
name: `${pre}equipment_model-equipment_category`,
|
||||
meta: { ...meta, cache: true, title: '设备类别' },
|
||||
component: _import('equipment-management/equipment-model/equipment-category')
|
||||
}
|
||||
])('device_management-')
|
||||
}
|
||||
|
||||
@@ -0,0 +1,293 @@
|
||||
<template>
|
||||
<d2-container>
|
||||
<template #header>
|
||||
<div class="search-bar">
|
||||
<el-form :inline="true" size="mini">
|
||||
<el-form-item :label="$t(key('code'))">
|
||||
<el-input
|
||||
v-model="search.code"
|
||||
:placeholder="$t(key('enter_code'))"
|
||||
clearable
|
||||
style="width:200px"
|
||||
@keyup.enter.native="onSearch"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t(key('name'))">
|
||||
<el-input
|
||||
v-model="search.name"
|
||||
:placeholder="$t(key('enter_name'))"
|
||||
clearable
|
||||
style="width:200px"
|
||||
@keyup.enter.native="onSearch"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" @click="onSearch">
|
||||
{{ $t(key('search')) }}
|
||||
</el-button>
|
||||
<el-button icon="el-icon-refresh" @click="onReset">
|
||||
{{ $t(key('reset')) }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<page-table
|
||||
ref="pageTable"
|
||||
:columns="columns"
|
||||
:data="tableData"
|
||||
:loading="loading"
|
||||
:toolbar-buttons="toolbarButtons"
|
||||
:row-buttons="rowButtons"
|
||||
:pagination="pagination"
|
||||
help-url="/help/equipment-category"
|
||||
:help-text="$t(ckey('help'))"
|
||||
auto-height
|
||||
@page-change="onPageChange"
|
||||
@selection-change="onSelect"
|
||||
/>
|
||||
|
||||
<page-dialog-form
|
||||
ref="dialogForm"
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogTitle"
|
||||
:width="'35%'"
|
||||
:form-cols="formCols"
|
||||
:form-data="formData"
|
||||
:rules="rules"
|
||||
:label-width="'110px'"
|
||||
:submitting="submitting"
|
||||
:confirm-text="key('confirm')"
|
||||
:cancel-text="key('cancel')"
|
||||
@submit="onDialogSubmit"
|
||||
@close="onDialogClose"
|
||||
/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useTableColumns } from '@/composables/useTableColumns'
|
||||
import { useTableButtons } from '@/composables/useTableButtons'
|
||||
import { i18nMixin } from '@/composables/useI18n'
|
||||
import { confirmMixin } from '@/composables/useConfirmHandle'
|
||||
import {
|
||||
getEquipmentCategoryList,
|
||||
createEquipmentCategory,
|
||||
editEquipmentCategory,
|
||||
deleteEquipmentCategory
|
||||
} from '@/api/equipment-management/equipment-category'
|
||||
import PageTable from '@/components/page-table'
|
||||
import PageDialogForm from '@/components/page-dialog-form'
|
||||
|
||||
export default {
|
||||
name: 'equipment-management-equipment-category',
|
||||
components: { PageTable, PageDialogForm },
|
||||
mixins: [i18nMixin('page.equipment_management.equipment_model.equipment_category'), confirmMixin],
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
submitting: false,
|
||||
tableData: [],
|
||||
selectedRows: [],
|
||||
dialogVisible: false,
|
||||
dialogTitle: '',
|
||||
editId: '',
|
||||
handleType: 'create',
|
||||
search: { code: '', name: '' },
|
||||
pagination: { current: 1, size: 10, total: 0 },
|
||||
formData: { code: '', name: '', remark: '' },
|
||||
rules: {
|
||||
code: [
|
||||
{ required: true, message: this.key('enter_code'), trigger: 'blur' },
|
||||
{ min: 1, max: 100, message: this.key('remark_length'), trigger: 'blur' }
|
||||
],
|
||||
name: [
|
||||
{ required: true, message: this.key('enter_name'), trigger: 'blur' },
|
||||
{ min: 1, max: 100, message: this.key('remark_length'), trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
columns: [],
|
||||
toolbarButtons: [],
|
||||
rowButtons: [],
|
||||
formCols: [
|
||||
[
|
||||
{
|
||||
type: 'input',
|
||||
prop: 'code',
|
||||
label: this.key('code'),
|
||||
placeholder: this.key('enter_code'),
|
||||
clearable: true,
|
||||
style: { width: '90%' }
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
type: 'input',
|
||||
prop: 'name',
|
||||
label: this.key('name'),
|
||||
placeholder: this.key('enter_name'),
|
||||
clearable: true,
|
||||
style: { width: '90%' }
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
type: 'input',
|
||||
prop: 'remark',
|
||||
inputType: 'textarea',
|
||||
autosize: { minRows: 2, maxRows: 6 },
|
||||
label: this.key('remark'),
|
||||
placeholder: this.key('remark_required'),
|
||||
clearable: true,
|
||||
style: { width: '90%' }
|
||||
}
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.columns = useTableColumns([
|
||||
{ prop: 'sort', label: this.key('sort'), width: 80 },
|
||||
{ prop: 'code', label: this.key('code'), minWidth: 120 },
|
||||
{ prop: 'name', label: this.key('name'), minWidth: 120 },
|
||||
{ prop: 'remark', label: this.key('remark') },
|
||||
{ prop: '_actions', label: this.key('operation'), width: 160, fixed: 'right' }
|
||||
])
|
||||
const btns = useTableButtons({
|
||||
toolbar: [
|
||||
{
|
||||
key: 'add',
|
||||
label: this.key('add'),
|
||||
icon: 'el-icon-plus',
|
||||
type: 'primary',
|
||||
auth: '/device_management/equipment_model/equipment_category/create',
|
||||
onClick: this.openAdd
|
||||
}
|
||||
],
|
||||
row: [
|
||||
{
|
||||
key: 'edit',
|
||||
label: this.key('edit'),
|
||||
icon: 'el-icon-edit',
|
||||
auth: '/device_management/equipment_model/equipment_category/edit',
|
||||
onClick: this.openEdit
|
||||
},
|
||||
{
|
||||
key: 'delete',
|
||||
label: this.key('delete'),
|
||||
icon: 'el-icon-delete',
|
||||
color: 'danger',
|
||||
auth: '/device_management/equipment_model/equipment_category/delete',
|
||||
onClick: this.handleDelete
|
||||
}
|
||||
]
|
||||
}, this.$permission)
|
||||
this.toolbarButtons = btns.toolbarButtons
|
||||
this.rowButtons = btns.rowButtons
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
async fetchData () {
|
||||
this.loading = true
|
||||
try {
|
||||
const res = await getEquipmentCategoryList({
|
||||
...this.search,
|
||||
page_no: this.pagination.current,
|
||||
page_size: this.pagination.size
|
||||
})
|
||||
const list = Array.isArray(res) ? res : (res.data || [])
|
||||
const total = Array.isArray(res) ? res.length : (res.count || 0)
|
||||
this.tableData = list
|
||||
this.pagination.total = total
|
||||
} finally {
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
onSearch () {
|
||||
this.pagination.current = 1
|
||||
this.fetchData()
|
||||
},
|
||||
onReset () {
|
||||
this.search = { code: '', name: '' }
|
||||
this.pagination.current = 1
|
||||
this.fetchData()
|
||||
},
|
||||
onPageChange (page) {
|
||||
this.pagination.current = page.current
|
||||
this.pagination.size = page.size
|
||||
this.fetchData()
|
||||
},
|
||||
onSelect (rows) {
|
||||
this.selectedRows = rows
|
||||
},
|
||||
resetForm () {
|
||||
this.formData = { code: '', name: '', remark: '' }
|
||||
this.editId = ''
|
||||
},
|
||||
openAdd () {
|
||||
this.handleType = 'create'
|
||||
this.dialogTitle = this.key('add_title')
|
||||
this.$nextTick(() => {
|
||||
this.$refs.dialogForm && this.$refs.dialogForm.reset()
|
||||
this.resetForm()
|
||||
this.dialogVisible = true
|
||||
})
|
||||
},
|
||||
openEdit (row) {
|
||||
this.handleType = 'edit'
|
||||
this.dialogTitle = this.key('edit_title')
|
||||
this.editId = row.id
|
||||
this.formData = {
|
||||
code: row.code,
|
||||
name: row.name,
|
||||
remark: row.remark || ''
|
||||
}
|
||||
this.dialogVisible = true
|
||||
},
|
||||
async onDialogSubmit () {
|
||||
this.submitting = true
|
||||
try {
|
||||
if (this.handleType === 'create') {
|
||||
await createEquipmentCategory(this.formData)
|
||||
} else {
|
||||
await editEquipmentCategory({ ...this.formData, id: this.editId })
|
||||
}
|
||||
this.$message.success(this.$t(this.key('operation_success')))
|
||||
this.dialogVisible = false
|
||||
this.fetchData()
|
||||
} finally {
|
||||
this.submitting = false
|
||||
}
|
||||
},
|
||||
onDialogClose () {
|
||||
this.resetForm()
|
||||
},
|
||||
async handleDelete (row) {
|
||||
const cancelled = await this.$confirmAction(
|
||||
{
|
||||
message: this.key('confirm_delete'),
|
||||
title: this.key('tip')
|
||||
},
|
||||
() => deleteEquipmentCategory({ id: [row.id] })
|
||||
)
|
||||
if (cancelled) return
|
||||
this.$message.success(this.$t(this.key('operation_success')))
|
||||
this.pagination.current = Math.min(
|
||||
this.pagination.current,
|
||||
Math.ceil((this.pagination.total - 1) / this.pagination.size) || 1
|
||||
)
|
||||
this.fetchData()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.search-bar {
|
||||
padding: 10px 0;
|
||||
}
|
||||
/deep/ .el-form-item--mini.el-form-item {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user