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

3 files changed, 126 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(
diff --git a/t b/t
new file mode 100644
index 000000000..11a756d60
--- /dev/null
+++ b/t
@@ -0,0 +1,86 @@
+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 d4c3f42..f248b28 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,13 +28,13 @@ 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>
+     }
+   }
+ 
+@@ -65,7 +66,8 @@ class NotesEditVehicleJourney extends Component {
+                   {(this.props.modal.type == 'notes_edit') && (
+                     <form>
+                       <div className='modal-body'>
+-                        {window.line_footnotes.map((lf, i) =>
++                        {/* notes */}
++                        {this.props.modal.modalProps.vehicleJourney.footnotes.map((lf, i) => {
+                           <div
+                             key={i}
+                             className='panel panel-default'
+@@ -78,9 +80,11 @@ class NotesEditVehicleJourney extends Component {
+                             </div>
+                             <div className='panel-body'><p>{lf.label}</p></div>
+                           </div>
+-                        )}
++                        })}
+                       </div>
+ 
++
++
+                       <div className='modal-footer'>
+                         <button
+                           className='btn btn-link'
+diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/index.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/index.js
+index 2a76ae4..489446a 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(