feat: /admin/users 新增删除按钮

admin 用户管理此前只有编辑/停用, 没有删除入口 (但后端 DELETE /system/user/{userIds} 一直存在, @PreAuthorize('system:user:remove'))。

改动:
- 操作列新增「删除」按钮 (danger, link 风格, 与编辑/停用风格一致)
- 操作列宽度 180 → 240 容纳 3 个按钮
- 删除自己时禁用 (前端 UX 防护, 后端亦会 reject: ArrayUtils.contains(userIds, getUserId()))
- 二次确认框: 提示用户名/姓名 + 「删除后无法恢复, 关联数据将受影响」, type='error', 红色「确认删除」按钮
- 后端: DELETE /system/user/{userId} (RuoYi 标准 /{userIds} 路径, 单 ID 即可)

权限: admin 角色默认拥有 system:user:remove (RuoYi 默认 admin 配), 验证通过后即生效。
This commit is contained in:
郭庆泰
2026-08-20 21:46:47 +08:00
parent 8c9fe1cd04
commit 7ad6b3ddbe
+29 -2
View File
@@ -39,12 +39,19 @@
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" width="170" />
<el-table-column label="操作" width="180" fixed="right">
<el-table-column label="操作" width="240" fixed="right">
<template #default="{ row }">
<el-button size="small" link type="primary" @click="openEdit(row)">编辑</el-button>
<el-button size="small" link :type="row.status === '0' ? 'danger' : 'success'" @click="toggleStatus(row)">
{{ row.status === '0' ? '停用' : '启用' }}
</el-button>
<el-button
size="small"
link
type="danger"
:disabled="row.userId === userStore.user?.userId"
@click="delUser(row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -94,7 +101,10 @@
import { ref, reactive, onMounted } from 'vue'
import { listUser } from '@/api/system'
import request from '@/utils/request'
import { ElMessage } from 'element-plus'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useUserStore } from '@/store/user'
const userStore = useUserStore()
const ROLE_LABEL = {
admin: '后台管理员', leader: '项目负责人', manager: '合规人员',
@@ -164,6 +174,23 @@ async function toggleStatus(row) {
}
}
async function delUser(row) {
try {
await ElMessageBox.confirm(
`确认删除用户「${row.userName}」(${row.nickName || '无姓名'})?\n\n删除后无法恢复, 该用户关联的项目/会议/报名数据将受影响!`,
'删除确认',
{ type: 'error', confirmButtonText: '确认删除', cancelButtonText: '取消' }
)
} catch { return }
try {
await request({ url: `/system/user/${row.userId}`, method: 'delete' })
ElMessage.success('已删除')
load()
} catch (e) {
ElMessage.error(e?.msg || '删除失败')
}
}
onMounted(load)
</script>