refactor(vehicle): 优化customer-archive弹窗结构与样式
- 使用<section-card>替换旧版灰底分组块与内层白卡,统一表单分组样式 - 删除冗余的基本信息大标题,减少嵌套层级 - 将客商材料和变更记录区域改用<section-card>,操作按钮通过插槽放置卡头右侧 - 清理无效的scoped样式,简化样式管理 - 统一弹窗内部灰底背景并增加16px内边距,与project-apply保持一致 - 确认vue文件与sass编译无误,保证改动稳定性
This commit is contained in:
@@ -15,3 +15,11 @@
|
||||
- 应用落地:business 模块自定义弹窗——`common-route.vue` 的「选择常用地址」弹窗用 section-card 包成「查询条件/常用地址」两组;`loading-manage.vue` 主弹窗 6 个分区全部改用 `<section-card>`;`common-cargo.vue` 导入弹窗经全局 `.el-dialog .avue-form` 规则自动获得白卡。`project-apply.vue` 本身作为参照未改(其 scoped 样式已符合,全局灰底与其一致)。
|
||||
- 验证:`vite build` 失败为仓库既有问题(`waybill-import-dialog.vue` 引入的 `xlsx` 依赖缺失),与本次改动无关;改用 `@vue/compiler-sfc` 编译三个改动 .vue(均 OK)+ sass 编译 `element-ui.scss`(OK)。
|
||||
- 注意:其他模块的**自定义弹窗**需按同样方式用 `<section-card>` 包裹各组(灰底已由全局规则自动生效);如需继续推进其余模块可照此模式批量处理。
|
||||
|
||||
## 继续推广:vehicle/customer-archive.vue 弹窗
|
||||
- 用户反馈 `/vehicle/customer-archive` 新增客商档案弹窗需与 `/business/project-apply` 一致。
|
||||
- 已将该页主弹窗内的表单分组由旧版「灰底分组块 + 内层白卡 + 标题在卡内」全部替换为 `<section-card>`:
|
||||
- 工商信息 / 联系信息 / 财务/信用信息 / 其他信息 四个分组改为 section-card;删除外层浮于灰底的「基本信息」大标题(分组已足够清晰,避免嵌套)。
|
||||
- 客商材料、变更记录两个非表单分区也改用 `<section-card>`,其中客商材料的操作按钮通过 `#extra` 插槽放在卡头右侧。
|
||||
- 清理了失效的 `.archive-form__group`、`.customer-material-section`、`.change-record-section`、`.section-title` 等 scoped 样式。
|
||||
- 验证:`@vue/compiler-sfc` 编译 `customer-archive.vue` OK;sass 编译 `element-ui.scss` OK;section-card 标签开合平衡。
|
||||
|
||||
Reference in New Issue
Block a user