fix(aigc): correct generated media preview handling

update ResultPreview component to use proper image and video result URLs
refine isVideo detection logic across detail and shared work pages
add pointer-events none to preview elements to avoid blocking user interactions
standardize media URL usage between AIGC detail and shared work components
This commit is contained in:
duanshuwen
2026-07-16 21:24:38 +08:00
parent 487caf9dbe
commit 38dbf7afc8
4 changed files with 21 additions and 8 deletions

View File

@@ -3,11 +3,12 @@
<video
v-if="result.mediaType === 'video'"
class="result-preview-image"
:src="result.cover"
:src="result.videoResultUrl"
:poster="result.imageResultUrl"
controls
object-fit="cover"
/>
<image v-else class="result-preview-image" :src="result.cover" mode="aspectFill" />
<image v-else class="result-preview-image" :src="result.imageResultUrl" mode="aspectFill" />
<view class="result-preview-shade" />
<view class="result-preview-caption">

View File

@@ -31,6 +31,7 @@
rgba(0, 0, 0, 0.16) 48%,
rgba(0, 0, 0, 0.74) 100%
);
pointer-events: none;
}
.result-preview-caption {
@@ -38,6 +39,7 @@
right: 18px;
bottom: 18px;
left: 18px;
pointer-events: none;
}
.result-preview-badge {

View File

@@ -65,7 +65,7 @@ const result = computed(() => {
const imageUrl = record.imageResultUrl || "";
const videoUrl = record.videoResultUrl || "";
const isVideo = Boolean(videoUrl) && (record.generatorType === 1 || !imageUrl);
const isVideo = Number(record.generatorType) === 1;
const typeText = getMappedText(GENERATOR_TYPE_TEXT, record.generatorType, "类型");
const statusText = getMappedText(TASK_STATUS_TEXT, record.taskStatus, "状态");
const consumedText =
@@ -76,7 +76,9 @@ const result = computed(() => {
return {
id: record.taskId,
title: record.itemTitle || record.taskId || "生成结果",
cover: isVideo ? videoUrl : imageUrl || videoUrl,
cover: isVideo ? videoUrl : imageUrl,
imageResultUrl: imageUrl,
videoResultUrl: videoUrl,
mediaType: isVideo ? "video" : "image",
accent: "#0a4d46",
variantLabel: typeText,

View File

@@ -7,9 +7,9 @@
<view class="shared-work-scroll">
<template v-if="shareDetail">
<video v-if="isVideo" class="shared-work-media is-video" :src="shareDetail.videoUrl"
:poster="shareDetail.imageUrl" controls object-fit="cover" />
<image v-else-if="shareDetail.imageUrl" class="shared-work-media" :src="shareDetail.imageUrl"
<video v-if="isVideo" class="shared-work-media is-video" :src="videoResultUrl"
:poster="imageResultUrl" controls object-fit="cover" />
<image v-else-if="imageResultUrl" class="shared-work-media" :src="imageResultUrl"
mode="aspectFill" />
<view class="shared-work-meta">
@@ -37,8 +37,16 @@ import { getAigcGeneratorTaskShareDetail } from "@/request/api/AigcApi.js";
const shareKey = ref("");
const shareDetail = ref(null);
const imageResultUrl = computed(() => {
return shareDetail.value?.imageResultUrl || shareDetail.value?.imageUrl || "";
});
const videoResultUrl = computed(() => {
return shareDetail.value?.videoResultUrl || shareDetail.value?.videoUrl || "";
});
const isVideo = computed(() => {
return Number(shareDetail.value?.generatorType) === 1 && Boolean(shareDetail.value?.videoUrl);
return Number(shareDetail.value?.generatorType) === 1 && Boolean(videoResultUrl.value);
});
const generatorTypeText = computed(() => {