2020-03-30

king

2020-03-30 461e4fff4b51d067671244eec63b097cd9012b6e

 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,37 @@
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 asyncComponent from '@/utils/asyncComponent'
import asyncLoadComponent from '@/utils/asyncLoadComponent'
import logourl from '@/assets/img/login-logo.png'
import loginbg from '@/assets/img/loginbg.jpg'
import './index.scss'

const { warning } = Modal
const LoginForm = asyncLoadComponent(() => import('./loginform'))
const Action = asyncComponent(() => import('@/tabviews/zshare/actionList'))
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,
    logo: window.GLOB.logo || logourl,
    bgImage: window.GLOB.bgImage || loginbg,
    platName: window.GLOB.platName || '明科商业智能开放平台',
    copyright: window.GLOB.copyRight || 'Copyright©2017    所有相关版权归    北京明科普华信息技术有限公司',
    ICP: window.GLOB.icp || 'ICP备案： 京ICP备12007830号',
    bgColor: window.GLOB.bgColor || '#000000',
    lineColor: window.GLOB.lineColor || '#1890ff',
    website: window.GLOB.website || (!window.GLOB.copyRight && 'http://minkesoft.com'),
    loaded: false
  }

  changelang (item) {
    // 切换语言
    this.setState({
      selectedlang: item,
      dict: item.value === 'zh-CN' ? zhCN : enUS
      dict: item === 'zh-CN' ? zhCN : enUS
    })
  }
  
@@ -55,93 +47,81 @@
    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)
    })
  }

  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)
        }
      })
    let res = await Api.getusermsg(param.username, param.password)
    if (res.status) {
      sessionStorage.setItem('UserID', res.UserID)
      sessionStorage.setItem('SessionUid', Utils.getuuid())
      sessionStorage.setItem('LoginUID', res.LoginUID)
      sessionStorage.setItem('User_Name', res.UserName)
      sessionStorage.setItem('Full_Name', res.FullName)
      sessionStorage.setItem('avatar', res.icon || '')
      
      localStorage.setItem('lang', param.lang)

      let _url = window.location.href.split('#')[0]

      if (param.remember) { // 记住密码时账号密码存入localStorage
        localStorage.setItem(_url, window.btoa(window.encodeURIComponent(JSON.stringify({username: param.username, password: param.password}))))
      } else {
        localStorage.removeItem(_url)
      }

      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(result.Message)
      message.warning(res.message)
      this.setState({
        isDisabled: false
      })
    }
  }

  UNSAFE_componentWillMount () {
  componentDidMount () {
    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)
    let _appId = window.GLOB.appId

        this.setState({
          auth: true
        })
      } else {
        localStorage.removeItem('AuthCode')
        this.setState({
          auth: false
        })
    if (options.systemType === 'cloud') { // 云端使用系统配置appid
      _appId = options.AppId
    }

    let str = md5('MK19' + _appId + timeStamp)
    Api.systemauth(_appId, timeStamp).then(res => {
      if (res.status) {
        if (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'))
@@ -150,91 +130,63 @@
        auth: true
      })
    }
  }

  componentDidMount () {
    const input = document.getElementById('username')
    if (input) {
      input.focus()
    }
    // let link = document.querySelector("link[rel*='icon']") || document.createElement('link')
    // link.type = 'image/x-icon'
    // link.rel = 'shortcut icon'
    // link.href = 'http://www.stackoverflow.com/favicon.ico'
    // document.getElementsByTagName('head')[0].appendChild(link)
  }

  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 className="login-container" style={{backgroundImage: 'url(' + this.state.bgImage + ')', backgroundColor: this.state.bgColor}}>
        <div className="logo" style={{borderColor: this.state.lineColor}}>
          <img src={this.state.logo} 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 className="login-middle" style={{borderColor: this.state.lineColor}}>
          <LoginForm
            platName={this.state.platName}
            dict={this.state.dict}
            auth={this.state.auth}
            lang={this.state.selectedlang}
            isDisabled={this.state.isDisabled}
            changelang={(value) => this.changelang(value)}
            handleSubmit={() => this.handleSubmit()}
            handleloaded={() => {this.setState({loaded: true})}}
            wrappedComponentRef={(inst) => this.loginformRef = inst}
          />
        </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>
          {this.state.website ?
            <a target="blank" href={this.state.website} dangerouslySetInnerHTML={{ __html: this.state.copyright.replace(/\s/ig, '&nbsp;') }}></a> :
            <p dangerouslySetInnerHTML={{ __html: this.state.copyright.replace(/\s/ig, '&nbsp;') }}></p>
          }
          <p dangerouslySetInnerHTML={{ __html: this.state.ICP.replace(/\s/ig, '&nbsp;') }}></p>
        </div>
        {this.state.loaded ? <div style={{position: 'fixed', bottom: '-300px'}}>
          <Action
            BID=""
            type=""
            menuType=""
            setting={{}}
            actions={[]}
            triggerBtn={{}}
            dict={{}}
            MenuID=""
            permRoles={{}}
            logcolumns={[]}
            ContainerId=""
            refreshdata={() => {}}
            triggerPopview={() => {}}
            getexceloutparam={() => {}}
            gettableselected={() => {}}
          />
        </div> : null}
      </div>
    )
  }
}

export default Form.create()(Login)
export default Login