parcoursmob-default-theme/web/layouts/solidarity_transport/ext/booking_proposal.html

95 lines
5.6 KiB
HTML

{{define "main"}}
<html class="h-full bg-gray-50">
<head>
<title>PARCOURSMOB</title>
<link rel="stylesheet" href="/public/css/main.css" />
<link href="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/maplibre-gl@^5.2.0/dist/maplibre-gl.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/@kingshott/iodine@8.1.0/dist/iodine.min.umd.js" defer></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js"></script>
<script src="https://cdn.jsdelivr.net/npm/maplibre-gl@^5.2.0/dist/maplibre-gl.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pmtiles@^4.3.0/dist/pmtiles.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@protomaps/basemaps@5/dist/basemaps.js" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@turf/turf@7/turf.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/polyline@0.2.0/src/polyline.js"></script>
<!--<script defer type="text/javascript" src="/public/js/main.js" defer></script>-->
</head>
<body class="h-full">
<div class="flex flex-col justify-center py-12">
<div class="">
<h2 class="m-4 mt-6 text-center text-3xl font-extrabold text-gray-900">Demande de trajet solidaire</h2>
<p class="m-4 text-center">
{{if eq .ViewState.booking.Status "WAITING_CONFIRMATION"}}
Vous avez une nouvelle demande de trajet
{{else if eq .ViewState.booking.Status "VALIDATED"}}
Demande déjà validée
{{else if eq .ViewState.booking.Status "CANCELLED"}}
Trajet annulé
{{end}}
</p>
</div>
<div class="h-50 w-full">
{{template "journey_map" (dict "driver_journey" .ViewState.booking.Journey "driver" .ViewState.driver "passenger" .ViewState.passenger "beneficiaries" .ViewState.beneficiaries)}}
</div>
<div class="grid grid-cols-1">
<div class="p-4 py-5 sm:px-6">
<dl class="grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2">
<div class="sm:col-span-1">
<dt class="font-medium text-gray-500">Départ passager</dt>
<dd class="mt-1 text-gray-900">{{.ViewState.booking.Journey.PassengerPickup.Properties.label}}</dd>
</div>
<div class="sm:col-span-1">
<dt class="font-medium text-gray-500">Destination passager</dt>
<dd class="mt-1 text-gray-900">{{.ViewState.booking.Journey.PassengerDrop.Properties.label}}</dd>
</div>
<div class="sm:col-span-1">
<dt class="font-medium text-gray-500">Kilomètres passager</dt>
<dd class="mt-1 text-gray-900">{{.ViewState.booking.Journey.PassengerDistance}} km</dd>
</div>
<div class="sm:col-span-1">
<dt class="font-medium text-gray-500">Kilomètres conducteur</dt>
<dd class="mt-1 text-gray-900">{{.ViewState.booking.Journey.DriverDistance}} km</dd>
</div>
<div class="sm:col-span-1">
<dt class="font-medium text-gray-500">Horaire rendez vous passager</dt>
<dd class="mt-1 text-gray-900">{{ .ViewState.booking.Journey.PassengerPickupDate.Format "02/01/2006 15:04"}}</dd>
</div>
<div class="sm:col-span-1">
<dt class="font-medium text-gray-500">Temps de trajet</dt>
<dd class="mt-1 text-gray-900">{{ printf "%.0f" .ViewState.booking.Journey.Duration.Minutes }} min</dd>
</div>
</dl>
</div>
<div>
</div>
<div class="flex flex-col justify-center m-4 sm:flex-row">
{{if eq .ViewState.booking.Status "WAITING_CONFIRMATION"}}
<form method="POST">
<input type="hidden" name="action" value="confirm" />
{{template "submit_with_sms"
dict "IconSet" .IconSet
"Viewstate" .ViewState
"ComponentState" (dict "submitText" "Valider"
"headerText" "Validez le trajet"
"infoText" "Le message suivant sera envoyé à votre passager. Vous pouvez le personnaliser.")
"SMSState" (dict "name" (.ViewState.config.GetString "service_name")
"address" .ViewState.booking.Journey.PassengerDrop.Properties.label
"date" (.ViewState.booking.Journey.PassengerPickupDate.Format "02/01/2006 15:04")
"phone_number" .ViewState.driver.Data.phone_number)}}
</form>
<form method="POST">
<input type="hidden" name="action" value="cancel" />
<button type="submit"
class="m-4 inline-flex items-center justify-center rounded-2xl border border-transparent bg-co-red px-4 py-2 text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-co-red focus:ring-offset-2 sm:w-auto">
Refuser
</button>
</form>
{{end}}
</div>
</div>
</body>
</html>
{{end}}