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:
@@ -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
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -1,10 +1,13 @@
|
||||
import assert from 'node:assert/strict'
|
||||
import { readFileSync } from 'node:fs'
|
||||
import { fileURLToPath } from 'node:url'
|
||||
import test from 'node:test'
|
||||
|
||||
function readSource(relativePath: string) {
|
||||
// Windows 检出为 CRLF,多行断言里的 \n 会匹配失败,先统一换行
|
||||
return readFileSync(new URL(relativePath, import.meta.url).pathname, 'utf8').replace(
|
||||
// Windows 上 new URL(...).pathname 会带前导斜杠,拼成 D:\D:\... 导致 ENOENT,
|
||||
// 这里统一用 fileURLToPath(Linux/Windows 都正确)。
|
||||
// 检出为 CRLF,多行断言里的 \n 会匹配失败,先统一换行
|
||||
return readFileSync(fileURLToPath(new URL(relativePath, import.meta.url)), 'utf8').replace(
|
||||
/\r\n/g,
|
||||
'\n',
|
||||
)
|
||||
@@ -55,6 +58,33 @@ test('寄卖配置:规格字段提供「支持筛选」开关并随配置保
|
||||
assert.ok(configSource.includes('filterable: false,'), '新建字段默认不参与筛选')
|
||||
})
|
||||
|
||||
test('寄卖配置:「支持筛选」与「匹配方式」同行(第3行必须是4列栅格)', () => {
|
||||
assert.ok(
|
||||
configSource.includes('order-service-field-extra is-four'),
|
||||
'规格字段第3行必须使用四列栅格类,支持筛选才会留在同一行',
|
||||
)
|
||||
assert.ok(
|
||||
!configSource.includes("gridTemplateColumns: 'repeat(3, minmax(0, 1fr))'"),
|
||||
'不能再用3列 inline 栅格,否则支持筛选会被挤到下一行',
|
||||
)
|
||||
// 第3行的四格顺序固定:匹配方式 → 通配值 → 进物品名 → 支持筛选
|
||||
const rowStart = configSource.indexOf('order-service-field-extra is-four')
|
||||
const rowEnd = configSource.indexOf('</div>', configSource.indexOf('支持筛选', rowStart))
|
||||
const row = configSource.slice(rowStart, rowEnd)
|
||||
const order = ['匹配方式', '通配值', '进物品名', '支持筛选'].map((label) => row.indexOf(label))
|
||||
assert.ok(
|
||||
order.every((index) => index >= 0) &&
|
||||
order.every((index, i) => i === 0 || index > order[i - 1]!),
|
||||
`第3行四格顺序必须是 匹配方式→通配值→进物品名→支持筛选,实际 ${JSON.stringify(order)}`,
|
||||
)
|
||||
|
||||
const cssSource = readSource('../src/styles/admin.css')
|
||||
assert.ok(
|
||||
cssSource.includes('.order-service-field-extra.is-four'),
|
||||
'必须提供 is-four 四列栅格样式',
|
||||
)
|
||||
})
|
||||
|
||||
test('筛选选项接口:按已开启寄卖的分类返回', () => {
|
||||
assert.ok(
|
||||
serviceSource.includes('/worker-platform/consignment/inventory-filter-options'),
|
||||
|
||||
Reference in New Issue
Block a user