/**
 * desc: 基础对话框
 */

import React, { useState } from 'react';
import { Button } from 'antd';
import { VtxFullScreenBaseModal } from '@vtx/modals';

const App = () => {
    const [isModalVisible, setIsModalVisible] = useState(false);
    const [isVisible, setIsVisible] = useState(false);

    const showModal = () => {
        setIsModalVisible(true);
    };

    const handleOk = () => {
        setIsModalVisible(false);
    };

    const handleCancel = () => {
        setIsModalVisible(false);
    };

    return (
        <>
            <Button type="primary" onClick={showModal}>
                Open Modal
            </Button>
            <VtxFullScreenBaseModal
                title="Basic Modal"
                visible={isModalVisible}
                onOk={handleOk}
                onCancel={handleCancel}
            >
                <Button type="primary" onClick={() => setIsVisible(true)}>
                    Open Modal
                </Button>
                <p>Some contents...</p>
                <p>Some contents...</p>
            </VtxFullScreenBaseModal>
            <VtxFullScreenBaseModal
                title="Basic Modal"
                visible={isVisible}
                onOk={handleOk}
                onCancel={() => setIsVisible(false)}
            >
                <p>Some contents...</p>
                <p>Some contents...</p>
            </VtxFullScreenBaseModal>
        </>
    );
};

export default App;