diff --git a/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useClipImport.ts b/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useClipImport.ts new file mode 100755 index 000000000..93293e9bd --- /dev/null +++ b/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useClipImport.ts @@ -0,0 +1,38 @@ +import { useCallback } from "react" +import { message } from "antd" +import { useQueryClient, useMutation } from "@tanstack/react-query" +import { createClipsFromAssets } from "@/api/template-editor" + +const QUERY_KEY = "editPlanClips" + +export function useClipImport(planId: string | undefined) { + const queryClient = useQueryClient() + + const invalidate = () => { + queryClient.invalidateQueries({ queryKey: [QUERY_KEY, planId] }) + } + + const importFromAssetsMutation = useMutation({ + mutationFn: (assetIds: string[]) => createClipsFromAssets(planId!, assetIds), + onSuccess: (res) => { + invalidate() + message.success(`已导入 ${res.created_count} 个素材片段`) + }, + onError: () => { + message.error("导入素材失败") + }, + }) + + const importFromAssets = useCallback( + (assetIds: string[]) => { + if (!planId || assetIds.length === 0) return + importFromAssetsMutation.mutate(assetIds) + }, + [planId, importFromAssetsMutation], + ) + + return { + importFromAssets, + isImporting: importFromAssetsMutation.isPending, + } +} diff --git a/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useClipReorder.ts b/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useClipReorder.ts new file mode 100755 index 000000000..c325e30cd --- /dev/null +++ b/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useClipReorder.ts @@ -0,0 +1,39 @@ +import { useCallback } from "react" +import { message } from "antd" +import { useQueryClient, useMutation } from "@tanstack/react-query" +import type { ClipReorderItem } from "@/api/template-editor" +import { reorderEditPlanClips } from "@/api/template-editor" + +const QUERY_KEY = "editPlanClips" + +export function useClipReorder(planId: string | undefined) { + const queryClient = useQueryClient() + + const invalidate = () => { + queryClient.invalidateQueries({ queryKey: [QUERY_KEY, planId] }) + } + + const reorderMutation = useMutation({ + mutationFn: (items: ClipReorderItem[]) => reorderEditPlanClips(planId!, items), + onSuccess: () => { + invalidate() + }, + onError: () => { + message.error("排序失败") + invalidate() + }, + }) + + const reorderClips = useCallback( + (items: ClipReorderItem[]) => { + if (!planId || items.length === 0) return + reorderMutation.mutate(items) + }, + [planId, reorderMutation], + ) + + return { + reorderClips, + isReordering: reorderMutation.isPending, + } +} diff --git a/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useEditPlanClipMutations.ts b/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useEditPlanClipMutations.ts old mode 100644 new mode 100755 index a1551c3b3..5fa249e56 --- a/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useEditPlanClipMutations.ts +++ b/apps/web/src/pages/editing-planner/hooks/useEditPlanClips/useEditPlanClipMutations.ts @@ -1,19 +1,15 @@ import { useCallback } from "react" import { message } from "antd" import { useQueryClient, useMutation } from "@tanstack/react-query" -import type { - CreateEditPlanClipRequest, - UpdateEditPlanClipRequest, - ClipReorderItem, -} from "@/api/template-editor" +import type { CreateEditPlanClipRequest, UpdateEditPlanClipRequest } from "@/api/template-editor" import { createEditPlanClip, updateEditPlanClip, deleteEditPlanClip, - reorderEditPlanClips, batchDeleteEditPlanClips, - createClipsFromAssets, } from "@/api/template-editor" +import { useClipReorder } from "./useClipReorder" +import { useClipImport } from "./useClipImport" const QUERY_KEY = "editPlanClips" @@ -24,10 +20,6 @@ interface UseEditPlanClipMutationsOptions { clipsLength: number } -/** - * 编辑计划片段 CRUD Hook - * 封装创建、更新、删除、批量删除、重排序、素材导入等操作 - */ export function useEditPlanClipMutations({ planId, selectedClipId, @@ -40,7 +32,6 @@ export function useEditPlanClipMutations({ queryClient.invalidateQueries({ queryKey: [QUERY_KEY, planId] }) } - /* ── 创建片段 ── */ const createMutation = useMutation({ mutationFn: (data: CreateEditPlanClipRequest) => createEditPlanClip(planId!, data), onSuccess: () => { @@ -61,7 +52,6 @@ export function useEditPlanClipMutations({ [planId, clipsLength, createMutation], ) - /* ── 更新片段 ── */ const updateMutation = useMutation({ mutationFn: ({ clipId, data }: { clipId: string; data: UpdateEditPlanClipRequest }) => updateEditPlanClip(planId!, clipId, data), @@ -81,7 +71,6 @@ export function useEditPlanClipMutations({ [planId, updateMutation], ) - /* ── 删除片段 ── */ const deleteMutation = useMutation({ mutationFn: (clipId: string) => deleteEditPlanClip(planId!, clipId), onSuccess: () => { @@ -104,7 +93,6 @@ export function useEditPlanClipMutations({ [planId, selectedClipId, setSelectedClipId, deleteMutation], ) - /* ── 批量删除 ── */ const batchDeleteMutation = useMutation({ mutationFn: (clipIds: string[]) => batchDeleteEditPlanClips(planId!, clipIds), onSuccess: (res) => { @@ -127,45 +115,8 @@ export function useEditPlanClipMutations({ [planId, selectedClipId, setSelectedClipId, batchDeleteMutation], ) - /* ── 重排序 ── */ - const reorderMutation = useMutation({ - mutationFn: (items: ClipReorderItem[]) => reorderEditPlanClips(planId!, items), - onSuccess: () => { - invalidate() - }, - onError: () => { - message.error("排序失败") - invalidate() - }, - }) - - const reorderClips = useCallback( - (items: ClipReorderItem[]) => { - if (!planId || items.length === 0) return - reorderMutation.mutate(items) - }, - [planId, reorderMutation], - ) - - /* ── 从素材批量导入 ── */ - const importFromAssetsMutation = useMutation({ - mutationFn: (assetIds: string[]) => createClipsFromAssets(planId!, assetIds), - onSuccess: (res) => { - invalidate() - message.success(`已导入 ${res.created_count} 个素材片段`) - }, - onError: () => { - message.error("导入素材失败") - }, - }) - - const importFromAssets = useCallback( - (assetIds: string[]) => { - if (!planId || assetIds.length === 0) return - importFromAssetsMutation.mutate(assetIds) - }, - [planId, importFromAssetsMutation], - ) + const { reorderClips, isReordering } = useClipReorder(planId) + const { importFromAssets, isImporting } = useClipImport(planId) return { addClip, @@ -177,7 +128,7 @@ export function useEditPlanClipMutations({ isCreating: createMutation.isPending, isUpdating: updateMutation.isPending, isDeleting: deleteMutation.isPending, - isReordering: reorderMutation.isPending, - isImporting: importFromAssetsMutation.isPending, + isReordering, + isImporting, } }