114 lines
4.0 KiB
JavaScript
114 lines
4.0 KiB
JavaScript
var React = require("react");
|
||
var NavigationActions = require('../../actions/navigationActions');
|
||
var UserActions = require('../../actions/userActions');
|
||
var Router = require('react-router');
|
||
var Link = Router.Link;
|
||
var RibicaValidationMixin = require('../../components/shared/mixins/ribicaValidationMixin');
|
||
var ValidationUtils = require('../../utils/validation.js');
|
||
var LoginModel = require('../../models/login');
|
||
var UserStore = require('../../stores/userStore');
|
||
|
||
var Login = React.createClass({
|
||
mixins: [RibicaValidationMixin],
|
||
componentDidMount:function() {
|
||
UserStore.addChangeListener(this.onUserStoreChange);
|
||
},
|
||
componentWillUnmount: function() {
|
||
UserStore.removeChangeListener(this.onUserStoreChange);
|
||
},
|
||
onUserStoreChange: function() {
|
||
if(this.isMounted()) {
|
||
var loginState = UserStore.getLoginState();
|
||
this.setState({login: loginState});
|
||
if (loginState.loggedIn) {
|
||
setTimeout(function(){
|
||
NavigationActions.goToHome();
|
||
}, 0);
|
||
}
|
||
}
|
||
},
|
||
getInitialState: function() {
|
||
return {
|
||
email: '',
|
||
password: '',
|
||
login: UserStore.getLoginState()
|
||
};
|
||
},
|
||
validations: {
|
||
email:function(value) {
|
||
|
||
if(!ValidationUtils.isValidEmail(value)) {
|
||
return ['Neispravna email adresa.'];
|
||
}
|
||
return [];
|
||
},
|
||
password: function(value) {
|
||
if(!ValidationUtils.isValidRequired(value)) {
|
||
return ["Šifra je obavezna."];
|
||
}
|
||
return [];
|
||
}
|
||
},
|
||
renderErrorMessage: function(message){
|
||
return (<div className='error-message'>{message}</div>)
|
||
},
|
||
onLoginClick: function(e) {
|
||
this.doLogin();
|
||
e.preventDefault();
|
||
},
|
||
doLogin: function() {
|
||
if(this.validate()) {
|
||
var loginInfo = new LoginModel({
|
||
email: this.state.email,
|
||
password: this.state.password
|
||
});
|
||
|
||
UserActions.userLogin(loginInfo);
|
||
|
||
}
|
||
},
|
||
renderLoginFailure: function() {
|
||
|
||
var loginState = this.state.login;
|
||
if(!loginState.loggedIn) {
|
||
return (<div>{loginState.error}</div>)
|
||
}
|
||
|
||
return (<div></div>)
|
||
},
|
||
onKeyPress: function(e) {
|
||
var enterKeyCode = 13;
|
||
if(e.which == enterKeyCode) {
|
||
this.doLogin();
|
||
}
|
||
},
|
||
render : function() {
|
||
return (
|
||
<div className="col-lg-4 col-md-6 col-sm-8 col-xs-10 col-centered" style={{height: 500}}>
|
||
|
||
<h1 style={{paddingTop: 40}} className="text-center">Prijava</h1>
|
||
<br />
|
||
{this.renderLoginFailure()}
|
||
|
||
<form className>
|
||
<div className="form-group col-lg-12 col-md-12">
|
||
<input style={{marginBottom: 8}} type="text" className="form-control" onKeyPress={this.onKeyPress} onChange={this.handleChange('email')} placeholder="Email adresa" />
|
||
{this.getValidationMessages('email').map(this.renderErrorMessage)}
|
||
|
||
</div>
|
||
<div className="form-group col-lg-12 col-md-12">
|
||
<input style={{marginBottom: 8}} type="password" onKeyPress={this.onKeyPress} onChange={this.handleChange('password')} className="form-control" placeholder="Šifra" />
|
||
{this.getValidationMessages('password').map(this.renderErrorMessage)}
|
||
|
||
</div>
|
||
<input style={{color: 'white', fontWeight: 'bold', height: 44}} type="submit" onClick={this.onLoginClick} className=" mybutton center-block col-md-8 col-sm-8 col-xs-8 col-sm-push-2 col-xs-push-2 col-md-push-2" defaultValue="Prijava" />
|
||
</form>
|
||
<div className="text-center col-lg-12">
|
||
<h4>Niste registrovani? <Link to="registracija"><span>Registrujte se</span></Link></h4>
|
||
</div>
|
||
</div>);
|
||
}
|
||
});
|
||
|
||
module.exports = Login;
|