gxwebsoft
4d5b99da82
- 合同变更页「其它附件」上传按钮样式调整，与变更材料区按钮统一 - 新增分区标题必填星号样式，改用 ::after 避免冲突 - 变更页 load() 强制清空表单关键字段，避免带入旧数据 - 实现 mergeChangeAttachments() 合并上次变更附件，去重并格式化大小 - 合同变更记录表格新增「变更内容」列，支持单行摘要显示与悬浮全量提示 - 操作列由单「流程」改为「详情 + 流程」按钮，详情文字统一 - 变更记录值格式化增强，支持方案名、支付比例、结算规则等摘要展示 - buildDetailChangeRecordRows 过滤条件更新，前后均为空时跳过展示 - 车辆认证审核弹窗样式及结构重构，使用 section-card 白卡分组，内容补全证件图片区 - 证件图片实现只读大图展示，复用全局样式，无需新增规则 - label 单位统一为中文全角括号，提升界面一致性 - 新增长期有效显示逻辑，避免日期未填「-」与长期有效混淆 - 删除无用计算属性 auditDetailItems，改用简洁 auditValue 方法返回展示值 - 全站弹窗标题统一增加 4px 主色竖条，符合设计规范，且对无标题弹窗进行排除处理 - 客户端临时额度申请期限字段拆分为两个独立字段，清晰明了 - 统一合同变更页变更原因必填标识及上传按钮样式 - 修正 EP 表单项标签高度和对齐，完善星号方案兼容性设计
40 lines
5.6 KiB
Markdown
40 lines
5.6 KiB
Markdown
|
||
## 必填星号与 label 首行齐平（全局）
|
||
- 根因：`element-ui.scss` 中 `.el-form-item--label-right .el-form-item__label { align-items:center }` 使 inline-flex label 的星号 `::before`（独立 flex 子项）在多行折行时被垂直居中。
|
||
- 修复：label 改 `align-self:center`（整体仍随行垂直居中）+ `align-items:flex-start`（星号/文字首行齐平），覆盖 label-right/left/top 三种位置；旧 inline-block 注释已修正。
|
||
- 影响页面：project-apply 独立表单页等所有多行 label 场景（弹窗内 `white-space:nowrap` 不受影响）。
|
||
|
||
## 必填星号首行对齐：改用 align-items: normal（stretch 方案）
|
||
- 最终写法（`src/styles/element-ui.scss`）：`.is-required .el-form-item__label { align-self:center; align-items:normal; }` + `::before { display:inline-block; height:auto; line-height:inherit; margin-right:4px }`。
|
||
- 原理：stretch 让星号盒子在「换行时」被拉伸到 label 全高、内容从顶部排布 → 贴首行；单行时盒子=一行高，视觉不变（比 flex-start 更贴合「只换行才生效」）。
|
||
- 前提：::before 高度必须 auto 且继承行高；label 不能是 固定 height + 等高 line-height，否则退化成居中，需 JS 判行数加 class。
|
||
|
||
## 合同变更页（contract-manage-change.vue）
|
||
- 「其它附件」上传按钮改为 `type="primary" plain icon="el-icon-upload"`，与「变更材料」区 vehicle-attachment-upload 内置按钮一致。
|
||
- 分区标题必填星号：`.dialog-section-title.is-required::after { content:'*'; color:#f56c6c }`（`::before` 已被蓝色竖条占用，星号走 `::after`）。
|
||
- 再次变更逻辑：`load()` 里 form 强制重置 `changeContent/changeReason/changeAttachmentsJson = ''`、`changeMaterials = []`（不带上一次内容）；新增 `mergeChangeAttachments()` 把上一次的 `changeAttachmentsJson` 归集进 `attachments`（其它附件），按 url/名去重，数字 size 转格式化文本，提交时随 attachmentsJson 持久化。
|
||
|
||
## 合同变更记录对齐客商变更记录（contract-manage.vue）
|
||
- 编辑页与详情弹窗的两处「变更记录」表格新增「变更内容」列：`formatContractChangeContent(row)` 复用 `buildDetailChangeRecordRows` 生成「字段：变更前：x → 变更后：y」摘要，单行省略 + `el-tooltip` 全量悬浮（样式 `.contract-change-record-content-cell/-tooltip` 照搬客商 `change-record-content-*`）。
|
||
- 编辑页操作列由单个「流程」改为「详情 + 流程」（`openDetailChangeRecord` + `openFlow`，宽度 120→150）；详情弹窗表格「查看详情」改「详情」与客商一致。
|
||
- 值格式化增强：`billingPlanJson`→方案名（默认）列表、`paymentRatioJson`→「第N笔 xx%」、`settlementRuleJson/preSettlementConfigJson/formalSettlementConfigJson`→可读摘要（自动生成开关/结算类型/周期类型/截单日/周期天数，含预结算+正式结算双段）。
|
||
- `buildDetailChangeRecordRows` 过滤条件补「前后都为空则跳过」（原来只比 JSON 字符串，'' 与 null 会漏）。
|
||
|
||
## 星号方案补丁（关键）
|
||
- EP 的 `.el-form-item__label` 写死 `height:32px; line-height:32px`（项目只覆盖了 line-height:14px），导致 stretch 方案文字顶到 32px 盒子顶部、单行不居中。
|
||
- 修复：`.is-required .el-form-item__label { height:auto; align-self:center; align-items:normal }`——height:auto 收缩到内容高 + align-self:center 行内居中 + normal(stretch) 仅换行时星号贴首行。
|
||
|
||
## 车辆认证审核弹窗重构（transportCapacity/vehicle.vue）
|
||
- 背景：用户反馈「样式不统一、内容不全」。根因是审核弹窗用 `<el-descriptions :column="3" border>`（大白表 + 居中 label），与同页编辑弹窗的 `<section-card>` 白卡分组风格不一致。
|
||
- 改造：弹窗主体改为 4 个 `section-card` 分组 —— 基础信息 / 尺寸重量 / 证件信息 / 证件图片；内部 `el-form label-position="right" label-width="auto"` + `el-row/el-col`（3 列 `:span="8"`，所属组织与备注占 `:span="24"`）。
|
||
- 内容补全：新增「证件图片」分组，6 张证件照用 `<image-upload-field readonly large class-prefix="vehicle">` 只读展示（可点击放大）；证件图片尺寸 240×151 复用已有全局 `:deep(.vehicle-uploader--large)` 规则，无需新写。
|
||
- label 单位统一为中文全角括号：`外廓长度（毫米）` / `核定载质量（KG）`（原为半角 `外廓长度(mm)`）。
|
||
- 方法重构：`formatAuditValue(item)` → `auditValue(prop)`，签名更简洁；新增 longTermMap，对 drivingLicenseEndDate / roadTransportCertEndDate / annualReviewEndDate / compulsoryScrapDate 在勾选长期有效时返回「长期有效」，避免与未填写的「-」混淆（与列表页 formatEndDate 行为一致）。
|
||
- 删除已无引用的 `auditDetailItems` computed。
|
||
|
||
## 全站弹窗标题补 4px 主色竖条（全局 element-ui.scss）
|
||
- 发现：`.el-dialog__title` 全局只配了 `inline-flex + gap:8px`，**没有竖条**（竖条此前只在 `.dialog-section-title::before`），导致全站 el-dialog 标题都不带竖条，不符合 AGENTS.md 4.8。
|
||
- 修复：新增 `.el-dialog__title:not(:empty)::before { width:4px; height:16px; border-radius:2px; background:var(--el-color-primary) }`。
|
||
- 注意：必须加 `:not(:empty)`，否则无标题弹窗会出现孤立蓝条。
|
||
- customer-archive.vue 评分详情弹窗：将「临时额度申请使用期限」区间行（span=12 + 至 连接）拆分为两个 span=6 独立字段「临时申请额度有效期起 / 止」，字段名 tempCreditStartDate/End 不变，删除废弃样式 .score-detail-form__range。
|