import Invoice from '@/pages/Invoice/InvoiceVerification/components/Invoice';
import { postServiceInvoiceGetInvoiceRecord } from '@/services';
import { ModalForm } from '@ant-design/pro-components';
import { Form } from 'antd';
import { useEffect, useState } from 'react';

export default ({ recordId, getRecord, button }) => {
  const [data, setData] = useState<any>({});
  const getData = async () => {
    let ret = await postServiceInvoiceGetInvoiceRecord({
      query: {
        id: recordId,
      },
    });
    setData(ret.data);
  };
  useEffect(() => {
    if (recordId) {
      getData();
    }
  }, []);
  const [form] = Form.useForm();
  return (
    <ModalForm
      title="预览发票"
      trigger={button ? button : <a type="primary">预览</a>}
      onOpenChange={(open) => {
        if (open) {
          if (getRecord) {
            setData(getRecord());
          } else {
            getData();
          }
        }
      }}
      width={1200}
      form={form}
      autoFocusFirstInput
      submitter={false}
      modalProps={{
        destroyOnClose: true,
      }}
    >
      <hr />
      <Invoice data={data} />
    </ModalForm>
  );
};