Refs #2520: Add pagination information (totalCount, vj positions)

Signed-off-by: Thomas Shawarma Haddad <thomas.haddad@af83.com>

1 files changed, 32 insertions, 25 deletions

diff --git a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/Navigate.js b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/Navigate.js
index f0ea6afdf..617e3509d 100644
--- a/app/assets/javascripts/es6_browserified/vehicle_journeys/components/Navigate.js
+++ b/app/assets/javascripts/es6_browserified/vehicle_journeys/components/Navigate.js
@@ -6,37 +6,44 @@ var actions = require('../actions')
 let Navigate = ({ dispatch, vehicleJourneys, pagination, status }) => {
   let firstPage = 1
   let lastPage = Math.ceil(pagination.totalCount / pagination.perPage)
+  let minVJ = (pagination.page - 1) * pagination.perPage + 1
+  let maxVJ = Math.min((pagination.page * pagination.perPage), pagination.totalCount)
   if(status.isFetching == true) {
     return false
   }
   if(status.fetchSuccess == true) {
     return (
-      <form className='btn-group btn-group-sm' onSubmit={e => {
-          e.preventDefault()
-        }}>
-        <button
-          onClick={e => {
+      <div class="vj_wrapper">
+        <div class="page_info">
+          <span class="search">Résultats : {minVJ} - {maxVJ} sur {pagination.totalCount}</span>
+        </div>
+        <form className='btn-group btn-group-sm' onSubmit={e => {
             e.preventDefault()
-            dispatch(actions.checkConfirmModal(e, actions.goToPreviousPage(dispatch, pagination), pagination.stateChanged, dispatch))
-          }}
-          type="submit"
-          data-toggle=''
-          data-target='#ConfirmModal'
-          className={ (pagination.page == firstPage ? "hidden" : "") + " btn btn-default" }>
-          <span className="fa fa-chevron-left"></span>
-        </button>
-        <button
-          onClick={e => {
-            e.preventDefault()
-            dispatch(actions.checkConfirmModal(e, actions.goToNextPage(dispatch, pagination), pagination.stateChanged, dispatch))
-          }}
-          type="submit"
-          data-toggle=''
-          data-target='#ConfirmModal'
-          className={ (pagination.page == lastPage ? "hidden" : "") + " btn btn-default" }>
-          <span className="fa fa-chevron-right"></span>
-        </button>
-      </form>
+          }}>
+          <button
+            onClick={e => {
+              e.preventDefault()
+              dispatch(actions.checkConfirmModal(e, actions.goToPreviousPage(dispatch, pagination), pagination.stateChanged, dispatch))
+            }}
+            type="submit"
+            data-toggle=''
+            data-target='#ConfirmModal'
+            className={ (pagination.page == firstPage ? "hidden" : "") + " btn btn-default" }>
+            <span className="fa fa-chevron-left"></span>
+          </button>
+          <button
+            onClick={e => {
+              e.preventDefault()
+              dispatch(actions.checkConfirmModal(e, actions.goToNextPage(dispatch, pagination), pagination.stateChanged, dispatch))
+            }}
+            type="submit"
+            data-toggle=''
+            data-target='#ConfirmModal'
+            className={ (pagination.page == lastPage ? "hidden" : "") + " btn btn-default" }>
+            <span className="fa fa-chevron-right"></span>
+          </button>
+        </form>
+      </div>
     )
   } else {
     return false