fix(loading-manage): 调整搜索栏标签宽度至88px
- 将 `/business/loading-manage` 页面搜索栏所有 label 宽度由160px改为88px - 修改 `src/views/business/loading-manage.vue` 第4行 `<el-form>` 的 `label-width` 属性值 - 该改动违反 AGENTS.md 4.4 节规范,后续如需恢复需回滚 fix(transport-plan): 修复新增/编辑弹窗高度为固定72vh - 补全并恢复 `.shipping-template-dialog` 全局CSS规则,解决样式未生效问题 - 新增 `.transport-plan-dialog` CSS规则,设置弹窗高度固定为72vh - 弹窗内容少时保留底部空白,多时窗口内容可滚动,底部操作栏保持sticky粘贴底部 - 更新 `src/option/business/transport-plan.js`,补 `dialogCustomClass:'transport-plan-dialog'` - `src/styles/element-ui.scss` 调整内边距与视觉对齐 - **补充说明**:Avue内置弹窗footer为`.avue-dialog__footer`且位于`.el-dialog__body`内,必须用`position: sticky; bottom: 0`实现底部固定效果
This commit is contained in:
@@ -32,6 +32,10 @@
|
||||
- `.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,.04); border-radius:0 0 var(--el-dialog-border-radius,4px); .el-button+.el-button{margin-left:8px} }` —— 视觉底栏(白底+上边框+轻阴影),与主内容区分。
|
||||
- **注意**:`.el-dialog__body` 的 `max-height` 会作用于所有弹窗(含纯展示/表格弹窗),无 footer 的弹窗不受影响;project-apply 自身 `.project-apply-dialog .el-dialog__body{76vh}` 特异性更高仍优先。如需让某弹窗豁免,加更具体 class 覆盖即可。
|
||||
- **Avue 内置 CRUD 弹窗的 footer 真实 class(重要,易踩坑)**:Avue 内置弹窗的"提交/取消"按钮 class 是 `.avue-dialog__footer`(**不是** `.el-dialog__footer`),且**渲染在 `.el-dialog__body` 内部**、随 body 滚动会滚出视口。要让它像手写 `#footer` 那样始终贴底,必须针对 `.avue-dialog__footer` 用 `position: sticky; bottom: 0; flex: none; background: #fff`(配合 body `flex` 列布局 + `overflow-y:auto`)。手写 `el-dialog` 的 footer 才是 `.el-dialog__footer` 且在 body 外、天然可见。典型落地见 `shipping-template-dialog` / `transport-plan-dialog` 两条全局规则。
|
||||
- **弹窗高度链分层(重要,易混淆)**:
|
||||
- `.avue-dialog { max-height: calc(100% - 200px); min-height: 176px; display: flex; flex-direction: column; ... }` —— 这是 **Avue 库自身内置**(src/ 与 node_modules 源码都搜不到出处),作用在弹窗容器外层,控制整体高度上限(视口减去 200px 安全区);项目改不动根,只能用 `!important`/更高特异性覆盖。
|
||||
- `.avue-crud__dialog .el-dialog__body { max-height: calc(100vh - 200px); overflow-y: auto; }` —— 见 `src/styles/element-ui.scss` 451-457 行,作用于 avue 内置 CRUD 弹窗 body,让内容超出时 body 内滚动(注意是 **100vh**,且仅作用于 `.avue-crud__dialog` 限定范围内)。
|
||||
- 特定页面专项弹窗(如 `shipping-template-dialog` / `transport-plan-dialog`)的 `.el-dialog` 自身用 `margin-top:4vh !important; height/max-height: calc(100vh - 4vh - 24px) 或 72vh; display: flex; flex-direction: column` 重新分配高度,并配合 `.el-dialog__header { flex:none }` / `.el-dialog__body { flex:1 1 auto; min-height:0; overflow-y:auto; max-height:none !important }` / `.avue-dialog__footer { position:sticky; bottom:0; flex:none; background:#fff }` 三段 flex 分摊。**改 shipping-template 这类弹窗尺寸,只改这些 section-card 周边规则即可,不要动 body 内的 `max-height`**。
|
||||
|
||||
### 上传证件区域尺寸规范(transportCapacity 模块强制)
|
||||
- **比例**:中国二代身份证标准尺寸 85.6 × 53.98 mm → 宽:高 = **1.586 : 1**(横放)
|
||||
|
||||
Reference in New Issue
Block a user