fix: 修复模板卡片和页面的类型安全问题
- 修复TemplateCard组件中url字段的可选类型处理 - 修复home页面中模板类型字段名称错误(templateType -> code) - 修复result页面中任务状态判断逻辑(processing -> running) - 增强代码类型安全,避免运行时错误
This commit is contained in:
parent
595e56378c
commit
4bf5935b06
|
|
@ -18,12 +18,12 @@ export default function TemplateCard({ template, onClick }: TemplateCardProps) {
|
|||
|
||||
// 检测output是否为视频
|
||||
const isOutputVideo = useMemo(() => {
|
||||
return /\.(mp4|webm|ogg|mov|avi|mkv|flv)$/i.test(template.outputExampleUrl);
|
||||
return /\.(mp4|webm|ogg|mov|avi|mkv|flv)$/i.test(template.outputExampleUrl || '');
|
||||
}, [template.outputExampleUrl]);
|
||||
|
||||
// 检测input是否为视频
|
||||
const isInputVideo = useMemo(() => {
|
||||
return /\.(mp4|webm|ogg|mov|avi|mkv|flv)$/i.test(template.inputExampleUrl);
|
||||
return /\.(mp4|webm|ogg|mov|avi|mkv|flv)$/i.test(template.inputExampleUrl || ``);
|
||||
}, [template.inputExampleUrl]);
|
||||
|
||||
const handleClick = () => {
|
||||
|
|
@ -86,10 +86,10 @@ export default function TemplateCard({ template, onClick }: TemplateCardProps) {
|
|||
{isOutputVideo ? (
|
||||
// 当output是视频时,只显示单个视频
|
||||
<View className="single-video-container">
|
||||
<Image className="video-poster" src={template.inputExampleUrl} mode="aspectFill" />
|
||||
<Image className="video-poster" src={template.inputExampleUrl || ``} mode="aspectFill" />
|
||||
<Video
|
||||
className="single-video"
|
||||
src={template.outputExampleUrl}
|
||||
src={template.outputExampleUrl || ``}
|
||||
autoplay
|
||||
muted
|
||||
loop
|
||||
|
|
@ -116,7 +116,7 @@ export default function TemplateCard({ template, onClick }: TemplateCardProps) {
|
|||
{isInputVideo ? (
|
||||
<Video
|
||||
className="full-video"
|
||||
src={template.inputExampleUrl}
|
||||
src={template.inputExampleUrl || ``}
|
||||
autoplay
|
||||
muted
|
||||
loop
|
||||
|
|
@ -127,7 +127,7 @@ export default function TemplateCard({ template, onClick }: TemplateCardProps) {
|
|||
controls={false}
|
||||
/>
|
||||
) : (
|
||||
<Image className="full-image" src={template.inputExampleUrl} mode="aspectFill" lazyLoad />
|
||||
<Image className="full-image" src={template.inputExampleUrl || ``} mode="aspectFill" lazyLoad />
|
||||
)}
|
||||
</View>
|
||||
|
||||
|
|
@ -138,7 +138,7 @@ export default function TemplateCard({ template, onClick }: TemplateCardProps) {
|
|||
clipPath: `polygon(${splitPosition}% 0%, 100% 0%, 100% 100%, ${splitPosition}% 100%)`,
|
||||
}}
|
||||
>
|
||||
<Image className="full-image" src={template.outputExampleUrl} mode="aspectFill" lazyLoad />
|
||||
<Image className="full-image" src={template.outputExampleUrl || ``} mode="aspectFill" lazyLoad />
|
||||
</View>
|
||||
|
||||
{/* 可拖拽的分割线 */}
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ export default function Home() {
|
|||
const handleTemplateClick = async (template: Template) => {
|
||||
try {
|
||||
// 第一步:选择并上传图片
|
||||
const imageCount = template.templateType === '2image-to-video' ? 2 : 1;
|
||||
const imageCount = template.code === '2image-to-video' ? 2 : 1;
|
||||
const imageUrl = await sdk.chooseAndUploadImage({
|
||||
count: imageCount,
|
||||
onImageSelected: () => {
|
||||
|
|
|
|||
|
|
@ -30,9 +30,9 @@ const ResultPage: React.FC = () => {
|
|||
return;
|
||||
} else if (result.status === 'failed') {
|
||||
// 任务失败,停止轮询并设置错误
|
||||
setError(result.error || result.errorMessage || '任务执行失败');
|
||||
setError('任务执行失败');
|
||||
return;
|
||||
} else if (result.status === 'processing' || result.status === 'pending') {
|
||||
} else if (result.status === 'running' || result.status === 'pending') {
|
||||
// 任务仍在进行中,继续轮询
|
||||
if (attempts < maxAttempts) {
|
||||
timerRef.current = setTimeout(poll, 1000);
|
||||
|
|
|
|||
Loading…
Reference in New Issue