修正音频素材封面

使用用户提供的透明 PNG 替换自绘 SVG 音频封面
统一后台素材查询、精选审核、创作主页和画板素材库的音频封面引用
补齐画板图层列表音频图层封面展示
更新相关测试覆盖

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();
 });

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,

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();
 });

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: '素材包' },

public/creation-home/audio-asset-cover.svg

@@ -1,19 +0,0 @@
-<svg
-  xmlns="http://www.w3.org/2000/svg"
-  viewBox="0 0 256 256"
-  role="img"
-  aria-label="音频素材"
->
-  <g
-    fill="none"
-    stroke="#dc7f58"
-    stroke-linecap="round"
-    stroke-linejoin="round"
-    stroke-width="16"
-  >
-    <path d="M92 185V35l152-24v149" />
-    <path d="M92 87l152-24" />
-    <ellipse cx="53" cy="207" rx="41" ry="24" transform="rotate(4 53 207)" />
-    <ellipse cx="201" cy="193" rx="41" ry="24" transform="rotate(-4 201 193)" />
-  </g>
-</svg>

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',
     );
   });
 

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 (
     <div className="creation-landing__asset-audio-preview">

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泥点');

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',

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'),

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;

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}`}

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(
+      <ImageCanvasSidebarView
+        {...createSidebarProps({
+          activeSidebarPanel: 'layers',
+          layers: [
+            createLayer({
+              title: '胜利音效',
+              src: '/generated-character-drafts/editor-audios/win.mp3',
+              mediaType: 'audio',
+            }),
+          ],
+        })}
+      />,
+    );
+
+    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(
       <ImageCanvasSidebarView