shihezi-admin/src/pages/Area/Subway/UpLine/edit.tsx

import {
  ModalForm,
  ProForm,
  ProFormDigit,
  ProFormText,
} from '@ant-design/pro-components';
import {  Form } from 'antd';
import {DictOptionType, DictValueEnumObj} from "@/components/DictTag";
import {useEffect} from 'react'
export type ListFormProps = {
  onCancel: (flag?: boolean, formVars?: unknown) => void;
  onSubmit: (values: API.AreaSubWay.LinePoint) => Promise<void>;
  open: boolean;
  values?: Partial<API.AreaSubWay.LinePoint>;
  jobGroupOptions?: DictOptionType[];
  statusOptions?: DictValueEnumObj;
};

const waitTime = (time: number = 100) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(true);
    }, time);
  });
};

const SubWayEdit: React.FC<ListFormProps> = (props) => {
  const [form] = Form.useForm();

  useEffect(() => {
    form.resetFields();
    if(props.values) {
      form.setFieldsValue({
        stationName: props.values.stationName,
        stationId: props.values.stationId,
        longitude: props.values.longitude,
        latitude: props.values.latitude,
      });
    }
  }, [form, props]);

  const handleCancel = () => {
    props.onCancel();
    form.resetFields();
  };

  const handleFinish = async (values: Record<string, any>) => {
    props.onSubmit(values as API.AreaSubWay.LinePoint);
  };

  return (
    <ModalForm<{
      name: string;
      company: string;
    }>
      title={`${props.values ? '编辑' : '新增'}站点`}
      form={form}
      // layout="inline"
      autoFocusFirstInput
      open={props.open}
      modalProps={{
        destroyOnClose: true,
        onCancel: () => handleCancel(),
      }}
      submitTimeout={2000}
      onFinish={handleFinish}
    >
      <ProFormDigit
        name="stationId"
        label={'字典主键'}
        placeholder="请输入字典主键"
        disabled
        hidden={true}
      />
      <ProForm.Group>
        <ProFormText
          width="md"
          name="stationName"
          label="站点名称:"
          placeholder="请输入名称"
        />
      </ProForm.Group>
      <ProForm.Group>
        <ProFormDigit
          label="纬度"
          placeholder="请输入纬度"
          name="latitude"
          width="md"
          min={-90}
          max={90}
          fieldProps={{ controls: false }}
          rules={[
            {
              required: true,
              message: "请输入纬度！" ,
            },
          ]}
        />
        <ProFormDigit
          label="经度"
          placeholder="请输入经度"
          name="longitude"
          width="md"
          min={-180}
          max={180}
          fieldProps={{ controls: false }}
          rules={[
            {
              required: true,
              message: "请输入经度！" ,
            },
          ]}
        />
      </ProForm.Group>
    </ModalForm>
  );
};

export default SubWayEdit