react-antd-dashboard/build/layout/Login/index.js

React dashboard layout solution created using AntD and permission based navigation. Supports theming with Less, parameterized routes and private routing. Contains useful components for dashboard application.

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React from 'react';
import { Form, Button, Input } from 'antd';
import "./index.css";
import { UserOutlined, LockOutlined } from '@ant-design/icons';

class Login extends React.Component {
  constructor(...args) {
    super(...args);

    _defineProperty(this, "handleSubmit", values => {
      this.props.onLogin(values);
    });
  }

  render() {
    const {
      logo,
      loginLogoStyle
    } = this.props;
    return /*#__PURE__*/React.createElement("div", {
      className: "login-panel"
    }, logo && /*#__PURE__*/React.createElement("img", {
      src: logo,
      alt: "logo",
      className: "login-logo",
      style: loginLogoStyle
    }), /*#__PURE__*/React.createElement(Form, {
      onFinish: this.handleSubmit,
      className: "login-form"
    }, /*#__PURE__*/React.createElement(Form.Item, {
      rules: [{
        required: true,
        message: "Username is required!"
      }],
      name: "username"
    }, /*#__PURE__*/React.createElement(Input, {
      prefix: /*#__PURE__*/React.createElement(UserOutlined, {
        style: {
          color: "rgba(0,0,0,.25)"
        }
      }),
      placeholder: "Username"
    })), /*#__PURE__*/React.createElement(Form.Item, {
      name: "password",
      rules: [{
        required: true,
        message: "Password is required!"
      }]
    }, /*#__PURE__*/React.createElement(Input, {
      prefix: /*#__PURE__*/React.createElement(LockOutlined, null),
      type: "password",
      placeholder: "Password"
    })), /*#__PURE__*/React.createElement(Form.Item, null, /*#__PURE__*/React.createElement(Button, {
      type: "primary",
      htmlType: "submit",
      className: "login-form-button"
    }, "Login"))));
  }

}

export default Login;