You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
72 lines
2.7 KiB
72 lines
2.7 KiB
import React from "react";
|
|
import {Button, Form} from 'react-bootstrap'
|
|
import {Input} from "../ui/InputGroup";
|
|
import {LoginProps, LoginState} from "../entity";
|
|
import {Method, request} from "../interface";
|
|
import {LoginRes, LoginResMessage, LoginTransform} from "../result";
|
|
import {MyDialog} from "../ui/MyDialog";
|
|
import {Api} from "../api";
|
|
|
|
/**
|
|
* 登陆表单组件
|
|
*/
|
|
export class Login extends React.Component<LoginProps, LoginState>{
|
|
|
|
|
|
constructor(props: Readonly<LoginProps>) {
|
|
super(props)
|
|
|
|
this.state={
|
|
userId:"",
|
|
password:"",
|
|
result:null
|
|
}
|
|
}
|
|
|
|
//登录
|
|
login(){
|
|
|
|
let that=this
|
|
request(Api.account.login,Method.POST,{
|
|
userId:this.state.userId,
|
|
password:this.state.password
|
|
},new LoginTransform(),function (res:LoginRes) {
|
|
let message
|
|
switch (res.customResult) {
|
|
case LoginResMessage.ok:
|
|
that.props.onLoginSuccess(res);break
|
|
case LoginResMessage.form_error:message="表单不合法，请联系管理员"
|
|
// eslint-disable-next-line no-fallthrough
|
|
case LoginResMessage.valid_error:message="账号或密码错误"
|
|
that.setState({
|
|
result:<h3 className="text-danger text-center">{message}</h3>
|
|
})
|
|
break
|
|
}
|
|
})
|
|
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div className="d-flex align-items-center" style={{height:window.screen.availHeight+'px'}}>
|
|
<div className="container">
|
|
<Form>
|
|
<Input name="user" type="text" desc="用户账号" value={this.state.userId}
|
|
onChange={(value: string)=>{this.setState({userId:value})}} valid={{check:this.state.userId.length>0}}/>
|
|
|
|
<Input name="password" type="password" desc="用户密码" value={this.state.password}
|
|
onChange={(value: string)=>{this.setState({password:value})}} valid={{check:this.state.password.length>0}}/>
|
|
|
|
<Button variant="success" className="mt-3 col-2 mr-3" disabled={!(this.state.userId.length>0&&this.state.password.length>0)}
|
|
onClick={()=>this.login()}>登录</Button>
|
|
|
|
<Button variant="info" className="mt-3 col-2" onClick={()=>this.props.toRegister()}>跳转到注册</Button>
|
|
</Form>
|
|
</div>
|
|
|
|
<MyDialog content={this.state.result} open={this.state.result!==null} titleId="login-tip" menuName="登录反馈" onClose={()=>this.setState({result:null})}/>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|