feat: 形态图库支持铺满展示与原图预览

This commit is contained in:
GouJ
2026-09-01 18:45:46 +08:00
parent de69deea54
commit 352d7bb73b
5 changed files with 116 additions and 6 deletions
+29 -1
View File
@@ -1,5 +1,5 @@
import { computed, nextTick, ref } from 'vue'
import { NScrollbar } from 'naive-ui'
import { NImage, NScrollbar } from 'naive-ui'
import { createMemoryHistory, createRouter } from 'vue-router'
import { flushPromises, mount, type VueWrapper } from '@vue/test-utils'
import { afterEach, describe, expect, it, vi } from 'vitest'
@@ -765,6 +765,34 @@ describe('工作台页面交互', () => {
expect(wrapper!.findAll('.form-image-card')).toHaveLength(1)
})
it('形态卡片铺满并打开原生图片预览,历史管理仍从独立按钮进入', async () => {
const form = formFixture()
const fetcher = vi
.fn<typeof fetch>()
.mockImplementation(async url =>
jsonResponse(String(url).endsWith('/subject-forms') ? [form] : form.images)
)
vi.stubGlobal('fetch', fetcher)
await mountSubjectImages()
await wrapper!.get('[aria-label="关闭操作面板"]').trigger('click')
const card = wrapper!.get('.form-image-card')
expect(card.getComponent(NImage).props()).toMatchObject({ objectFit: 'cover', previewDisabled: false })
await card.get('img').trigger('click')
await flushPromises()
expect(document.querySelector('.n-image-preview')?.getAttribute('src')).toContain(
'/storage/subjects/project/form/image.png'
)
expect(document.querySelector('.image-history')).toBeNull()
expect(fetcher).toHaveBeenCalledOnce()
document.querySelector<HTMLElement>('.n-image-preview-overlay')!.click()
await flushPromises()
button('查看图片与记录').click()
await flushPromises()
expect(document.querySelector('.image-history')).not.toBeNull()
expect(fetcher.mock.calls.some(([url]) => String(url).endsWith('/subject-forms/form-db-1/images'))).toBe(true)
expect(fetcher.mock.calls.every(([, init]) => init?.method === 'GET')).toBe(true)
})
it('形态单图确认后发送正式 ID 并刷新候选图,不会调用 production/start', async () => {
const form = formFixture()
const fetcher = vi.fn<typeof fetch>().mockImplementation(async (_url, init) => {