import React, { useRef } from 'react';
import { DrawerForm, ProFormInstance, ProFormText } from '@ant-design/pro-components';
export type FormValueType = {
  target?: string;
  template?: string;
  type?: string;
  time?: string;
  frequency?: string;
} & Partial<API.PbcSpecification>;
export type UpdateFormProps = {
  onCancel: (flag?: boolean, formVals?: FormValueType) => void;
  onSubmit: (values: FormValueType) => Promise<void>;
  updateModalVisible: boolean;
};

const UpdateItemForm: React.FC<UpdateFormProps> = (props) => {
  const formRef = useRef<ProFormInstance>();
  return (
    <DrawerForm
      width={640}
      title={'新增规格项'}
      open={props.updateModalVisible}
      formRef={formRef}
      onFinish={(value: API.PbcSpecification) => {
        return props.onSubmit({ ...value })
      }}
      drawerProps={{
        destroyOnClose: true,
      }}
      onOpenChange={(visible) => {
        formRef.current?.resetFields();
        if (!visible) {
          props.onCancel();
        }
      }}
    >
      <ProFormText
        placeholder={'请输入规格项名称'}
        label="规格项名称"
        rules={[
          {
            required: true,
            message: '规格项名称为必填项',
          },
        ]}
        width="md"
        name="pbcSystemValue"
      />
    </DrawerForm>
  );
};

export default UpdateItemForm;