fix: 删除同名文件避免循环导入（目录index.ts已作为入口）

主文件 238→60 行（-75%），拆分为：
- useClipBasicOps: 选中状态 + 增删改查重排
- useClipTrim: 裁剪、分割、重置裁剪
- useClipEffects: 转场、调速、TTS、配音选择

导入路径保持向后兼容

apps/web/src/api/products.ts

@@ -0,0 +1,174 @@
+/**
+ * 成品 / 视频相关 API
+ * 后端实际接口：/videos
+ */
+import apiClient from "./client"
+
+/** 复核状态 */
+export type ReviewStatus = "pending_review" | "approved" | "rejected"
+
+/** 成品条目 */
+export interface ProductItem {
+  id: string
+  title: string
+  video_url?: string
+  thumbnail_url?: string
+  duration_seconds?: number
+  file_size?: number
+  resolution?: string
+  status: "processing" | "completed" | "failed"
+  /** 复核状态 */
+  review_status?: ReviewStatus
+  /** 所属项目 ID */
+  project_id?: string
+  /** 所属项目名称 */
+  project_name?: string
+  /** 查重率（百分比） */
+  duplicate_rate?: number
+  created_at?: string
+  updated_at?: string
+}
+
+/** 列表查询参数 */
+export interface ProductListParams {
+  page?: number
+  page_size?: number
+  project_id?: string
+  review_status?: ReviewStatus | "all"
+}
+
+/** 分页响应 */
+export interface ProductListResponse {
+  items: ProductItem[]
+  total: number
+  page: number
+  page_size: number
+}
+
+/** 批量下载任务状态 */
+export interface BatchDownloadStatus {
+  job_id: string
+  status: "processing" | "completed" | "failed"
+  /** 完成后返回的下载 URL */
+  download_url?: string
+  /** 进度百分比 */
+  progress?: number
+}
+
+/** 后端 /videos 接口返回的原始视频条目 */
+interface VideoItem {
+  id: string
+  project_id: string
+  generation_task_id: string
+  name: string
+  file_url: string
+  file_size: number
+  duration: number
+  thumbnail_url: string | null
+  width: number
+  height: number
+  fps: number
+  status: string
+  review_status: ReviewStatus
+  generation_params: Record<string, unknown>
+  download_url: string
+  generated_at: string
+}
+
+/**
+ * 将后端 VideoItem 映射为 ProductItem 格式
+ */
+function mapVideoToProductItem(video: VideoItem): ProductItem {
+  return {
+    id: video.id,
+    title: video.name || "未命名视频",
+    // 优先用 download_url（带签名）播放，file_url 无签名无法访问
+    video_url: video.download_url || video.file_url,
+    thumbnail_url: video.thumbnail_url || undefined,
+    duration_seconds: video.duration,
+    file_size: video.file_size,
+    resolution: video.width && video.height ? `${video.width}x${video.height}` : undefined,
+    status:
+      video.status === "completed"
+        ? "completed"
+        : video.status === "failed"
+          ? "failed"
+          : "processing",
+    review_status: video.review_status,
+    project_id: video.project_id,
+    // 后端 /videos 接口暂无 project_name 字段
+    project_name: undefined,
+    // 后端字段名为 generated_at，映射为 created_at 供前端统一使用
+    created_at: video.generated_at,
+    updated_at: video.generated_at,
+    // 后端 /videos 接口暂无 duplicate_rate 字段
+    duplicate_rate: undefined,
+  }
+}
+
+/** 获取成品列表（支持分页和筛选） */
+export const getProducts = async (params?: ProductListParams): Promise<ProductItem[]> => {
+  const response = await apiClient.get("/videos", { params })
+  const data = response.data
+  const videos: VideoItem[] = Array.isArray(data?.items)
+    ? data.items
+    : Array.isArray(data)
+      ? data
+      : []
+  return videos.map(mapVideoToProductItem)
+}
+
+/** 获取单个成品详情 */
+export const getProduct = async (productId: string): Promise<ProductItem> => {
+  const response = await apiClient.get(`/videos/${productId}`)
+  return mapVideoToProductItem(response.data as VideoItem)
+}
+
+/**
+ * 删除成品
+ * 注意：后端暂未实现 /videos DELETE 接口，调用会返回 405
+ * 待后端实现后自动生效
+ */
+export const deleteProduct = async (productId: string): Promise<void> => {
+  await apiClient.delete(`/videos/${productId}`)
+}
+
+/**
+ * 获取成品下载链接
+ * 直接使用列表返回的 download_url（带OSS签名）
+ */
+export const getProductDownloadUrl = async (
+  productId: string,
+): Promise<{ url: string; expires_at: string }> => {
+  // 优先从列表缓存取；如果没有则调详情接口
+  const product = await getProduct(productId)
+  if (!product.video_url) throw new Error("下载链接不可用")
+  return { url: product.video_url, expires_at: "" }
+}
+
+/** 更新复核状态 — TODO: 后端暂无对应端点，暂存本地状态 */
+export const updateReviewStatus = async (
+  productId: string,
+  status: ReviewStatus,
+): Promise<ProductItem> => {
+  // 后端暂无 /videos/{id}/review 端点
+  // 暂时返回当前状态，后续可扩展
+  const product = await getProduct(productId)
+  return { ...product, review_status: status }
+}
+
+/** 发起批量下载 — TODO: 后端暂无对应端点 */
+export const batchDownload = async (videoIds: string[]): Promise<{ job_id: string }> => {
+  // 后端暂无 /videos/batch-download 端点
+  // 暂时返回模拟 job_id，后续可扩展
+  console.warn("[batchDownload] 后端暂无批量下载端点", videoIds)
+  return { job_id: `mock-${Date.now()}` }
+}
+
+/** 查询批量下载状态 — TODO: 后端暂无对应端点 */
+export const getBatchDownloadStatus = async (jobId: string): Promise<BatchDownloadStatus> => {
+  // 后端暂无 /videos/batch-download/{jobId} 端点
+  // 暂时返回模拟状态，后续可扩展
+  console.warn("[getBatchDownloadStatus] 后端暂无批量下载状态端点", jobId)
+  return { job_id: jobId, status: "processing", progress: 0 }
+}

apps/web/src/api/products/index.ts

@@ -1,28 +0,0 @@
-/**
- * 成品 / 视频相关 API — 目录化入口
- * 保持与原 products.ts 相同导出，向后兼容
- */
-
-// 类型
-export type {
-  ReviewStatus,
-  ProductItem,
-  ProductListParams,
-  ProductListResponse,
-  BatchDownloadStatus,
-  VideoItem,
-} from "./types"
-
-// 工具函数
-export { mapVideoToProductItem } from "./utils"
-
-// API 函数
-export {
-  getProducts,
-  getProduct,
-  deleteProduct,
-  getProductDownloadUrl,
-  updateReviewStatus,
-  batchDownload,
-  getBatchDownloadStatus,
-} from "./products"

apps/web/src/api/products/products.ts

@@ -1,80 +0,0 @@
-/**
- * 成品 / 视频相关 API 函数
- * 后端实际接口：/videos
- */
-import apiClient from "../client"
-import type {
-  BatchDownloadStatus,
-  ProductItem,
-  ProductListParams,
-  VideoItem,
-  ReviewStatus,
-} from "./types"
-import { mapVideoToProductItem } from "./utils"
-
-/** 获取成品列表（支持分页和筛选） */
-export const getProducts = async (params?: ProductListParams): Promise<ProductItem[]> => {
-  const response = await apiClient.get("/videos", { params })
-  const data = response.data
-  const videos: VideoItem[] = Array.isArray(data?.items)
-    ? data.items
-    : Array.isArray(data)
-      ? data
-      : []
-  return videos.map(mapVideoToProductItem)
-}
-
-/** 获取单个成品详情 */
-export const getProduct = async (productId: string): Promise<ProductItem> => {
-  const response = await apiClient.get(`/videos/${productId}`)
-  return mapVideoToProductItem(response.data as VideoItem)
-}
-
-/**
- * 删除成品
- * 注意：后端暂未实现 /videos DELETE 接口，调用会返回 405
- * 待后端实现后自动生效
- */
-export const deleteProduct = async (productId: string): Promise<void> => {
-  await apiClient.delete(`/videos/${productId}`)
-}
-
-/**
- * 获取成品下载链接
- * 直接使用列表返回的 download_url（带OSS签名）
- */
-export const getProductDownloadUrl = async (
-  productId: string,
-): Promise<{ url: string; expires_at: string }> => {
-  // 优先从列表缓存取；如果没有则调详情接口
-  const product = await getProduct(productId)
-  if (!product.video_url) throw new Error("下载链接不可用")
-  return { url: product.video_url, expires_at: "" }
-}
-
-/** 更新复核状态 — TODO: 后端暂无对应端点，暂存本地状态 */
-export const updateReviewStatus = async (
-  productId: string,
-  status: ReviewStatus,
-): Promise<ProductItem> => {
-  // 后端暂无 /videos/{id}/review 端点
-  // 暂时返回当前状态，后续可扩展
-  const product = await getProduct(productId)
-  return { ...product, review_status: status }
-}
-
-/** 发起批量下载 — TODO: 后端暂无对应端点 */
-export const batchDownload = async (videoIds: string[]): Promise<{ job_id: string }> => {
-  // 后端暂无 /videos/batch-download 端点
-  // 暂时返回模拟 job_id，后续可扩展
-  console.warn("[batchDownload] 后端暂无批量下载端点", videoIds)
-  return { job_id: `mock-${Date.now()}` }
-}
-
-/** 查询批量下载状态 — TODO: 后端暂无对应端点 */
-export const getBatchDownloadStatus = async (jobId: string): Promise<BatchDownloadStatus> => {
-  // 后端暂无 /videos/batch-download/{jobId} 端点
-  // 暂时返回模拟状态，后续可扩展
-  console.warn("[getBatchDownloadStatus] 后端暂无批量下载状态端点", jobId)
-  return { job_id: jobId, status: "processing", progress: 0 }
-}

apps/web/src/api/products/types.ts

@@ -1,74 +0,0 @@
-/**
- * 成品 / 视频相关类型定义
- */
-
-/** 复核状态 */
-export type ReviewStatus = "pending_review" | "approved" | "rejected"
-
-/** 成品条目 */
-export interface ProductItem {
-  id: string
-  title: string
-  video_url?: string
-  thumbnail_url?: string
-  duration_seconds?: number
-  file_size?: number
-  resolution?: string
-  status: "processing" | "completed" | "failed"
-  /** 复核状态 */
-  review_status?: ReviewStatus
-  /** 所属项目 ID */
-  project_id?: string
-  /** 所属项目名称 */
-  project_name?: string
-  /** 查重率（百分比） */
-  duplicate_rate?: number
-  created_at?: string
-  updated_at?: string
-}
-
-/** 列表查询参数 */
-export interface ProductListParams {
-  page?: number
-  page_size?: number
-  project_id?: string
-  review_status?: ReviewStatus | "all"
-}
-
-/** 分页响应 */
-export interface ProductListResponse {
-  items: ProductItem[]
-  total: number
-  page: number
-  page_size: number
-}
-
-/** 批量下载任务状态 */
-export interface BatchDownloadStatus {
-  job_id: string
-  status: "processing" | "completed" | "failed"
-  /** 完成后返回的下载 URL */
-  download_url?: string
-  /** 进度百分比 */
-  progress?: number
-}
-
-/** 后端 /videos 接口返回的原始视频条目 */
-export interface VideoItem {
-  id: string
-  project_id: string
-  generation_task_id: string
-  name: string
-  file_url: string
-  file_size: number
-  duration: number
-  thumbnail_url: string | null
-  width: number
-  height: number
-  fps: number
-  status: string
-  review_status: ReviewStatus
-  generation_params: Record<string, unknown>
-  download_url: string
-  generated_at: string
-}

apps/web/src/api/products/utils.ts

@@ -1,35 +0,0 @@
-/**
- * 成品数据转换工具函数
- */
-import type { ProductItem, VideoItem } from "./types"
-
-/**
- * 将后端 VideoItem 映射为 ProductItem 格式
- */
-export function mapVideoToProductItem(video: VideoItem): ProductItem {
-  return {
-    id: video.id,
-    title: video.name || "未命名视频",
-    // 优先用 download_url（带签名）播放，file_url 无签名无法访问
-    video_url: video.download_url || video.file_url,
-    thumbnail_url: video.thumbnail_url || undefined,
-    duration_seconds: video.duration,
-    file_size: video.file_size,
-    resolution: video.width && video.height ? `${video.width}x${video.height}` : undefined,
-    status:
-      video.status === "completed"
-        ? "completed"
-        : video.status === "failed"
-          ? "failed"
-          : "processing",
-    review_status: video.review_status,
-    project_id: video.project_id,
-    // 后端 /videos 接口暂无 project_name 字段
-    project_name: undefined,
-    // 后端字段名为 generated_at，映射为 created_at 供前端统一使用
-    created_at: video.generated_at,
-    updated_at: video.generated_at,
-    // 后端 /videos 接口暂无 duplicate_rate 字段
-    duplicate_rate: undefined,
-  }
-}

apps/web/src/pages/editing-planner/hooks/useClipOperations.ts

@@ -1,238 +0,0 @@
-import { useState, useCallback, useMemo } from "react"
-import { Modal, message } from "antd"
-import type {
-  ClipData,
-  ClipType,
-  TransitionConfig,
-  SpeedConfig,
-  TtsConfig,
-  TrimConfig,
-} from "../types"
-import type { AssetItem } from "@/api/assets"
-
-interface UseClipOperationsParams {
-  clips: ClipData[]
-  setClips: (updater: (prev: ClipData[]) => ClipData[]) => void
-}
-
-/**
- * 片段操作 Hook
- * 片段增删改查、排序、裁剪、分割、转场、调速、TTS、配音选择
- */
-export const useClipOperations = ({ clips, setClips }: UseClipOperationsParams) => {
-  const [selectedClipId, setSelectedClipId] = useState<string | null>(null)
-
-  const selectedClip = useMemo(
-    () => clips.find((c) => c.id === selectedClipId) || null,
-    [clips, selectedClipId],
-  )
-
-  /* ── 选中 / 重排 / 删除 ── */
-
-  const handleClipSelect = useCallback((clipId: string) => {
-    setSelectedClipId(clipId)
-  }, [])
-
-  const handleClipReorder = useCallback(
-    (fromIdx: number, toIdx: number) => {
-      setClips((prev) => {
-        const updated = [...prev]
-        const [moved] = updated.splice(fromIdx, 1)
-        updated.splice(toIdx, 0, moved)
-        return updated.map((c, i) => ({ ...c, order: i }))
-      })
-    },
-    [setClips],
-  )
-
-  const handleClipRemove = useCallback(
-    (clipId: string) => {
-      Modal.confirm({
-        title: "删除片段",
-        content: "确定要删除这个片段吗？此操作可通过撤销恢复。",
-        okText: "删除",
-        okType: "danger",
-        cancelText: "取消",
-        onOk: () => {
-          setClips((prev) => prev.filter((c) => c.id !== clipId))
-          if (selectedClipId === clipId) setSelectedClipId(null)
-        },
-      })
-    },
-    [setClips, selectedClipId],
-  )
-
-  const handleClipUpdate = useCallback(
-    (clipId: string, data: Partial<ClipData>) => {
-      setClips((prev) => prev.map((c) => (c.id === clipId ? { ...c, ...data } : c)))
-    },
-    [setClips],
-  )
-
-  /**
-   * 添加片段（不绑定任何素材）
-   * 片段 = 时间规划 + 类型标记
-   */
-  const handleAddClip = useCallback(
-    (type: ClipType, duration: number) => {
-      const newClip: ClipData = {
-        id: `clip-${Date.now()}`,
-        type,
-        duration,
-        startOffset: 0,
-        order: clips.length,
-      }
-      setClips((prev) => [...prev, newClip])
-    },
-    [clips.length, setClips],
-  )
-
-  /* ── 裁剪 / 分割 / 重置 ── */
-
-  const handleClipTrim = useCallback(
-    (clipId: string, trimConfig: TrimConfig, newDuration: number) => {
-      setClips((prev) =>
-        prev.map((c) =>
-          c.id === clipId ? { ...c, trim_config: trimConfig, duration: newDuration } : c,
-        ),
-      )
-    },
-    [setClips],
-  )
-
-  const handleClipSplit = useCallback(
-    (clipId: string, splitRatio: number) => {
-      setClips((prev) => {
-        const idx = prev.findIndex((c) => c.id === clipId)
-        if (idx === -1) return prev
-        const clip = prev[idx]
-        const splitPoint = Math.round(clip.duration * splitRatio * 10) / 10
-        if (splitPoint < 0.5 || splitPoint >= clip.duration - 0.5) return prev
-
-        // 前半段
-        const firstHalf: ClipData = {
-          ...clip,
-          duration: splitPoint,
-          trim_config: clip.trim_config
-            ? {
-                ...clip.trim_config,
-                end_time: clip.trim_config.start_time + splitPoint,
-              }
-            : undefined,
-        }
-
-        // 后半段
-        const secondHalf: ClipData = {
-          ...clip,
-          id: `clip-${Date.now()}`,
-          duration: clip.duration - splitPoint,
-          startOffset: clip.startOffset + splitPoint,
-          trim_config: clip.trim_config
-            ? {
-                ...clip.trim_config,
-                start_time: clip.trim_config.start_time + splitPoint,
-              }
-            : undefined,
-          order: (clip.order ?? idx) + 1,
-        }
-
-        const updated = [...prev]
-        updated[idx] = firstHalf
-        updated.splice(idx + 1, 0, secondHalf)
-        return updated.map((c, i) => ({ ...c, order: i }))
-      })
-    },
-    [setClips],
-  )
-
-  const handleClipResetTrim = useCallback(
-    (clipId: string) => {
-      setClips((prev) =>
-        prev.map((c) => {
-          if (c.id !== clipId || !c.trim_config) return c
-          const originalDuration = c.trim_config.original_duration ?? c.duration
-          return {
-            ...c,
-            duration: originalDuration,
-            trim_config: undefined,
-          }
-        }),
-      )
-    },
-    [setClips],
-  )
-
-  /* ── 转场 / 调速 / TTS ── */
-
-  const handleTransitionChange = useCallback(
-    (targetClipId: string | null, config: TransitionConfig) => {
-      if (targetClipId) {
-        handleClipUpdate(targetClipId, { transition: config })
-      }
-      // 同时更新全局默认转场（供新片段使用）—— 暂未实现全局默认
-    },
-    [handleClipUpdate],
-  )
-
-  const handleSpeedChange = useCallback(
-    (targetClipId: string | null, config: SpeedConfig) => {
-      if (targetClipId) {
-        handleClipUpdate(targetClipId, { speed: config })
-      }
-    },
-    [handleClipUpdate],
-  )
-
-  const handleApplySpeedAll = useCallback(
-    (config: SpeedConfig) => {
-      setClips((prev) => prev.map((c) => ({ ...c, speed: { ...config } })))
-      message.success("已应用到所有片段")
-    },
-    [setClips],
-  )
-
-  const handleTtsChange = useCallback(
-    (targetClipId: string | null, ttsConfig: TtsConfig) => {
-      if (!targetClipId) return
-      handleClipUpdate(targetClipId, { tts_config: ttsConfig })
-    },
-    [handleClipUpdate],
-  )
-
-  /** 为片段选择配音素材 */
-  const handleClipVoiceSelect = useCallback(
-    (clipId: string, asset: AssetItem | null) => {
-      setClips((prev) =>
-        prev.map((c) =>
-          c.id === clipId
-            ? {
-                ...c,
-                voice_asset_id: asset?.id ?? undefined,
-                voice_file_url: asset?.file_url ?? undefined,
-              }
-            : c,
-        ),
-      )
-    },
-    [setClips],
-  )
-
-  return {
-    selectedClipId,
-    setSelectedClipId,
-    selectedClip,
-    handleClipSelect,
-    handleClipReorder,
-    handleClipRemove,
-    handleClipUpdate,
-    handleAddClip,
-    handleClipTrim,
-    handleClipSplit,
-    handleClipResetTrim,
-    handleTransitionChange,
-    handleSpeedChange,
-    handleApplySpeedAll,
-    handleTtsChange,
-    handleClipVoiceSelect,
-  }
-}

apps/web/src/pages/editing-planner/hooks/useClipOperations/index.ts

@@ -0,0 +1,38 @@
+import type { ClipData } from "../../types"
+import { useClipBasicOps } from "./useClipBasicOps"
+import { useClipTrim } from "./useClipTrim"
+import { useClipEffects } from "./useClipEffects"
+
+interface UseClipOperationsParams {
+  clips: ClipData[]
+  setClips: (updater: (prev: ClipData[]) => ClipData[]) => void
+}
+
+/**
+ * 片段操作 Hook
+ * 片段增删改查、排序、裁剪、分割、转场、调速、TTS、配音选择
+ */
+export const useClipOperations = ({ clips, setClips }: UseClipOperationsParams) => {
+  const basicOps = useClipBasicOps({ clips, setClips })
+  const trimOps = useClipTrim({ setClips })
+  const effectOps = useClipEffects({ setClips, handleClipUpdate: basicOps.handleClipUpdate })
+
+  return {
+    selectedClipId: basicOps.selectedClipId,
+    setSelectedClipId: basicOps.setSelectedClipId,
+    selectedClip: basicOps.selectedClip,
+    handleClipSelect: basicOps.handleClipSelect,
+    handleClipReorder: basicOps.handleClipReorder,
+    handleClipRemove: basicOps.handleClipRemove,
+    handleClipUpdate: basicOps.handleClipUpdate,
+    handleAddClip: basicOps.handleAddClip,
+    handleClipTrim: trimOps.handleClipTrim,
+    handleClipSplit: trimOps.handleClipSplit,
+    handleClipResetTrim: trimOps.handleClipResetTrim,
+    handleTransitionChange: effectOps.handleTransitionChange,
+    handleSpeedChange: effectOps.handleSpeedChange,
+    handleApplySpeedAll: effectOps.handleApplySpeedAll,
+    handleTtsChange: effectOps.handleTtsChange,
+    handleClipVoiceSelect: effectOps.handleClipVoiceSelect,
+  }
+}

apps/web/src/pages/editing-planner/hooks/useClipOperations/useClipBasicOps.ts

@@ -0,0 +1,86 @@
+import { useState, useMemo, useCallback } from "react"
+import { Modal } from "antd"
+import type { ClipData, ClipType } from "../../types"
+
+interface UseClipBasicOpsParams {
+  clips: ClipData[]
+  setClips: (updater: (prev: ClipData[]) => ClipData[]) => void
+}
+
+/**
+ * 片段基础操作 Hook
+ * 选中状态、增删改查、重排
+ */
+export function useClipBasicOps({ clips, setClips }: UseClipBasicOpsParams) {
+  const [selectedClipId, setSelectedClipId] = useState<string | null>(null)
+
+  const selectedClip = useMemo(
+    () => clips.find((c) => c.id === selectedClipId) || null,
+    [clips, selectedClipId],
+  )
+
+  const handleClipSelect = useCallback((clipId: string) => {
+    setSelectedClipId(clipId)
+  }, [])
+
+  const handleClipReorder = useCallback(
+    (fromIdx: number, toIdx: number) => {
+      setClips((prev) => {
+        const updated = [...prev]
+        const [moved] = updated.splice(fromIdx, 1)
+        updated.splice(toIdx, 0, moved)
+        return updated.map((c, i) => ({ ...c, order: i }))
+      })
+    },
+    [setClips],
+  )
+
+  const handleClipRemove = useCallback(
+    (clipId: string) => {
+      Modal.confirm({
+        title: "删除片段",
+        content: "确定要删除这个片段吗？此操作可通过撤销恢复。",
+        okText: "删除",
+        okType: "danger",
+        cancelText: "取消",
+        onOk: () => {
+          setClips((prev) => prev.filter((c) => c.id !== clipId))
+          if (selectedClipId === clipId) setSelectedClipId(null)
+        },
+      })
+    },
+    [setClips, selectedClipId],
+  )
+
+  const handleClipUpdate = useCallback(
+    (clipId: string, data: Partial<ClipData>) => {
+      setClips((prev) => prev.map((c) => (c.id === clipId ? { ...c, ...data } : c)))
+    },
+    [setClips],
+  )
+
+  const handleAddClip = useCallback(
+    (type: ClipType, duration: number) => {
+      const newClip: ClipData = {
+        id: `clip-${Date.now()}`,
+        type,
+        duration,
+        startOffset: 0,
+        order: clips.length,
+      }
+      setClips((prev) => [...prev, newClip])
+    },
+    [clips.length, setClips],
+  )
+
+  return {
+    selectedClipId,
+    setSelectedClipId,
+    selectedClip,
+    handleClipSelect,
+    handleClipReorder,
+    handleClipRemove,
+    handleClipUpdate,
+    handleAddClip,
+  }
+}

apps/web/src/pages/editing-planner/hooks/useClipOperations/useClipEffects.ts

@@ -0,0 +1,74 @@
+import { useCallback } from "react"
+import { message } from "antd"
+import type { ClipData, TransitionConfig, SpeedConfig, TtsConfig } from "../../types"
+import type { AssetItem } from "@/api/assets"
+
+interface UseClipEffectsParams {
+  setClips: (updater: (prev: ClipData[]) => ClipData[]) => void
+  handleClipUpdate: (clipId: string, data: Partial<ClipData>) => void
+}
+
+/**
+ * 片段效果操作 Hook
+ * 转场、调速、TTS、配音选择
+ */
+export function useClipEffects({ setClips, handleClipUpdate }: UseClipEffectsParams) {
+  const handleTransitionChange = useCallback(
+    (targetClipId: string | null, config: TransitionConfig) => {
+      if (targetClipId) {
+        handleClipUpdate(targetClipId, { transition: config })
+      }
+    },
+    [handleClipUpdate],
+  )
+
+  const handleSpeedChange = useCallback(
+    (targetClipId: string | null, config: SpeedConfig) => {
+      if (targetClipId) {
+        handleClipUpdate(targetClipId, { speed: config })
+      }
+    },
+    [handleClipUpdate],
+  )
+
+  const handleApplySpeedAll = useCallback(
+    (config: SpeedConfig) => {
+      setClips((prev) => prev.map((c) => ({ ...c, speed: { ...config } })))
+      message.success("已应用到所有片段")
+    },
+    [setClips],
+  )
+
+  const handleTtsChange = useCallback(
+    (targetClipId: string | null, ttsConfig: TtsConfig) => {
+      if (!targetClipId) return
+      handleClipUpdate(targetClipId, { tts_config: ttsConfig })
+    },
+    [handleClipUpdate],
+  )
+
+  const handleClipVoiceSelect = useCallback(
+    (clipId: string, asset: AssetItem | null) => {
+      setClips((prev) =>
+        prev.map((c) =>
+          c.id === clipId
+            ? {
+                ...c,
+                voice_asset_id: asset?.id ?? undefined,
+                voice_file_url: asset?.file_url ?? undefined,
+              }
+            : c,
+        ),
+      )
+    },
+    [setClips],
+  )
+
+  return {
+    handleTransitionChange,
+    handleSpeedChange,
+    handleApplySpeedAll,
+    handleTtsChange,
+    handleClipVoiceSelect,
+  }
+}

apps/web/src/pages/editing-planner/hooks/useClipOperations/useClipTrim.ts

@@ -0,0 +1,89 @@
+import { useCallback } from "react"
+import type { ClipData, TrimConfig } from "../../types"
+
+interface UseClipTrimParams {
+  setClips: (updater: (prev: ClipData[]) => ClipData[]) => void
+}
+
+/**
+ * 片段裁剪分割 Hook
+ * 裁剪、分割、重置裁剪
+ */
+export function useClipTrim({ setClips }: UseClipTrimParams) {
+  const handleClipTrim = useCallback(
+    (clipId: string, trimConfig: TrimConfig, newDuration: number) => {
+      setClips((prev) =>
+        prev.map((c) =>
+          c.id === clipId ? { ...c, trim_config: trimConfig, duration: newDuration } : c,
+        ),
+      )
+    },
+    [setClips],
+  )
+
+  const handleClipSplit = useCallback(
+    (clipId: string, splitRatio: number) => {
+      setClips((prev) => {
+        const idx = prev.findIndex((c) => c.id === clipId)
+        if (idx === -1) return prev
+        const clip = prev[idx]
+        const splitPoint = Math.round(clip.duration * splitRatio * 10) / 10
+        if (splitPoint < 0.5 || splitPoint >= clip.duration - 0.5) return prev
+
+        const firstHalf: ClipData = {
+          ...clip,
+          duration: splitPoint,
+          trim_config: clip.trim_config
+            ? {
+                ...clip.trim_config,
+                end_time: clip.trim_config.start_time + splitPoint,
+              }
+            : undefined,
+        }
+
+        const secondHalf: ClipData = {
+          ...clip,
+          id: `clip-${Date.now()}`,
+          duration: clip.duration - splitPoint,
+          startOffset: clip.startOffset + splitPoint,
+          trim_config: clip.trim_config
+            ? {
+                ...clip.trim_config,
+                start_time: clip.trim_config.start_time + splitPoint,
+              }
+            : undefined,
+          order: (clip.order ?? idx) + 1,
+        }
+
+        const updated = [...prev]
+        updated[idx] = firstHalf
+        updated.splice(idx + 1, 0, secondHalf)
+        return updated.map((c, i) => ({ ...c, order: i }))
+      })
+    },
+    [setClips],
+  )
+
+  const handleClipResetTrim = useCallback(
+    (clipId: string) => {
+      setClips((prev) =>
+        prev.map((c) => {
+          if (c.id !== clipId || !c.trim_config) return c
+          const originalDuration = c.trim_config.original_duration ?? c.duration
+          return {
+            ...c,
+            duration: originalDuration,
+            trim_config: undefined,
+          }
+        }),
+      )
+    },
+    [setClips],
+  )
+
+  return {
+    handleClipTrim,
+    handleClipSplit,
+    handleClipResetTrim,
+  }
+}