From 3bb0fddcca056f79bc9d8a9241747cb44af40982 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com> Date: Fri, 14 Aug 2026 00:33:32 +0800 Subject: [PATCH] =?UTF-8?q?style(transportCapacity):=20=E8=B0=83=E6=95=B4?= =?UTF-8?q?=E5=88=B0=E6=9C=9F=E7=AD=9B=E9=80=89=E6=A0=87=E7=AD=BE=E4=BD=8D?= =?UTF-8?q?=E7=BD=AE=E5=92=8C=E6=A0=B7=E5=BC=8F=EF=BC=8C=E7=BB=9F=E4=B8=80?= =?UTF-8?q?=E6=A0=87=E7=AD=BE=E5=B1=95=E7=A4=BA=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - transportCapacity/driver、vehicle、ship 页的「全部/30天内到期/已到期」筛选标签改为靠右对齐 - 统一使用 #search-menu 插槽替代 #expireStatus-search，标签移至搜索按钮前 - 标签容器删除宽度限制，增加 order:-1 和 margin-right:12px，保证标签和按钮为一体 - transportCapacity/vehicle 和 ship 的 expireStatus 列 search 改为 false，避免多余输入框出现 - transportCapacity/vehicle、ship 的 searchIndex 提升至6，避免搜索条件折叠，标签默认展开 - 暂用样式更改保证标签与搜索按钮间距和垂直对齐 - temporary-credit-limit 弹窗新增 dialogCustomClass，实现弹窗label固定六字宽度并自动换行 - element-ui.scss 新增临时额度弹窗 label 样式，修改label宽度、换行、对齐，提升可读性 - 调整多处搜索表单内 label 宽度由160px变为88px，优化表单紧凑度 - 多处文本域的最小行数 minRows 统一由较高数值改为2，改善表单布局和输入体验 - 更新 vite.config.mjs 开发服务器端口及代理配置，切换至本地测试环境 - waybill-import-dialog.vue 中修正文本域 autosize 最小行数为2，更符合表单设计规范 - 修改业务页 contract-manage.vue 菜单宽度由245px调整至252px，优化界面布局 --- .workbuddy/memory/2026-08-13.md | 8 +++++ .workbuddy/memory/2026-08-14.md | 33 +++++++++++++++++++ src/main.js | 2 +- src/option/base/cargo-type.js | 4 +-- src/option/business/contract-manage.js | 1 + src/option/business/shipping-template.js | 4 +-- src/option/business/temporary-credit-limit.js | 2 ++ src/option/business/transport-plan.js | 6 ++-- src/option/business/waybill-manage.js | 10 +++--- src/option/system/user.js | 4 +-- src/option/tool/codesetting.js | 2 +- src/option/tool/formsetting.js | 2 +- .../transportCapacity/transport-ship.js | 4 +-- .../transportCapacity/transport-vehicle.js | 4 +-- src/option/vehicle/accident-record.js | 2 +- .../vehicle/annual-inspection-record.js | 2 +- src/option/vehicle/equipment-ledger.js | 2 +- src/option/vehicle/etc-record.js | 2 +- src/option/vehicle/other-expense-record.js | 2 +- src/option/vehicle/tire-replacement-record.js | 2 +- src/option/vehicle/violation-record.js | 2 +- src/styles/element-ui.scss | 25 +++++++++++--- src/views/authority/apiscope.vue | 2 +- src/views/authority/datascope.vue | 6 ++-- src/views/authority/ratelimit.vue | 6 ++-- src/views/authority/role.vue | 2 +- src/views/base/airport-master.vue | 2 +- src/views/base/port-terminal.vue | 2 +- src/views/base/region.vue | 2 +- .../components/waybill-import-dialog.vue | 2 +- src/views/business/contract-manage.vue | 2 +- src/views/resource/oss.vue | 2 +- src/views/resource/sms.vue | 2 +- src/views/system/post.vue | 2 +- src/views/system/tenantdatasource.vue | 4 +-- src/views/tool/datasource.vue | 4 +-- src/views/transportCapacity/driver.vue | 2 +- src/views/transportCapacity/ship.vue | 6 ++-- src/views/transportCapacity/vehicle.vue | 6 ++-- src/views/util/form.vue | 2 +- src/views/util/table.vue | 2 +- src/views/vehicle/maintenance-plan.vue | 4 +-- src/views/vehicle/maintenance-record.vue | 4 +-- vite.config.mjs | 26 +++++++-------- 44 files changed, 141 insertions(+), 76 deletions(-) create mode 100644 .workbuddy/memory/2026-08-14.md diff --git a/.workbuddy/memory/2026-08-13.md b/.workbuddy/memory/2026-08-13.md index ed21e44..324d77a 100644 --- a/.workbuddy/memory/2026-08-13.md +++ b/.workbuddy/memory/2026-08-13.md @@ -93,3 +93,11 @@ 1. `.dialog-section-title > span { line-height: 1 }` 收紧标题文字行高。 2. `&__section-actions .el-link { display:inline-flex; align-items:center; line-height:1 }` 让链接严格垂直居中。 - 校验：两处使用 `.dialog-section-title--action.business-crud-page__goods-title` + `__section-actions` 的货物信息标题都会生效。 + +## transportCapacity/driver.vue 到期筛选标签靠右对齐 + +- 需求：将搜索栏下方「全部/30天内到期/已到期」筛选标签靠右对齐，放到搜索按钮前面并保留间距。 +- 改动（src/views/transportCapacity/driver.vue）： + - `.driver-page__expiry-tags` 的 `margin-right: auto` 改为 `margin-right: 12px`。 + - 保留 `order: -1` 使标签在 Flex 排列中位于搜索按钮之前；全局 `.avue-crud__search .avue-form__menu` 已设 `justify-content: flex-end`，删除 `auto` 后标签与按钮作为一个整体靠右排列，不再分居两端。 +- 间距：标签内部 `gap: 8px` 保留；标签与搜索按钮之间 12px。 diff --git a/.workbuddy/memory/2026-08-14.md b/.workbuddy/memory/2026-08-14.md new file mode 100644 index 0000000..c73b5db --- /dev/null +++ b/.workbuddy/memory/2026-08-14.md @@ -0,0 +1,33 @@ +# 2026-08-14 工作记录 + +## temporary-credit-limit 弹窗 label 固定 6 汉字宽度并换行 + +- 需求：用户反馈 `/business/temporary-credit-limit` 新增弹窗中 label「已使用项目资金使用额度（万元）」过宽（227px），希望超过 6 个汉字就换行。 +- 宽度来源： + - `src/option/business/common.js` 的 `createCrudOption` 中 `labelWidth: 'auto'`； + - Avue 会按当前弹窗内最长 label 自动计算宽度，故出现 227px。 + - `src/styles/element-ui.scss` 第 164 行 `.el-dialog .el-form-item__label { white-space: nowrap }` 阻止换行。 +- 改动： + 1. `src/option/business/temporary-credit-limit.js`：option 增加 `dialogCustomClass: 'temporary-credit-limit-dialog'`。 + 2. `src/styles/element-ui.scss`：新增 `.temporary-credit-limit-dialog .el-form-item__label` 规则，固定宽度 `calc(6em + 24px)`，并设置 `white-space: normal; word-break: break-all; overflow-wrap: anywhere; line-height: 18px`，实现超长 label 自动换行。 + 3. 同时给 `.temporary-credit-limit-dialog .el-form-item { align-items: center; }` 保持垂直居中。 +- 参考：同文件已有 `.avue-dialog--common-route` 使用相同 6em label 宽度方案。 + +## transportCapacity/ship 到期筛选标签默认展开并靠前 + +- 需求：用户反馈 `/transportCapacity/ship` 页面搜索栏的「全部/30天内到期/已到期」标签需要点击「展开」后才显示，希望默认直接显示；且位置要位于搜索按钮前面。 +- 原因：`src/option/transportCapacity/transport-ship.js` 中 `searchIndex: 4`，默认只展示前 4 个搜索条件，而 `expireStatus` 的 `searchOrder: 0`（Avue 越大越靠前）排在第 6 位，因此被折叠到第二行。 +- 改动： + - `src/option/transportCapacity/transport-ship.js`：`searchIndex: 4 → 6`，让全部 6 个搜索条件默认展开，标签无需再点展开即可看到。 + - 由于 `expireStatus` 排在最后，展开后它自然位于第二行末尾、搜索按钮之前，满足"移到搜索按钮前面"的要求。 + +## transportCapacity/vehicle 与 ship 到期筛选标签重构（对齐 driver 的 #search-menu 方案） + +- 需求：用户希望 `/transportCapacity/vehicle` 和 `/transportCapacity/ship` 的「全部/30天内到期/已到期」标签与 driver 页一致：① 不展开就直接显示；② 移到搜索按钮前面并保留间距。 +- 关键差异（排查发现）：driver 用 `#search-menu` 插槽把标签渲染在**按钮所在行**；而 vehicle/ship 之前用 `#expireStatus-search` 列插槽，标签被渲染进**搜索条件网格**（位置不对）。 +- 改动（两页同样处理）： + 1. `.vue`：`