style(table): 优化表格样式和布局自适应
- 移除 basic-container 内部 el-card 的无效 box-shadow 样式 - 调整表头单元格高度,增加上下内边距至10px - 保持数据行单元格紧凑,内边距缩小至2px上下 - 改善表格底部空白区域,自适应高度,不再强制填满 - 使表格容器高度自动适应内容尺寸
This commit is contained in:
@@ -600,10 +600,6 @@ export default {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
:deep(.el-card) {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
// <20><>除 basic-container 卡片内层 el-card 的 padding(规范 4.4)
|
||||
:deep(.basic-container__card) > .el-card__body {
|
||||
padding: 0;
|
||||
@@ -620,9 +616,26 @@ export default {
|
||||
--el-table-row-hover-bg-color: #f5f7fa;
|
||||
--el-table-row-height: 40px;
|
||||
|
||||
.el-table__cell {
|
||||
padding: 1px 0;
|
||||
// 表头加高
|
||||
.el-table__header-wrapper .el-table__cell {
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
// 数据行保持紧凑
|
||||
.el-table__body .el-table__cell {
|
||||
padding: 2px 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部空白区域自适应:表格 body 不再强制撑满计算高度
|
||||
:deep(.avue-crud .el-table__body-wrapper) {
|
||||
max-height: none !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
// 同步让外层表格容器也自适应
|
||||
:deep(.avue-crud .el-table) {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
:deep(.el-table__body tr:nth-child(even) > td.el-table__cell) {
|
||||
|
||||
Reference in New Issue
Block a user