king
2019-11-23 9f9d68cf40f1d7470bfb49220266b26663cbb722
src/views/login/index.jsx
@@ -1,5 +1,5 @@
import React, {Component} from 'react'
import { Form, Icon, Input, Button, Checkbox, Dropdown, Menu, message, Modal } from 'antd'
import { message } from 'antd'
import md5 from 'md5'
import moment from 'moment'
import Api from '@/api'
@@ -7,45 +7,25 @@
import enUS from '@/locales/en-US/login.js'
import options from '@/store/options.js'
import Utils from '@/utils/utils.js'
import asyncComponent from '@/utils/asyncComponent'
import logourl from '../../assets/img/login-logo.png'
import './index.scss'
const { warning } = Modal
const LoginForm = asyncComponent(() => import('./loginform'))
const iszhCN = !localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN'
class Login extends Component {
  constructor (props) {
    super(props)
    const iszhCN = !localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN'
    this.state = {
      langs: [{
        name: '中文简体',
        value: 'zh-CN'
      }, {
        name: 'English',
        value: 'en-US'
      }],
      selectedlang: iszhCN ?
        {
          name: '中文简体',
          value: 'zh-CN'
        } :
        {
          name: 'English',
          value: 'en-US'
        },
      dict: iszhCN ? zhCN : enUS,
      isDisabled: false,
      auth: false
    }
  state = {
    selectedlang: iszhCN ? 'zh-CN' : 'en-US',
    dict: iszhCN ? zhCN : enUS,
    isDisabled: false,
    auth: false
  }
  changelang (item) {
    // 切换语言
    this.setState({
      selectedlang: item,
      dict: item.value === 'zh-CN' ? zhCN : enUS
      dict: item === 'zh-CN' ? zhCN : enUS
    })
  }
  
@@ -55,25 +35,12 @@
    return md5(md5(pwd + salt))
  }
  handleSubmit = e => {
    // 登录参数检验
    e.preventDefault()
    if (!this.state.auth) {
      warning({
        title: this.state.dict['login.auth.tip'],
        okText: this.state.dict['login.auth.ok'],
        cancelText: this.state.dict['login.auth.cancel'],
        onOk() {},
        onCancel() {}
      })
      return
    }
    this.props.form.validateFields((err, values) => {
      if (err) return
  handleSubmit = () => {
    this.loginformRef.handleConfirm().then(res => {
      this.setState({
        isDisabled: true
      })
      this.loginsubmit(values)
      this.loginsubmit(res)
    })
  }
@@ -88,7 +55,7 @@
          sessionStorage.setItem('UserID', res.UserID)
          sessionStorage.setItem('SessionUid', Utils.getuuid())
          sessionStorage.setItem('LoginUID', res.LoginUID)
          localStorage.setItem('lang', this.state.selectedlang.value)
          localStorage.setItem('lang', param.lang)
    
          if (param.remember) { // 记住密码时账号密码存入localStorage
            localStorage.setItem('username', param.username)
@@ -116,7 +83,7 @@
    }
  }
  UNSAFE_componentWillMount () {
  componentDidMount () {
    let timeStamp = new Date().getTime()
    let str = md5('MK19' + options.AppId + timeStamp)
    Api.systemauth(options.AppId, timeStamp).then(res => {
@@ -140,9 +107,6 @@
      }
    })
    // console.log(options)
    // localStorage.setItem('AuthCode', [md5('mksoft' + moment().format('YYYYMMDD'))])
    let authCode = localStorage.getItem('AuthCode')
    let _s = md5('mksoft' + moment().format('YYYYMMDD'))
    if (authCode && authCode.includes(_s)) {
@@ -152,74 +116,22 @@
    }
  }
  componentDidMount () {
    const input = document.getElementById('username')
    if (input) {
      input.focus()
    }
  }
  render () {
    const { getFieldDecorator } = this.props.form
    const menu = (
      <Menu>
        {this.state.langs.map((item, index) => {
          return (
            <Menu.Item key={index} onClick={() => {this.changelang(item)}}>
              <span>{item.name}</span>
            </Menu.Item>
          )
        })}
      </Menu>
    )
    return (
      <div className="login-container">
        <div className="logo">
          <img src={logourl} alt=""/>
        </div>
        <div className="login-middle">
          <Form onSubmit={this.handleSubmit} className="login-form">
            <h4>明科商业智能开放平台</h4>
            <Form.Item>
              {getFieldDecorator('username', {
                rules: [{ required: true, message: this.state.dict['login.username.empty'] }],
                initialValue: localStorage.getItem('username') || '',
              })(
                <Input
                  prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
                  placeholder={this.state.dict['login.username']}
                />,
              )}
            </Form.Item>
            <Form.Item>
              {getFieldDecorator('password', {
                rules: [{ required: true, message: this.state.dict['login.password.empty'] }],
                initialValue: localStorage.getItem('password') || '',
              })(
                <Input
                  prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
                  type="password"
                  placeholder={this.state.dict['login.password']}
                />,
              )}
            </Form.Item>
            <Form.Item className="minline">
              {getFieldDecorator('remember', {
                valuePropName: 'checked',
                initialValue: true,
              })(<Checkbox>{this.state.dict['login.remember']}</Checkbox>)}
              <Dropdown overlay={menu} trigger={['click']} placement="bottomRight">
                <span className="ant-dropdown-link">
                  {this.state.selectedlang.name} <Icon type="down" />
                </span>
              </Dropdown>
            </Form.Item>
            <Form.Item className="btn-login">
              <Button type="primary" htmlType="submit" className="login-form-button" disabled={this.state.isDisabled} loading={this.state.isDisabled}>
                {this.state.dict['login.submit']}
              </Button>
            </Form.Item>
          </Form>
          <LoginForm
            dict={this.state.dict}
            auth={this.state.auth}
            lang={this.state.selectedlang}
            isDisabled={this.state.isDisabled}
            changelang={(value) => this.changelang(value)}
            handleSubmit={() => this.handleSubmit()}
            wrappedComponentRef={(inst) => this.loginformRef = inst}
          />
        </div>
        <div className="login-bottom">
          <p>
@@ -237,4 +149,4 @@
  }
}
export default Form.create()(Login)
export default Login