|
|
@@ -144,30 +144,38 @@
|
|
|
<i class="fas fa-calendar-times text-gray-400 text-4xl mb-4"></i>
|
|
|
<p class="text-gray-500">Aucun trajet assigné pour aujourd'hui</p>
|
|
|
</div>
|
|
|
- <div v-else class="space-y-4">
|
|
|
- <div
|
|
|
- v-for="trip in todayTrips"
|
|
|
- :key="trip.id"
|
|
|
- :class="[
|
|
|
- 'border rounded-lg p-4 transition-all duration-200',
|
|
|
- trip.registrationClosed
|
|
|
- ? 'border-gray-300 bg-gray-50 opacity-60 cursor-pointer'
|
|
|
- : 'border-gray-200 hover:shadow-md cursor-pointer'
|
|
|
- ]"
|
|
|
- @click="selectTrip(trip)"
|
|
|
- >
|
|
|
- <div class="flex items-center justify-between">
|
|
|
- <div class="flex-1">
|
|
|
- <div class="flex items-center space-x-4">
|
|
|
- <div class="flex-shrink-0">
|
|
|
- <div
|
|
|
- :class="[
|
|
|
- 'w-3 h-3 rounded-full',
|
|
|
- trip.registrationClosed ? 'bg-gray-400' : 'bg-green-500'
|
|
|
- ]"
|
|
|
- ></div>
|
|
|
- </div>
|
|
|
- <div class="flex-1 min-w-0">
|
|
|
+ <div v-else>
|
|
|
+ <!-- En-têtes du tableau -->
|
|
|
+ <div class="grid grid-cols-5 gap-4 text-sm font-medium text-gray-500 border-b pb-2 mb-4">
|
|
|
+ <div>Départ → Arrivée</div>
|
|
|
+ <div>Dates</div>
|
|
|
+ <div>Véhicule</div>
|
|
|
+ <div>Passagers</div>
|
|
|
+ <div>Prix</div>
|
|
|
+ </div>
|
|
|
+ <!-- Lignes du tableau -->
|
|
|
+ <div class="space-y-4">
|
|
|
+ <div
|
|
|
+ v-for="trip in todayTrips"
|
|
|
+ :key="trip.id"
|
|
|
+ :class="[
|
|
|
+ 'border rounded-lg p-4 transition-all duration-200 cursor-pointer',
|
|
|
+ trip.registrationClosed
|
|
|
+ ? 'border-gray-300 bg-gray-50 opacity-60'
|
|
|
+ : 'border-gray-200 hover:shadow-md'
|
|
|
+ ]"
|
|
|
+ @click="selectTrip(trip)"
|
|
|
+ >
|
|
|
+ <div class="grid grid-cols-5 gap-4 items-center">
|
|
|
+ <!-- Départ → Arrivée -->
|
|
|
+ <div class="flex items-center space-x-2">
|
|
|
+ <div
|
|
|
+ :class="[
|
|
|
+ 'w-3 h-3 rounded-full flex-shrink-0',
|
|
|
+ trip.registrationClosed ? 'bg-gray-400' : 'bg-green-500'
|
|
|
+ ]"
|
|
|
+ ></div>
|
|
|
+ <div class="min-w-0">
|
|
|
<p
|
|
|
:class="[
|
|
|
'text-sm font-medium truncate',
|
|
|
@@ -175,46 +183,85 @@
|
|
|
]"
|
|
|
>
|
|
|
{{ trip.departure }} → {{ trip.arrival }}
|
|
|
- <span v-if="trip.registrationClosed" class="ml-2 text-xs font-normal text-red-500">
|
|
|
- (Enregistrement fermé)
|
|
|
- </span>
|
|
|
- </p>
|
|
|
- <p
|
|
|
- :class="[
|
|
|
- 'text-sm',
|
|
|
- trip.registrationClosed ? 'text-gray-400' : 'text-gray-500'
|
|
|
- ]"
|
|
|
- >
|
|
|
- {{ formatDateTime(trip.departureDateTime) }} - {{ formatDateTime(trip.arrivalDateTime) }}
|
|
|
- </p>
|
|
|
- <p v-if="trip.vehicule"
|
|
|
- :class="[
|
|
|
- 'text-xs mt-1',
|
|
|
- trip.registrationClosed ? 'text-gray-400' : 'text-gray-400'
|
|
|
- ]"
|
|
|
- >
|
|
|
- {{ trip.vehicule.type }} - {{ trip.vehicule.immatriculation }}
|
|
|
</p>
|
|
|
+ <span v-if="trip.registrationClosed" class="text-xs text-red-500">
|
|
|
+ (Fermé)
|
|
|
+ </span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="flex items-center space-x-4">
|
|
|
- <span
|
|
|
- :class="[
|
|
|
- 'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium',
|
|
|
- trip.registrationClosed
|
|
|
- ? 'bg-gray-200 text-gray-600'
|
|
|
- : 'bg-blue-100 text-blue-800'
|
|
|
- ]"
|
|
|
- >
|
|
|
- {{ trip.passengers }}/{{ trip.vehicule?.number_places || trip.capacity || 'N/A' }} passagers
|
|
|
- </span>
|
|
|
- <i
|
|
|
- :class="[
|
|
|
- 'fas fa-chevron-right',
|
|
|
- trip.registrationClosed ? 'text-gray-300' : 'text-gray-400'
|
|
|
- ]"
|
|
|
- ></i>
|
|
|
+
|
|
|
+ <!-- Dates -->
|
|
|
+ <div>
|
|
|
+ <p
|
|
|
+ :class="[
|
|
|
+ 'text-sm',
|
|
|
+ trip.registrationClosed ? 'text-gray-400' : 'text-gray-600'
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ formatDateTime(trip.departureDateTime) }}
|
|
|
+ </p>
|
|
|
+ <p
|
|
|
+ :class="[
|
|
|
+ 'text-xs',
|
|
|
+ trip.registrationClosed ? 'text-gray-400' : 'text-gray-500'
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ formatDateTime(trip.arrivalDateTime) }}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Véhicule -->
|
|
|
+ <div v-if="trip.vehicule">
|
|
|
+ <p
|
|
|
+ :class="[
|
|
|
+ 'text-sm',
|
|
|
+ trip.registrationClosed ? 'text-gray-400' : 'text-gray-600'
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ trip.vehicule.type }}
|
|
|
+ </p>
|
|
|
+ <p
|
|
|
+ :class="[
|
|
|
+ 'text-xs',
|
|
|
+ trip.registrationClosed ? 'text-gray-400' : 'text-gray-500'
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ trip.vehicule.immatriculation }}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div v-else class="text-sm text-gray-400">N/A</div>
|
|
|
+
|
|
|
+ <!-- Passagers -->
|
|
|
+ <div>
|
|
|
+ <span
|
|
|
+ :class="[
|
|
|
+ 'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium',
|
|
|
+ trip.registrationClosed
|
|
|
+ ? 'bg-gray-200 text-gray-600'
|
|
|
+ : 'bg-blue-100 text-blue-800'
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ trip.passengers }}/{{ trip.vehicule?.number_places || trip.capacity || 'N/A' }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- Prix -->
|
|
|
+ <div class="flex items-center justify-between">
|
|
|
+ <span
|
|
|
+ :class="[
|
|
|
+ 'text-sm font-medium',
|
|
|
+ trip.registrationClosed ? 'text-gray-400' : 'text-green-600'
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ {{ trip.pricePerSeat ? trip.pricePerSeat + ' €' : 'N/A' }}
|
|
|
+ </span>
|
|
|
+ <i
|
|
|
+ :class="[
|
|
|
+ 'fas fa-chevron-right',
|
|
|
+ trip.registrationClosed ? 'text-gray-300' : 'text-gray-400'
|
|
|
+ ]"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|