fix: 优化移动端工作台筛选与工具栏

将形态图片状态筛选合并为下拉框,统一筛选容器内边距并调整背景。重新排列分镜与镜头生产移动端工具栏,隐藏重复统计并补充交互测试。
This commit is contained in:
GouJ
2026-09-08 09:59:05 +08:00
committed by GitHub
parent 4edb0ff6cc
commit 769407cb14
8 changed files with 102 additions and 58 deletions
+1 -1
View File
@@ -89,7 +89,7 @@ describe('统一目录条目', () => {
expect(css).toMatch(/\.workspace-tabs\.n-tabs\s*\{[^}]*width:\s*100%;[^}]*min-width:\s*0/)
expect(css).toMatch(/\.workspace-tabs \.n-tabs-nav-scroll-wrapper\s*\{[^}]*min-width:\s*0/)
expect(css).toMatch(
/\.form-image-filters\s*\{[^}]*grid-template-columns:\s*minmax\(200px, 360px\) 152px minmax\(260px, 1fr\) auto/
/\.form-image-filters\s*\{[^}]*grid-template-columns:\s*minmax\(200px, 360px\) 152px 160px auto/
)
expect(css).toMatch(
/@container \(max-width: 900px\)\s*\{\s*\.form-image-filters\s*\{[^}]*minmax\(0, 1fr\) 152px/
+4 -1
View File
@@ -184,7 +184,7 @@ describe('全站平面主题', () => {
// DOM 环境不计算几何;保护容器宽度断点和居中契约,真实坐标仍需浏览器验收。
const css = readAllStyles()
expect(css).toMatch(
/\.form-image-filter-region\s*\{[^}]*padding(?:-block)?:\s*5px;[^}]*background:\s*var\(--app-subtle\);/
/\.form-image-filter-region\s*\{[^}]*padding:\s*12px;[^}]*background:\s*color-mix\(in srgb, var\(--app-subtle\) 96%, white\);/
)
expect(css).toMatch(/\.form-image-toolbar\s*\{[^}]*align-items:\s*center;[^}]*gap:\s*12px 16px;/)
expect(css).toMatch(
@@ -197,6 +197,9 @@ describe('全站平面主题', () => {
expect(css).toMatch(/\.asset-impact-context\s*\{[^}]*gap:\s*10px/)
expect(css).toMatch(/\.asset-impact-context\s*\{[^}]*padding(?:-block)?:\s*5px/)
expect(css).toMatch(/\.asset-impact-context\s*\{[^}]*margin:\s*0/)
expect(css).toMatch(
/@container \(max-width: 460px\)\s*\{[^}]*\.form-image-filters\s*\{[^}]*grid-template-columns:\s*minmax\(0, 1fr\) 120px;[^}]*\}[^}]*\.filter-result-count\s*\{[^}]*display:\s*none;/
)
})
it('单图标按钮以当前控件高度为边长,尺寸与内容按钮互不影响', () => {
@@ -347,7 +347,11 @@ describe('过期首帧到具体素材定位', () => {
expect(toolbar.classes()).toContain('has-impact-picker')
expect(picker.nextElementSibling).toBe(toolbar.get('.form-image-filters').element)
expect(toolbar.find('input[aria-label="搜索形态图片"]').exists()).toBe(true)
expect(toolbar.findAll('.filter-toggles [role="checkbox"]')).toHaveLength(2)
expect(
toolbar
.findAllComponents(NSelect)
.some((item: VueWrapper) => item.attributes('aria-label') === '筛选图片状态')
).toBe(true)
expect(wrapper!.find('.asset-impact-context').exists()).toBe(false)
const select = wrapper!
.findAllComponents(NSelect)
+5 -4
View File
@@ -806,7 +806,7 @@ describe('视觉风格与主体身份工作区', () => {
})
describe('工作台页面交互', () => {
it('形态筛选搜索、类型和勾选组合仍只过滤本地显示,控件与结果数处于同一工具栏', async () => {
it('形态筛选搜索、类型和图片状态仍只过滤本地显示,控件与结果数处于同一工具栏', async () => {
const person = formFixture()
const scene = {
...formFixture(),
@@ -823,8 +823,8 @@ describe('工作台页面交互', () => {
expect(wrapper!.findAll('.form-image-filters')).toHaveLength(1)
expect(filters.get('.filter-result-count').text()).toBe('2 个形态')
expect(filters.find('input[aria-label="搜索形态图片"]').exists()).toBe(true)
expect(filters.findAll('.filter-toggles [role="checkbox"]')).toHaveLength(2)
await filters.findAll('.filter-toggles [role="checkbox"]')[0]!.trigger('click')
selectControl(wrapper!, 'aria-label', '筛选图片状态').vm.$emit('update:value', 'missing')
await flushPromises()
expect(wrapper!.findAll('.form-image-card')).toHaveLength(1)
expect(wrapper!.get('.form-image-card').text()).toContain('旧书店')
selectControl(wrapper!, 'aria-label', '筛选主体类型').vm.$emit('update:value', 'character')
@@ -833,7 +833,8 @@ describe('工作台页面交互', () => {
selectControl(wrapper!, 'aria-label', '筛选主体类型').vm.$emit('update:value', 'all')
await filters.get('input[aria-label="搜索形态图片"]').setValue('旧书店')
expect(filters.get('.filter-result-count').text()).toBe('1 个形态')
await filters.findAll('.filter-toggles [role="checkbox"]')[1]!.trigger('click')
selectControl(wrapper!, 'aria-label', '筛选图片状态').vm.$emit('update:value', 'stale')
await flushPromises()
expect(filters.get('.filter-result-count').text()).toBe('0 个形态')
expect(fetcher.mock.calls.every(([, init]) => init?.method === 'GET')).toBe(true)
})