feat: 新增项目资产库与形态参考素材

2026-09-21 19:54:51 +08:00
parent e6d02a20a7
commit b834d1d259
18 changed files with 737 additions and 41 deletions
@@ -0,0 +1,86 @@
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { flushPromises, mount, type VueWrapper } from '@vue/test-utils'
+import { createMemoryHistory, createRouter } from 'vue-router'
+import ProjectAssetsPage from '@/features/project-assets/ProjectAssetsPage.vue'
+import { projectContextKey } from '@/features/projects/context'
+import { testProjectContext } from '@/testing/project-context'
+
+let wrapper: VueWrapper | undefined
+afterEach(() => {
+    wrapper?.unmount()
+    wrapper = undefined
+    document.body.innerHTML = ''
+    vi.unstubAllGlobals()
+})
+
+describe('项目资产库页面', () => {
+    it('读取当前项目素材并支持名称、分类和原文件名筛选', async () => {
+        const fetcher = vi.fn<typeof fetch>().mockResolvedValue(
+            new Response(
+                JSON.stringify({
+                    data: [
+                        {
+                            id: 'asset-scene',
+                            projectId: 'capability-test',
+                            name: '雨夜街道',
+                            type: 'image',
+                            category: 'scene',
+                            mimeType: 'image/png',
+                            extension: 'png',
+                            size: 4096,
+                            publicUrl: '/storage/scene.png',
+                            metadata: { originalName: 'street-original.png' },
+                            createdAt: '2026-09-21T00:00:00Z',
+                            updatedAt: '2026-09-21T00:00:00Z'
+                        },
+                        {
+                            id: 'asset-character',
+                            projectId: 'capability-test',
+                            name: '林默正面照',
+                            type: 'image',
+                            category: 'character',
+                            mimeType: 'image/jpeg',
+                            extension: 'jpg',
+                            size: 8192,
+                            publicUrl: '/storage/character.jpg',
+                            metadata: null,
+                            createdAt: '2026-09-21T01:00:00Z',
+                            updatedAt: '2026-09-21T01:00:00Z'
+                        }
+                    ]
+                })
+            )
+        )
+        vi.stubGlobal('fetch', fetcher)
+        const router = createRouter({
+            history: createMemoryHistory(),
+            routes: [{ path: '/projects/:projectId/assets', component: ProjectAssetsPage }]
+        })
+        await router.push('/projects/capability-test/assets')
+        wrapper = mount(ProjectAssetsPage, {
+            attachTo: document.body,
+            global: {
+                plugins: [router],
+                provide: { [projectContextKey as symbol]: testProjectContext() }
+            }
+        })
+        await flushPromises()
+
+        expect(fetcher).toHaveBeenCalledWith(
+            '/api/projects/capability-test/assets',
+            expect.objectContaining({ method: 'GET' })
+        )
+        expect(wrapper.findAll('.project-asset-card')).toHaveLength(2)
+        expect(wrapper.text()).toContain('雨夜街道')
+        expect(wrapper.text()).toContain('林默正面照')
+
+        await wrapper.get('input[aria-label="搜索项目素材"]').setValue('street-original')
+        expect(wrapper.findAll('.project-asset-card')).toHaveLength(1)
+        expect(wrapper.text()).toContain('雨夜街道')
+        expect(wrapper.text()).not.toContain('林默正面照')
+
+        await wrapper.get('input[aria-label="搜索项目素材"]').setValue('没有结果')
+        expect(wrapper.findAll('.project-asset-card')).toHaveLength(0)
+        expect(wrapper.text()).toContain('没有匹配的素材')
+    })
+})