批量删除
parent
347d9472ab
commit
9bdfd77963
|
|
@ -289,18 +289,18 @@
|
|||
v-if="cur_page !== 'work_order'"
|
||||
v-hasPermi="['system:test_order:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
</el-col> -->
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
@click="handleBatchDelete"
|
||||
v-if="cur_page !== 'work_order'"
|
||||
v-hasPermi="['system:test_order:remove']"
|
||||
>删除</el-button>
|
||||
</el-col> -->
|
||||
>批量删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
|
|
@ -772,6 +772,20 @@ export default {
|
|||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 批量删除按钮操作 */
|
||||
handleBatchDelete() {
|
||||
if (this.ids.length === 0) {
|
||||
this.$modal.msgWarning("请选择要删除的订单");
|
||||
return;
|
||||
}
|
||||
const ids = this.ids.join(',');
|
||||
this.$modal.confirm(`是否确认删除选中的 ${this.ids.length} 个订单?`).then(function() {
|
||||
return delTest_order(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("批量删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('system/test_order/export', {
|
||||
|
|
|
|||
|
|
@ -68,6 +68,16 @@
|
|||
v-hasPermi="['system:test_work_order:list']"
|
||||
>生成订单</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5" v-if="!$store.getters.roles.includes('common')">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
:disabled="multiple"
|
||||
@click="handleBatchDelete"
|
||||
v-hasPermi="['system:test_work_order:remove']"
|
||||
>批量删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
|
|
@ -812,6 +822,20 @@ export default {
|
|||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 批量删除按钮操作 */
|
||||
handleBatchDelete() {
|
||||
if (this.ids.length === 0) {
|
||||
this.$modal.msgWarning("请选择要删除的工单");
|
||||
return;
|
||||
}
|
||||
const ids = this.ids.join(',');
|
||||
this.$modal.confirm(`是否确认删除选中的 ${this.ids.length} 个工单?`).then(function() {
|
||||
return delTest_work_order(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("批量删除成功");
|
||||
}).catch(() => {});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('system/test_work_order/export', {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,213 @@
|
|||
# 批量删除功能实现说明
|
||||
|
||||
## 功能描述
|
||||
|
||||
为工单管理和订单管理页面添加批量删除功能,允许用户选中多个项目后一次性删除。
|
||||
|
||||
## 实现内容
|
||||
|
||||
### 1. 工单管理页面(test_work_order/index.vue)
|
||||
|
||||
#### 添加的按钮
|
||||
在工单管理页面的按钮行中添加了"批量删除"按钮:
|
||||
|
||||
```vue
|
||||
<el-col :span="1.5" v-if="!$store.getters.roles.includes('common')">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
:disabled="multiple"
|
||||
@click="handleBatchDelete"
|
||||
v-hasPermi="['system:test_work_order:remove']"
|
||||
>批量删除</el-button>
|
||||
</el-col>
|
||||
```
|
||||
|
||||
**按钮特性**:
|
||||
- 位置:在"生成订单"按钮之后
|
||||
- 权限控制:只有非common角色的用户可见
|
||||
- 禁用状态:当没有选中任何工单时禁用(`multiple`为true时)
|
||||
- 权限标识:`system:test_work_order:remove`
|
||||
|
||||
#### 添加的方法
|
||||
|
||||
```javascript
|
||||
/** 批量删除按钮操作 */
|
||||
handleBatchDelete() {
|
||||
if (this.ids.length === 0) {
|
||||
this.$modal.msgWarning("请选择要删除的工单");
|
||||
return;
|
||||
}
|
||||
const ids = this.ids.join(',');
|
||||
this.$modal.confirm(`是否确认删除选中的 ${this.ids.length} 个工单?`).then(function() {
|
||||
return delTest_work_order(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("批量删除成功");
|
||||
}).catch(() => {});
|
||||
}
|
||||
```
|
||||
|
||||
**方法功能**:
|
||||
1. 检查是否选中了工单
|
||||
2. 将选中的工单ID数组转换为逗号分隔的字符串
|
||||
3. 显示确认对话框,提示要删除的工单数量
|
||||
4. 调用删除API
|
||||
5. 刷新列表并显示成功消息
|
||||
|
||||
### 2. 订单管理页面(test_order/index.vue)
|
||||
|
||||
#### 添加的按钮
|
||||
在订单管理页面的按钮行中添加了"批量删除"按钮:
|
||||
|
||||
```vue
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
:disabled="multiple"
|
||||
@click="handleBatchDelete"
|
||||
v-if="cur_page !== 'work_order'"
|
||||
v-hasPermi="['system:test_order:remove']"
|
||||
>批量删除</el-button>
|
||||
</el-col>
|
||||
```
|
||||
|
||||
**按钮特性**:
|
||||
- 位置:替换了原来注释掉的删除按钮位置
|
||||
- 显示条件:只在订单页面显示(`cur_page !== 'work_order'`)
|
||||
- 禁用状态:当没有选中任何订单时禁用
|
||||
- 权限标识:`system:test_order:remove`
|
||||
|
||||
#### 添加的方法
|
||||
|
||||
```javascript
|
||||
/** 批量删除按钮操作 */
|
||||
handleBatchDelete() {
|
||||
if (this.ids.length === 0) {
|
||||
this.$modal.msgWarning("请选择要删除的订单");
|
||||
return;
|
||||
}
|
||||
const ids = this.ids.join(',');
|
||||
this.$modal.confirm(`是否确认删除选中的 ${this.ids.length} 个订单?`).then(function() {
|
||||
return delTest_order(ids);
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("批量删除成功");
|
||||
}).catch(() => {});
|
||||
}
|
||||
```
|
||||
|
||||
**方法功能**:
|
||||
1. 检查是否选中了订单
|
||||
2. 将选中的订单ID数组转换为逗号分隔的字符串
|
||||
3. 显示确认对话框,提示要删除的订单数量
|
||||
4. 调用删除API
|
||||
5. 刷新列表并显示成功消息
|
||||
|
||||
## 使用说明
|
||||
|
||||
### 工单管理页面
|
||||
|
||||
1. **访问页面**:进入"工单管理" → "测试工单"
|
||||
2. **选择工单**:勾选要删除的工单(可多选)
|
||||
3. **点击删除**:点击"批量删除"按钮
|
||||
4. **确认操作**:在弹出的确认对话框中点击"确定"
|
||||
5. **完成删除**:系统显示"批量删除成功"消息,列表自动刷新
|
||||
|
||||
### 订单管理页面
|
||||
|
||||
1. **访问页面**:进入"订单管理"
|
||||
2. **选择订单**:勾选要删除的订单(可多选)
|
||||
3. **点击删除**:点击"批量删除"按钮
|
||||
4. **确认操作**:在弹出的确认对话框中点击"确定"
|
||||
5. **完成删除**:系统显示"批量删除成功"消息,列表自动刷新
|
||||
|
||||
## 权限要求
|
||||
|
||||
### 工单管理
|
||||
- 需要权限:`system:test_work_order:remove`
|
||||
- 角色限制:common角色不可见批量删除按钮
|
||||
|
||||
### 订单管理
|
||||
- 需要权限:`system:test_order:remove`
|
||||
- 页面限制:只在订单页面显示(不在工单页面显示)
|
||||
|
||||
## 后端API
|
||||
|
||||
批量删除功能使用现有的删除API,支持传入逗号分隔的ID字符串:
|
||||
|
||||
### 工单删除API
|
||||
- **接口**:`DELETE /system/test_work_order/{ids}`
|
||||
- **参数**:`ids` - 逗号分隔的工单ID字符串(如:"1,2,3")
|
||||
- **返回**:删除结果
|
||||
|
||||
### 订单删除API
|
||||
- **接口**:`DELETE /system/test_order/{ids}`
|
||||
- **参数**:`ids` - 逗号分隔的订单ID字符串(如:"1,2,3")
|
||||
- **返回**:删除结果
|
||||
|
||||
## 注意事项
|
||||
|
||||
1. **选择验证**:
|
||||
- 未选中任何项目时,按钮处于禁用状态
|
||||
- 点击按钮时会再次验证是否有选中项
|
||||
|
||||
2. **确认对话框**:
|
||||
- 显示要删除的项目数量
|
||||
- 用户可以取消操作
|
||||
|
||||
3. **删除后操作**:
|
||||
- 自动刷新列表
|
||||
- 清空选中状态
|
||||
- 显示成功消息
|
||||
|
||||
4. **错误处理**:
|
||||
- 如果删除失败,会显示错误消息
|
||||
- 不会影响其他已选中的项目
|
||||
|
||||
## 测试建议
|
||||
|
||||
### 功能测试
|
||||
1. 选中单个项目删除
|
||||
2. 选中多个项目删除
|
||||
3. 未选中任何项目时按钮应禁用
|
||||
4. 取消删除操作
|
||||
5. 删除后列表应正确刷新
|
||||
|
||||
### 权限测试
|
||||
1. 有权限的用户可以看到并使用批量删除按钮
|
||||
2. 无权限的用户看不到批量删除按钮
|
||||
3. common角色在工单页面看不到批量删除按钮
|
||||
|
||||
### 边界测试
|
||||
1. 删除所有项目
|
||||
2. 删除第一页的所有项目(应跳转到上一页)
|
||||
3. 删除最后一页的所有项目(应跳转到上一页)
|
||||
|
||||
## 相关文件
|
||||
|
||||
- `ruoyi-fastapi-frontend/src/views/system/test_work_order/index.vue` - 工单管理页面
|
||||
- `ruoyi-fastapi-frontend/src/views/system/test_order/index.vue` - 订单管理页面
|
||||
- `ruoyi-fastapi-backend/module_admin/system/service/test_work_order_service.py` - 工单服务
|
||||
- `ruoyi-fastapi-backend/module_admin/system/service/test_order_service.py` - 订单服务
|
||||
|
||||
## 修改总结
|
||||
|
||||
### 工单管理
|
||||
- ✅ 添加批量删除按钮
|
||||
- ✅ 添加 `handleBatchDelete` 方法
|
||||
- ✅ 权限控制(非common角色)
|
||||
- ✅ 禁用状态控制
|
||||
|
||||
### 订单管理
|
||||
- ✅ 添加批量删除按钮
|
||||
- ✅ 添加 `handleBatchDelete` 方法
|
||||
- ✅ 权限控制
|
||||
- ✅ 页面显示控制(只在订单页面显示)
|
||||
- ✅ 禁用状态控制
|
||||
|
||||
## 完成时间
|
||||
2026-01-09
|
||||
Loading…
Reference in New Issue