- 将单一el-row拆分为工商信息、联系信息、财务/信用信息、其他信息四个分组 - 每个分组外层使用灰色背景块,内层字段区为白底卡片,提升视觉层次感 - 字段顺序重新调整,保留全部字段并优化布局,联系信息三项均分一行 - 新增.archive-form__group样式,定义背景色、圆角、内外边距及阴影效果 - 复用全局.dialog-section-title样式作为分组标题样式,保持风格统一 - 确保表单校验正常,vue/compiler-sfc解析无错误,标签闭合平衡 - 在项目长期记忆新增设计约定,明确弹窗字段分组的UI方案及理由
31 lines
2.7 KiB
Markdown
31 lines
2.7 KiB
Markdown
# 2026-08-05 工作记录
|
||
|
||
## 排查:改线上接口后前端"运行不了"(CORS 根因)
|
||
|
||
- 现象:用户将 `.env.development` 的 `VITE_APP_API` 改为 `http://172.16.203.228:8000/api`(直连线上/测试后端)后仍运行不了。
|
||
- 根因:Saber3 的 axios 配了 `withCredentials = true`(`src/axios.js:79`)。该后端(openresty + blade-gateway)对跨域请求返回 `Access-Control-Allow-Origin: *` 且 `Access-Control-Allow-Credentials: true`,浏览器规定 credentials 模式下 Allow-Origin 不能是 `*`,非法组合会被直接拒绝 → 所有接口失败。
|
||
- 之前用 `/api` 能跑是因为走 Vite 代理,浏览器请求同源 localhost:2888,不触发跨域。
|
||
- 已改动:
|
||
1. `.env.development` 的 `VITE_APP_API` 改回 `/api`,并加注释说明两种模式。
|
||
2. `vite.config.mjs` 的 `server.proxy['/api']` target 改为 `http://172.16.203.228:8000`,并去掉 `rewrite` 去掉 `/api` 的逻辑(保留 `/api` 前缀,对齐 openresty 期望路径)。
|
||
- 注意:改 `.env` / `vite.config.mjs` 后必须重启 `npm run dev`(Vite 启动时加载环境变量,运行中改动不会热更新)。
|
||
- 若确需直连绝对地址(如生产/部署):必须让后端 CORS 把 Allow-Origin 改为具体前端域名(blade-gateway 的 CorsConfig 用 `setAllowedOriginPatterns` 或显式域名),不可用 `*` 配合 credentials。
|
||
|
||
## 调整:货物类型导入失败原因展示格式
|
||
|
||
- 文件:`src/views/base/cargo-type.vue`
|
||
- 修改 `decorateCargoTypeFailDetail`:
|
||
- 移除「第N行:」前缀;
|
||
- 失败原因编号从 `A. B. C.` 改为 `1. 2. 3.`;
|
||
- 备注超长兜底提示也同步使用数字编号。
|
||
|
||
## UI 优化:客商档案弹窗「基本信息」分组(vehicle/customer-archive.vue)
|
||
|
||
- 背景:原弹窗「基本信息」是一整块 `el-row` 平铺 20 个字段,信息密度过高。
|
||
- 方案(与用户确认):采用「分区标题平铺 + 浅色背景块」而非嵌套卡片(契合 AGENTS.md 去卡片化哲学;全局 `.dialog-section-title` 已自带 4px 主色竖条)。
|
||
- 改动:
|
||
- 模板:将单一 `el-row` 拆分为 4 个 `.archive-form__group`:工商信息 / 联系信息(3项 span=8) / 财务·信用信息 / 其他信息(备注 span=24);字段顺序重组但全部保留,地址、备注保持 span=24。
|
||
- 样式:新增 `.archive-form__group`(#fafafa 背景、8px 圆角、16px/20px 内边距、组间距 16px),子标题复用 `.dialog-section-title`(14px/500)。
|
||
- 校验:@vue/compiler-sfc 解析 0 错误;标签闭合平衡。
|
||
- 注:此前讨论中提及的「Tab 内容加内边距」「材料区标题竖条」未纳入本次(材料区已用 dialog-section-title);如需可后续追加。
|