diff options
3 files changed, 62 insertions, 16 deletions
diff --git a/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDay.js b/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDay.js new file mode 100644 index 000000000..5117b53c0 --- /dev/null +++ b/app/assets/javascripts/es6_browserified/time_tables/components/TimeTableDay.js @@ -0,0 +1,24 @@ +var React = require('react') +var Component = require('react').Component +var PropTypes = require('react').PropTypes + +class TimeTableDay extends Component { + constructor(props) { + super(props) + } + + render() { + return ( + <div className='t2e-item'> + Toto + </div> + ) + } +} + +TimeTableDay.propTypes = { + value: PropTypes.object.isRequired, + index: PropTypes.number.isRequired +} + +module.exports = TimeTableDay diff --git a/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js b/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js index 8f25d1f10..0652f2cc6 100644 --- a/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js +++ b/app/assets/javascripts/es6_browserified/time_tables/components/Timetable.js @@ -1,21 +1,43 @@ var React = require('react') +var Component = require('react').Component var PropTypes = require('react').PropTypes +var TimeTableDay = require('./TimeTableDay') -const Timetable = ({timetable}) => { - return ( - <div> - <h2>Calendrier</h2> - <ul> - {timetable.current_month.map((day, i) => - <li - key={i} - > - <span>{day.day} {day.mday} ({day.wday} {day.included_date} {day.excluded_date})</span> - </li> - )} - </ul> - </div> - ) +class Timetable extends Component{ + constructor(props){ + super(props) + } + + render() { + return ( + <div className='row'> + <div className="col-lg-12"> + <div className="table table-2entries mt-sm mb-sm"> + <div className="t2e-head w20"> + <div className="th"> + <div></div> + <div></div> + <div></div> + <div className="strong">Synthèse</div> + </div> + <div className="td">Journées d'application</div> + <div className="td">Périodes</div> + <div className="td">Exceptions</div> + </div> + <div className="t2e-item-list w80"> + {this.props.timetable.current_month.map((day, i) => + <TimeTableDay + key={i} + index={i} + value={day} + /> + )} + </div> + </div> + </div> + </div> + ) + } } Timetable.propTypes = { diff --git a/app/views/time_tables/edit.html.slim b/app/views/time_tables/edit.html.slim index d66c8e6aa..6eb1e288c 100644 --- a/app/views/time_tables/edit.html.slim +++ b/app/views/time_tables/edit.html.slim @@ -10,7 +10,7 @@ #periods .row - .col-lg-8.col-lg-offset-2.col-md-8.col-md-offset-2.col-sm-10.col-sm-offset-1 + .col-lg-8.col-lg-offset-2.col-md-8.col-md-offset-2.col-sm-10.col-sm-offset-1.mt-lg .well strong = "original version" == render 'form' |