style(consignment): 规格字段「支持筛选」开关与匹配方式同行

规格字段第3行(匹配方式/通配值/进物品名/支持筛选)原来用 inline gridTemplateColumns 写死3列,把「支持筛选」挤到下一行,左侧留大片空白。

改为 CSS 类 order-service-field-extra.is-four 定义四列栅格,通配值保留 1.5fr 宽度;inline 样式同时盖掉了 960px 媒体查询导致窄屏无法折行,改成类后窄屏按 2x2 折行。

测试:新增用例断言第3行必须使用四列栅格类、禁止再出现3列 inline、四格顺序固定;并把该测试文件的路径解析改为 fileURLToPath,修掉 Windows 下 new URL(...).pathname 拼成 D:\\D:\\... 的 ENOENT。
This commit is contained in:
2026-11-06 18:17:45 +08:00
parent fde35624cd
commit bc35e0c4f4
3 changed files with 48 additions and 6 deletions
@@ -1073,10 +1073,7 @@ export default function ConsignmentConfigPanel() {
) : null}
</div>
<div
className="order-service-field-extra"
style={{ gridTemplateColumns: 'repeat(3, minmax(0, 1fr))' }}
>
<div className="order-service-field-extra is-four">
<div style={fieldCellStyle}>
<Text type="secondary">匹配方式</Text>
<Select
+15
View File
@@ -2235,6 +2235,20 @@
margin-top: 8px;
}
/*
* 规格字段第 3 行(匹配方式 / 通配值 / 进物品名 / 支持筛选)共 4 格。
* 之前用 inline gridTemplateColumns 写死 3 列,把「支持筛选」挤到了下一行;
* inline 样式还会盖掉 960px 媒体查询,窄屏下这一行无法折行。
* 改成 CSS 类后:4 格同行,窄屏按 2×2 折行。
*/
.order-service-field-extra.is-four {
grid-template-columns:
minmax(110px, 0.8fr)
minmax(200px, 1.5fr)
minmax(90px, 0.7fr)
minmax(90px, 0.7fr);
}
.order-service-field-extra-tip {
grid-column: 1 / -1;
font-size: 12px;
@@ -2372,6 +2386,7 @@
}
.order-service-field-extra,
.order-service-field-extra.is-four,
.order-service-switch-grid,
.order-service-switch-grid.is-auto-publish,
.order-service-status-step-grid {