diff --git a/apps/admin-web/src/pages/AdminEditorAssetQueryPage.test.tsx b/apps/admin-web/src/pages/AdminEditorAssetQueryPage.test.tsx index 3d075d2ed..346a7335d 100644 --- a/apps/admin-web/src/pages/AdminEditorAssetQueryPage.test.tsx +++ b/apps/admin-web/src/pages/AdminEditorAssetQueryPage.test.tsx @@ -154,7 +154,7 @@ test('后台素材查询音频素材使用统一封面缩略图', async () => { const image = await screen.findByRole('img', { name: '素材：胜利音效' }); expect(image.getAttribute('src')).toBe( - '/creation-home/audio-asset-cover.svg', + '/creation-home/audio-asset-cover.png', ); expect(getAdminAssetReadUrl).not.toHaveBeenCalled(); }); diff --git a/apps/admin-web/src/pages/AdminEditorAssetQueryPage.tsx b/apps/admin-web/src/pages/AdminEditorAssetQueryPage.tsx index 50f588c25..177865f24 100644 --- a/apps/admin-web/src/pages/AdminEditorAssetQueryPage.tsx +++ b/apps/admin-web/src/pages/AdminEditorAssetQueryPage.tsx @@ -19,7 +19,7 @@ interface AdminEditorAssetQueryPageProps { } const ADMIN_ASSET_READ_EXPIRE_SECONDS = 300; -const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.svg'; +const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.png'; export function AdminEditorAssetQueryPage({ token, diff --git a/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.test.tsx b/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.test.tsx index ac11c94bd..90cd99289 100644 --- a/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.test.tsx +++ b/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.test.tsx @@ -200,7 +200,7 @@ test('后台精选审核音频素材使用统一封面缩略图', async () => { const image = await screen.findByRole('img', { name: '精选素材：胜利音效' }); expect(image.getAttribute('src')).toBe( - '/creation-home/audio-asset-cover.svg', + '/creation-home/audio-asset-cover.png', ); expect(getAdminAssetReadUrl).not.toHaveBeenCalled(); }); diff --git a/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.tsx b/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.tsx index 302d4d074..1988dfab4 100644 --- a/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.tsx +++ b/apps/admin-web/src/pages/AdminEditorShowcaseReviewPage.tsx @@ -24,7 +24,7 @@ interface AdminEditorShowcaseReviewPageProps { } const ADMIN_SHOWCASE_READ_EXPIRE_SECONDS = 300; -const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.svg'; +const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.png'; const showcaseCategoryOptions = [ { value: 'packs', label: '素材包' }, diff --git a/public/creation-home/audio-asset-cover.png b/public/creation-home/audio-asset-cover.png new file mode 100644 index 000000000..893e476ab Binary files /dev/null and b/public/creation-home/audio-asset-cover.png differ diff --git a/public/creation-home/audio-asset-cover.svg b/public/creation-home/audio-asset-cover.svg deleted file mode 100644 index 0e96909aa..000000000 --- a/public/creation-home/audio-asset-cover.svg +++ /dev/null @@ -1,19 +0,0 @@ - - - - - - - - diff --git a/src/components/creation-home/CreationLandingView.test.tsx b/src/components/creation-home/CreationLandingView.test.tsx index b80a8d7f6..e54762ba5 100644 --- a/src/components/creation-home/CreationLandingView.test.tsx +++ b/src/components/creation-home/CreationLandingView.test.tsx @@ -547,7 +547,7 @@ describe('CreationLandingView', () => { name: '背景音乐', }); expect(image.getAttribute('src')).toBe( - '/creation-home/audio-asset-cover.svg', + '/creation-home/audio-asset-cover.png', ); }); diff --git a/src/components/creation-home/CreationLandingView.tsx b/src/components/creation-home/CreationLandingView.tsx index 833e6f490..64f8a2cf1 100644 --- a/src/components/creation-home/CreationLandingView.tsx +++ b/src/components/creation-home/CreationLandingView.tsx @@ -191,7 +191,7 @@ function ShowcaseAudioPreview({ objectKey: preview.objectKey, }); const coverSrc = - preview.coverSrc?.trim() || '/creation-home/audio-asset-cover.svg'; + preview.coverSrc?.trim() || '/creation-home/audio-asset-cover.png'; return (
diff --git a/src/components/creation-home/creationShowcaseModel.test.ts b/src/components/creation-home/creationShowcaseModel.test.ts index 99a53de5d..e108cb496 100644 --- a/src/components/creation-home/creationShowcaseModel.test.ts +++ b/src/components/creation-home/creationShowcaseModel.test.ts @@ -459,7 +459,7 @@ describe('creationShowcaseModel', () => { expect(items).toHaveLength(1); expect(items[0]?.previews[0]?.mediaType).toBe('audio'); expect(items[0]?.previews[0]?.coverSrc).toBe( - '/creation-home/audio-asset-cover.svg', + '/creation-home/audio-asset-cover.png', ); expect(items[0]?.author).toBe('当前用户'); expect(items[0]?.cost).toBe('5泥点'); diff --git a/src/components/creation-home/creationShowcaseModel.ts b/src/components/creation-home/creationShowcaseModel.ts index 4001a2f0a..68dd913a3 100644 --- a/src/components/creation-home/creationShowcaseModel.ts +++ b/src/components/creation-home/creationShowcaseModel.ts @@ -56,7 +56,7 @@ type ShowcaseAssetGroup = { }; const UNKNOWN_META_VALUE = '-'; -const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.svg'; +const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.png'; const SHOWCASE_COST_KEYS = [ 'priceMudPoints', diff --git a/src/components/image-editor/ImageCanvasAssetRowView.test.tsx b/src/components/image-editor/ImageCanvasAssetRowView.test.tsx index 2ca914786..dec4bac5e 100644 --- a/src/components/image-editor/ImageCanvasAssetRowView.test.tsx +++ b/src/components/image-editor/ImageCanvasAssetRowView.test.tsx @@ -249,7 +249,7 @@ describe('ImageCanvasAssetRowView', () => { expect(screen.getByText('音频')).toBeTruthy(); const image = screen.getByRole('img', { name: '素材：胜利音效.mp3' }); expect(image.getAttribute('src')).toBe( - '/creation-home/audio-asset-cover.svg', + '/creation-home/audio-asset-cover.png', ); expect( document.querySelector('.image-canvas-editor__asset-media-overlay'), diff --git a/src/components/image-editor/ImageCanvasAssetRowView.tsx b/src/components/image-editor/ImageCanvasAssetRowView.tsx index c6bd2093a..32f387cbb 100644 --- a/src/components/image-editor/ImageCanvasAssetRowView.tsx +++ b/src/components/image-editor/ImageCanvasAssetRowView.tsx @@ -24,7 +24,7 @@ import { getCanvasMediaPreviewMarker, } from './ImageCanvasMediaModel'; -const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.svg'; +const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.png'; export type ImageCanvasAssetRowViewProps = { asset: EditorAsset; diff --git a/src/components/image-editor/ImageCanvasLayerPanelView.tsx b/src/components/image-editor/ImageCanvasLayerPanelView.tsx index aa03a6150..bf4a9941d 100644 --- a/src/components/image-editor/ImageCanvasLayerPanelView.tsx +++ b/src/components/image-editor/ImageCanvasLayerPanelView.tsx @@ -7,6 +7,8 @@ import type { ImageContextMenuState, } from './ImageCanvasEditorTypes'; +const AUDIO_ASSET_COVER_SRC = '/creation-home/audio-asset-cover.png'; + export type ImageCanvasLayerPanelViewProps = { layers: CanvasLayer[]; selectedLayerId: string | null; @@ -52,8 +54,12 @@ export function ImageCanvasLayerPanelView({ ] .filter(Boolean) .join(' · ')} - imageSrc={layer.src} - objectKey={layer.mediaType === 'image' ? layer.objectKey : undefined} + imageSrc={ + layer.mediaType === 'audio' ? AUDIO_ASSET_COVER_SRC : layer.src + } + objectKey={ + layer.mediaType === 'image' ? layer.objectKey : undefined + } imageAlt={`图层缩略图：${layer.title}`} selected={selectedLayerId === layer.id} primaryLabel={`选择图层${layer.title}`} diff --git a/src/components/image-editor/ImageCanvasSidebarView.test.tsx b/src/components/image-editor/ImageCanvasSidebarView.test.tsx index 83300590f..5b479b6e8 100644 --- a/src/components/image-editor/ImageCanvasSidebarView.test.tsx +++ b/src/components/image-editor/ImageCanvasSidebarView.test.tsx @@ -297,6 +297,28 @@ describe('ImageCanvasSidebarView', () => { ).toBeTruthy(); }); + it('uses the transparent audio cover for audio layer thumbnails', () => { + render( + , + ); + + const image = screen.getByAltText('图层缩略图：胜利音效'); + expect(image.getAttribute('src')).toBe( + '/creation-home/audio-asset-cover.png', + ); + }); + it('filters canvas layers from the sidebar search field', () => { render(