import React, { useEffect, useState } from 'react';
import {
  ProForm,
  ProFormDigit,
  ProFormText,
  ProFormSwitch,
  ProFormSelect
} from '@ant-design/pro-components';
import { Form, Modal, InputNumber } from 'antd';
import { useIntl } from '@umijs/max';
import FilesManager from '@/components/FilesManage/index';
const RoleForm: React.FC = (props: any) => {

  const [form] = Form.useForm();

  const { values } = props;

  useEffect(() => {
    console.log(values, 'values');

    form.resetFields();
    form.setFieldsValue(values);
  }, [form, props]);

  const intl = useIntl();
  const handleOk = () => {
    form.submit();
  };
  const handleCancel = () => {
    props.onCancel();
  };
  const handleFinish = async (values: any) => {
    props.onSubmit(values);
  };

  return (
    <Modal
      width={640}
      title={'设备补贴'}
      open={props.open}
      forceRender
      destroyOnClose
      onOk={handleOk}
      onCancel={handleCancel}
    >
      <ProForm
        form={form}
        submitter={false}
        layout="horizontal"
        onFinish={handleFinish}>
        <ProFormDigit
          name="id"
          label={'ID'}
          disabled
          hidden={true}
        />

        <ProForm.Group>
          <ProForm.Item
            label="设备类型"
            name={'deviceType'}
          >
            <InputNumber addonAfter="W" style={{ width: 150 }} />
          </ProForm.Item>
          <ProForm.Item
            label="补贴金额"
            name={'amount'}
          >
            <InputNumber addonBefore="￥" style={{ width: 150 }} />
          </ProForm.Item>
        </ProForm.Group>
        <ProForm.Group>
          <ProForm.Item
            label="上下浮动比例"
            name={'earingsFloat'}
          >
            <InputNumber addonAfter="%" style={{ width: 150 }} />
          </ProForm.Item>
          <ProForm.Item
            label="基础收入服务费"
            name={'baseAmount'}
          >
            <InputNumber style={{ width: 150 }} />
          </ProForm.Item>
          <ProForm.Item
            label="交付时间"
            name={'deliverDate'}
          >
            <InputNumber addonAfter="天" style={{ width: 150 }} />
          </ProForm.Item>
        </ProForm.Group>
      </ProForm>
    </Modal>
  );
};

export default RoleForm;
