- 将全站 Avue CRUD 操作列宽度统一修改为 180px,替换原有不同宽度配置 - 修正部分页面菜单宽度从 160、220、250、300、350 等多值变为统一 180 - 新增全局样式,实现操作列内容左对齐,解决内置右对齐不统一问题 - 统一所有“删 除”按钮文本为“删除”,提升文案一致性 - 根据 cargo-type 参考,精简全站操作列宽度,提升界面紧凑度和一致性 - 说明风险:部分按钮较多页面可能出现换行或溢出,需单独处理
6.7 KiB
6.7 KiB
2026-07-31 工作记录
货物类型(/base/cargo-type)批量导入「全或无」改造
- 需求:批量导入时只要任一行报错,整批都不入库,并返回失败明细 Excel。用户在「事务 vs 校验」之间选了"全或无 + 推荐方案"。
- 结论(已落地):全量预校验 + 单事务兜底,而非纯事务或纯校验二选一。
- 后端仓库:
/Users/gxwebsoft/JAVA/tms-erp-api-ws(BladeX,本仓库 tms-erp-web-ws 是纯前端,无 Java)。 - 改动文件:
blade-service/blade-system/.../service/impl/CargoTypeServiceImpl.java(仅此一文件,未动 Controller/前端)。 - 实现要点:
importCargoType拆为两阶段:阶段一validateImportAll(只读,不写库)→ 任一失败直接返回失败明细、整批不入库;阶段二saveImportAll全部通过后才在@Transactional内统一写库(兜底防半截入库)。- 补上原缺失的校验:文件内编码全局去重、一级名称去重、二级(同上级)名称去重;二级父级解析同时支持 DB 与"文件内一级映射"(解决"单文件一级在前"场景,二级引用同文件的一级)。
- 原代码其实已是
@Transactional + setRollbackOnly,但"边校验边写库"且缺文件内去重/父子引用校验;本次重构成更干净的预校验优先。
- 前端无需改动:
src/views/base/cargo-type.vue+utils/import-excel.js已支持失败明细 Excel 下载与decorateCargoTypeFailDetail装饰。 - 验证:本环境无 maven,无法编译;已做静态核对(imports/方法/字段/括号完整,无 TransactionAspectSupport 残留)。需在本地
mvn -pl blade-service/blade-system compile确认。 - 遗留小问题(非本次引入,可选优化):后端二级编码前缀报错文案为"货物类型编码前2位必须与上级货物类型编码一致",而前端
CARGO_TYPE_FAIL_RULES匹配的是"二级编码前2位必须与上级货物类型编码一致",二者不完全一致,导致该错误前端不会追加规则说明(仍会显示原因)。可后续对齐文案。
cargo-type 分页隐藏「首页/上一页/下一页/尾页」
- 根因:页面有两套分页——有数据时用
avue-crud自带分页(默认 layouttotal, sizes, prev, pager, next, jumper,原生上一页/下一页来自这里);无数据时用共享组件<empty-pagination>(layout 写死同样带 prev/next)。「首页/尾页」按钮不是 Avue/EP 原生的,而是全局增强器src/utils/pagination.js的setupPaginationEnhancer()(main.js 第 98 行全局启用)扫描所有.el-pagination,在.btn-prev前插「首页」、.btn-next后插「尾页」。 - 关键机制:增强器只在存在
.btn-prev/.btn-next时才注入首页/尾页。因此去掉分页 layout 里的 prev/next,首页/尾页就不会被注入。 - 改动(仅
src/views/base/cargo-type.vue,未碰共享组件):①page数据加layout: 'total, sizes, pager, jumper'处理有数据状态;② 新增 scoped:deep(.avue-crud__pagination)规则隐藏.btn-prev/.btn-next/.erp-pagination-first/.erp-pagination-last,覆盖无数据时的 empty-pagination 状态。 - 注意:
empty-pagination被 16+ 页面共用,本次未改它的默认 layout,避免影响其它页面。如需其它页面也隐藏,应给该组件加layoutprop 而非改默认值。
全站分页统一隐藏「首页/上一页/下一页/尾页」(接上一条)
- 用户要求全站统一。逐页改不现实(empty-pagination 被 16+ 页共用,还有大量 avue-crud 自带分页),改为集中两处全局改动:
src/utils/pagination.js:删除全局增强器对「首页/尾页」按钮的注入(保留「跳转」);同步精简updatePaginationButtons(不再处理 first/last disabled)。src/styles/element-ui.scss:新增全局规则.el-pagination { .btn-prev, .btn-next { display: none !important } },统一隐藏原生「上一页/下一页」。
- 因此回退了 cargo-type.vue 之前的两处页面级改动(
page.layout与 scoped 隐藏样式),避免与全局方案两套机制并存;cargo-type 现由全局方案统一接管。 - 效果:全站所有 el-pagination(含 avue-crud 自带分页与 empty-pagination)均只保留「总条数/每页条数/页码/跳转」,首页/上一页/下一页/尾页全部隐藏;「跳转」按钮保留。
- 风险点:全局
display:none !important会影响所有分页,符合"全站统一"诉求;如后续某页面需恢复导航按钮,需针对该页用更高优先级样式覆盖或单独处理。
全站搜索按钮文案统一
- 文件:
src/lang/zh.js、src/lang/en.js - 改动:
tagsView.search:搜索→查询(中)/Search→Query(英)crud.filter.resetBtn:清空条件→重置
- 影响范围: 全站所有 Avue CRUD 搜索栏按钮自动生效(通过 i18n 全局配置)
- 排除: 地图搜索、日志清空等非 CRUD 场景的按钮文案保持不变
全站操作栏按钮隐藏图标
- 文件:
src/styles/element-ui.scss - 改动: 新增全局 CSS 规则
.avue-crud__menu .el-button--text i, .avue-crud__menu .el-button i { display: none !important } - 效果: 全站所有 Avue CRUD 操作列(查看/编辑/删除等)按钮前的图标统一隐藏,仅保留文字
- 方案选择: CSS 全局覆盖,无需逐个修改 option 配置文件
全站操作栏按钮紧凑间距
- 文件:
src/styles/element-ui.scss - 改动: 新增全局规则
.avue-crud__menu .el-button { margin-left: 4px; margin-right: 0; padding: 0 4px } - 效果: 全站 CRUD 操作列按钮统一为 4px 间距 + 4px 内边距,与 cargo-type 一致
全站操作列宽度统一为 160px
- 目标: 参考 cargo-type(menuWidth: 160)的紧凑效果,全站统一操作列宽度
- 改动: ①
src/main.js全局默认menuWidth由 220 改为 160;② 批量将 src 下 72 处 option/vue 里显式menuWidth: 数字统一替换为menuWidth: 160 - 影响范围: 全站所有 Avue CRUD 操作列(含自定义 menu 插槽列,menuWidth 仍控制该列宽度)
- 风险: 原部分页面操作按钮较多(如 tenant/customer-archive 等曾配 380~420),统一 160px 后若按钮数 > 3 可能出现换行/溢出;如某页溢出需单独放宽或精简按钮
全站操作列内容左对齐
- 文件:
src/styles/element-ui.scss - 原因: cargo-type 用自定义
#menu模板默认左对齐;其他页面用 Avue 内置菜单(viewBtn:true)默认右对齐 - 改动: 新增
.avue-crud .el-table td .cell.avue-crud__menu { text-align: left } - 效果: 全站操作列统一左对齐