fix: 合并图库镜头定位与筛选工具栏并统一对齐
This commit is contained in:
GouJ
@@ -379,13 +379,10 @@ async function showStaleForms() {
|
||||
>镜头影响检查失败，暂时无法确认有无过期首帧：{{ impact.query.error.value }}
|
||||
<NButton text size="small" @click="impact.query.refresh">重试检查</NButton></NAlert
|
||||
>
|
||||
<div
|
||||
v-if="impactOptions.length || sourceShotId"
|
||||
class="asset-impact-context mt-3"
|
||||
aria-label="镜头与素材定位"
|
||||
>
|
||||
<div class="flex flex-wrap items-center gap-3">
|
||||
<div class="form-image-filter-region">
|
||||
<div class="form-image-toolbar" :class="{ 'has-impact-picker': impactOptions.length || sourceShotId }">
|
||||
<NSelect
|
||||
v-if="impactOptions.length || sourceShotId"
|
||||
:value="sourceShot?.shotId ?? null"
|
||||
:options="impactOptions"
|
||||
placeholder="选择过期镜头，查看关联素材"
|
||||
@@ -394,6 +391,34 @@ async function showStaleForms() {
|
||||
class="asset-impact-select"
|
||||
@update:value="selectImpactShot"
|
||||
/>
|
||||
<div class="form-image-filters" role="group" aria-label="形态图片筛选">
|
||||
<NInput
|
||||
placeholder="搜索主体、引用或形态"
|
||||
:input-props="{ 'aria-label': '搜索形态图片' }"
|
||||
v-model:value="search"
|
||||
clearable
|
||||
><template #prefix><Search :size="14" /></template
|
||||
></NInput>
|
||||
<NSelect
|
||||
aria-label="筛选主体类型"
|
||||
v-model:value="module"
|
||||
:options="[
|
||||
{ label: String('全部类型'), value: 'all' },
|
||||
{ label: String('人物'), value: 'character' },
|
||||
{ label: String('场景'), value: 'scene' },
|
||||
{ label: String('道具'), value: 'prop' }
|
||||
]"
|
||||
></NSelect>
|
||||
<div class="filter-toggles">
|
||||
<NCheckbox v-model:checked="onlyMissing">仅看缺少主图</NCheckbox>
|
||||
<NCheckbox v-model:checked="onlyStale">仅看身份过期</NCheckbox>
|
||||
</div>
|
||||
<span class="filter-result-count">{{ filtered.length }} 个形态</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="sourceShotId" class="asset-impact-context mt-3" aria-label="镜头与素材定位">
|
||||
<div class="flex flex-wrap items-center gap-3">
|
||||
<RouterLink v-if="sourceLocation" :to="sourceLocation" class="text-button"
|
||||
>返回第 {{ sourceShot?.episodeNo }} 集 · 镜头 {{ sourceShot?.shotNo }} →</RouterLink
|
||||
>
|
||||
@@ -470,32 +495,6 @@ async function showStaleForms() {
|
||||
}}</template>
|
||||
<NButton text size="small" @click="resetFilters">清除定位</NButton>
|
||||
</NAlert>
|
||||
<div class="form-image-filter-region">
|
||||
<div class="form-image-filters" role="group" aria-label="形态图片筛选">
|
||||
<NInput
|
||||
placeholder="搜索主体、引用或形态"
|
||||
:input-props="{ 'aria-label': '搜索形态图片' }"
|
||||
v-model:value="search"
|
||||
clearable
|
||||
><template #prefix><Search :size="14" /></template
|
||||
></NInput>
|
||||
<NSelect
|
||||
aria-label="筛选主体类型"
|
||||
v-model:value="module"
|
||||
:options="[
|
||||
{ label: String('全部类型'), value: 'all' },
|
||||
{ label: String('人物'), value: 'character' },
|
||||
{ label: String('场景'), value: 'scene' },
|
||||
{ label: String('道具'), value: 'prop' }
|
||||
]"
|
||||
></NSelect>
|
||||
<div class="filter-toggles">
|
||||
<NCheckbox v-model:checked="onlyMissing">仅看缺少主图</NCheckbox>
|
||||
<NCheckbox v-model:checked="onlyStale">仅看身份过期</NCheckbox>
|
||||
</div>
|
||||
<span class="filter-result-count">{{ filtered.length }} 个形态</span>
|
||||
</div>
|
||||
</div>
|
||||
<NAlert v-if="query.error.value" role="alert" type="error" :show-icon="false" class="mt-4"
|
||||
>{{ query.error.value }}<span v-if="forms.length"> 当前展示上次读取的数据。</span></NAlert
|
||||
><NAlert v-if="running" role="status" type="info" :show-icon="false" class="mt-4">
|
||||
|
||||
@@ -229,11 +229,22 @@ describe('过期首帧到具体素材定位', () => {
|
||||
expect(wrapper!.findAll('.form-image-card')).toHaveLength(3)
|
||||
expect(wrapper!.text()).not.toContain('个形态主图与当前已锁定身份母版不一致')
|
||||
expect(fetcher.mock.calls.some(([url]) => String(url).endsWith('/references'))).toBe(false)
|
||||
// 镜头选择和图库筛选共享上方工具栏；未选择镜头时不留下空的关联说明面板。
|
||||
const toolbar = wrapper!.get('.form-image-toolbar')
|
||||
const picker = toolbar.get('.asset-impact-select').element
|
||||
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(wrapper!.find('.asset-impact-context').exists()).toBe(false)
|
||||
const select = wrapper!
|
||||
.findAllComponents(NSelect)
|
||||
.find(item => item.attributes('aria-label') === '选择关联镜头')!
|
||||
select.vm.$emit('update:value', 'shot-target')
|
||||
await flushPromises()
|
||||
expect(wrapper!.get('.asset-impact-context').element.previousElementSibling).toBe(
|
||||
wrapper!.get('.form-image-filter-region').element
|
||||
)
|
||||
expect(wrapper!.text()).toContain('待处理首帧关联此素材')
|
||||
expect(fetcher.mock.calls.filter(([url]) => String(url).endsWith('/references'))).toHaveLength(1)
|
||||
})
|
||||
|
||||
@@ -817,6 +817,9 @@ describe('工作台页面交互', () => {
|
||||
vi.stubGlobal('fetch', fetcher)
|
||||
await mountSubjectImages()
|
||||
const filters = wrapper!.get('.form-image-filters')
|
||||
expect(wrapper!.get('.form-image-toolbar').classes()).not.toContain('has-impact-picker')
|
||||
expect(filters.element.parentElement).toBe(wrapper!.get('.form-image-toolbar').element)
|
||||
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)
|
||||
|
||||
Reference in New Issue
Block a user