/**
 * THIS IS AN AUTO-GENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
 */
import React, { useEffect } from 'react';
import { useIntl } from 'umi';
import { BetaSchemaForm } from '@ant-design/pro-form';
import type { ProFormLayoutType } from '@ant-design/pro-form';
import { create{{Table}}, update{{Table}} } from '@/generated/services';
import { formColumnsToFields } from '@/generated/services/utils';
import useRequestInfo from '@/generated/hooks/useRequestInfo';
import defaultFormProps from '{{pageImportPath}}/props/form';
import Submitter from '@/generated/components/submitter';
import { appendColumnsInitialData } from '@/generated/utils';

export type UpdateFormProps = {
  onCancel: () => void;
  onFinish: () => Promise<void>;
  onValuesChange?: (values: any) => void;
  visible: boolean;
  values?: Partial<API.{{Table}}>;
  initialValues?: Partial<API.{{Table}}> & API.FormExtraFields;
  layoutType?: ProFormLayoutType;
};

const fields = formColumnsToFields('{{table}}', defaultFormProps.columns);
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
  const isUpdate = props.values && !!props.values.id;
  const intl = useIntl();
  const { loading, data } = useRequestInfo('{{table}}', props.values?.id, fields);

  useEffect(() => {
    appendColumnsInitialData(defaultFormProps.columns, data);
  }, [data]);

  if (loading) {
    return null;
  }

  const FormProps = {
    layoutType: props.layoutType || 'ModalForm',
  };
  const isModal = ['ModalForm', 'DrawerForm'].includes(FormProps.layoutType);
  if (isModal) {
    Object.assign(FormProps, {
      visible: props.visible,
      modalProps: { keyboard: false, maskClosable: false, centered: true },
      onVisibleChange(visible: boolean) {
        if (!visible) {
          props.onCancel();
        }
      },
    });
  }

  const formItemLayout = {
    layout: 'horizontal',
    labelCol: { span: 6 },
    wrapperCol: { span: 18 },
    labelAlign: 'left',
    colon: false,
    ...(isModal && { width: 500 }),
  };

  return (
    <BetaSchemaForm<API.{{Table}}>
      title={
        isUpdate
          ? intl.formatMessage({ id: 'pages.searchTable.modify', defaultMessage: 'Modify' })
          : intl.formatMessage({ id: 'pages.searchTable.new', defaultMessage: 'New' })
      }
      {...FormProps}
      omitNil={false}
      submitter={Submitter({ fixOnFooter: !isModal, onCancel: props.onCancel })}
      onFinish={async (values: any) => {
        if (isUpdate) {
          Object.assign(values, { id: props.values?.id });
          await update{{Table}}({...props.initialValues, ...values}, data as API.{{Table}});
        } else {
          await create{{Table}}({...props.initialValues, ...values});
        }
        props.onFinish();
      }}
      initialValues={data}
      {...defaultFormProps}
      {...formItemLayout}
      columns={defaultFormProps.columns}
    />
  );
};

export default UpdateForm;