diff --git a/apps/web/src/api/template-editor/mediaAssets.ts b/apps/web/src/api/template-editor/mediaAssets.ts index 9e13b7680..613df0f72 100644 --- a/apps/web/src/api/template-editor/mediaAssets.ts +++ b/apps/web/src/api/template-editor/mediaAssets.ts @@ -18,6 +18,7 @@ const mapAssetToMediaAsset = (asset: AssetItem): MediaAsset => { id: asset.id, name: asset.name, type: inferMediaType(asset.mime_type || ""), + source_url: asset.file_url, thumbnail_url: asset.thumbnail_url, duration: asset.duration ?? metaDuration, size: asset.file_size ?? undefined, diff --git a/apps/web/src/api/template-editor/types.ts b/apps/web/src/api/template-editor/types.ts index b9bc8bf89..42bf46849 100644 --- a/apps/web/src/api/template-editor/types.ts +++ b/apps/web/src/api/template-editor/types.ts @@ -424,6 +424,8 @@ export interface MediaAsset { id: string name: string type: "video" | "image" | "audio" + /** 源文件 URL(视频/原图),用于悬浮预览播放 */ + source_url?: string /** 缩略图 URL */ thumbnail_url?: string /** 时长(秒),仅 video/audio */ diff --git a/apps/web/src/components/asset-selector/AssetSelector.css b/apps/web/src/components/asset-selector/AssetSelector.css index 3e19910da..cd32261f7 100644 --- a/apps/web/src/components/asset-selector/AssetSelector.css +++ b/apps/web/src/components/asset-selector/AssetSelector.css @@ -456,7 +456,8 @@ margin-bottom: 8px; } -.as-preview-overlay-thumb img { +.as-preview-overlay-thumb img, +.as-preview-overlay-thumb video { width: 100%; height: 100%; object-fit: cover; diff --git a/apps/web/src/components/asset-selector/PreviewOverlay.tsx b/apps/web/src/components/asset-selector/PreviewOverlay.tsx index 5b7d2da21..72c47bb92 100644 --- a/apps/web/src/components/asset-selector/PreviewOverlay.tsx +++ b/apps/web/src/components/asset-selector/PreviewOverlay.tsx @@ -12,7 +12,16 @@ const PreviewOverlay: React.FC = ({ asset, position }) => { return (
- {asset.thumbnail_url ? ( + {asset.type === "video" && asset.source_url ? ( +