| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { Form, Input, Button, Checkbox, Select, Modal, message, AutoComplete } from 'antd' |
| | | import { Form, Input, Button, Checkbox, Select, Modal, message, AutoComplete, Tooltip } from 'antd' |
| | | import { UserOutlined, LockOutlined, QrcodeOutlined, RedoOutlined, CloseCircleOutlined } from '@ant-design/icons' |
| | | import md5 from 'md5' |
| | | import moment from 'moment' |
| | |
| | | const { warning } = Modal |
| | | let LoginVerCodeTimer = null |
| | | const QrCode = asyncLoadComponent(() => import('@/components/qrcode')) |
| | | |
| | | const CheckWrap = ({checked, prolType, onChange, prolCont}) => { |
| | | const change = (e) => { |
| | | onChange(e.target.checked) |
| | | |
| | | if (prolType === 'once') { |
| | | localStorage.setItem(window.GLOB.sysSign + 'protocol', e.target.checked) |
| | | } |
| | | } |
| | | |
| | | return ( |
| | | <> |
| | | <Checkbox defaultChecked={checked} onChange={change} style={{marginRight: '8px'}}></Checkbox> |
| | | <span dangerouslySetInnerHTML={{__html: prolCont}}></span> |
| | | </> |
| | | ) |
| | | } |
| | | |
| | | class LoginTabForm extends Component { |
| | | static propTpyes = { |
| | |
| | | username: '', |
| | | password: '', |
| | | remember: true, |
| | | protocol: null, |
| | | delay: null, |
| | | loginWays: [], |
| | | smsId: '', |
| | |
| | | |
| | | timer = null |
| | | splitTime = 0 |
| | | scanParam = null |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { loginWays } = this.props |
| | | const { loginWays, prolType } = this.props |
| | | |
| | | let protocol = null |
| | | |
| | | if (prolType === 'once') { |
| | | protocol = localStorage.getItem(window.GLOB.sysSign + 'protocol') === 'true' |
| | | } else if (prolType === 'every_time') { |
| | | protocol = false |
| | | } |
| | | |
| | | let remember = true |
| | | |
| | | if (localStorage.getItem(window.GLOB.sysSign + 'remember') === 'false') { |
| | |
| | | scanId: activeKey === 'app_scan' || activeKey === 'weixin_scan' ? Utils.getuuid() : '', |
| | | timeout: false, |
| | | remember, |
| | | protocol, |
| | | wayLabels, |
| | | hasScan |
| | | }) |
| | |
| | | } |
| | | |
| | | checkResult = () => { |
| | | const { scanId } = this.state |
| | | const { scanId, protocol, dict } = this.state |
| | | |
| | | this.splitTime += 10000 |
| | | this.scanParam = null |
| | | |
| | | let _param = { |
| | | func: 'webapi_get_binding_key', |
| | |
| | | message.warning(res.message) |
| | | return |
| | | } else if (res.thd_party_appid && res.thd_party_member_id && res.thd_party_openid) { |
| | | if (protocol === false) { |
| | | this.scanParam = { |
| | | ...res, |
| | | scanId |
| | | } |
| | | message.warning(dict['protocol_check'] || '请阅读并同意协议!') |
| | | return |
| | | } |
| | | this.props.authLogin(res.thd_party_appid, res.thd_party_openid, res.thd_party_member_id, scanId) |
| | | } else { |
| | | this.timer = setTimeout(() => { |
| | |
| | | } |
| | | |
| | | handleConfirm = () => { |
| | | const { activeKey } = this.state |
| | | const { activeKey, protocol } = this.state |
| | | |
| | | if (protocol === false) return Promise.reject() |
| | | |
| | | // 表单提交时检查输入值是否正确 |
| | | return new Promise((resolve, reject) => { |
| | | this.props.form.validateFieldsAndScroll((err, values) => { |
| | |
| | | localStorage.setItem(window.GLOB.sysSign + 'users', window.btoa(window.encodeURIComponent(JSON.stringify(_users)))) |
| | | } |
| | | |
| | | changeAgree = (val) => { |
| | | this.setState({protocol: val}) |
| | | |
| | | if (this.scanParam && val) { |
| | | this.props.authLogin(this.scanParam.thd_party_appid, this.scanParam.thd_party_openid, this.scanParam.thd_party_member_id, this.scanParam.scanId) |
| | | } |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新 |
| | | */ |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { langList } = this.props |
| | | const { langList, isDisabled, prolType, prolCont } = this.props |
| | | const { getFieldDecorator } = this.props.form |
| | | const { activeKey, verdisabled, delay, loginWays, remember, scanId, timeout, hasScan, users, wayLabels, dict, lang, vispwd } = this.state |
| | | const { activeKey, verdisabled, delay, loginWays, remember, scanId, timeout, hasScan, users, wayLabels, dict, lang, vispwd, protocol } = this.state |
| | | |
| | | return ( |
| | | <Form className="login-form" id="login-form" onSubmit={this.handleSubmit}> |
| | |
| | | </Select> |
| | | )} |
| | | </Form.Item> : null} |
| | | {prolType ? <Form.Item className="proline"> |
| | | <CheckWrap checked={protocol} onChange={(val) => this.setState({protocol: val})} prolCont={prolCont} prolType={prolType}/> |
| | | </Form.Item> : null} |
| | | <Form.Item className="btn-login"> |
| | | <Button type="primary" htmlType="submit" className="login-form-button" disabled={this.props.isDisabled} loading={this.props.isDisabled}> |
| | | {dict['log_in'] || '登录'} |
| | | </Button> |
| | | {protocol === false ? <Tooltip overlayStyle={{maxWidth: 500}} placement="top" trigger="click" title={dict['protocol_check'] || '请阅读并同意协议!'}> |
| | | <Button type="primary" htmlType="submit" className="login-form-button disabled"> |
| | | {dict['log_in'] || '登录'} |
| | | </Button> |
| | | </Tooltip> : <Button type="primary" htmlType="submit" className="login-form-button" disabled={isDisabled} loading={isDisabled}> |
| | | {dict['log_in'] || '登录'} |
| | | </Button>} |
| | | </Form.Item> |
| | | {window.GLOB.sysType === 'cloud' && options.cdomain.indexOf('mk9h') > -1 ? <Form.Item className="register-line"> |
| | | <a href="http://www.minkesoft.com/signup" target="_blank" rel="noopener noreferrer" className="register">注册</a> |
| | |
| | | </Select> |
| | | )} |
| | | </Form.Item> : null} |
| | | {prolType ? <Form.Item className="proline"> |
| | | <CheckWrap checked={protocol} onChange={(val) => this.setState({protocol: val})} prolCont={prolCont} prolType={prolType}/> |
| | | </Form.Item> : null} |
| | | <Form.Item className="btn-login"> |
| | | <Button type="primary" htmlType="submit" className="login-form-button" disabled={this.props.isDisabled} loading={this.props.isDisabled}> |
| | | {protocol === false ? <Tooltip overlayStyle={{maxWidth: 500}} placement="top" trigger="click" title={dict['protocol_check'] || '请阅读并同意协议!'}> |
| | | <Button type="primary" htmlType="submit" className="login-form-button disabled"> |
| | | {dict['log_in'] || '登录'} |
| | | </Button> |
| | | </Tooltip> : <Button type="primary" htmlType="submit" className="login-form-button" disabled={isDisabled} loading={isDisabled}> |
| | | {dict['log_in'] || '登录'} |
| | | </Button> |
| | | </Button>} |
| | | </Form.Item> |
| | | {window.GLOB.sysType === 'cloud' && options.cdomain.indexOf('mk9h') > -1 ? <Form.Item className="register-line"> |
| | | <a href="http://www.minkesoft.com/signup" target="_blank" rel="noopener noreferrer" className="register">注册</a> |
| | |
| | | </div> |
| | | <img src={wxicon} alt=""/>{dict['wechat_scan'] || '请使用微信扫一扫登录'} |
| | | </div> |
| | | {prolType ? <Form.Item className="proline"> |
| | | <CheckWrap checked={protocol} onChange={this.changeAgree} prolCont={prolCont} prolType={prolType}/> |
| | | </Form.Item> : null} |
| | | </div> : null} |
| | | {activeKey === 'app_scan' ? <div className="form-item-wrap"> |
| | | <div className="form-scan-wrap"> |
| | |
| | | </div> |
| | | {dict['client_scan'] || '请使用客户端扫一扫登录'} |
| | | </div> |
| | | {prolType ? <Form.Item className="proline"> |
| | | <CheckWrap checked={protocol} onChange={this.changeAgree} prolCont={prolCont} prolType={prolType}/> |
| | | </Form.Item> : null} |
| | | </div> : null} |
| | | <div className={'login-ways ' + (activeKey === 'app_scan' || activeKey === 'weixin_scan' ? 'center' : '')}> |
| | | {loginWays.map(item => { |