diff --git a/.workbuddy/memory/2026-08-14.md b/.workbuddy/memory/2026-08-14.md index 46bd283..80d5bc4 100644 --- a/.workbuddy/memory/2026-08-14.md +++ b/.workbuddy/memory/2026-08-14.md @@ -3,6 +3,12 @@ ## temporary-credit-limit 弹窗 label 固定 6 汉字宽度并换行 - 需求：用户反馈 `/business/temporary-credit-limit` 新增弹窗中 label「已使用项目资金使用额度（万元）」过宽（227px），希望超过 6 个汉字就换行。 + +## loading-manage 搜索栏 label 宽度 160→88 + +- 用户要求把 `/business/loading-manage` 页面搜索栏所有 label 宽度从 160px 改为 88px。 +- 改动：`src/views/business/loading-manage.vue` 第 4 行 ``。 +- 注意事项：AGENTS.md 4.4 节规范"搜索组件 label 宽度统一不小于 160px"，本次按用户指令执行但与项目规范冲突；如后续要恢复规范或全站统一，需要回滚。 - 宽度来源： - `src/option/business/common.js` 的 `createCrudOption` 中 `labelWidth: 'auto'`； - Avue 会按当前弹窗内最长 label 自动计算宽度，故出现 227px。 @@ -65,14 +71,14 @@ - 注意：class 唯一，仅作用于 shipping-template（business-crud-page 被多页共用，但其余页 option 未设该 class）；弹窗 `append-to-body`，故样式必须放全局（element-ui.scss）而非组件 scoped 样式。 - 验证：dev server(2889) HMR 自动生效；刷新后重开「新增」即可见效果（未跑全量 build，改动为纯 CSS + option 属性）。 -## transport-plan 新增/编辑弹窗封顶 72vh（对齐 customer-archive） +## transport-plan 新增/编辑弹窗固定 72vh（对齐 customer-archive 视觉） -- 需求：用户要求 `/business/transport-plan` 新增/编辑弹窗高度"封顶 72vh"，与 `/vehicle/customer-archive` 一致。 +- 需求：用户要求 `/business/transport-plan` 新增/编辑弹窗高度 72vh，与 `/vehicle/customer-archive` 视觉一致。 - 排查发现：上次给 shipping-template 加的 `.shipping-template-dialog` 全局 CSS 规则**未持久化**（option 钩子 `dialogCustomClass:'shipping-template-dialog'` 还在，但 `element-ui.scss` 里对应规则丢失），即 shipping-template 弹窗样式实际一直未生效。本次一并补回。 - 改动： 1. `src/option/business/transport-plan.js`：补 `dialogCustomClass:'transport-plan-dialog'`（option 已有 `dialogWidth:'96%'`、`dialogTop:'4vh'`）。 2. `src/styles/element-ui.scss`： - 补回 `.shipping-template-dialog` 规则（弹窗体 `height: calc(100vh - 4vh - 24px)` 占满视口 + flex 列布局；body `max-height:none !important; overflow-y:auto`；`.avue-dialog__footer { position:sticky; bottom:0; background:#fff }` 贴底）。 - - 新增 `.transport-plan-dialog` 规则（与 shipping-template 同结构，但弹窗体用 `max-height:72vh` **封顶**而非占满整屏，内容少时随内容变矮、内容多时窗内滚动；footer 同样 sticky 贴底）。 + - 新增 `.transport-plan-dialog` 规则（弹窗体用 `height:72vh` **固定**高度，内容少时 body 下方留白、内容多时窗内滚动；footer 同样 sticky 贴底）。 - 关键技术点：Avue 内置弹窗 footer 的真实 class 是 `.avue-dialog__footer`，且**渲染在 `.el-dialog__body` 内部**；贴底必须用 `position: sticky; bottom: 0`（flex `margin-top:auto` 在滚动容器内仍会随内容滚走，无效）。这与手写 el-dialog（footer 在 body 外、class 为 `.el-dialog__footer`）不同。 -- 验证：dev server(2889) HMR 自动生效；刷新后重开「新增」即可见（弹窗封顶 72vh、底部"提交/取消"常驻可见）。 +- 验证：dev server(2889) HMR 自动生效；刷新后重开「新增」即可见（弹窗固定 72vh、底部"提交/取消"常驻可见）。 diff --git a/.workbuddy/memory/MEMORY.md b/.workbuddy/memory/MEMORY.md index 02793e7..9b44b7c 100644 --- a/.workbuddy/memory/MEMORY.md +++ b/.workbuddy/memory/MEMORY.md @@ -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**（横放） diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss index 10f6b70..a2d77eb 100644 --- a/src/styles/element-ui.scss +++ b/src/styles/element-ui.scss @@ -247,7 +247,7 @@ background: #fff; border-radius: 6px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); - padding: 24px; // 加大内边距，与 customer-archive 对齐 + padding: 8px 16px 4px; // 加大内边距，与 customer-archive 对齐 margin-bottom: 0; // 与下方 footer 无缝衔接 } @@ -487,8 +487,8 @@ background: #fff; } -// 运输计划新增/编辑弹窗：参照 vehicle/customer-archive，弹窗体封顶 72vh， -// 内容较少时弹窗随内容变矮，内容超出 72vh 时窗内滚动； +// 运输计划新增/编辑弹窗：参照 vehicle/customer-archive，弹窗体固定 72vh， +// 内容较少时下方留白，内容超出 72vh 时窗内滚动； // 底部操作栏（avue 内置 footer，渲染在 body 内部）sticky 贴底始终可见 .transport-plan-dialog.el-dialog { margin-top: 4vh !important; diff --git a/src/views/business/loading-manage.vue b/src/views/business/loading-manage.vue index f1425f7..e9f7527 100644 --- a/src/views/business/loading-manage.vue +++ b/src/views/business/loading-manage.vue @@ -1,7 +1,7 @@