import React from 'react';
import { Button, Checkbox, Form, Input } from 'antd';
import { SigninService } from './signin.service';
import './signin.css';
const onFinish = (values: any) => {
  const service = new SigninService();
  service
    .login(values)
    .then((res) => {
      console.log(res);
      //   if (res.status) {
      //     alert('User Created Successfully');
      // //  history.push("/Users-view")
      //     // onReset();
      //   } else {
      //     if (res.intlCode) {
      //      alert(res.internalMessage);
      //     } else {
      //       alert(res.internalMessage);
      //     }
      //   }
    })
    .catch((err) => {
      alert(err.message);
    });
};

const onFinishFailed = (errorInfo: any) => {
  console.log('Failed:', errorInfo);
};

const App: React.FC = () => (
  <div className="login-page">
    <div className="login-box">
      <div className="illustration-wrapper">
        <img src="back-imag.avif" alt="Login" />
      </div>
      <Form
        name="basic"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        style={{ maxWidth: 600 }}
        initialValues={{ remember: true }}
        onFinish={onFinish}
        onFinishFailed={onFinishFailed}
        autoComplete="off"
      >
        <Form.Item
          label="Username"
          name="username"
          rules={[{ required: true, message: 'Please input your username!' }]}
        >
          <Input />
        </Form.Item>

        <Form.Item
          label="Password"
          name="password"
          rules={[{ required: true, message: 'Please input your password!' }]}
        >
          <Input.Password />
        </Form.Item>

        <Form.Item
          name="remember"
          valuePropName="checked"
          wrapperCol={{ offset: 8, span: 16 }}
        >
          <Checkbox>Remember me</Checkbox>
        </Form.Item>

        <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
          <Button type="primary" htmlType="submit">
            Submit
          </Button>
        </Form.Item>
      </Form>
    </div>
  </div>
);

export default App;