# 2026-08-07 工作日志 ## 修复车辆/船舶/司机管理「所属组织」列前导空格 - 症状:车辆管理列表截图中「所属组织」列值左侧有明显缩进空格。 - 根因:组织下拉选项构建时把带层级缩进(全角空格 `' '.repeat(level)`)的字符串同时作为 `label` 和 `value`,保存到后端后表格直接回显该值,导致前导空格。 - 改动: - `src/views/transportCapacity/vehicle.vue`、`ship.vue`、`driver.vue` - `flattenDeptOptions` / `formatDeptOptions`:`value` 改为无缩进的 `rawLabel`,`label` 仍保留缩进用于下拉层级展示。 - 表格增加 `#organizationName` 插槽,对 `row.organizationName` 去除前导半角/全角空白,兼容已入库的旧数据。 - `src/option/transportCapacity/transport-vehicle.js`、`transport-ship.js`、`driver.js` - 「所属组织」列增加 `slot: true`,使自定义插槽生效。 - 验证:通过 `git diff` 确认 6 个文件改动正确。 ## 调整司机管理到期筛选标签位置 - 需求:截图反馈司机管理页「全部 / 30天内到期 / 已到期」三个筛选标签放在搜索表单右侧,占位突兀,希望与搜索/重置按钮同排或放到更合适位置。 - 方案:参考 `business-crud-page.vue` 的 `#search-menu` 插槽,把筛选标签移到搜索菜单行(搜索/重置按钮同一排),标签居左、按钮居右。 - 改动: - `src/views/transportCapacity/driver.vue` - `#expireStatus-search` 插槽改为 `#search-menu` 插槽。 - `.driver-page__expiry-tags` 增加 `order: -1`、`margin-right: auto`、`min-width: 0`,移除 `width: 100%` 和不再需要的响应式媒体查询。 - `src/option/transportCapacity/driver.js` - 删除仅作为占位用的 `expireStatus` 隐藏搜索字段(`search: true`、`searchSpan: 6` 等)。 - 说明:筛选逻辑仍通过 `query.expireStatus` + `handleExpireChange` 工作,不受字段删除影响;车辆/船舶管理页有相同布局,如需统一可复用该改法。 - 验证:通过 `git diff` 确认改动正确。 ## 运输计划调度弹窗恢复左右分栏布局 - 需求:客户提供「计划详情」参考截图,要求调度弹窗改回「左侧基本信息卡 + 右侧收发货路线卡」的左右分栏布局。 - 改动:`src/views/business/components/business-crud-page.vue` - 模板:把基本信息与收发货路线重新包进 `business-crud-page__dispatch-summary` 双列容器;左侧 `section-card` 内恢复 3 列网格(客户/项目/合同编号),货物信息占 2 列、计划执行时间占 1 列、附件独占一行;右侧 `section-card` 内恢复左右排列的起点/终点(徽章+名称+地址+联系人),中间用方向虚线连接。 - 样式: - 外容器恢复 `grid-template-columns: minmax(0, 1.25fr) minmax(420px, 1fr)`,gap 16px,卡片等高拉伸。 - 基本信息网格恢复 3 列,列间距 16px、行间距 12px。 - 路线区恢复 `grid-template-columns: 1fr 56px 1fr`,徽章 32px,标题 16px,地址/联系人 13px,连接线 56px。 - 保留紧凑化后的字号/间距(标签 12px、值 14px),避免回到原先过松的状态。 - 验证:`npm run build` 成功。 ## 运输计划调度弹窗基本信息改为 2 列 - 需求:客户截图反馈左侧「基本信息」还嫌松,要求改为 2 列更紧凑。 - 改动:`src/views/business/components/business-crud-page.vue` - 模板:调整基本信息字段顺序为 客户/项目、合同编号/计划执行时间、货物信息(占满 2 列)、附件(占满 2 列)。 - 样式:`business-crud-page__dispatch-summary-grid` 从 `repeat(3, minmax(0, 1fr))` 改为 `repeat(2, minmax(0, 1fr))`,保持 gap 12px 16px。 - 验证:`npm run build` 成功。 ## 运输计划调度弹窗路线连接改为车辆图标 - 需求:客户希望把收发货路线中间的方向虚线换成车辆图标。 - 改动:`src/views/business/components/business-crud-page.vue` - 模板:把 `
` 替换为 `
`。 - 样式:删除原 `&__dispatch-route-line` 虚线箭头样式,新增 `&__dispatch-route-vehicle`,使用主色圆形背景、白色 `Van` 图标,尺寸 36×36px,居中与路线节点对齐。 - 验证:`npm run build` 成功。 ## 运输计划调度弹窗收发货路线视觉美化 - 需求:客户反馈右上角「收发货路线」卡片仍不够美观,要求继续优化。 - 改动:`src/views/business/components/business-crud-page.vue` - 样式: - 路线容器去掉 `padding-top`,改为 `align-items: center` 垂直居中。 - 起点/终点 item 改为 `align-items: center`,徽章从方角改为圆形,并加轻微阴影。 - 车辆图标改为白底 + 主色边框 + 主色 `Van` 图标,尺寸加大到 44×44px,两侧各延伸 20px 虚线,形成「路线」流动感。 - 城市名称限制单行并溢出省略,地址/联系人间距收紧、颜色变淡。 - 验证:`npm run build` 成功。 ## 通知公告 /desk/notice 操作列加宽 - 需求:客户截图反馈操作列中「查看、编辑、删除」三个文字链接被挤成两行,要求加宽。 - 改动:`src/views/desk/notice.vue` - 在 Avue CRUD option 中新增 `menuWidth: 220`,使操作列可在一行容纳三个操作链接;符合项目样式规范「三个操作按钮时宽度不小于 220px」。 ## 全仓表格操作列宽度统一(≤3 按钮统一 180) - 需求:客户提供新截图,要求所有操作按钮 ≤3 个的表格操作列统一宽度为 180;>3 个按钮保持 320。 - 核心改动: - `src/utils/table-menu.js`:`TABLE_MENU_WIDTH` 的 `default` 与 `three` 都从 160/220 统一改为 180,`four` 保持 320;`resolveTableMenuWidth` 逻辑不变。 - `src/main.js`:全局 `crudOption.menuWidth` 从 160 改为 180,覆盖未显式设置 menuWidth 的 Avue CRUD 页面。 - `src/views/desk/notice.vue`:`menuWidth` 从 220 改为 180。 - `src/option/business/process-config.js`:`menuWidth` 从 200 改为 180。 - `src/views/system/param.vue`:手写 el-table 操作列宽度从 220 改为 180。 - 批量替换:对 44 个显式设置 `menuWidth: 160` 的 `.vue` / `.js` / `const/*.js` 文件统一改为 180(含部分文件内多处)。 - 验证:`npm run build` 成功(exit code 0)。 ## 角色管理 /authority/role 操作列改 180 - 需求:用户明确要求把 /authority/role 页面操作列宽度设为 180(该页面此前设为 320,因含「查看/编辑/删除 + 权限设置」自定义菜单)。 - 改动:`src/views/authority/role.vue` - option 内联 `menuWidth: 320` 改为 `menuWidth: 180`。 ## 全站操作列按钮统一为链接(el-link)风格 - 需求:用户要求「操作栏里的按钮改成链接的方案,全站风格统一」,并先确认了对功能是否有影响。 - 调研结论(关键):全仓手写 el-table 操作列(10 个文件、约 28 列)与 53 个 avue-crud 自定义 `#menu` 插槽**已全部是 ``**,全库 `type="text"` 残留为 0;真正未链接化的只剩下 **Avue 内置 viewBtn/editBtn/delBtn**(渲染为 ``,包在 `div.avue-crud__menu` 内,且自带 `permission` 指令与 `rowView/rowEdit/rowDel` 事件)。 - 实施手法:采用「方案 A:纯 CSS 视觉对齐」(零功能影响、不动事件与权限,符合用户「不要影响功能」的诉求)。 - 改动:`src/styles/element-ui.scss` - 新增 `.avue-crud__menu > .el-button.is-text` 规则,把 Avue 内置行操作按钮外观对齐为 el-link:主色文字、无边框/无背景、hover 下划线 + 浅色、禁用态浅色无下划线、`height:auto / padding:0`(配合父级 `inline-flex; gap:8px` 与已存在的主色/间距覆盖规则)。 - 选择器仅命中行操作列 `.avue-crud__menu` 内的 `is-text` 按钮,不误伤顶部工具栏(`.avue-crud__header`)与弹窗按钮(`.avue-crud__dialog__menu`)。 - 注意:现有全局规则 `.avue-crud__menu .el-link` 会强制操作列内所有 el-link(含 `type="danger"` 的删除)显示为主色蓝。如需删除按钮保留红色告警,需单独调整该覆盖规则(本次未改,保持统一蓝)。 - 验证:`npm run build` 成功(exit code 0);构建日志中的 CSS `*` 告警来自第三方库压缩,与本次无关(历史既有)。 ## 操作列文字取消加粗(统一常规字重) - 需求:用户要求操作栏下的按钮字体都不要加粗,统一风格。 - 根因:Element Plus `el-link` 默认 `font-weight: var(--el-font-weight-primary)`(500 中等粗),导致操作列里的链接(查看/编辑/删除等)显示为加粗;而 Avue 内置 `is-text` 按钮此前已被规则设为 normal。 - 改动:`src/styles/element-ui.scss` - 在既有 `.avue-crud__menu .el-link, .el-table ... .cell:has(.el-link) .el-link` 统一规则中增加 `font-weight: normal;`((0,2,0) 优先级高于 el-link 自身 (0,1,0) 的默认字重,可覆盖)。 - 覆盖范围:Avue 行菜单内的 el-link + 任意含 el-link 的表格体单元格(手写操作列),一次统一全站操作列字重;Avue 内置 `is-text` 按钮与顶部工具栏/弹窗按钮字重保持原样不受影响。 - 验证:`npm run build` 成功(exit code 0)。 ## 全站表格省略文字 hover tooltip 提示统一 - 需求:用户截图反馈合同管理等页面中「所属项目」等列文字被省略,要求像 `/base/common-address` 一样,鼠标移上去显示完整提示;全站统一加,改完列出文件。 - 参考实现:`src/option/base/common-address.js` 中 Avue 列配置使用 `showOverflowTooltip: true`。 - 调研结论:全站表格可见列约 848 个(Avue)+ 424 个手写 ``,其中 801 个 Avue 列、268 个手写列未开启 tooltip。Element Plus 支持全局 `table: { showOverflowTooltip: true }` 配置,Avue 3.9.2 完整透传,可一行代码覆盖全站。 - 改动文件清单: - `src/main.js` - Element Plus 全局配置新增 `table: { showOverflowTooltip: true }`,一次性覆盖所有 Avue CRUD 与手写 el-table。 - Avue 全局 `crudOption` 新增 `showOverflowTooltip: true` 作为双保险,避免页面级 option 被错误覆盖时失效。 - `src/styles/element-ui.scss` - 新增 `.el-table .cell.avue-crud__menu, .el-table .el-table__body .cell.el-tooltip:has(> .el-link)` 规则,豁免操作列单元格的固定宽度与溢出隐藏,防止全局 tooltip 导致操作列内 el-link 换行后被裁切,保持原有 8px gap 与自动换行。 - `src/option/business/common.js` - 共享工厂函数 `createCrudOption` 新增 `showOverflowTooltip: true`,覆盖 business 模块通过该工厂生成的所有 CRUD option。 - 覆盖范围:全站所有表格可见文本列(含 Avue 与手写 el-table),`type="selection"` 选择列由 Element Plus 自动豁免;操作列通过 CSS 豁免不被影响。 - 验证:`npm run build` 成功(exit code 0);构建日志中 CSS `*` 告警来自第三方库压缩,与本次无关(历史既有)。 ## 修复运输计划 /business/transport-plan 详情页字段列对齐 - 现象:用户截图反馈「基本信息 / 收发货信息 / 其它信息」详情表格不平整,左侧一列 label 与右侧 value 错位、中间空 cell。 - 根因:`src/views/business/components/business-crud-page.vue` 的 `detailBox` 用 `` 渲染 `config.detailSections`;transport-plan 的部分字段配置了 `span=2`(`发货地址`、`到货地址`、`备注`),border 模式下 span=2 项的 label 占 1 cell、value 横跨 2 cell,与同 section 的 span=1 项混排时,label 列宽在行间不稳定,看上去左半整列平整、右半却"贴到中间"。 - 改动:`src/option/business/transport-plan.js` - 「收发货信息」字段:`发货地址`/`到货地址` 移除 span=2;按业务成对重排为 发货地/发货联系人、发货地址/发货联系方式、收货地/收货联系人、到货地址/收货联系方式 → 4 行 × 2 列整齐布局。 - 「其它信息」字段:`备注` 移除 span=2;保持 备注/更新人、更新时间/创建时间 → 2 行 × 2 列。 - 「基本信息」9 个字段本来全部 span=1,无需调整。 - 现有样式(`&__detail-content .section-card` 内 `:deep(.el-descriptions__label) { width:140px; ... }`)保证 label 列固定 140px 右对齐;`:deep(.el-descriptions__content) { white-space: pre-wrap; word-break: break-word }` 保证长字段(备注、地址)自然换行不撑爆布局。 - 验证:`npm run build` 成功(exit code 0)。 ## 修复 /system/dept 操作栏错位(链接竖排) - 现象:用户截图反馈机构管理页操作列「查看 / 编辑 / 删除 / 新增子项」竖排且偏右错位。 - 根因:Avue 自带默认样式 `.avue-crud .avue-crud__menu{display:block}`(特异性 0,2,0)与项目全局覆盖样式选择器完全相同;项目原规则虽带 `!important`,但在 dev 模式 CSS 注入时序或浏览器缓存旧 element-ui.scss 时,`.avue-crud__menu` 退化成 block,导致内部按钮/链接竖排。 - 修复: - `src/styles/element-ui.scss`:把 `.avue-crud .avue-crud__menu` 改为重复类名 `.avue-crud .avue-crud__menu.avue-crud__menu`(特异性升到 0,3,0),并新增 `width: 100% !important` 让操作列容器占满单元格、左对齐横排更稳。 - `src/views/system/dept.vue`:scoped 样式新增 `:deep(.avue-crud__menu)` 兜底(inline-flex + gap 8px + 子元素 inline-flex),双保险确保本页操作列横排。 - 验证:dev server 已热更新,curl 确认两处编译结果均含 `display: inline-flex !important`;构建需用户硬刷新浏览器清旧 CSS 缓存。 ## 客商档案 /vehicle/customer-archive 弹窗风格统一为 section-card - 需求:用户截图反馈弹窗有「双层灰色背景」,且「工商信息」等标题没有放到卡片里面;要求改成和 `/business/project-apply` 一致的白卡风格。 - 根因:原页面主表单使用 `.archive-form__group` 灰色容器,内部再包一层白色 `.el-row` 卡片,标题坐在灰色背景上,形成外层 dialog body 灰 + 分组灰的「双层灰」;客商材料、变更记录、评分材料、发票/邮寄信息也沿用旧的分节标题样式。 - 改动:`src/views/vehicle/customer-archive.vue` - 主表单 4 个分组改为 `` 全局白卡组件,删除外层「基本信息」大标题。 - 评分/联系人/收款/发票 4 个 Tab 内容改为 `` + `