From 646c5cebacb33e93829bec972a09be1ae098b2b2 Mon Sep 17 00:00:00 2001 From: xiaoxia Date: Mon, 27 Jul 2026 12:53:34 +0800 Subject: [PATCH] =?UTF-8?q?refactor(asset-ops):=20=E9=87=8D=E5=86=99?= =?UTF-8?q?=E4=B8=BB=E5=85=A5=E5=8F=A3=E4=B8=BA=E7=BB=84=E5=90=88=E5=B1=82?= =?UTF-8?q?=EF=BC=8C=E4=BF=9D=E6=8C=81=E5=AF=BC=E5=87=BA=E5=85=BC=E5=AE=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/assets/hooks/useAssetOperations.ts | 158 +++++++----------- 1 file changed, 61 insertions(+), 97 deletions(-) diff --git a/apps/web/src/pages/assets/hooks/useAssetOperations.ts b/apps/web/src/pages/assets/hooks/useAssetOperations.ts index ce99f80a3..160ca3d23 100644 --- a/apps/web/src/pages/assets/hooks/useAssetOperations.ts +++ b/apps/web/src/pages/assets/hooks/useAssetOperations.ts @@ -1,3 +1,9 @@ +/** + * 素材操作 Hook（入口） + * 组合各子模块，保持导出不变 + * + * 子模块位于 ./asset-operations/ + */ import { useState, useCallback } from "react" import { useQueryClient } from "@tanstack/react-query" import { useSingleOperations, useBatchHelpers } from "./asset-operations/useSingleOperations" @@ -7,8 +13,8 @@ import { useBatchClassify, useBatchMark, } from "./asset-operations/batchOperations" -import type { SmartViewType } from "../components/BatchMarkModal" import type { BatchOperationResult } from "@/api/assets" +import type { SmartViewType } from "../components/BatchMarkModal" interface UseAssetOperationsProps { selectedIds: Set @@ -17,104 +23,62 @@ interface UseAssetOperationsProps { export function useAssetOperations({ selectedIds, setSelectedIds }: UseAssetOperationsProps) { const queryClient = useQueryClient() - const { invalidateAssets, showOperationResult: showResultBase } = useBatchHelpers( - queryClient, - setSelectedIds, - ) /* ── 诊断状态 ── */ const [diagnosingId, setDiagnosingId] = useState(null) - /* ── 批量操作弹窗状态 ── */ - const [tagModalOpen, setTagModalOpen] = useState(false) - const [classifyModalOpen, setClassifyModalOpen] = useState(false) - const [markModalOpen, setMarkModalOpen] = useState(false) - const [resultDrawerOpen, setResultDrawerOpen] = useState(false) - - /* ── 批量打标签表单 ── */ - const [batchTagInput, setBatchTagInput] = useState("") - const [batchTags, setBatchTags] = useState([]) - const [tagMode, setTagMode] = useState<"add" | "replace">("add") - - /* ── 批量改分类表单 ── */ - const [batchCategory, setBatchCategory] = useState("") - - /* ── 批量智能标记表单 ── */ - const [batchSmartView, setBatchSmartView] = useState("recommended") - /* ── 操作结果 ── */ + const [resultDrawerOpen, setResultDrawerOpen] = useState(false) const [operationResult, setOperationResult] = useState(null) const [operationTitle, setOperationTitle] = useState("") - /* ── 批量操作 loading ── */ - const [batchLoading, setBatchLoading] = useState(false) - - /* ── 操作结果展示 ── */ - const showOperationResult = useCallback( - (result: BatchOperationResult, title: string, clearSelection = true) => { - showResultBase( - result, - title, - setOperationResult, - setOperationTitle, - setResultDrawerOpen, - clearSelection, - ) - }, - [showResultBase], - ) - /* ── 单个操作 ── */ const { handleDiagnose: handleDiagnoseRaw, handleSingleDelete } = useSingleOperations({ selectedIds, setSelectedIds, - invalidateAssets, }) + // 包装一下，加上 diagnosingId 状态 const handleDiagnose = useCallback( - (asset: Parameters[0]) => handleDiagnoseRaw(asset, setDiagnosingId), + async (asset: Parameters[0]) => { + setDiagnosingId(asset.id) + try { + await handleDiagnoseRaw(asset) + } finally { + setDiagnosingId(null) + } + }, [handleDiagnoseRaw], ) - /* ── 批量操作 deps ── */ - const batchDeps = { + /* ── 批量操作辅助 ── */ + const { invalidateAssets } = useBatchHelpers({ queryClient, setSelectedIds }) + + // 包装 showResult 适配子模块的接口 + const showResult = useCallback( + (result: BatchOperationResult, title: string, clearSelection = true) => { + setOperationResult(result) + setOperationTitle(title) + setResultDrawerOpen(true) + if (clearSelection) setSelectedIds(new Set()) + }, + [setSelectedIds], + ) + + /* ── 批量操作 ── */ + const { batchLoading: deleteLoading, handleBatchDelete } = useBatchDelete({ selectedIds, invalidateAssets, - showResult: showOperationResult, - setLoading: setBatchLoading, - queryClient, - } - - /* ── 批量删除 ── */ - const handleBatchDelete = useBatchDelete(batchDeps) - - /* ── 批量打标签 ── */ - const { handleBatchTag, handleTagInputKeyDown, removeBatchTag } = useBatchTag({ - ...batchDeps, - batchTags, - setBatchTags, - tagMode, - setTagMode, - setTagModalOpen, - setBatchTagInput, - batchTagInput, + showResult, }) - /* ── 批量改分类 ── */ - const handleBatchClassify = useBatchClassify({ - ...batchDeps, - batchCategory, - setBatchCategory, - setClassifyModalOpen, - }) + const tagResult = useBatchTag({ selectedIds, queryClient, showResult }) + const classifyResult = useBatchClassify({ selectedIds, queryClient, showResult }) + const markResult = useBatchMark({ selectedIds, queryClient, showResult }) - /* ── 批量智能标记 ── */ - const handleBatchMark = useBatchMark({ - ...batchDeps, - batchSmartView, - setBatchSmartView, - setMarkModalOpen, - }) + // 取任一批量操作的 loading 状态（任意一个在加载都算加载中） + const batchLoading = + deleteLoading || tagResult.batchLoading || classifyResult.batchLoading || markResult.batchLoading /* ── 关闭结果 Drawer ── */ const handleResultDrawerClose = useCallback(() => { @@ -131,29 +95,29 @@ export function useAssetOperations({ selectedIds, setSelectedIds }: UseAssetOper // 批量操作 loading batchLoading, // 批量打标签 - tagModalOpen, - setTagModalOpen, - batchTagInput, - setBatchTagInput, - batchTags, - setBatchTags, - tagMode, - setTagMode, - handleBatchTag, - handleTagInputKeyDown, - removeBatchTag, + tagModalOpen: tagResult.tagModalOpen, + setTagModalOpen: tagResult.setTagModalOpen, + batchTagInput: tagResult.batchTagInput, + setBatchTagInput: tagResult.setBatchTagInput, + batchTags: tagResult.batchTags, + setBatchTags: tagResult.setBatchTags, + tagMode: tagResult.tagMode, + setTagMode: tagResult.setTagMode, + handleBatchTag: tagResult.handleBatchTag, + handleTagInputKeyDown: tagResult.handleTagInputKeyDown, + removeBatchTag: tagResult.removeBatchTag, // 批量改分类 - classifyModalOpen, - setClassifyModalOpen, - batchCategory, - setBatchCategory, - handleBatchClassify, + classifyModalOpen: classifyResult.classifyModalOpen, + setClassifyModalOpen: classifyResult.setClassifyModalOpen, + batchCategory: classifyResult.batchCategory, + setBatchCategory: classifyResult.setBatchCategory, + handleBatchClassify: classifyResult.handleBatchClassify, // 批量智能标记 - markModalOpen, - setMarkModalOpen, - batchSmartView, - setBatchSmartView, - handleBatchMark, + markModalOpen: markResult.markModalOpen, + setMarkModalOpen: markResult.setMarkModalOpen, + batchSmartView: markResult.batchSmartView as SmartViewType, + setBatchSmartView: markResult.setBatchSmartView, + handleBatchMark: markResult.handleBatchMark, // 批量删除 handleBatchDelete, // 操作结果