style(cargo-type): 优化表格样式及时间格式展示
- 为部分字段添加溢出显示提示(showOverflowTooltip) - 修改更新时间和创建时间的格式为“YYYY-MM-DD” - 调整el-table头部和数据行的内边距,提高视觉一致性 - 将按钮类型由success和danger统一更改为primary,简化按钮样式
This commit is contained in:
@@ -81,6 +81,7 @@ export const getCargoTypeOption = ctx => ({
|
|||||||
addDisplay: false,
|
addDisplay: false,
|
||||||
editDisplay: false,
|
editDisplay: false,
|
||||||
display: false,
|
display: false,
|
||||||
|
showOverflowTooltip: true,
|
||||||
minWidth: 160,
|
minWidth: 160,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -101,6 +102,7 @@ export const getCargoTypeOption = ctx => ({
|
|||||||
minWidth: 150,
|
minWidth: 150,
|
||||||
maxlength: 50,
|
maxlength: 50,
|
||||||
showWordLimit: true,
|
showWordLimit: true,
|
||||||
|
showOverflowTooltip: true,
|
||||||
rules: [{ validator: validateCargoName, trigger: 'blur' }],
|
rules: [{ validator: validateCargoName, trigger: 'blur' }],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -155,14 +157,15 @@ export const getCargoTypeOption = ctx => ({
|
|||||||
maxlength: 200,
|
maxlength: 200,
|
||||||
showWordLimit: true,
|
showWordLimit: true,
|
||||||
overHidden: true,
|
overHidden: true,
|
||||||
|
showOverflowTooltip: true,
|
||||||
rules: [{ validator: validateRemark, trigger: 'blur' }],
|
rules: [{ validator: validateRemark, trigger: 'blur' }],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '更新时间',
|
label: '更新时间',
|
||||||
prop: 'updateTime',
|
prop: 'updateTime',
|
||||||
type: 'datetime',
|
type: 'datetime',
|
||||||
format: 'YYYY-MM-DD HH:mm:ss',
|
format: 'YYYY-MM-DD',
|
||||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
valueFormat: 'YYYY-MM-DD',
|
||||||
addDisplay: false,
|
addDisplay: false,
|
||||||
editDisplay: false,
|
editDisplay: false,
|
||||||
display: false,
|
display: false,
|
||||||
@@ -172,8 +175,8 @@ export const getCargoTypeOption = ctx => ({
|
|||||||
label: '创建时间',
|
label: '创建时间',
|
||||||
prop: 'createTime',
|
prop: 'createTime',
|
||||||
type: 'datetime',
|
type: 'datetime',
|
||||||
format: 'YYYY-MM-DD HH:mm:ss',
|
format: 'YYYY-MM-DD',
|
||||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
valueFormat: 'YYYY-MM-DD',
|
||||||
addDisplay: false,
|
addDisplay: false,
|
||||||
editDisplay: false,
|
editDisplay: false,
|
||||||
display: false,
|
display: false,
|
||||||
|
|||||||
@@ -84,7 +84,7 @@
|
|||||||
|
|
||||||
<template #menu="{ row, index }">
|
<template #menu="{ row, index }">
|
||||||
<el-button
|
<el-button
|
||||||
type="success"
|
type="primary"
|
||||||
text
|
text
|
||||||
v-if="permission.cargo_type_view"
|
v-if="permission.cargo_type_view"
|
||||||
@click="$refs.crud.rowView(row, index)"
|
@click="$refs.crud.rowView(row, index)"
|
||||||
@@ -100,7 +100,7 @@
|
|||||||
编辑
|
编辑
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
type="danger"
|
type="primary"
|
||||||
text
|
text
|
||||||
v-if="permission.cargo_type_delete"
|
v-if="permission.cargo_type_delete"
|
||||||
@click="rowDel(row)"
|
@click="rowDel(row)"
|
||||||
@@ -617,14 +617,14 @@ export default {
|
|||||||
--el-table-row-height: 40px;
|
--el-table-row-height: 40px;
|
||||||
|
|
||||||
// 表头加高
|
// 表头加高
|
||||||
//.el-table__header-wrapper .el-table__cell {
|
.el-table__header-wrapper .el-table__cell {
|
||||||
// padding: 10px 0;
|
padding: 10px 0;
|
||||||
//}
|
}
|
||||||
|
|
||||||
// 数据行保持紧凑
|
// 数据行保持紧凑
|
||||||
//.el-table__body .el-table__cell {
|
.el-table__body .el-table__cell {
|
||||||
// padding: 2px 0;
|
padding: 6px 0;
|
||||||
//}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 底部空白区域自适应:表格 body 不再强制撑满计算高度
|
// 底部空白区域自适应:表格 body 不再强制撑满计算高度
|
||||||
|
|||||||
Reference in New Issue
Block a user