xiaoxia-saas/apps/web/src/pages/assets/components/AssetModals.tsx

/**
 * AssetLibrary 弹窗集合
 */
import React from "react"
import type { AssetItem, AssetKind } from "../types"
import type { SmartViewType } from "./BatchMarkModal"
import type { BatchOperationResult } from "@/api/assets"
import CreateLibraryModal from "./CreateLibraryModal"
import PlayModal from "./PlayModal"
import BatchTagModal from "./BatchTagModal"
import BatchClassifyModal from "./BatchClassifyModal"
import BatchMarkModal from "./BatchMarkModal"
import ResultDrawer from "./ResultDrawer"

export interface AssetModalsProps {
  /* 上传进度 */

  /* 新建视频库 */
  createModalOpen: boolean
  onCreateModalCancel: () => void
  onCreateModalOk: () => void
  newLibName: string
  onNewLibNameChange: (name: string) => void
  newLibKind: AssetKind
  onNewLibKindChange: (kind: AssetKind) => void
  createLoading: boolean

  /* 播放弹窗 */
  playingAsset: AssetItem | null
  onPlayClose: () => void

  /* 批量打标签 */
  tagModalOpen: boolean
  selectedCount: number
  onTagCancel: () => void
  onTagOk: () => void
  batchTags: string[]
  batchTagInput: string
  onTagInputChange: (val: string) => void
  onTagInputKeyDown: (e: React.KeyboardEvent) => void
  onRemoveTag: (tag: string) => void
  tagMode: "add" | "replace"
  onTagModeChange: (mode: "add" | "replace") => void
  batchLoading: boolean

  /* 批量改分类 */
  classifyModalOpen: boolean
  onClassifyCancel: () => void
  onClassifyOk: () => void
  batchCategory: string
  onCategoryChange: (val: string) => void

  /* 批量智能标记 */
  markModalOpen: boolean
  onMarkCancel: () => void
  onMarkOk: () => void
  batchSmartView: SmartViewType
  onSmartViewChange: (val: SmartViewType) => void

  /* 操作结果 Drawer */
  resultDrawerOpen: boolean
  operationTitle: string
  operationResult: BatchOperationResult | null
  onResultDrawerClose: () => void
}

export const AssetModals: React.FC<AssetModalsProps> = ({
  createModalOpen,
  onCreateModalCancel,
  onCreateModalOk,
  newLibName,
  onNewLibNameChange,
  newLibKind,
  onNewLibKindChange,
  createLoading,
  playingAsset,
  onPlayClose,
  tagModalOpen,
  selectedCount,
  onTagCancel,
  onTagOk,
  batchTags,
  batchTagInput,
  onTagInputChange,
  onTagInputKeyDown,
  onRemoveTag,
  tagMode,
  onTagModeChange,
  batchLoading,
  classifyModalOpen,
  onClassifyCancel,
  onClassifyOk,
  batchCategory,
  onCategoryChange,
  markModalOpen,
  onMarkCancel,
  onMarkOk,
  batchSmartView,
  onSmartViewChange,
  resultDrawerOpen,
  operationTitle,
  operationResult,
  onResultDrawerClose,
}) => {
  return (
    <>
      {/* 新建视频库弹窗 */}
      <CreateLibraryModal
        open={createModalOpen}
        onCancel={onCreateModalCancel}
        onOk={onCreateModalOk}
        name={newLibName}
        onNameChange={onNewLibNameChange}
        kind={newLibKind}
        onKindChange={onNewLibKindChange}
        confirmLoading={createLoading}
      />

      {/* 视频/音频播放弹窗 */}
      <PlayModal open={!!playingAsset} asset={playingAsset} onClose={onPlayClose} />

      {/* 批量打标签弹窗 */}
      <BatchTagModal
        open={tagModalOpen}
        selectedCount={selectedCount}
        onCancel={onTagCancel}
        onOk={onTagOk}
        tags={batchTags}
        onTagInputChange={onTagInputChange}
        onTagInputKeyDown={onTagInputKeyDown}
        onRemoveTag={onRemoveTag}
        tagInput={batchTagInput}
        tagMode={tagMode}
        onTagModeChange={onTagModeChange}
        confirmLoading={batchLoading}
      />

      {/* 批量改分类弹窗 */}
      <BatchClassifyModal
        open={classifyModalOpen}
        selectedCount={selectedCount}
        onCancel={onClassifyCancel}
        onOk={onClassifyOk}
        category={batchCategory}
        onCategoryChange={onCategoryChange}
        confirmLoading={batchLoading}
      />

      {/* 批量智能标记弹窗 */}
      <BatchMarkModal
        open={markModalOpen}
        selectedCount={selectedCount}
        onCancel={onMarkCancel}
        onOk={onMarkOk}
        smartView={batchSmartView}
        onSmartViewChange={onSmartViewChange}
        confirmLoading={batchLoading}
      />

      {/* 操作结果 Drawer */}
      <ResultDrawer
        open={resultDrawerOpen}
        title={operationTitle}
        result={operationResult}
        onClose={onResultDrawerClose}
      />
    </>
  )
}

export default AssetModals