fix: template

src/pages/TemplateDetailPageV2.tsx

@@ -1,11 +1,11 @@
 import React, { useState, useEffect } from 'react'
 import { useParams, useNavigate } from 'react-router-dom'
-import { 
-  ArrowLeft, 
-  RotateCcw, 
-  Trash2, 
-  ZoomIn, 
-  ZoomOut, 
+import {
+  ArrowLeft,
+  RotateCcw,
+  Trash2,
+  ZoomIn,
+  ZoomOut,
   Download,
   Share2,
   Edit3,
@@ -25,7 +25,7 @@ import { useTemplateOperationV2 } from '../hooks/useTemplateProgressV2'
 const TemplateDetailPageV2: React.FC = () => {
   const { templateId } = useParams<{ templateId: string }>()
   const navigate = useNavigate()
-  
+
   const [template, setTemplate] = useState<TemplateInfo | null>(null)
   const [templateDetail, setTemplateDetail] = useState<TemplateDetail | null>(null)
   const [loading, setLoading] = useState(true)
@@ -44,16 +44,16 @@ const TemplateDetailPageV2: React.FC = () => {
 
   const loadTemplateDetail = async () => {
     if (!templateId) return
-    
+
     try {
       setLoading(true)
-      
+
       // 并行加载基本信息和详细信息
       const [templateInfo, detail] = await Promise.all([
         TemplateServiceV2.getTemplate(templateId),
         TemplateServiceV2.getTemplateDetail(templateId)
       ])
-      
+
       setTemplate(templateInfo)
       setTemplateDetail(detail)
     } catch (error) {
@@ -82,7 +82,7 @@ const TemplateDetailPageV2: React.FC = () => {
     if (!template || !confirm('确定要删除这个模板吗？此操作不可撤销。')) return
 
     const success = await executeDelete(() => TemplateServiceV2.deleteTemplate(template.id))
-    
+
     if (success) {
       navigate('/templates-v2')
     } else if (deleteError) {
@@ -136,8 +136,8 @@ const TemplateDetailPageV2: React.FC = () => {
     )
   }
 
-  const totalDuration = templateDetail ? 
-    (templateDetail.duration > 1000000 ? templateDetail.duration / 1000000 : templateDetail.duration) : 
+  const totalDuration = templateDetail ?
+    (templateDetail.duration > 1000000 ? templateDetail.duration / 1000000 : templateDetail.duration) :
     template.duration
 
   const isCloudTemplate = TemplateServiceV2.isCloudTemplate(template)
@@ -399,23 +399,26 @@ const TemplateDetailPageV2: React.FC = () => {
             <div className="bg-white rounded-lg shadow-sm p-6">
               <h2 className="text-lg font-semibold text-gray-900 mb-4">轨道时间轴</h2>
               <div className="space-y-4">
-                {templateDetail.tracks.map((track) => (
-                  <TrackTimeline
-                    key={track.id}
-                    track={track}
-                    totalDuration={totalDuration}
-                    currentTime={currentTime}
-                    onSegmentClick={(segment) => {
-                      // 跳转到片段开始时间
-                      setCurrentTime(segment.start_time)
-                    }}
-                    onSegmentHover={(segment) => {
-                      // 可以在工具提示中显示片段详情
-                      console.log('Hovering segment:', segment?.name)
-                    }}
-                    onSegmentNameChange={handleSegmentNameChange}
-                  />
-                ))}
+                {templateDetail.tracks.map((track) => {
+                  console.log(track)
+                  return (
+                    <TrackTimeline
+                      key={track.id}
+                      track={track}
+                      totalDuration={totalDuration}
+                      currentTime={currentTime}
+                      onSegmentClick={(segment) => {
+                        // 跳转到片段开始时间
+                        setCurrentTime(segment.start_time)
+                      }}
+                      onSegmentHover={(segment) => {
+                        // 可以在工具提示中显示片段详情
+                        console.log('Hovering segment:', segment?.name)
+                      }}
+                      onSegmentNameChange={handleSegmentNameChange}
+                    />
+                  )
+                })}
               </div>
             </div>
           </>