diff --git a/.workbuddy/memory/2026-09-09.md b/.workbuddy/memory/2026-09-09.md new file mode 100644 index 0000000..7a11bee --- /dev/null +++ b/.workbuddy/memory/2026-09-09.md @@ -0,0 +1,5 @@ + +## 必填星号与 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` 不受影响)。 diff --git a/src/styles/element-ui.scss b/src/styles/element-ui.scss index e5439c6..e826a61 100644 --- a/src/styles/element-ui.scss +++ b/src/styles/element-ui.scss @@ -1047,23 +1047,29 @@ .el-form-item--default .el-form-item__label { line-height: 14px; } -.el-form-item--label-right .el-form-item__label { - align-items: center; +// ============ 必填星号 * 与 label 首行齐平(全局) ============ +// label 为 inline-flex,星号 ::before 与文字是两个独立 flex 子项; +// 多行折行 label 若 align-items: center,星号会被垂直居中到第二行位置。 +// align-items: flex-start 让星号与文字首行齐平; +// align-self: center 让 label 整体不随表单行(32px)拉伸,单行 label 仍与输入框垂直居中,视觉不变。 +.el-form-item--label-right .el-form-item__label, +.el-form-item--label-left .el-form-item__label, +.el-form-item--label-top .el-form-item__label { + align-self: center; + align-items: flex-start; } .el-form-item--default { margin-bottom: 14px; } -// ============ 必填星号 * 与首行文字垂直居中 ============ -// Element Plus 默认 .el-form-item__label 为 inline-flex + align-items: flex-start, -// 星号 :before 高度(1em) 与文字行盒(line-height) 不一致时,多行/折行 label 会偏上。 -// 让 :before 跟随 label 行高、以 inline-block 参与行内对齐即可修复, -// 兼容单行(默认 32px)与多行(auto + 18px)两种 label 高度场景。 -// 注:客商档案(customer-archive)的 label 为 auto 高度 + padding 下沉方案,scoped 特异性更高会覆盖本规则。 +// 辅助:星号跟随 label 行高,保证与首行文字基线一致(单行/多行通用)。 +// 注:真正的首行对齐由上方 .el-form-item__label 的 align-items: flex-start 完成; +// 客商档案(customer-archive)的 label 为 auto 高度 + padding 下沉方案,scoped 特异性更高会覆盖本规则。 .el-form-item.is-required .el-form-item__label::before { display: inline-block; line-height: inherit; margin-right: 4px; + margin-top: 2px !important; } //.el-form-item { // margin-bottom: 15px !important; diff --git a/src/views/business/project-apply.vue b/src/views/business/project-apply.vue index 42ced0b..4ab860c 100644 --- a/src/views/business/project-apply.vue +++ b/src/views/business/project-apply.vue @@ -376,7 +376,7 @@ - + { __VUE_I18N_LEGACY_API__: true, __INTLIFY_PROD_DEVTOOLS__: false, }, - server: { - port: 2888, - proxy: { - '/api': { - target: 'http://localhost', - //target: 'https://saber3.bladex.cn/api', - changeOrigin: true, - rewrite: path => path.replace(/^\/api/, ''), - }, - }, - }, // server: { - // port: 2889, + // port: 2888, // proxy: { // '/api': { - // target: 'http://172.16.203.228:8000', + // target: 'http://localhost', + // //target: 'https://saber3.bladex.cn/api', // changeOrigin: true, + // rewrite: path => path.replace(/^\/api/, ''), // }, // }, // }, + server: { + port: 2889, + proxy: { + '/api': { + target: 'http://172.16.203.228:8000', + changeOrigin: true, + }, + }, + }, resolve: { alias: { '~': resolve(__dirname, './'),