/**
 * 表单预览弹窗组件
 * 用于在工作流设计页面预览启动表单
 */

import React from 'react';
import { Modal } from 'antd';
import { FormPreview } from '@/components/FormDesigner';
import type { FormDefinitionResponse } from '@/pages/Form/Definition/List/types';

interface FormPreviewModalProps {
    open: boolean;
    onClose: () => void;
    formDefinition: FormDefinitionResponse | null;
}

const FormPreviewModal: React.FC<FormPreviewModalProps> = ({
    open,
    onClose,
    formDefinition
}) => {
    if (!formDefinition) {
        return null;
    }

    const { schema } = formDefinition;

    return (
        <Modal
            title={`预览表单：${formDefinition.name}`}
            open={open}
            onCancel={onClose}
            footer={null}
            width={schema.formConfig.formWidth || 600}
            styles={{
                body: {
                    maxHeight: '70vh',
                    overflowY: 'auto',
                    padding: 0,
                }
            }}
        >
            <FormPreview
                fields={schema.fields}
                formConfig={schema.formConfig}
            />
        </Modal>
    );
};

export default FormPreviewModal;
