21c4168867
- 在通用详情描述和运费信息描述表中添加 label-width="140px",统一 label 列宽 - 调整收发货信息字段顺序,将联系人和联系方式置于地址之前 - 解决 span 行固定布局下 label 列宽不一致的问题 - 保证表格首行的两列 label 宽度固定,提升视觉一致性
2.6 KiB
2.6 KiB
2026-08-24
发货模板查看弹窗白底卡片统一化
- 问题:shipping-template 查看弹窗仍走 Avue 默认 rowView,各板块无白底卡片分隔。
- 改动:
src/option/business/shipping-template.js:config 新增detailButton: true、detailButtonIgnoreDraftStatus: true,并配置detailSections(模板信息/基本信息/收发货信息),每板块两列 el-descriptions,备注与地址占整行。src/views/business/components/business-crud-page.vue:在 detailBox 通用详情模板中,货物信息卡片后新增运费信息 section-card,区分公路(单价/数量合计/运费/运费合计/其他运费合计/币种)与非公路(运费/数量合计/其他运费合计/币种)展示。
- 样式:
&__detail-content已统一gap: 12px,section-card 间距即为 12px;新增&__freight-descriptions单位/币种辅助色。 - 验证:
npm run build通过。
发货模板查看弹窗 label 宽度统一
- 问题:详情弹窗各 section 的 el-descriptions 按内容自动列宽,导致「收发货信息」板块含 6 字标签(发货联系方式/收货联系方式)时 label 列比其他板块(4 字标签)更宽,视觉不一致。原 CSS
.el-descriptions__label{width:140px}在含 span 行的 fixed 布局下未能可靠等宽。 - 改动:
src/views/business/components/business-crud-page.vue在通用详情描述(line ~3109)与运费信息两张描述表(road / 非 road)上加label-width="140px"。src/option/business/shipping-template.js:将「收发货信息」字段顺序调整为联系人/联系方式在前、地址整行在后(非 span 行置于首行,让table-layout: fixed能在首行正确建立两列 label 宽度)。
- 验证:
npm run build通过。
全站业务状态标签文字化(调度状态/审批状态)
- 新增全局
.status-text工具类(src/styles/element-ui.scss末尾):去掉el-tag背景/边框,保留彩色文字 +currentColor圆点。 - 全站所有业务状态
el-tag统一加class="status-text":business-crud-page(#status/#businessStatus/#approvalStatus 插槽 + 运输计划详情头 + 运单详情头 + 调度弹窗头)、master-order 系列 businessStatus、loading-manage 详情弹窗、结算三处 approvalStatus、process-config 流程状态。 - 已通过 dev (localhost:2889) HMR 生效,刷新即可查看。调度状态(businessStatus)全站视觉已统一为"文字 + 颜色"。
credit-score-quantification.vue状态列(#status 插槽,statusMap: 正常/停用/草稿)的 el-tag 也加.status-text统一。