diff --git a/frontend/src/components/ui/dialog.tsx b/frontend/src/components/ui/dialog.tsx index c680b9d3..81748675 100644 --- a/frontend/src/components/ui/dialog.tsx +++ b/frontend/src/components/ui/dialog.tsx @@ -4,7 +4,35 @@ import { X } from "lucide-react" import { cn } from "@/lib/utils" -const Dialog = DialogPrimitive.Root +/** + * 修复 Radix UI Dialog 关闭后 body.style.pointerEvents 残留的问题 + * 当 Dialog 从打开变为关闭时,自动清理 body 样式 + */ +const Dialog: React.FC> = ({ open, onOpenChange, ...props }) => { + // 监听 open 状态变化,关闭时清理 body 样式 + React.useEffect(() => { + if (open === false) { + // 延迟执行,确保在 Dialog 关闭动画之后 + const timer = setTimeout(() => { + // 强制移除 body 的 pointer-events 限制 + if (document.body.style.pointerEvents === 'none') { + document.body.style.pointerEvents = ''; + } + }, 350); // 稍微比 Dialog 动画时间(200ms)长一点 + + return () => clearTimeout(timer); + } + }, [open]); + + return ( + + ); +}; +Dialog.displayName = "Dialog" const DialogTrigger = DialogPrimitive.Trigger diff --git a/frontend/src/pages/Form/Definition/components/FormBasicInfoModal.tsx b/frontend/src/pages/Form/Definition/components/FormBasicInfoModal.tsx index 65037afe..53815598 100644 --- a/frontend/src/pages/Form/Definition/components/FormBasicInfoModal.tsx +++ b/frontend/src/pages/Form/Definition/components/FormBasicInfoModal.tsx @@ -47,21 +47,20 @@ const FormBasicInfoModal: React.FC = ({ // 加载分类列表和初始化数据 useEffect(() => { - if (visible) { - loadCategories(); - if (mode === 'edit' && record) { - setFormData({ - name: record.name, - key: record.key, - categoryId: record.categoryId, - description: record.description || '', - isTemplate: record.isTemplate || false, - }); - } else if (mode === 'create') { - resetForm(); - } - } else { - // 弹窗关闭时重置表单数据 + // 只在弹窗打开时初始化数据 + if (!visible) return; + + loadCategories(); + + if (mode === 'edit' && record) { + setFormData({ + name: record.name, + key: record.key, + categoryId: record.categoryId, + description: record.description || '', + isTemplate: record.isTemplate || false, + }); + } else if (mode === 'create') { resetForm(); } }, [visible, mode, record?.id]); // 只依赖 record.id 而不是整个 record 对象