diff --git a/.workbuddy/memory/2026-07-31.md b/.workbuddy/memory/2026-07-31.md index 46bc476..5dedb41 100644 --- a/.workbuddy/memory/2026-07-31.md +++ b/.workbuddy/memory/2026-07-31.md @@ -106,3 +106,12 @@ 3. scoped 样式新增 `.top-user__trigger`(inline-flex / padding 4px 8px / hover 浅灰背景 rgba(0,0,0,0.04)),并把 `.top-bar__img` 自身 `margin` 改为 `0 5px 0 0` 配合新容器。 - **效果**: 鼠标悬停在头像或姓名任一处都会展开下拉;保留 `:hide-on-click="false"`(菜单内点击不收起,el-tooltip 等仍可交互)。 - **注意**: 若用户后续希望「hover 触发」仅作用于头像、不影响姓名点击行为,需把姓名部分移出 el-dropdown 触发区;当前实现是统一行为。 + +## 全站 avue-crud 弹窗内部滚动高度统一 + +- **需求**:/business/process-config 与 /base/cargo-type 表单弹窗滚动高度不一致(process-config 用 dialogWidth:'96%'+dialogTop:'10px' 且内容很长被撑爆;cargo-type 用 dialogWidth:760 窄窗),要求全站统一。 +- **关键结论**:@smallwei/avue 3.9.2 的 avue-crud **没有 `dialogHeight` 属性**(源码 avue.js 中无此字符串;dialogTop 默认值为 "0")。逐个 option 设 dialogHeight 不可行,故延续本项目「全局 CSS 统一」范式(见上「全站操作栏按钮」等先例)。 +- **改动文件**:`src/styles/element-ui.scss`(全局生效,被 common.scss 通过 `@use './element-ui.scss'` 引入) +- **新增规则**:`.avue-crud__dialog .el-dialog__body { max-height: calc(100vh - 200px); overflow-y: auto; }` +- **效果**:全站所有 Avue CRUD 弹窗(含 process-config、cargo-type)的 body 在 `calc(100vh - 200px)` 内滚动,内容超长时在窗内滚动而非撑爆整窗;矮弹窗不受影响(max-height 仅为上限)。 +- **验证**:已 `pnpm build` 后台运行验证全站编译。 diff --git a/src/styles/common.scss b/src/styles/common.scss index 92d2c85..edc9b68 100644 --- a/src/styles/common.scss +++ b/src/styles/common.scss @@ -119,8 +119,8 @@ a { flex: 1; overflow-y: auto; overflow-x: hidden; - margin-bottom: 10px; - padding: 8px; + margin-bottom: 6px; + padding: 12px; } .avue-view { diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss index 9f31a32..4453f4a 100644 --- a/src/styles/element-ui.scss +++ b/src/styles/element-ui.scss @@ -145,6 +145,7 @@ } .avue-crud__search { + margin-top: 4px; margin-bottom: 8px; } @@ -219,6 +220,13 @@ order: 2; } +// 统一 avue-crud 弹窗内部可滚动高度:内容超出时在窗内滚动,避免弹窗被整体撑爆 +// (@smallwei/avue 3.9.2 无 dialogHeight 属性,故用全局样式统一所有 CRUD 弹窗) +.avue-crud__dialog .el-dialog__body { + max-height: calc(100vh - 200px); + overflow-y: auto; +} + // 统一表格线条颜色 .el-table { --el-table-border-color: #eff1f7;