Add history for solidarity transport and organized carpool

web/layouts/solidarity_transport/_partials/driver_history.html

@@ -1,7 +1,69 @@
 {{define "driver_history"}}
-<div class="px-4 py-6 sm:px-6 text-center">
-  <p class="text-center text-lg">Trajets réalisés : {{ .ViewState.stats.bookings.count }}</p>
-  <p class="text-center text-lg">Kilomètres réalisés : {{ .ViewState.stats.bookings.km}} km</p>
+<div class="py-6">
+  {{if .ViewState.stats}}
+  <div class="py-5 text-center">
+    <p class="text-lg">Trajets réalisés : {{ .ViewState.stats.bookings.count }}</p>
+    <p class="text-lg">Kilomètres réalisés : {{ .ViewState.stats.bookings.km}} km</p>
+  </div>
+  {{end}}
 
+  {{if .ViewState.bookings}}
+  <div class="py-5">
+    <h4 class="text-lg font-medium text-gray-900 mb-4 text-center">Historique des transports solidaires</h4>
+    <table class="min-w-full divide-y divide-gray-300 border-gray-300 border-t-1">
+      <thead class="bg-gray-50">
+        <tr>
+          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Date</th>
+          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Passager</th>
+          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Départ</th>
+          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Arrivée</th>
+          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Statut</th>
+          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6"></th>
+        </tr>
+      </thead>
+      <tbody class="divide-y divide-gray-200 bg-white">
+        {{range .ViewState.bookings}}
+        {{if or (eq .Status "VALIDATED") (eq .Status "WAITING_CONFIRMATION")}}
+        <tr>
+          <td class="py-4 pl-4 pr-3 text-sm sm:pl-6">
+            {{if .Journey}}
+              {{timeFormat .Journey.PassengerPickupDate "02/01/2006 15:04"}}
+            {{end}}
+          </td>
+          <td class="py-4 pl-4 pr-3 text-sm sm:pl-6">
+            {{if .PassengerId}}
+              <a class="text-co-blue" href="/app/beneficiaries/{{.PassengerId}}">
+                {{ (index $.ViewState.beneficiaries_map .PassengerId).Data.first_name }}
+                {{ (index $.ViewState.beneficiaries_map .PassengerId).Data.last_name }}
+              </a>
+            {{end}}
+          </td>
+          <td class="py-4 pl-4 pr-3 text-sm sm:pl-6">
+            {{if .Journey}}{{if .Journey.PassengerPickup}}{{.Journey.PassengerPickup.Properties.label}}{{end}}{{end}}
+          </td>
+          <td class="py-4 pl-4 pr-3 text-sm sm:pl-6">
+            {{if .Journey}}{{if .Journey.PassengerDrop}}{{.Journey.PassengerDrop.Properties.label}}{{end}}{{end}}
+          </td>
+          <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">
+            {{if eq .Status "VALIDATED"}}
+              <span class="p-1 px-2 text-xs bg-co-green rounded-2xl">Validé</span>
+            {{else if eq .Status "WAITING_CONFIRMATION"}}
+              <span class="p-1 px-2 text-xs bg-gray-300 rounded-2xl">Attente confirmation</span>
+            {{end}}
+          </td>
+          <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">
+            <a class="text-co-blue" href="/app/solidarity-transport/bookings/{{.Id}}">Voir</a>
+          </td>
+        </tr>
+        {{end}}
+        {{end}}
+      </tbody>
+    </table>
+  </div>
+  {{else}}
+  <div class="py-5">
+    <p class="text-sm text-gray-500 text-center">Aucun transport solidaire enregistré</p>
+  </div>
+  {{end}}
 </div>
 {{end}}

web/layouts/solidarity_transport/driver_display.html

@@ -148,7 +148,7 @@
             </section>
 
             <section aria-labelledby="functionalities-title" x-data="{
-                    tab: 'documents',
+                    tab: '{{ if .ViewState.tab }}{{ .ViewState.tab }}{{ else }}documents{{ end }}',
                     to(event) {
                         this.tab = event.target.value
                     }
@@ -172,7 +172,7 @@
 
                                     <option value="wallet">Compte mobilité</option>
 
-                                    <option value="history">Historique</option>
+                                    <option value="history">Transports solidaires</option>
                                 </select>
                             </div>
                             <div class="hidden sm:block">
@@ -197,7 +197,7 @@
                                         <a href="#" @click="tab = 'history'"
                                         class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm"
                                         :class="tab == 'history' ? 'border-co-blue text-co-blue' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'">
-                                        Transport solidaires </a>
+                                        Transports solidaires </a>
 
                                     </nav>
                                 </div>

web/layouts/solidarity_transport/driver_journey.html

@@ -31,7 +31,7 @@
 <div class="max-w-7xl m-auto px-4 sm:px-6 md:px-8 flex flex-col justify-items-center">
   {{if .ViewState.passenger}}
   {{if lt .ViewState.passenger_wallet_balance .ViewState.pricing_result.passenger.Amount}}
-    <p class="text-xl text-co-red text-center p-4">Le solde du compte mobilité est insuffisant.</p>
+    <p class="text-xl text-co-red text-center p-4">Le solde du compte mobilité est insuffisant. <a href="/app/beneficiaries/{{.ViewState.passenger.ID}}?tab=wallet" class="underline text-co-blue">Créditer le compte</a></p>
     {{end}}
   <form method="POST">
     {{if not .ViewState.driver_journey.Noreturn}}