client/src/components/Login.js
changeset 89 06f609adfbf8
parent 62 b2514a9bcd49
child 90 990f2c928b15
equal deleted inserted replaced
88:2a861fed6bde 89:06f609adfbf8
    13     const password = this.password.value;
    13     const password = this.password.value;
    14 
    14 
    15     this.props.authActions.loginSubmit(username, password);
    15     this.props.authActions.loginSubmit(username, password);
    16   }
    16   }
    17 
    17 
       
    18   onClickRegister = (e) => {
       
    19     e.preventDefault();
       
    20     this.props.history.push('/register');
       
    21   }
       
    22 
    18   renderError() {
    23   renderError() {
    19     return (
    24     return (
    20       <Alert bsStyle="danger">Bad credentials</Alert>
    25       <Alert bsStyle="danger">Bad credentials</Alert>
    21     )
    26     )
    22   }
    27   }
    23 
    28 
    24   render() {
    29   render() {
       
    30 
       
    31     const panelHeader = (
       
    32       <h4 className="text-uppercase text-center">Login</h4>
       
    33     )
       
    34 
    25     return (
    35     return (
    26       <div>
    36       <div>
    27         <Navbar history={this.props.history} />
    37         <Navbar history={this.props.history} />
    28         <Grid fluid>
    38         <Grid fluid>
    29           <Row>
    39           <Row>
    30             <Col md={6} mdOffset={3}>
    40             <Col md={6} mdOffset={3}>
    31               <Panel>
    41               <Panel header={ panelHeader } className="panel-login">
    32                 <form>
    42                 <form>
    33                   <FormGroup>
    43                   <FormGroup>
    34                     <ControlLabel>Username</ControlLabel>
    44                     <ControlLabel>Username</ControlLabel>
    35                     <FormControl componentClass="input" type="text" inputRef={ref => { this.username = ref; }} />
    45                     <FormControl componentClass="input" type="text" inputRef={ref => { this.username = ref; }} />
    36                   </FormGroup>
    46                   </FormGroup>
    40                   </FormGroup>
    50                   </FormGroup>
    41                   { this.props.login.error && this.renderError() }
    51                   { this.props.login.error && this.renderError() }
    42                   <Button block bsStyle="primary" onClick={this.login}>Login</Button>
    52                   <Button block bsStyle="primary" onClick={this.login}>Login</Button>
    43                 </form>
    53                 </form>
    44               </Panel>
    54               </Panel>
       
    55               <p className="text-center">
       
    56                 <a className="text-muted" href="/register" onClick={ this.onClickRegister }>Not registered yet? Create an account.</a>
       
    57               </p>
    45             </Col>
    58             </Col>
    46           </Row>
    59           </Row>
    47         </Grid>
    60         </Grid>
    48       </div>
    61       </div>
    49     );
    62     );