# 工单状态参数筛选功能实现说明 ## 功能描述 当通过URL参数访问工单管理页面时,自动根据 `state` 参数筛选工单状态。 ## URL参数说明 ### state 参数映射 | state 值 | 含义 | testStep 值 | 显示的工单 | |---------|------|------------|----------| | 0 | 进行中 | 1 | 测试中的工单 | | 1 | 已完成 | 5 | 已完成的工单 | ### 示例URL 1. **查看进行中的工单**: ``` http://123.56.98.4:8081/system/test_work_order?state=0 ``` 自动筛选 `testStep=1`(测试中)的工单 2. **查看已完成的工单**: ``` http://123.56.98.4:8081/system/test_work_order?state=1 ``` 自动筛选 `testStep=5`(已完成)的工单 3. **查看特定批次的进行中工单**: ``` http://123.56.98.4:8081/system/test_work_order?orderId=123&state=0 ``` 筛选批次ID为123且状态为测试中的工单 ## 实现细节 ### 修改文件 `ruoyi-fastapi-frontend/src/views/system/test_work_order/index.vue` ### 修改内容 在 `watch` 部分添加了对 `state` 参数的处理: ```javascript watch: { '$route': { immediate: true, deep: true, handler(to) { const orderId = to.query.orderId || to.params.orderId; const state = to.query.state || to.params.state; if(orderId !== undefined && orderId !== null) { this.queryParams.batchId = orderId; } // 根据 state 参数设置 testStep 筛选条件 if(state !== undefined && state !== null) { const stateNum = parseInt(state); if (stateNum === 0) { // state=0 表示进行中,对应 testStep=1 this.queryParams.testStep = 1; } else if (stateNum === 1) { // state=1 表示已完成,对应 testStep=5 this.queryParams.testStep = 5; } } if(orderId !== undefined && orderId !== null || state !== undefined && state !== null) { this.getList(); } } } } ``` ## 工作流程 1. **路由变化触发**:当URL中的查询参数变化时,触发路由监听器 2. **参数解析**:从URL中提取 `state` 和 `orderId` 参数 3. **状态映射**: - `state=0` → `testStep=1`(测试中) - `state=1` → `testStep=5`(已完成) 4. **数据加载**:调用 `getList()` 方法,根据设置的 `testStep` 筛选工单 ## 与菜单配置的关系 ### 菜单配置示例 如果您想在菜单中添加"进行中"和"已完成"的快捷入口: **进行中菜单**: - 菜单名称:进行中 - 上级菜单:工单管理 - 菜单类型:菜单(C) - 路由地址:test_work_order - 组件路径:system/test_work_order/index - 路由参数:`{"state": 0}` - 权限字符:system:test_work_order:list **已完成菜单**: - 菜单名称:已完成 - 上级菜单:工单管理 - 菜单类型:菜单(C) - 路由地址:test_work_order - 组件路径:system/test_work_order/index - 路由参数:`{"state": 1}` - 权限字符:system:test_work_order:list ## 扩展功能 如果需要支持更多状态,可以扩展映射关系: ```javascript if(state !== undefined && state !== null) { const stateNum = parseInt(state); switch(stateNum) { case 0: this.queryParams.testStep = 1; // 测试中 break; case 1: this.queryParams.testStep = 5; // 已完成 break; case 2: this.queryParams.testStep = 0; // 待领取 break; case 3: this.queryParams.testStep = 2; // 一审中 break; case 4: this.queryParams.testStep = 3; // 二审中 break; case 5: this.queryParams.testStep = 4; // 三审中 break; default: this.queryParams.testStep = null; // 全部 } } ``` ## 测试步骤 ### 1. 清除浏览器缓存 按 `Ctrl + Shift + R` 强制刷新页面 ### 2. 测试进行中筛选 访问:`http://123.56.98.4:8081/system/test_work_order?state=0` - 应该只显示 testStep=1 的工单 - 页面标题或筛选条件应该显示"测试中" ### 3. 测试已完成筛选 访问:`http://123.56.98.4:8081/system/test_work_order?state=1` - 应该只显示 testStep=5 的工单 - 页面标题或筛选条件应该显示"已完成" ### 4. 测试组合筛选 访问:`http://123.56.98.4:8081/system/test_work_order?orderId=123&state=1` - 应该显示批次ID为123且已完成的工单 ### 5. 测试无参数访问 访问:`http://123.56.98.4:8081/system/test_work_order` - 应该显示所有工单(不筛选状态) ## 注意事项 1. **参数优先级**:URL参数会覆盖页面上的按钮筛选 2. **参数持久性**:URL参数只在页面加载时生效,点击页面上的按钮会改变筛选条件 3. **参数验证**:代码会将 state 参数转换为整数,非数字参数会被忽略 4. **兼容性**:同时支持 query 参数和 params 参数 ## 相关文件 - `ruoyi-fastapi-frontend/src/views/system/test_work_order/index.vue` - 工单管理页面(已修改) - `工单菜单错误子菜单修复说明.md` - 菜单配置修复说明 - `工单按钮点击事件修复说明.md` - 按钮点击事件修复说明