feat(applicationManagement): 优化规则列表操作按钮显示逻辑

-调整按钮显示逻辑,确保所有状态都能显示查看详情按钮
-规则状态为"停用"时显示编辑和删除按钮
- 修改启用/停用按钮的显示逻辑和提示文本
- 优化代码结构,提高可读性和可维护性
This commit is contained in:
陈昱达
2025-07-28 17:18:56 +08:00
parent 7dcb09d84a
commit 6d0352b97d

View File

@@ -239,8 +239,10 @@ export default {
key: '操作',
isRedraw: true,
render: (h, params) => {
return h('div', [
// 查看详情按钮
const buttons = []
// 所有状态都显示查看详情按钮
buttons.push(
h(
'el-button',
{
@@ -254,38 +256,45 @@ export default {
on: { click: () => this.handleView(params.row) }
},
''
),
// 编辑按钮
h(
'el-button',
{
props: {
type: 'text',
size: 'mini',
icon: 'el-icon-edit-outline',
title: '编辑'
)
)
// 规则状态为"停用"(ruleStatus === 1)时显示编辑和删除按钮
if (params.row.ruleStatus === 1) {
buttons.push(
h(
'el-button',
{
props: {
type: 'text',
size: 'mini',
icon: 'el-icon-edit-outline',
title: '编辑'
},
class: 'normal-button',
on: { click: () => this.handleEdit(params.row) }
},
class: 'normal-button',
on: { click: () => this.handleEdit(params.row) }
},
''
),
// 删除按钮
h(
'el-button',
{
props: {
type: 'text',
size: 'mini',
style: 'color: #F56C6C',
icon: 'el-icon-delete',
title: '删除'
''
),
h(
'el-button',
{
props: {
type: 'text',
size: 'mini',
style: 'color: #F56C6C',
icon: 'el-icon-delete',
title: '删除'
},
on: { click: () => this.handleDelete(params.row) }
},
on: { click: () => this.handleDelete(params.row) }
},
''
),
// 启用/停用按钮(根据当前状态显示不同图标)
''
)
)
}
// 显示启用/停用按钮(根据当前状态显示不同图标)
buttons.push(
h(
'el-button',
{
@@ -296,13 +305,15 @@ export default {
params.row.ruleStatus === 0
? 'el-icon-remove-outline'
: 'el-icon-circle-check',
title: params.row.ruleStatus === 0 ? '用' : '用'
title: params.row.ruleStatus === 0 ? '用' : '用'
},
on: { click: () => this.handleToggleStatus(params.row) }
},
''
)
])
)
return h('div', buttons)
}
}
]
@@ -470,7 +481,7 @@ export default {
// 1 停用 0 启用
// 启用的数据能停用,停用的数据反之
const newStatus = row.ruleStatus === 1 ? 'enable' : 'disabled'
const statusText = row.ruleStatus === 0 ? '用' : '用'
const statusText = row.ruleStatus === 1 ? '用' : '用'
this.$messageBox(
() => {