feat: 添加配置管理的批量删除,复选框
This commit is contained in:
@@ -22,8 +22,8 @@
|
||||
<el-button type="primary" @click="handleAddSetting">
|
||||
<el-icon><Plus /></el-icon>新增配置
|
||||
</el-button>
|
||||
<el-button type="danger" :disabled="!selectedNode" @click="handleBatchDelete">
|
||||
<el-icon><Delete /></el-icon>删除选中
|
||||
<el-button type="danger" :disabled="selectedRows.length === 0" @click="handleBatchDelete">
|
||||
<el-icon><Delete /></el-icon>批量删除 ({{ selectedRows.length }})
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -39,7 +39,9 @@
|
||||
row-key="id"
|
||||
:header-cell-style="{ background: '#fafafa', color: '#333', fontWeight: 600 }"
|
||||
class="setting-tree-table"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="名称" min-width="300">
|
||||
<template #default="{ row }">
|
||||
<div class="tree-item-content" :style="{ paddingLeft: (row.level - 1) * 24 + 'px' }">
|
||||
@@ -727,22 +729,74 @@ const resetQuery = () => {
|
||||
|
||||
// 批量删除
|
||||
const handleBatchDelete = () => {
|
||||
if (!selectedNode.value) {
|
||||
if (selectedRows.value.length === 0) {
|
||||
ElMessage.warning('请先选择要删除的项目')
|
||||
return
|
||||
}
|
||||
|
||||
const type = selectedNode.value.type
|
||||
const data = selectedNode.value.data
|
||||
// 分离配置组和配置项
|
||||
const groups = selectedRows.value.filter(row => row.type === 'group')
|
||||
const settings = selectedRows.value.filter(row => row.type === 'setting')
|
||||
|
||||
let confirmMessage = ''
|
||||
if (groups.length > 0 && settings.length > 0) {
|
||||
confirmMessage = `确认删除选中的 ${groups.length} 个配置组和 ${settings.length} 个配置项吗?删除配置组将同时删除其下的所有配置项。`
|
||||
} else if (groups.length > 0) {
|
||||
confirmMessage = `确认删除选中的 ${groups.length} 个配置组吗?删除配置组将同时删除其下的所有配置项。`
|
||||
} else {
|
||||
confirmMessage = `确认删除选中的 ${settings.length} 个配置项吗?`
|
||||
}
|
||||
|
||||
ElMessageBox.confirm(confirmMessage, '批量删除警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const deletePromises = []
|
||||
|
||||
// 删除配置组
|
||||
groups.forEach(row => {
|
||||
deletePromises.push(deleteSettingGroup({ setting_group_id: row.data.id }))
|
||||
})
|
||||
|
||||
// 删除配置项
|
||||
settings.forEach(row => {
|
||||
deletePromises.push(deleteSetting({ id: row.data.id }))
|
||||
})
|
||||
|
||||
try {
|
||||
const results = await Promise.all(deletePromises)
|
||||
const successCount = results.filter(res => res.data.code === 200).length
|
||||
|
||||
if (successCount === selectedRows.value.length) {
|
||||
ElMessage.success('批量删除成功')
|
||||
} else {
|
||||
ElMessage.warning(`成功删除 ${successCount} 项,失败 ${selectedRows.value.length - successCount} 项`)
|
||||
}
|
||||
|
||||
// 清空选择
|
||||
selectedRows.value = []
|
||||
handleQuery()
|
||||
} catch (error) {
|
||||
console.error('批量删除失败:', error)
|
||||
ElMessage.error('批量删除失败')
|
||||
}
|
||||
}).catch(() => {})
|
||||
}
|
||||
|
||||
// 删除节点
|
||||
const handleDelete = (data) => {
|
||||
const type = data.type
|
||||
const rowData = data.data
|
||||
|
||||
if (type === 'group') {
|
||||
ElMessageBox.confirm(`确认删除配置组 "${data.name}" 吗?`, '警告', {
|
||||
ElMessageBox.confirm(`确认删除配置组 "${rowData.name}" 吗?`, '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
try {
|
||||
const res = await deleteSettingGroup({ setting_group_id: data.id })
|
||||
const res = await deleteSettingGroup({ setting_group_id: rowData.id })
|
||||
if (res.data.code === 200) {
|
||||
ElMessage.success('删除成功')
|
||||
handleQuery()
|
||||
@@ -753,13 +807,13 @@ const handleBatchDelete = () => {
|
||||
}
|
||||
}).catch(() => {})
|
||||
} else if (type === 'setting') {
|
||||
ElMessageBox.confirm(`确认删除配置 "${data.name}" 吗?`, '警告', {
|
||||
ElMessageBox.confirm(`确认删除配置 "${rowData.name}" 吗?`, '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
try {
|
||||
const res = await deleteSetting({ id: data.id })
|
||||
const res = await deleteSetting({ id: rowData.id })
|
||||
if (res.data.code === 200) {
|
||||
ElMessage.success('删除成功')
|
||||
handleQuery()
|
||||
@@ -772,10 +826,9 @@ const handleBatchDelete = () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 删除节点
|
||||
const handleDelete = (data) => {
|
||||
selectedNode.value = data
|
||||
handleBatchDelete()
|
||||
// 处理表格选择变化
|
||||
const handleSelectionChange = (selection) => {
|
||||
selectedRows.value = selection
|
||||
}
|
||||
|
||||
// ==================== 配置组方法 ====================
|
||||
|
||||
Reference in New Issue
Block a user