import React, {Component} from 'react'; import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom"; import {getImageUrl, DragValidator} from 'educoder'; import {Tabs, Input, Checkbox, Button, notification} from 'antd'; import axios from 'axios'; import './common.css' const TabPane = Tabs.TabPane const loginInputsyl = { "width": " 100%", "height": "40px", } //父组件 EducoderLogin.js class LoginRegisterComponent extends Component { constructor(props) { super(props) this.state = { login: "", password: "", passwords: "", seconds: 60, codes: "", getverificationcodes: true, Phonenumberisnotco: undefined, Phonenumberisnotcobool: false, s: 'text', classpass: "text", readonlyInput: true, } } openNotification = (messge) => { notification.open({ message: "提示", description: messge, onClick: () => { console.log('Notification Clicked!'); }, }); }; StudyMakeMoney = () => { // 调用父组件方法 this.props.Setshowbool(); } // 点击表单后，改变type changeType = () => { this.setState({classpass: 'password'}); } changeTypey = () => { } //倒计时 getverificationcode = () => { if (this.state.Phonenumberisnotcobool === false ||this.state.Phonenumberisnotcobool === undefined) { if (this.state.login&&this.state.login.length === 0) { this.openNotification("请输入手机号或邮箱"); return } else { this.openNotification("请输入正确的手机号或邮箱"); } return; } if (this.state.getverificationcodes === true) { this.setState({ getverificationcodes: undefined, }) let timer = setInterval(() => { this.setState((preState) => ({ seconds: preState.seconds - 1, }), () => { if (this.state.seconds == 0) { clearInterval(timer); this.setState({ getverificationcodes: false, seconds: 60, }) } }); }, 1000) this.SMSverification(); } else { this.setState({ getverificationcodes: undefined, }) let timer = setInterval(() => { this.setState((preState) => ({ seconds: preState.seconds - 1, }), () => { if (this.state.seconds == 0) { clearInterval(timer); this.setState({ getverificationcodes: false, seconds: 60, }) } }); }, 1000) this.SMSverification(); } } //短信验证 SMSverification = () => { var url = `/accounts/get_verification_code.json`; axios.get((url), { params: { login: this.state.login, type: 2, } }).then((result) => { //验证有问题{"status":1,"message":"success"} console.log(result); }).catch((error) => { console.log(error); }) } cancelReadOnly = () => { this.setState({ readonlyInput: false, }) } //找回密码 Retrievepassword = () => { if (this.state.Phonenumberisnotcobool === false) { if (this.state.login.length === 0) { this.openNotification("请输入手机号或邮箱"); return } this.openNotification("请输入正确的手机号或邮箱"); return; } if (this.state.login === undefined || this.state.login == "") { this.openNotification(`请输入登录手机号码或邮箱`); return } else if (this.state.password === undefined || this.state.password == "") { this.openNotification(`请输入密码`); return } else if (this.state.passwords === undefined || this.state.passwords == "") { this.openNotification(`请输入密码`); return } else if (this.state.password !== this.state.passwords) { this.openNotification(`两次密码不相同`); return } else if (this.state.codes === undefined || this.state.codes == "") { this.openNotification(`请输入验证码`); return } var url = "/accounts/reset_password.json"; axios.post(url, { login: this.state.login, code: this.state.codes, new_password: this.state.password, new_password_confirmation: this.state.passwords, }).then((result) => { // console.log(result); //登录成功，会生成session this.openNotification("找回密码成功，请重新登入。"); window.location.href = "/login" }).catch((error) => { }) } openNotification = (messge) => { notification.open({ message: "提示", description: messge, onClick: () => { console.log('Notification Clicked!'); }, }); }; loginInputonChange = (e) => { // console.log(e.target.value); this.setState({ login: e.target.value, }) } loginInputonChanges = (e) => { // console.log(e.target.value); this.setState({ password: e.target.value, }) } loginInputonChangess = (e) => { // console.log(e.target.value); this.setState({ passwords: e.target.value, }) } //获取code codesonChange = (e) => { this.setState({ codes: e.target.value }) } inputOnBlur = (e) => { this.isCorrectname(e.target.value); // this.Emailphonenumberverification(e.target.value, id); } isCorrectname = (value) => { console.log(value.length); if (value.length === 0) { this.setState({ Phonenumberisnotco: undefined, Phonenumberisnotcobool: false, }) return; } // var telephone = $("#telephoneAdd.tianjia_phone").val(); var regph = /^[1][3,4,5,6,7,8][0-9]{9}$/; // var email = $("#add_email.tianjia_email").val(); var regemail = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/; // [1]手机号开头必须是1 [3,4,5,6,7,8] 第二位是3-8中的一个 [0-9]{9} 后边9位可以是0-9的任意数字。 var stringdata = undefined; if (!regph.test(value)) { stringdata = "手机号格式不正确"; this.setState({ Phonenumberisnotco: stringdata, Phonenumberisnotcobool: false, }) } else { this.setState({ Phonenumberisnotco: undefined, Phonenumberisnotcobool: true, }) return } if (!regemail.test(value)) { if ((value.indexOf("@") != -1) === true) { stringdata = "邮箱格式不正确"; } else { stringdata = "手机号格式不正确"; } this.setState({ Phonenumberisnotco: stringdata, Phonenumberisnotcobool: false, }) this.Emailphonenumberverification(value) return } else { this.setState({ Phonenumberisnotco: undefined, Phonenumberisnotcobool: true, }) return } } //邮箱手机号验证 Emailphonenumberverification = (value) => { var url = `/accounts/valid_email_and_phone.json`; axios.get((url), { params: { login: value, type: 2, } }).then((result) => { //验证有问题{"status":1,"message":"success"} // console.log(result); this.openNotification("验证码已发送，请注意查收!",2); }).catch((error) => { console.log(error); // this.setState({ // login:"", // logins:"", // }) }) } render() { const { activeKey, // 登录 autoLogin, // 注册 readAgreement, dragOk, login, password, passwords, classpass, seconds, getverificationcodes, Phonenumberisnotco, readonlyInput, codes, } = this.state // height: 346px; return (
找回密码
this.inputOnBlur(e)} onChange={this.loginInputonChange} style={{marginTop: '10px',height: "38px"}}> { Phonenumberisnotco && Phonenumberisnotco != "" ?

{Phonenumberisnotco}

:
}
{ getverificationcodes === undefined ? : getverificationcodes === true ? : }
); } } export default (LoginRegisterComponent);