import React, {Component} from 'react'
|
import { Form, Icon, Input, Button, Checkbox, Dropdown, Menu, message, Modal } from 'antd'
|
import md5 from 'md5'
|
import moment from 'moment'
|
import Api from '@/api'
|
import zhCN from '@/locales/zh-CN/login.js'
|
import enUS from '@/locales/en-US/login.js'
|
import options from '@/store/options.js'
|
import Utils from '@/utils/utils.js'
|
import logourl from '../../assets/img/login-logo.png'
|
import './index.scss'
|
|
const { confirm } = Modal
|
|
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
|
}
|
}
|
|
changelang (item) {
|
// 切换语言
|
this.setState({
|
selectedlang: item,
|
dict: item.value === 'zh-CN' ? zhCN : enUS
|
})
|
}
|
|
md5Password (pwd) {
|
// md5密码加密
|
const salt = 'minkesoft'
|
return md5(md5(pwd + salt))
|
}
|
|
handleSubmit = e => {
|
// 登录参数检验
|
e.preventDefault()
|
if (!this.state.auth) {
|
confirm({
|
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
|
this.setState({
|
isDisabled: true
|
})
|
this.loginsubmit(values)
|
})
|
}
|
|
async loginsubmit (param) {
|
// 登录提交
|
// let password = this.md5Password(param.password)
|
let password = param.password
|
let result = await Api.loginsystem(param.username, password)
|
if (!result.IsError) {
|
Api.getusermsg(param.username, password).then(res => {
|
if (res.status) {
|
sessionStorage.setItem('UserID', res.UserID)
|
sessionStorage.setItem('SessionUid', Utils.getuuid())
|
sessionStorage.setItem('LoginUID', res.LoginUID)
|
localStorage.setItem('lang', this.state.selectedlang.value)
|
|
if (param.remember) { // 记住密码时账号密码存入localStorage
|
localStorage.setItem('username', param.username)
|
localStorage.setItem('password', param.password)
|
} else {
|
localStorage.removeItem('username')
|
localStorage.removeItem('password')
|
}
|
|
if (this.props.location.state && this.props.location.state.from.pathname) {
|
// 查看是否为其他页面跳转，路径存在时，跳回原页面
|
this.props.history.replace(this.props.location.state.from.pathname)
|
} else {
|
this.props.history.replace('/main')
|
}
|
} else {
|
message.warning(res.message)
|
}
|
})
|
} else {
|
message.warning(result.Message)
|
this.setState({
|
isDisabled: false
|
})
|
}
|
}
|
|
UNSAFE_componentWillMount () {
|
let timeStamp = new Date().getTime()
|
let str = md5('MK19' + options.AppId + timeStamp)
|
Api.systemauth(options.AppId, timeStamp).then(res => {
|
if (res.status && res.EPC === str) {
|
let box = []
|
for (let i = 0; i < 15; i++) {
|
let s = 'mksoft' + moment().add(i, 'days').format('YYYYMMDD')
|
box.push(md5(s))
|
}
|
box = box.join(',')
|
localStorage.setItem('AuthCode', box)
|
|
this.setState({
|
auth: true
|
})
|
} else {
|
localStorage.removeItem('AuthCode')
|
this.setState({
|
auth: false
|
})
|
}
|
})
|
|
// 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)) {
|
this.setState({
|
auth: true
|
})
|
}
|
}
|
|
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>
|
</div>
|
<div className="login-bottom">
|
<p>
|
<span className="split">Copyright©2017</span>
|
<span className="split">{this.state.dict['login.copyright']}</span>
|
<span>北京明科普华信息技术有限公司</span>
|
</p>
|
<p>
|
<span>ICP备案：</span>
|
<span>京ICP备12007830号</span>
|
</p>
|
</div>
|
</div>
|
)
|
}
|
}
|
|
export default Form.create()(Login)
|
