Refs #3457: updating noteeditVJ modal, according to wireframe changes

2 files changed, 40 insertions, 10 deletions

diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/tools/NotesEditVehicleJourney.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/tools/NotesEditVehicleJourney.js
index d4c3f4231..4c18ef96f 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/tools/NotesEditVehicleJourney.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/tools/NotesEditVehicleJourney.js
@@ -2,6 +2,7 @@ var React = require('react')
 var Component = require('react').Component
 var PropTypes = require('react').PropTypes
 var actions = require('../../actions')
+var _ = require('lodash')
 
 class NotesEditVehicleJourney extends Component {
   constructor(props) {
@@ -27,16 +28,28 @@ class NotesEditVehicleJourney extends Component {
         type='button'
         className='btn btn-outline-danger btn-xs'
         onClick={() => this.props.onToggleFootnoteModal(lf, false)}
-      ><span className="fa fa-trash"></span></button>
+      ><span className="fa fa-trash"></span> Retirer</button>
     }else{
       return <button
         type='button'
         className='btn btn-outline-primary btn-xs'
         onClick={() => this.props.onToggleFootnoteModal(lf, true)}
-      ><span className="fa fa-plus"></span></button>
+      ><span className="fa fa-plus"></span> Ajouter</button>
     }
   }
 
+  filterFN() {
+    return _.filter(window.line_footnotes, (lf, i) => {
+      let bool = true
+      _.map(this.props.modal.modalProps.vehicleJourney.footnotes, (f, j) => {
+        if(lf.id === f.id) {
+          bool = false
+        }
+      })
+      return bool
+    })
+  }
+
   render() {
     if(this.props.status.isFetching == true) {
       return false
@@ -65,7 +78,24 @@ class NotesEditVehicleJourney extends Component {
                   {(this.props.modal.type == 'notes_edit') && (
                     <form>
                       <div className='modal-body'>
-                        {window.line_footnotes.map((lf, i) =>
+                        <h3>Notes associées</h3>
+                        {(this.props.modal.modalProps.vehicleJourney.footnotes).map((lf, i) =>
+                          <div
+                            key={i}
+                            className='panel panel-default'
+                          >
+                            <div className='panel-heading'>
+                              <h4 className='panel-title clearfix'>
+                                <div className='pull-left' style={{paddingTop: '3px'}}>{lf.code}</div>
+                                <div className='pull-right'>{this.renderFootnoteButton(lf, this.props.modal.modalProps.vehicleJourney.footnotes)}</div>
+                              </h4>
+                            </div>
+                            <div className='panel-body'><p>{lf.label}</p></div>
+                          </div>
+                        )}
+
+                        <h3 className='mt-lg'>Sélectionnez les notes à associer à cette course :</h3>
+                        {this.filterFN().map((lf, i) =>
                           <div
                             key={i}
                             className='panel panel-default'
diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/index.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/index.js
index 2a76ae43a..489446ab9 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/index.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/index.js
@@ -8,10 +8,10 @@ var actions = require("./actions")
 var enableBatching = require('./batch').enableBatching
 
 // logger, DO NOT REMOVE
-// var applyMiddleware = require('redux').applyMiddleware
-// var createLogger = require('redux-logger')
-// var thunkMiddleware = require('redux-thunk').default
-// var promise = require('redux-promise')
+var applyMiddleware = require('redux').applyMiddleware
+var createLogger = require('redux-logger')
+var thunkMiddleware = require('redux-thunk').default
+var promise = require('redux-promise')
 
 var selectedJP = []
 
@@ -85,12 +85,12 @@ if (window.jpOrigin){
   initialState.filters.queryString = actions.encodeParams(params)
 }
 
-// const loggerMiddleware = createLogger()
+const loggerMiddleware = createLogger()
 
 let store = createStore(
   enableBatching(vehicleJourneysApp),
-  initialState
-  // applyMiddleware(thunkMiddleware, promise, loggerMiddleware)
+  initialState,
+  applyMiddleware(thunkMiddleware, promise, loggerMiddleware)
 )
 
 render(