|
|
|
|
# 一键全部清空功能 - 超简化版本
|
|
|
|
|
|
|
|
|
|
## 🎯 设计理念
|
|
|
|
|
|
|
|
|
|
**后端只有一个通用接口**,通过业务模块标识匹配表名,前端配置极简。
|
|
|
|
|
|
|
|
|
|
## 🔧 后端架构(已完成)
|
|
|
|
|
|
|
|
|
|
### 核心组件
|
|
|
|
|
- ✅ `CommonClearController` - 通用清空控制器
|
|
|
|
|
- ✅ `CommonClearService` - 通用清空服务
|
|
|
|
|
- ✅ `CommonClearMapper` - 通用清空数据访问层
|
|
|
|
|
|
|
|
|
|
### 安全措施
|
|
|
|
|
1. **白名单机制** - 只允许清空预定义的表
|
|
|
|
|
2. **表名验证** - 正则校验,防止SQL注入
|
|
|
|
|
3. **权限检查** - 动态权限验证
|
|
|
|
|
4. **SQL关键字过滤** - 防止恶意攻击
|
|
|
|
|
5. **长度限制** - 表名长度控制
|
|
|
|
|
6. **操作日志** - 完整的审计日志
|
|
|
|
|
|
|
|
|
|
## 🚀 前端快速集成(3步完成)
|
|
|
|
|
|
|
|
|
|
### 步骤1:添加按钮(导入按钮后)
|
|
|
|
|
```vue
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button
|
|
|
|
|
type="danger"
|
|
|
|
|
plain
|
|
|
|
|
icon="el-icon-delete"
|
|
|
|
|
size="mini"
|
|
|
|
|
@click="handleClearAll"
|
|
|
|
|
v-hasPermi="['你的权限:remove']"
|
|
|
|
|
>一键全部清空</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
### 步骤2:导入mixin
|
|
|
|
|
```javascript
|
|
|
|
|
import clearAllMixin from "@/mixins/clearAllMixin";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
name: "YourComponent",
|
|
|
|
|
mixins: [clearAllMixin],
|
|
|
|
|
// ... 其他代码
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
### 步骤3:配置模块信息(created钩子中)
|
|
|
|
|
```javascript
|
|
|
|
|
created() {
|
|
|
|
|
// 其他代码...
|
|
|
|
|
|
|
|
|
|
// 配置清空功能(仅需3个参数)
|
|
|
|
|
this.clearAllConfig = {
|
|
|
|
|
moduleKey: '模块标识', // 见下方支持的模块列表
|
|
|
|
|
entityName: '显示名称', // 如:'日常故障记录'
|
|
|
|
|
permission: '权限标识' // 如:'ems/info:dailyFaultRecord:remove'
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
## 📋 支持的模块列表(后端已配置)
|
|
|
|
|
|
|
|
|
|
| 模块标识 | 实体名称 | 权限标识 |
|
|
|
|
|
|---------|---------|---------|
|
|
|
|
|
| `dailyFaultRecord` | 日常故障记录 | `ems/info:dailyFaultRecord:remove` |
|
|
|
|
|
| `faultHandlingRecord` | 故障处置记录 | `ems/info:faultHandlingRecord:remove` |
|
|
|
|
|
| `plcBufferBatteryLifecycle` | PLC缓冲电池生命周期 | `ems/info:plcBufferBatteryLifecycle:remove` |
|
|
|
|
|
| `securityDoorBatteryLifecycle` | 安全门电池生命周期 | `ems/info:securityDoorBatteryLifecycle:remove` |
|
|
|
|
|
| `upsBatteryLifecycle` | UPS电池生命周期 | `ems/info:upsBatteryLifecycle:remove` |
|
|
|
|
|
| `sparePartsInventory` | 备件库记录 | `ems/info:sparePartsInventory:remove` |
|
|
|
|
|
| `sparePartsUsageRecord` | 备件领用记录 | `ems/info:sparePartsUsageRecord:remove` |
|
|
|
|
|
| `sparePartsRegistration` | 废旧备件登记 | `ems/info:sparePartsRegistration:remove` |
|
|
|
|
|
| `supervisionChecklist` | 监督检查清单 | `ems/info:supervisionChecklist:remove` |
|
|
|
|
|
| `sparePartsInventoryCheck` | 备件盘点记录 | `ems/info:sparePartsInventoryCheck:remove` |
|
|
|
|
|
|
|
|
|
|
## 💡 实际应用示例
|
|
|
|
|
|
|
|
|
|
### 日常故障记录页面(已完成)
|
|
|
|
|
```vue
|
|
|
|
|
<!-- 1. 添加按钮 -->
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="danger" plain icon="el-icon-delete"
|
|
|
|
|
size="mini" @click="handleClearAll"
|
|
|
|
|
v-hasPermi="['ems/info:dailyFaultRecord:remove']">
|
|
|
|
|
一键全部清空
|
|
|
|
|
</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
// 2. 导入mixin
|
|
|
|
|
import clearAllMixin from "@/mixins/clearAllMixin";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
mixins: [clearAllMixin],
|
|
|
|
|
created() {
|
|
|
|
|
// 3. 配置模块
|
|
|
|
|
this.clearAllConfig = {
|
|
|
|
|
moduleKey: 'dailyFaultRecord',
|
|
|
|
|
entityName: '日常故障记录',
|
|
|
|
|
permission: 'ems/info:dailyFaultRecord:remove'
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
### 故障处置记录页面(示例)
|
|
|
|
|
```javascript
|
|
|
|
|
// 只需要修改配置
|
|
|
|
|
this.clearAllConfig = {
|
|
|
|
|
moduleKey: 'faultHandlingRecord',
|
|
|
|
|
entityName: '故障处置记录',
|
|
|
|
|
permission: 'ems/info:faultHandlingRecord:remove'
|
|
|
|
|
};
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
## ⚡ 添加新模块支持
|
|
|
|
|
|
|
|
|
|
如需要支持新模块,只需要在后端 `CommonClearController` 的白名单中添加:
|
|
|
|
|
|
|
|
|
|
```java
|
|
|
|
|
put("新模块标识", new TableInfo("数据库表名", "显示名称", "权限标识"));
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
## 🛡️ 安全特性
|
|
|
|
|
|
|
|
|
|
1. **三次确认机制** - 确保用户真的要执行操作
|
|
|
|
|
2. **白名单限制** - 只能清空预定义的表
|
|
|
|
|
3. **权限验证** - 检查用户权限
|
|
|
|
|
4. **SQL安全** - 防止注入攻击
|
|
|
|
|
5. **操作审计** - 记录所有操作日志
|
|
|
|
|
|
|
|
|
|
## 📈 开发效率对比
|
|
|
|
|
|
|
|
|
|
| 方案 | 后端代码量 | 前端集成步骤 | 新增模块成本 |
|
|
|
|
|
|-----|-----------|-------------|-------------|
|
|
|
|
|
| 原方案 | 每模块5个文件 | 8步 | 高 |
|
|
|
|
|
| **新方案** | **1个通用接口** | **3步** | **极低** |
|
|
|
|
|
|
|
|
|
|
## 🎉 总结
|
|
|
|
|
|
|
|
|
|
- **后端**:一次开发,永久使用
|
|
|
|
|
- **前端**:复制粘贴,秒级集成
|
|
|
|
|
- **维护**:集中管理,安全可控
|
|
|
|
|
- **扩展**:新增模块只需添加一行配置
|
|
|
|
|
|
|
|
|
|
现在为任何页面添加清空功能,只需要3步,2分钟搞定!
|