74 lines
3.3 KiB
JavaScript
74 lines
3.3 KiB
JavaScript
import React from "react";
|
|
import * as Act from "./interface/Actions";
|
|
import usrsvg from "./images/loginuser.svg";
|
|
import pswsvg from "./images/loginpas.svg";
|
|
|
|
export default class SignIn extends React.Component {
|
|
constructor() {
|
|
super();
|
|
this.state = { u: '', p: '', p1: '', p2: '' };
|
|
}
|
|
|
|
handleKeyPress(e) {
|
|
if (e.key === 'Enter') {
|
|
this.handleLogin();
|
|
}
|
|
}
|
|
|
|
handleLogin() {
|
|
Act.apiCall('login', 'ACCTKN', {
|
|
a: this.props.a, usr: this.state.u, psw: this.state.p,
|
|
p1: this.state.p1, p2: this.state.p2
|
|
});
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div style={{ display: "flex", justifyContent: "center" }} >
|
|
<div className="flexCol " style={{
|
|
justifyContent: "center", alignItems: "center",
|
|
marginTop: "50px", width: "300px", height: "300px",
|
|
backgroundImage: 'url("signin.png")', backgroundSize: "100%"
|
|
}}>
|
|
{this.props.a !== -1
|
|
? <div>
|
|
<div className="LognInp">
|
|
<span><img src={usrsvg} /></span>
|
|
<input type="text" name="u" placeholder="Username" required="required"
|
|
value={this.state.u} onChange={(e) => { this.setState({ u: e.target.value }) }} />
|
|
</div>
|
|
<div className="LognInp">
|
|
<span><img src={pswsvg} /></span>
|
|
<input type="password" name="p1" placeholder="Password" required="required"
|
|
key={this.props.a} value={this.state.p}
|
|
onKeyPress={this.handleKeyPress.bind(this)}
|
|
onChange={(e) => { this.setState({ p: e.target.value }) }} />
|
|
</div>
|
|
</div>
|
|
:
|
|
<div>
|
|
<div className="LognInp">
|
|
<span><img src={pswsvg} /></span>
|
|
<input type="password" name="p1" placeholder="New Password" required="required"
|
|
value={this.state.p1} onChange={(e) => { this.setState({ p1: e.target.value }) }} />
|
|
</div>
|
|
<div className="LognInp">
|
|
<span><img src={pswsvg} /></span>
|
|
<input type="password" name="p2" placeholder="Reenter Password" required="required"
|
|
value={this.state.p2}
|
|
onChange={(e) => { this.setState({ p2: e.target.value }) }} />
|
|
</div>
|
|
</div>
|
|
}
|
|
<div className="LognInp" style={{ justifyContent: "flex-end" }}>
|
|
<input type="submit" value="enter"
|
|
onClick={this.handleLogin.bind(this)} style={{ width: "145px" }} />
|
|
</div>
|
|
<div style={{ fontFamily: "Roboto", fontSize: "13px", color: "#ff073a" }}>
|
|
{this.props.msg}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
} |