import React from 'react';
import { Form, Input } from 'antd';
import {ChangePasswordProps, ChangePasswordPrams} from './auth.interface';

export const ChangePassword: React.FC<ChangePasswordProps> = ({onChange}) => {

  const onSubmit = (value: ChangePasswordPrams) => {
    onChange && onChange(value);
  }
  
  return (
    <Form name="basic" onFinish={onSubmit}>
      <Form.Item
        label={<span className="header-item-pw">老密码</span>}
        rules={[{ required: true, message: '请输入老密码!' }]}
      >
        <Input.Password placeholder="请输入老密码!" name="oldPassword" />
      </Form.Item>
      <Form.Item
        label={<span className="header-item-pw">新密码</span>}
        rules={[{ required: true, message: '请输入新密码!' }]}
      >
        <Input.Password placeholder="请输入新密码!" name="newPassword" />
      </Form.Item>
      <Form.Item
        label={<span className="header-item-pw">确认新密码</span>}
        rules={[{ required: true, message: '确认新密码!' }]}
      >
        <Input.Password name="passwordAg" placeholder="请输入确认新密码!" />
      </Form.Item>
  </Form>
  )
};