diff options
| -rw-r--r-- | app/assets/stylesheets/modules/_jp_collection.sass | 7 | ||||
| -rw-r--r-- | app/javascript/journey_patterns/components/JourneyPattern.js | 65 |
2 files changed, 55 insertions, 17 deletions
diff --git a/app/assets/stylesheets/modules/_jp_collection.sass b/app/assets/stylesheets/modules/_jp_collection.sass index 9d68a217f..b4370a5ac 100644 --- a/app/assets/stylesheets/modules/_jp_collection.sass +++ b/app/assets/stylesheets/modules/_jp_collection.sass @@ -5,7 +5,6 @@ #journey_patterns .table-2entries .t2e-head - > .td position: relative padding-left: 25px @@ -119,6 +118,12 @@ .td padding: 15px 8px + .totals + color: $blue + padding-top: 4px + i + padding-right: 3px + $link-size: 10px .link position: absolute diff --git a/app/javascript/journey_patterns/components/JourneyPattern.js b/app/javascript/journey_patterns/components/JourneyPattern.js index 8dc542bc8..b951b4445 100644 --- a/app/javascript/journey_patterns/components/JourneyPattern.js +++ b/app/javascript/journey_patterns/components/JourneyPattern.js @@ -74,18 +74,60 @@ export default class JourneyPattern extends Component{ return !this.props.status.policy[`journey_patterns.${action}`] } + totals(){ + let totalTime = 0 + let totalDistance = 0 + let from = null + this.props.value.stop_points.map((stopPoint, i) =>{ + if(from && stopPoint.checked){ + let [costsKey, costs, time, distance] = this.getTimeAndDistanceBetweenStops(from, stopPoint.id) + totalTime += time + totalDistance += distance + } + if(stopPoint.checked){ + from = stopPoint.id + } + }) + return [this.formatTime(totalTime), this.formatDistance(totalDistance)] + } + + getTimeAndDistanceBetweenStops(from, to){ + let costsKey = from + "-" + to + let costs = this.props.value.costs[costsKey] || {distance: 0, time: 0} + let time = costs['time'] || 0 + let distance = costs['distance'] || 0 + return [costsKey, costs, time, distance] + } + + formatDistance(distance){ + return parseFloat(Math.round(distance * 100) / 100).toFixed(2) + " km" + } + + formatTime(time){ + if(time < 60){ + return time + " min" + } + else{ + let hours = parseInt(time/60) + return hours + " h " + (time - 60*hours) + " min" + } + } + render() { this.previousSpId = undefined + let [totalTime, totalDistance] = this.totals() return ( <div className={'t2e-item' + (this.props.value.deletable ? ' disabled' : '') + (this.props.value.object_id ? '' : ' to_record') + (this.props.value.errors ? ' has-error': '') + (this.hasFeature('costs_in_journey_patterns') ? ' with-costs' : '')}> - {/* Errors */} - {/* this.props.value.errors ? this.getErrors(this.props.value.errors) : '' */} - <div className='th'> <div className='strong mb-xs'>{this.props.value.object_id ? this.props.value.short_id : '-'}</div> <div>{this.props.value.registration_number}</div> <div>{actions.getChecked(this.props.value.stop_points).length} arrêt(s)</div> - + {this.hasFeature('costs_in_journey_patterns') && + <div className="small row totals"> + <span className="col-md-6"><i className="fa fa-arrows-h"></i>{totalTime}</span> + <span className="col-md-6"><i className="fa fa-clock-o"></i>{totalDistance}</span> + </div> + } <div className={this.props.value.deletable ? 'btn-group disabled' : 'btn-group'}> <div className={this.props.value.deletable ? 'btn dropdown-toggle disabled' : 'btn dropdown-toggle'} @@ -132,17 +174,8 @@ export default class JourneyPattern extends Component{ let distance = null let time_in_words = null if(this.previousSpId && stopPoint.checked){ - costsKey = this.previousSpId + "-" + stopPoint.id - costs = this.props.value.costs[costsKey] || {distance: 0, time: 0} - time = costs['time'] || 0 - distance = costs['distance'] || 0 - if(time < 60){ - time_in_words = time + " min" - } - else{ - let hours = parseInt(time/60) - time_in_words = hours + " h " + (time - 60*hours) + " min" - } + [costsKey, costs, time, distance] = this.getTimeAndDistanceBetweenStops(this.previousSpId, stopPoint.id) + time_in_words = this.formatTime(time) } if(stopPoint.checked){ this.previousSpId = stopPoint.id @@ -165,7 +198,7 @@ export default class JourneyPattern extends Component{ </p> </div>} {!this.props.editMode && <div> - <p><i className="fa fa-arrows-h"></i>{(costs['distance'] || 0) + " km"}</p> + <p><i className="fa fa-arrows-h"></i>{this.formatDistance(costs['distance'] || 0)}</p> <p><i className="fa fa-clock-o"></i>{time_in_words}</p> </div>} </div>} |