style(table): 优化表格样式并添加全局美化
- 在 component.less 中添加了 ele-pro-table 的全局美化样式 - 调整了表格的列宽、对齐方式等样式 - 优化了表格的视觉效果,提高了可读性
This commit is contained in:
@@ -1,2 +1,17 @@
|
|||||||
/** 组件样式 */
|
/** 组件样式 */
|
||||||
//@input-item: 300px;
|
//@input-item: 300px;
|
||||||
|
|
||||||
|
/* ele-pro-table 全局美化样式 */
|
||||||
|
.ele-pro-table .ant-table-thead > tr > th {
|
||||||
|
border-bottom: 2px solid #f0f0f0;
|
||||||
|
background-color: #fafafa;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ele-pro-table .ant-table-tbody > tr > td {
|
||||||
|
border-bottom: 1px solid #f5f5f5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ele-pro-table .ant-table-tbody > tr:hover > td {
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
}
|
||||||
|
|||||||
@@ -35,9 +35,9 @@
|
|||||||
<a-tag v-else color="green">正常</a-tag>
|
<a-tag v-else color="green">正常</a-tag>
|
||||||
</template>
|
</template>
|
||||||
<template v-if="column.key === 'action'">
|
<template v-if="column.key === 'action'">
|
||||||
<a-space>
|
|
||||||
<a @click="openEdit(record)" class="ele-text-primary">
|
<a @click="openEdit(record)" class="ele-text-primary">
|
||||||
<EditOutlined /> 编辑
|
<EditOutlined/>
|
||||||
|
编辑
|
||||||
</a>
|
</a>
|
||||||
<a-divider type="vertical"/>
|
<a-divider type="vertical"/>
|
||||||
<a-popconfirm
|
<a-popconfirm
|
||||||
@@ -46,10 +46,10 @@
|
|||||||
placement="topRight"
|
placement="topRight"
|
||||||
>
|
>
|
||||||
<a class="ele-text-danger">
|
<a class="ele-text-danger">
|
||||||
<DeleteOutlined /> 删除
|
<DeleteOutlined/>
|
||||||
|
删除
|
||||||
</a>
|
</a>
|
||||||
</a-popconfirm>
|
</a-popconfirm>
|
||||||
</a-space>
|
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</ele-pro-table>
|
</ele-pro-table>
|
||||||
|
|||||||
Reference in New Issue
Block a user