style(element-ui): 区分 el-select 选中值与占位符颜色

- 修复 Element Plus el-select 组件选中值与占位符使用同一节点导致无法区分颜色的问题 - 只有未选值或已展开无搜索时节点带 .is-transparent，用此类排除选中颜色样式应用 - 更新
2026-09-03 17:03:08 +08:00
parent a0a3d53927
commit 23b23dc8e5
2 changed files with 18 additions and 4 deletions
@@ -15,3 +15,10 @@
 - 根因：`__dispatch-shipping-form __route-address-row` 网格地址列为 `minmax(280px, 1fr)`，各列最小宽度合计 1030px，弹窗不够宽时 grid 不换行直接溢出。
 - 修复：地址列改 `minmax(0, 1fr)`（宽屏仍 1fr 拉伸，窄窗自动收窄，总最小宽降到 750px）。
 - 备注：基础规则 `__route-address-row`（13750 行，运单独立表单页等在用，7 列含 40px 按钮列）仍是 minmax(280px,1fr)，同样窄窗有溢出风险，暂未动（用户未反馈该页问题）。
+
+## el-select 选中值 / 占位符颜色区分（全局）
+- 需求：已选值 #606266，未选值保持 placeholder 灰 #909399。
+- 根因：Element Plus 的选中值文本与占位符**共用同一节点** `<div class="el-select__selected-item el-select__placeholder [is-transparent]">`，仅靠 `.el-select__selected-item` 无法区分，导致未选态也被染成选中色。
+- 区分标志：只有「未选值」或「已展开但无搜索输入」时才带 `.is-transparent`。
+- 修复（`src/styles/element-ui.scss`）：选中规则改为 `.el-select__wrapper:not(.is-disabled) .el-select__selected-item:not(.is-transparent)`；多选 tag 文字另加 `.el-select__tags-text` 规则（tag 自身 color 优先级更高，父级规则盖不到）。
+- 经验：以后写任何「区分 el-select 有值/无值」的 CSS，一律用 `:not(.is-transparent)`。