style(button): 优化按钮样式和布局

- 调整了多个组件中的按钮样式,包括禁用状态的样式
- 优化了按钮的排列和间距
- 统一了按钮的样式类和属性
- 移除了部分冗余的代码
This commit is contained in:
陈昱达
2025-05-14 15:36:34 +08:00
parent 2c9ac917fe
commit 6d86c3e447
6 changed files with 83 additions and 75 deletions

View File

@@ -60,6 +60,14 @@
}
}
.el-table {
& .el-button {
&.is-disabled {
background: unset;
color: #cecece;
}
}
}
//.el-pagination.is-background .el-pager li:not(.disabled).active {
//
//}

View File

@@ -61,22 +61,22 @@ const RenderSlot = {
if (params.column.isRedraw) {
let content = data.props.render(h, params)
let contentDiv = content.children
if (contentDiv.length > 2) {
// if (contentDiv.length > 2) {
// 切割掉第一个div
const first = contentDiv.splice(0, 1)
const other = contentDiv.splice(0, contentDiv.length)
first[0].data.class = 'normal-button'
first[0].data.props.type = null
first[0].data.props.size = null
other.forEach(item => {
// item.data.class = 'normal-button '
item.data.class = 'normal-button popver-button'
})
content.children = [renderTooltip(first), renderPopver(other)]
// content.children = [renderTooltip(first), ...other]
return content
} else {
// const first = contentDiv.splice(0, 1)
// const other = contentDiv.splice(0, contentDiv.length)
// first[0].data.class = 'normal-button'
// first[0].data.props.type = null
// first[0].data.props.size = null
// other.forEach(item => {
// // item.data.class = 'normal-button '
// item.data.class = 'normal-button popver-button'
// })
//
// content.children = [renderTooltip(first), renderPopver(other)]
// // content.children = [renderTooltip(first), ...other]
// return content
// } else {
// const first = contentDiv.splice(0, contentDiv)
contentDiv = contentDiv.map(item => {
@@ -87,7 +87,7 @@ const RenderSlot = {
})
content.children = contentDiv
return content
}
// }
// let div =
} else {
return data.props.render(h, params)

View File

@@ -62,6 +62,7 @@
size="medium"
icon="el-icon-plus"
class="primary-button"
disbaled
@click="jumpAddKnowledge"
>上传知识
</el-button>
@@ -91,7 +92,7 @@
</el-button>
<el-button
type="primary"
icon="el-icon-edit-outline"
icon="el-icon-help"
size="medium"
class="line-button"
@click="handleMetaData"
@@ -699,8 +700,8 @@ export default {
on: {
click: () => this.deleteKnowledge(params.row)
}
},
'删除'
}
// '删除'
),
// h(
// 'el-button',
@@ -725,15 +726,15 @@ export default {
props: {
type: 'primary',
size: 'mini',
icon: 'el-icon-tickets',
icon: 'el-icon-help',
title: '添加元数据',
disabled: params.row.documentStatus !== 1
},
on: {
click: () => this.handleAddMetadata(params.row)
}
},
'标注元数据'
}
// '标注元数据'
),
params.row.optStatus < 4
? h(
@@ -743,14 +744,14 @@ export default {
props: {
type: 'primary',
size: 'mini',
icon: 'el-icon-tickets',
title: '添加元数据'
icon: 'el-icon-video-play',
title: '继续处理'
},
on: {
click: () => this.jumpToUpload(params)
}
},
'文件拆分处理'
}
// '文件拆分处理'
)
: ''
])

View File

@@ -54,8 +54,8 @@ export default {
},
class: 'normal-button',
on: { click: () => this.handleEdit(params.row) }
},
'修改'
}
// '修改'
),
h(
'el-button',
@@ -70,8 +70,8 @@ export default {
on: {
click: () => this.handleDelete(params.row, params.index)
}
},
'删除'
}
// '删除'
)
])
}

View File

@@ -179,8 +179,8 @@ export default {
},
class: 'normal-button',
on: { click: () => this.handleDelete(params.row) }
},
'删除'
}
// '删除'
),
h(
'el-button',
@@ -195,8 +195,8 @@ export default {
on: {
click: () => this.handlePermissionVisible(params.row)
}
},
'设置权限'
}
// '设置权限'
)
])
}

View File

@@ -177,43 +177,42 @@ export default {
props: {
type: 'text',
size: 'mini',
icon: 'el-icon-remove-outline',
style:
icon:
params.row.status === 0
? 'color: #F56C6C'
: 'color: #67C23A'
? 'el-icon-remove-outline'
: 'el-icon-circle-check',
title: params.row.status === 0 ? '停用' : '启用'
},
// style:
// params.row.status === 0
// ? 'color: #F56C6C'
// : 'color: #67C23A',
on: { click: () => this.handleToggleStatus(params.row) }
},
params.row.status === 0 ? '停用' : '启用'
}
// params.row.status === 0 ? '停用' : '启用'
),
h(
'el-button',
{
h('el-button', {
props: {
type: 'text',
size: 'mini',
style: 'color: #409EFF',
icon: 'el-icon-refresh-right'
icon: 'el-icon-refresh-right',
title: '重置密码'
},
class: 'normal-button',
on: { click: () => this.handleResetPassword(params.row) }
},
'重置密码'
),
h(
'el-button',
{
}),
h('el-button', {
props: {
type: 'text',
size: 'mini',
style: 'color: #F56C6C',
icon: 'el-icon-delete'
icon: 'el-icon-delete',
title: '删除'
},
on: { click: () => this.handleDelete(params.row) }
},
'删除'
)
})
])
}
}