style(business): 优化业务弹窗布局与样式统一
- 修改 dispatchItemForm 表单标签宽度为 calc(6em + 24px),统一label宽度标准 - 调整 business-crud-page 内 section-card 间距,避免卡片紧贴,符合整体风格 - 规范 detail-content 内部元素间距及白卡底部边距,提升视觉一致性 - 调整 contract-manage select 组件列占比,优化表单布局 - 调整 customer-archive 弹窗间距,增强界面美观 - 全站弹窗新增底部操作栏固定与滚动内容区,提升弹窗交互体验 - port-terminal、railway-station 弹窗表单标签宽度调整及样式改进,提高表单对齐效果 - 统一多处弹窗及表单组件底部间距,确保全局风格一致 - port-terminal 弹窗取消分组白卡,恢复原有结构以满足用户需求
This commit is contained in:
@@ -176,6 +176,28 @@
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* 全站弹窗:底部操作栏浮动效果(参照 business/project-apply)
|
||||
* - body 超高时内部独立滚动,footer(取消/保存等按钮)始终固定在底部可见
|
||||
* - footer 加视觉底栏:白底 + 上边框 + 轻阴影,与主内容区分 */
|
||||
.el-dialog__body {
|
||||
max-height: calc(100vh - 200px);
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.el-dialog__footer {
|
||||
margin: 0;
|
||||
padding: 12px 20px;
|
||||
background: #fff;
|
||||
border-top: 1px solid var(--el-border-color-lighter, #ebeef5);
|
||||
//box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.04);
|
||||
border-radius: 0 0 var(--el-dialog-border-radius, 4px);
|
||||
|
||||
.el-button + .el-button {
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-dialog__title,
|
||||
.dialog-section-title {
|
||||
display: inline-flex;
|
||||
@@ -217,7 +239,7 @@
|
||||
// 1) 所有弹窗内容区统一灰底 + 8px 内边距(全站统一)
|
||||
.el-dialog__body {
|
||||
background-color: #f2f2f2;
|
||||
padding: 8px !important;
|
||||
padding: 12px !important;
|
||||
}
|
||||
|
||||
// Avue CRUD 弹窗:表单白卡 + 底部按钮区视觉合一(按钮在卡片内部)
|
||||
@@ -305,9 +327,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 4) 弹窗内表单项默认上下间距 20px(覆盖默认 18px / 22px,与 customer-archive 对齐)
|
||||
// 4) 弹窗内表单项默认上下间距 16px(覆盖默认 18px / 22px,与 customer-archive 对齐)
|
||||
.el-dialog .el-form-item {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
// 5) 通用分组白卡组件(<section-card>):标题融入卡头
|
||||
@@ -315,6 +337,7 @@
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 12px;
|
||||
overflow: hidden;
|
||||
|
||||
&:last-child {
|
||||
@@ -760,4 +783,8 @@
|
||||
|
||||
.avue-crud__dialog .avue-dialog__footer{
|
||||
border-top: 0 !important;
|
||||
margin-top: -30px !important;
|
||||
}
|
||||
.el-form-item__label {
|
||||
margin-left: 20px !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user