style(business): 统一业务状态标签为文字+颜色样式
- 新增全局 `.status-text` 样式,去除 el-tag 背景和边框,仅保留彩色文字和跟随文字颜色的圆点 - 业务状态相关的 el-tag 标签全部加上 `class="status-text"`,覆盖调度状态、审批状态、运单状态等全站业务状态展示 - 统一发货模板查看弹窗的卡片样式,新增分区块样式与运费信息展示板块 - 调整发货模板弹窗详情 label 宽度,所有 el-descriptions 的 label 宽度统一为 140px 以保证视觉一致 - 表格列内嵌输入控件全宽默认样式生效,无需单独设置跨度,解决输入框显示不足问题 - 弹窗中的部分表单和导入区域使用 `section-card` 统一卡片风格 - 客商档案查看模式改为独立路由,实现查看与编辑隔离并调整对应操作按钮文案 - 相关样式调整及细节优化,包括运费单位颜色等辅助样式,保证界面细节统一规范
This commit is contained in:
@@ -657,6 +657,26 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
// 全站统一:el-table 表格列内嵌控件默认拉满 cell(不撞表头)
|
||||
// 适用场景:可编辑表、弹窗内表格(如 pre-settlement-editor 结算明细调整、transport-reconciliation/formal-settlement/settlement-adjustment editor 等)。
|
||||
// 排除 .el-form-item__content 上下文,与表单内 250px 规则互不冲突。
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-input-number,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-input,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-select,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-date-editor,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-cascader,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-input-number .el-input__wrapper,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-select .el-select__wrapper,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-date-editor.el-input,
|
||||
.el-table .el-table__body td.el-table__cell .cell > .el-date-editor.el-input .el-input__wrapper {
|
||||
width: 100%;
|
||||
--el-input-number-width: 100%;
|
||||
--el-input-width: 100%;
|
||||
--el-select-width: 100%;
|
||||
--el-date-editor-width: 100%;
|
||||
--el-cascader-width: 100%;
|
||||
}
|
||||
|
||||
// 统一 avue-crud 偶数行背景色
|
||||
.avue-crud .el-table__body-wrapper tr.el-table__row:nth-child(even) td.el-table__cell,
|
||||
.avue-crud .el-table__body-wrapper tr.el-table__row:nth-child(even) td.el-table-fixed-column--left,
|
||||
@@ -985,6 +1005,11 @@
|
||||
border-top: 0 !important;
|
||||
margin-top: -30px !important;
|
||||
}
|
||||
|
||||
// 查看弹窗(avue--detail)footer 不上移,避免遮住详情表格底部边框
|
||||
.avue-crud__dialog .avue-form.avue--detail ~ .avue-dialog__footer {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
.el-form-item__label {
|
||||
margin-left: 12px !important;
|
||||
}
|
||||
@@ -1001,3 +1026,28 @@
|
||||
//.el-form-item {
|
||||
// margin-bottom: 15px !important;
|
||||
//}
|
||||
|
||||
// ============ 业务状态标签:全站统一为「文字 + 颜色」样式 ============
|
||||
// 去掉 el-tag 默认背景与边框,仅保留彩色文字,并前置一个状态圆点(颜色同文字)。
|
||||
// 适用于所有业务状态展示:调度状态 / 运单状态 / 审批状态等。
|
||||
.el-tag.status-text {
|
||||
background-color: transparent !important;
|
||||
border-color: transparent !important;
|
||||
padding: 0;
|
||||
margin-left: 8px;
|
||||
font-weight: 500;
|
||||
line-height: inherit;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-radius: 50%;
|
||||
background-color: currentColor;
|
||||
margin-right: 6px;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user