import React from 'react';
import { connect } from 'dva';
import router from 'umi/router';
import store from '@/utils/store';
import { Input, Icon, Button, message } from 'antd';
import config from '@/config';
import styles from './index.less';

@connect()
class Login extends React.Component {
  state = {
    username: '',
    password: '',
  };

  localOnChangeUserName = e => {
    this.setState({ username: e.target.value });
  };

  localOnChangePassWord = e => {
    this.setState({ password: e.target.value });
  };

  login = () => {
    const { username, password } = this.state;
    const { dispatch } = this.props;
    dispatch({
      type: 'userLogin/login',
      payload: { userName: username, password },
    }).then(({ code, data }) => {
      if (code === 'sys.success') {
        const { token, userId } = data;
        // message.success("登录成功");
        store.set('token', token);
        store.set('userId', userId);
        router.push(config.home || '/profile/message');
      }
    });
  };

  render() {
    return (
      <div className={styles.root}>
        <div className={styles.container}>
          <div className={styles.box}>
            <div className={styles.title}>KIM3.0 平台业务架构</div>
            <Input
              className={styles.username}
              onChange={this.localOnChangeUserName}
              prefix={<Icon type="user" />}
              placeholder="请输入账号"
            />
            <Input
              className={styles.password}
              onChange={this.localOnChangePassWord}
              type="password"
              prefix={<Icon type="lock" />}
              placeholder="请输入密码"
              onPressEnter={this.login}
            />
            <Button className={styles.submit} type="primary" onClick={this.login}>
              登录
            </Button>
          </div>
          {/* <div className={styles.more}>
            <div className={styles.info} />
            <div className={styles.rights}>
              <span>copyright</span>
              <span>2019 KIM3.0技术中台部出品</span>
            </div>
          </div> */}
        </div>

        <div className={styles.line} />
      </div>
    );
  }
}

export default Login;