video-flow-b/components/ui/script-tab-content.tsx

52 lines
1.5 KiB
TypeScript

import React, { useState, useCallback, useEffect, SetStateAction } from 'react';
import { motion, AnimatePresence } from 'framer-motion';
import { FileText } from 'lucide-react';
import { ScriptRenderer } from '@/components/script-renderer/ScriptRenderer';
interface ScriptTabContentProps {
scriptData: any[] | null;
setIsPauseWorkFlow: (isPauseWorkFlow: boolean) => void;
setAnyAttribute: any;
isPauseWorkFlow: boolean;
applyScript: any;
}
export function ScriptTabContent({
scriptData = [],
setIsPauseWorkFlow,
setAnyAttribute,
isPauseWorkFlow,
applyScript
}: ScriptTabContentProps) {
// 如果没有数据,显示空状态
if (!scriptData || scriptData.length === 0) {
return (
<div className="flex flex-col items-center justify-center min-h-[400px] text-white/50">
<FileText className="w-16 h-16 mb-4" />
<p>No script data</p>
</div>
);
}
return (
<div className="flex flex-col h-full">
<motion.div
className="relative w-full h-[90vh] backdrop-blur-xl rounded-2xl shadow-2xl overflow-hidden flex flex-col"
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
>
<ScriptRenderer
data={scriptData}
setIsPauseWorkFlow={setIsPauseWorkFlow}
setAnyAttribute={setAnyAttribute}
isPauseWorkFlow={isPauseWorkFlow}
applyScript={applyScript}
mode='manual'
from='tab'
/>
</motion.div>
</div>
);
};