/**
 * THIS IS AN AUTO-GENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
 */
import React, { useEffect } from 'react';
import { Modal } from 'antd';
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 { appendColumnsInitialData } from '@/generated/utils';
import defaultFormProps from '{{pageImportPath}}/props/form';

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 { steps: defaultSteps, ...restFormProps } = defaultFormProps;
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);
  const steps = defaultSteps.map((item) => ({ ...item, initialValues: data }));

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

  if (loading) {
    return null;
  }

  const isModal = props.layoutType !== 'Form';

  return (
    <BetaSchemaForm<API.{{Table}}>
      layoutType="StepsForm"
      omitNil={false}
      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();
      }}
      stepsFormRender={!isModal ? null : (dom, submitter) => {
        return (
          <Modal
            title={
              isUpdate
                ? intl.formatMessage({ id: 'pages.searchTable.modify', defaultMessage: 'Modify' })
                : intl.formatMessage({ id: 'pages.searchTable.new', defaultMessage: 'New' })
            }
            width={800}
            onCancel={() => props.onCancel()}
            visible={props.visible}
            footer={submitter}
            keyboard={false}
            maskClosable={false}
            destroyOnClose
          >
            {dom}
          </Modal>
        );
      }}
      steps={steps}
      {...restFormProps}
      columns={defaultFormProps.columns}
    />
  );
};

export default UpdateForm;