84 lines
2.3 KiB
JavaScript
84 lines
2.3 KiB
JavaScript
import React from 'react';
|
|
import {TextField, RaisedButton} from 'material-ui';
|
|
import {inject, observer} from 'mobx-react';
|
|
import './style.scss'
|
|
import {LINKS} from "../../routes";
|
|
import {APP_TYPE} from "../../config/app";
|
|
|
|
|
|
@inject('appstate')
|
|
@observer
|
|
export default class LoginComponent extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.props = props;
|
|
this.state = {
|
|
username: "",
|
|
password: "",
|
|
};
|
|
this.defaultState = Object.assign({}, this.state);
|
|
this.authStore = props.appstate.auth;
|
|
}
|
|
|
|
componentDidMount() {
|
|
|
|
}
|
|
|
|
login = () => {
|
|
const username = this.state.username;
|
|
const password = this.state.password;
|
|
const data = {
|
|
username: username,
|
|
password: password,
|
|
}
|
|
this.authStore.login(data).then(res => {
|
|
this.props.history.push(LINKS.DASHBOARD);
|
|
}).catch(err => {
|
|
alert(err.message);
|
|
});
|
|
};
|
|
|
|
register = () => {
|
|
this.props.history.push(LINKS.REGISTER);
|
|
}
|
|
|
|
render() {
|
|
|
|
let loginImage = 'http://giift.asacreative.com/giift_logo_wide.4d15de72.png';
|
|
if(APP_TYPE === 'btn') {
|
|
loginImage = 'https://www.niaga.asia/wp-content/uploads/2021/02/IMG-20210223-WA0025.jpg'
|
|
}
|
|
return (
|
|
<div className="loginWrapper">
|
|
<div className={'formContainer'}>
|
|
<img className={'logoLogin'} src={loginImage} />
|
|
<p className={'textLogin'}>Login into our System</p>
|
|
|
|
<div className={'formParent'}>
|
|
<div className={'inputContainer'}>
|
|
<input
|
|
className={'usernameForm'}
|
|
placeholder="Username"
|
|
onChange={(e) => this.setState({username: e.target.value})}
|
|
/>
|
|
<input
|
|
className={'passwordForm'}
|
|
placeholder="Password"
|
|
onChange={(e) => this.setState({password: e.target.value})}
|
|
type="password"
|
|
/>
|
|
</div>
|
|
|
|
<button onClick={() => this.login()} className={'buttonLogin'}>
|
|
Sign In
|
|
</button>
|
|
</div>
|
|
<div style={{marginTop:12,display:'flex',flexDirection:'row'}}>
|
|
<a onClick={()=> this.register()} style={{fontWeight:20,fontSize:14}}>Does not have account yet? Let's create your account now!</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
}
|