This repository has been archived by the owner on May 28, 2018. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Refactor PEPITE selection components to query API instead of static file
- Loading branch information
Showing
8 changed files
with
278 additions
and
263 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| import axios from 'axios' | ||
|
|
||
| class pepiteApi { | ||
| static getRegions() { | ||
| return axios.get('/region/') | ||
| .then((res) => { | ||
| return res.data | ||
| }) | ||
| } | ||
|
|
||
| static getEstablishments(regionId) { | ||
| return axios.get(`/region/${regionId}/establishment`) | ||
| .then((res) => { | ||
| return res.data | ||
| }) | ||
| } | ||
|
|
||
| static getPepites(regionId) { | ||
| return axios.get(`/region/${regionId}/pepite`) | ||
| .then((res) => { | ||
| return res.data | ||
| }) | ||
| } | ||
|
|
||
| static getPepite(pepiteId) { | ||
| return axios.get(`/pepite/${pepiteId}`) | ||
| .then((res) => { | ||
| return res.data | ||
| }) | ||
| } | ||
| } | ||
|
|
||
| export default pepiteApi |
63 changes: 63 additions & 0 deletions
63
client/src/components/application/Pepite/EstablishmentSelect.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,63 @@ | ||
| import React, { PropTypes } from 'react' | ||
| import { FormGroup, ControlLabel } from 'react-bootstrap' | ||
| import ValidatedFormControl from '../../common/ValidatedFormControl' | ||
| import { getCurrentYear } from '../../common/yearHelper' | ||
| import pepiteApi from '../../../api/pepiteApi' | ||
|
|
||
| class EstablishmentSelect extends React.Component { | ||
| constructor(props, context) { | ||
| super(props, context) | ||
| this.state = { | ||
| establishments: [] | ||
| } | ||
| this.onEstablishementSelect = this.onEstablishementSelect.bind(this) | ||
| if (this.props.selectedRegion) { | ||
| this.loadEstablishements(this.props.selectedRegion) | ||
| } | ||
| } | ||
|
|
||
| componentWillReceiveProps(nextProps) { | ||
| if (this.props.selectedRegion != nextProps.selectedRegion) { | ||
| this.loadEstablishements(nextProps.selectedRegion) | ||
| } | ||
| } | ||
|
|
||
| loadEstablishements(regionId) { | ||
| pepiteApi.getEstablishments(regionId).then(establishments => { | ||
| this.setState({ establishments }) | ||
| }) | ||
| } | ||
|
|
||
| onEstablishementSelect(event) { | ||
| const establishment = this.state.establishments.find((e) => (e._id == event.target.value)) | ||
| this.props.onEstablishementChange(establishment) | ||
| } | ||
|
|
||
| render() { | ||
| if (this.props.isStudent && this.props.selectedRegion) { | ||
| return ( | ||
| <FormGroup> | ||
| <ControlLabel>Mon établissement pour l'année {getCurrentYear()}</ControlLabel> | ||
| <ValidatedFormControl name="establishment" componentClass="select" onChange={this.onEstablishementSelect} value={this.props.selectedEstablishment}> | ||
| <option value={0} disabled>Sélectionner</option> | ||
| {this.state.establishments.map((establishment) => { | ||
| return (<option key={establishment._id} value={establishment._id}>{establishment.name}</option>) | ||
| })} | ||
| </ValidatedFormControl> | ||
| </FormGroup> | ||
| ) | ||
| } else { | ||
| return null | ||
| } | ||
| } | ||
| } | ||
|
|
||
| EstablishmentSelect.propTypes = { | ||
| selectedRegion: PropTypes.string.isRequired, | ||
| selectedEstablishment: PropTypes.string.isRequired, | ||
| isStudent: PropTypes.bool.isRequired, | ||
| onEstablishementChange: PropTypes.func.isRequired, | ||
| errors: PropTypes.object, | ||
| } | ||
|
|
||
| export default EstablishmentSelect |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,65 @@ | ||
| import React, { PropTypes } from 'react' | ||
| import { FormGroup, ControlLabel } from 'react-bootstrap' | ||
| import ValidatedFormControl from '../../common/ValidatedFormControl' | ||
| import { getCurrentYear } from '../../common/yearHelper' | ||
| import pepiteApi from '../../../api/pepiteApi' | ||
|
|
||
| class PepiteSelect extends React.Component { | ||
| constructor(props, context) { | ||
| super(props, context) | ||
| this.state = { | ||
| pepites: [] | ||
| } | ||
| if (this.props.selectedRegion) { | ||
| this.loadPepites(this.props.selectedRegion, this.props.selectedPepite) | ||
| } | ||
| } | ||
|
|
||
| componentWillReceiveProps(nextProps) { | ||
| if ((this.props.selectedRegion != nextProps.selectedRegion) || | ||
| (this.props.selectedPepite != nextProps.selectedPepite)) { | ||
| this.loadPepites(nextProps.selectedRegion, nextProps.selectedPepite) | ||
| } | ||
| } | ||
|
|
||
| loadPepites(regionId, pepiteId) { | ||
| if (pepiteId && pepiteId != '0') { | ||
| pepiteApi.getPepite(pepiteId).then(pepite => { | ||
| this.setState({ pepites: [pepite] }) | ||
| }) | ||
| } else { | ||
| pepiteApi.getPepites(regionId).then(pepites => { | ||
| this.setState({ pepites }) | ||
| }) | ||
| } | ||
| } | ||
|
|
||
| isComponentVisible() { | ||
| return (this.props.selectedRegion) | ||
| } | ||
|
|
||
| render() { | ||
| if (this.isComponentVisible()) { | ||
| return ( | ||
| <FormGroup className="required"> | ||
| <ControlLabel>Mon PEPITE</ControlLabel> | ||
| <ValidatedFormControl name="pepite" componentClass="select" onChange={this.props.onChange} value={this.props.selectedPepite} error={this.props.errors.pepite}> | ||
| <option value={0} disabled>Sélectionner</option> | ||
| {this.state.pepites.map((pepite) => { return (<option key={pepite._id} value={pepite._id}>PEPITE {pepite.name}</option>) })} | ||
| </ValidatedFormControl> | ||
| </FormGroup> | ||
| ) | ||
| } else { | ||
| return null | ||
| } | ||
| } | ||
| } | ||
|
|
||
| PepiteSelect.propTypes = { | ||
| selectedRegion: PropTypes.string.isRequired, | ||
| selectedPepite: PropTypes.string.isRequired, | ||
| onChange: PropTypes.func.isRequired, | ||
| errors: PropTypes.object, | ||
| } | ||
|
|
||
| export default PepiteSelect |
Oops, something went wrong.