fix: Modal 组件默认居中 + 4 个弹窗统一使用 Modal 封装 #1325

Merged
auto-approve-bot merged 1 commits from fix/modal-centered-and-unify into develop 2026-08-09 22:01:06 +08:00
5 changed files with 15 additions and 14 deletions
+2 -2
View File
@@ -22,10 +22,10 @@ interface ModalComponent extends React.FC<ModalProps> {
warning: (config: ModalFuncProps) => ReturnType<typeof AntModal.warning>
}
const Modal: ModalComponent = ({ className, v21 = true, children, ...rest }) => {
const Modal: ModalComponent = ({ className, v21 = true, centered = true, children, ...rest }) => {
const v21Class = classNames(v21 && "xx-modal", className)
return (
<AntModal className={v21Class} {...rest}>
<AntModal className={v21Class} centered={centered} {...rest}>
{children}
</AntModal>
)
@@ -1,5 +1,6 @@
import React from "react"
import { Modal as AntModal, Select as AntSelect } from "antd"
import { Select as AntSelect } from "antd"
import Modal from "@/components/ui/Modal"
import { CATEGORY_OPTIONS } from "@/pages/assets/constants"
/* ============================================================
@@ -24,7 +25,7 @@ const BatchClassifyModal: React.FC<BatchClassifyModalProps> = ({
onCategoryChange,
confirmLoading,
}) => (
<AntModal
<Modal
title={`批量改分类(${selectedCount} 个素材)`}
open={open}
onCancel={onCancel}
@@ -43,7 +44,7 @@ const BatchClassifyModal: React.FC<BatchClassifyModalProps> = ({
options={CATEGORY_OPTIONS}
/>
</div>
</AntModal>
</Modal>
)
export default BatchClassifyModal
@@ -1,5 +1,5 @@
import React from "react"
import { Modal as AntModal } from "antd"
import Modal from "@/components/ui/Modal"
import type { AssetItem } from "@/pages/assets/types"
/* ============================================================
@@ -12,7 +12,7 @@ export interface PlayModalProps {
}
const PlayModal: React.FC<PlayModalProps> = ({ open, asset, onClose }) => (
<AntModal
<Modal
title={asset?.name ?? "播放"}
open={open}
onCancel={onClose}
@@ -28,7 +28,7 @@ const PlayModal: React.FC<PlayModalProps> = ({ open, asset, onClose }) => (
<p className="xx-asset-empty-fallback-id"> ID: {asset?.id}</p>
</div>
)}
</AntModal>
</Modal>
)
export default PlayModal
@@ -1,5 +1,5 @@
import React from "react"
import { Modal as AntModal } from "antd"
import Modal from "@/components/ui/Modal"
import { CopyOutlined, CheckOutlined } from "@ant-design/icons"
import { Button, Input } from "@/components/ui"
import { AI_KEYWORD_MAX_LENGTH } from "../../constants/titleLibrary"
@@ -28,7 +28,7 @@ export const AIGenerateModal: React.FC<AIGenerateModalProps> = ({
onAdopt,
}) => {
return (
<AntModal
<Modal
title="AI 生成标题"
open={open}
onCancel={onCancel}
@@ -116,6 +116,6 @@ export const AIGenerateModal: React.FC<AIGenerateModalProps> = ({
</div>
)}
</div>
</AntModal>
</Modal>
)
}
@@ -1,5 +1,5 @@
import React from "react"
import { Modal as AntModal } from "antd"
import Modal from "@/components/ui/Modal"
import { Input, Select } from "@/components/ui"
import type { TitleType } from "../../types/titleLibrary"
import { TITLE_MAX_LENGTH } from "../../constants/titleLibrary"
@@ -30,7 +30,7 @@ export const CreateTitleModal: React.FC<CreateTitleModalProps> = ({
onSubmit,
}) => {
return (
<AntModal
<Modal
title="新建标题"
open={open}
onCancel={onCancel}
@@ -84,6 +84,6 @@ export const CreateTitleModal: React.FC<CreateTitleModalProps> = ({
/>
</div>
</div>
</AntModal>
</Modal>
)
}