diff --git a/components/ui/character-tab-content.tsx b/components/ui/character-tab-content.tsx index bf87756..cca4be9 100644 --- a/components/ui/character-tab-content.tsx +++ b/components/ui/character-tab-content.tsx @@ -15,18 +15,17 @@ interface Role { interface CharacterTabContentProps { taskSketch: any[]; - currentSketchIndex: number; + currentRoleIndex: number; onSketchSelect: (index: number) => void; roles: Role[]; } export function CharacterTabContent({ taskSketch, - currentSketchIndex, + currentRoleIndex, onSketchSelect, roles = [] }: CharacterTabContentProps) { - const [selectedCharacterIndex, setSelectedCharacterIndex] = useState(0); const [isReplaceModalOpen, setIsReplaceModalOpen] = useState(false); const [activeReplaceMethod, setActiveReplaceMethod] = useState('upload'); const [isPlaying, setIsPlaying] = useState(false); @@ -80,7 +79,7 @@ export function CharacterTabContent({ }; // 获取当前选中的角色 - const currentRole = roles[selectedCharacterIndex]; + const currentRole = roles[currentRoleIndex]; return (
@@ -98,9 +97,9 @@ export function CharacterTabContent({ className={cn( 'relative flex-shrink-0 w-24 rounded-lg overflow-hidden cursor-pointer', 'aspect-[9/16]', - selectedCharacterIndex === index ? 'ring-2 ring-blue-500' : 'hover:ring-2 hover:ring-blue-500/50' + currentRoleIndex === index ? 'ring-2 ring-blue-500' : 'hover:ring-2 hover:ring-blue-500/50' )} - onClick={() => setSelectedCharacterIndex(index)} + onClick={() => onSketchSelect(index)} whileHover={{ scale: 1.05 }} whileTap={{ scale: 0.95 }} > diff --git a/components/ui/edit-modal.tsx b/components/ui/edit-modal.tsx index 1c6e663..fa996cf 100644 --- a/components/ui/edit-modal.tsx +++ b/components/ui/edit-modal.tsx @@ -46,6 +46,7 @@ export function EditModal({ }: EditModalProps) { const [activeTab, setActiveTab] = useState(activeEditTab); const [currentIndex, setCurrentIndex] = useState(currentSketchIndex); + const [currentRoleIndex, setCurrentRoleIndex] = useState(0); // 当 activeEditTab 改变时更新 activeTab useEffect(() => { @@ -61,6 +62,14 @@ export function EditModal({ return parseInt(tabId) > parseInt(taskStatus); }; + const hanldeChangeSelect = (index: number) => { + if (activeTab === '2') { + setCurrentRoleIndex(index); + } else { + setCurrentIndex(index); + } + } + const renderTabContent = () => { switch (activeTab) { case '1': @@ -68,15 +77,15 @@ export function EditModal({ ); case '2': return ( ); @@ -85,7 +94,7 @@ export function EditModal({ ); diff --git a/components/ui/video-tab-content.tsx b/components/ui/video-tab-content.tsx index 596b300..4ed0507 100644 --- a/components/ui/video-tab-content.tsx +++ b/components/ui/video-tab-content.tsx @@ -324,62 +324,14 @@ export function VideoTabContent({ src={sketches[currentSketchIndex]?.url} className="w-full h-full object-cover" loop - autoPlay + autoPlay={false} playsInline + controls muted={isMuted} onTimeUpdate={handleTimeUpdate} /> - {/* 视频控制层 */} -
-
- {/* 进度条 */} -
{ - const rect = e.currentTarget.getBoundingClientRect(); - const x = e.clientX - rect.left; - const percentage = (x / rect.width) * 100; - if (videoPlayerRef.current) { - videoPlayerRef.current.currentTime = (percentage / 100) * videoPlayerRef.current.duration; - } - }} - > - -
- - {/* 控制按钮 */} -
- setIsPlaying(!isPlaying)} - whileHover={{ scale: 1.1 }} - whileTap={{ scale: 0.9 }} - > - {isPlaying ? ( - - ) : ( - - )} - - - setIsMuted(!isMuted)} - whileHover={{ scale: 1.1 }} - whileTap={{ scale: 0.9 }} - > - {isMuted ? ( - - ) : ( - - )} - -
-
-
+ {/* 操作按钮 */}