2017-03-03 21:09:40 +08:00
|
|
|
import React from 'react';
|
|
|
|
|
2017-03-30 20:55:54 +08:00
|
|
|
import { Dropdown } from 'react-toolbox';
|
2017-03-03 21:09:40 +08:00
|
|
|
|
|
|
|
export default class PageLogin extends React.Component {
|
2017-03-30 20:55:54 +08:00
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
|
|
|
this.state = {
|
|
|
|
schools: [],
|
|
|
|
school: null,
|
|
|
|
};
|
|
|
|
|
|
|
|
this.changeSchool = this.changeSchool.bind(this);
|
|
|
|
|
|
|
|
this.fetchSchools();
|
|
|
|
}
|
|
|
|
|
|
|
|
async fetchSchools() {
|
2017-04-14 21:18:50 +08:00
|
|
|
return fetch('/api/v1/schools/')
|
2017-03-30 20:55:54 +08:00
|
|
|
.then(data => data.json())
|
|
|
|
.then((data) => {
|
|
|
|
this.setState({
|
|
|
|
schools: data.map(s => ({ value: s.id, label: s.name })),
|
|
|
|
});
|
|
|
|
})
|
|
|
|
.catch((err) => {
|
|
|
|
console.error(err);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
changeSchool(school) {
|
|
|
|
this.setState({
|
|
|
|
school,
|
|
|
|
});
|
|
|
|
this.context.router.history.push(`/login/${school}`);
|
|
|
|
}
|
|
|
|
|
2017-03-03 21:09:40 +08:00
|
|
|
render() {
|
|
|
|
return (
|
2017-03-30 20:55:54 +08:00
|
|
|
<section style={{ padding: '1em', margin: '0 auto', maxWidth: '480px' }}>
|
|
|
|
<h1>
|
|
|
|
Login
|
|
|
|
</h1>
|
|
|
|
<Dropdown
|
|
|
|
onChange={this.changeSchool}
|
|
|
|
source={this.state.schools}
|
|
|
|
value={this.state.school}
|
|
|
|
label="School"
|
|
|
|
/>
|
|
|
|
</section>
|
2017-03-03 21:09:40 +08:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
2017-03-30 20:55:54 +08:00
|
|
|
|
|
|
|
PageLogin.contextTypes = {
|
|
|
|
router: React.PropTypes.shape({
|
|
|
|
history: React.PropTypes.shape({
|
|
|
|
push: React.PropTypes.func.isRequired,
|
|
|
|
}).isRequired,
|
|
|
|
}).isRequired,
|
|
|
|
};
|