import { MyButtons } from '@/common';
import { Modal } from 'antd';
import { useEffect, useImperativeHandle, useState } from 'react';

export function MyModal(props?: any) {
  const [open, setOpen] = useState(false);
  const close = () => {
    setOpen(false);
  };

  useEffect(() => {
    if (open && props?.onOpen) {
      props.onOpen();
    }
  }, [open, props?.onOpen]);

  useImperativeHandle(props.myRef, () => ({
    close,
  }));
  return (
    <>
      {props?.trigger ? (
        <div onClick={() => setOpen(true)}>{props?.trigger}</div>
      ) : (
        <MyButtons.View
          title={props.title || '详情'}
          type={props.type || 'primary'}
          onClick={() => setOpen(true)}
        />
      )}
      <Modal
        title={props?.modal?.title || '标题'}
        open={open}
        onOk={() => {
          setOpen(false);
          props?.handleOk?.();
        }}
        onCancel={() => {
          setOpen(false);
          props?.onCancel?.();
        }}
        footer={props?.modal?.footer || false}
        {...props}
      >
        {props?.node}
      </Modal>
    </>
  );
}