6 import Navbar from './Navbar'; |
6 import Navbar from './Navbar'; |
7 import * as authActions from '../actions/authActions'; |
7 import * as authActions from '../actions/authActions'; |
8 |
8 |
9 class Login extends Component { |
9 class Login extends Component { |
10 |
10 |
|
11 state = { |
|
12 username: '', |
|
13 password: '' |
|
14 } |
|
15 |
|
16 handleInputChange = (e) => { |
|
17 const target = e.target; |
|
18 const value = target.value; |
|
19 const name = target.name; |
|
20 |
|
21 this.setState({ |
|
22 [name]: value |
|
23 }); |
|
24 } |
|
25 |
|
26 |
11 login = () => { |
27 login = () => { |
12 const username = this.username.value; |
28 const { username, password } = this.state; |
13 const password = this.password.value; |
|
14 |
29 |
15 this.props.authActions.loginSubmit(username, password); |
30 this.props.authActions.loginSubmit(username, password); |
16 } |
31 } |
17 |
32 |
18 submit = (e) => { |
33 submit = (e) => { |
63 <Col md={6} mdOffset={3}> |
78 <Col md={6} mdOffset={3}> |
64 <Panel header={ panelHeader } className="panel-login"> |
79 <Panel header={ panelHeader } className="panel-login"> |
65 <form onSubmit={this.submit}> |
80 <form onSubmit={this.submit}> |
66 <FormGroup validationState={ errorMessages && errorMessages.has('username') ? 'error' : null }> |
81 <FormGroup validationState={ errorMessages && errorMessages.has('username') ? 'error' : null }> |
67 <ControlLabel>Username</ControlLabel> |
82 <ControlLabel>Username</ControlLabel> |
68 <FormControl componentClass="input" type="text" inputRef={ref => { this.username = ref; }} /> |
83 <FormControl componentClass="input" type="text" onChange={this.handleInputChange} name="username" /> |
69 { this.renderErrorMessage(errorMessages, 'username') } |
84 { this.renderErrorMessage(errorMessages, 'username') } |
70 </FormGroup> |
85 </FormGroup> |
71 <FormGroup validationState={ errorMessages && errorMessages.has('password') ? 'error' : null }> |
86 <FormGroup validationState={ errorMessages && errorMessages.has('password') ? 'error' : null }> |
72 <ControlLabel>Password</ControlLabel> |
87 <ControlLabel>Password</ControlLabel> |
73 <FormControl componentClass="input" type="password" inputRef={ref => { this.password = ref; }} /> |
88 <FormControl componentClass="input" type="password" onChange={this.handleInputChange} name="password" /> |
74 { this.renderErrorMessage(errorMessages, 'password') } |
89 { this.renderErrorMessage(errorMessages, 'password') } |
75 </FormGroup> |
90 </FormGroup> |
76 { this.renderNonFieldErrors(errorMessages) } |
91 { this.renderNonFieldErrors(errorMessages) } |
77 <Button type="submit" block bsStyle="primary" onClick={this.login}>Login</Button> |
92 <Button type="submit" block bsStyle="primary" onClick={this.login}>Login</Button> |
78 </form> |
93 </form> |