change sms
This commit is contained in:
89
web/layouts/solidarity_transport/_partials/journey_map.html
Normal file
89
web/layouts/solidarity_transport/_partials/journey_map.html
Normal file
@@ -0,0 +1,89 @@
|
||||
{{ define "journey_map" }}
|
||||
<div id="map" class="w-full h-full"></div>
|
||||
<script>
|
||||
let protocol = new pmtiles.Protocol();
|
||||
maplibregl.addProtocol("pmtiles",protocol.tile);
|
||||
var map = new maplibregl.Map({
|
||||
container: 'map', // container id
|
||||
style: "/public/maps/protomaps-light/style.json",
|
||||
});
|
||||
|
||||
const geojsonPoints = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{{ json .driver_journey.DriverDeparture }},
|
||||
{{ json .driver_journey.PassengerPickup }},
|
||||
{{ json .driver_journey.PassengerDrop }},
|
||||
{{ json .driver_journey.DriverArrival }}
|
||||
]
|
||||
}
|
||||
const driverGeojsonPoints = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{{ json .driver_journey.DriverDeparture }},
|
||||
{{ json .driver_journey.DriverArrival }}
|
||||
]
|
||||
}
|
||||
const passengerGeojsonPoints = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{{ json .driver_journey.PassengerPickup }},
|
||||
{{ json .driver_journey.PassengerDrop }},
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
map.on('load', async () => {
|
||||
{{if .driver_journey.JourneyPolyline}}
|
||||
var linestring = polyline.toGeoJSON('{{.driver_journey.JourneyPolyline}}');
|
||||
map.addSource('trip', {
|
||||
type: "geojson",
|
||||
data: linestring
|
||||
})
|
||||
map.addLayer({
|
||||
'id': 'trip',
|
||||
'type': 'line',
|
||||
'source': 'trip',
|
||||
'layout': {
|
||||
'line-join': 'round',
|
||||
'line-cap': 'round',
|
||||
},
|
||||
'paint': {
|
||||
'line-color': '#243887',
|
||||
'line-width': 3
|
||||
},
|
||||
});
|
||||
{{end}}
|
||||
|
||||
map.addSource('driver_points', {
|
||||
type: "geojson",
|
||||
data: driverGeojsonPoints
|
||||
})
|
||||
map.addLayer({
|
||||
'id': 'driver_points',
|
||||
'type': 'circle',
|
||||
'source': 'driver_points',
|
||||
'paint': {
|
||||
'circle-color': '#000'
|
||||
},
|
||||
});
|
||||
map.addSource('passenger_points', {
|
||||
type: "geojson",
|
||||
data: passengerGeojsonPoints
|
||||
})
|
||||
map.addLayer({
|
||||
'id': 'passenger_points',
|
||||
'type': 'circle',
|
||||
'source': 'passenger_points',
|
||||
'paint': {
|
||||
'circle-color': '#243887',
|
||||
'circle-radius': 8
|
||||
},
|
||||
});
|
||||
var bbox=turf.bbox(geojsonPoints)
|
||||
|
||||
map.fitBounds(bbox, { padding: 50 })
|
||||
})
|
||||
</script>
|
||||
|
||||
{{ end }}
|
||||
@@ -52,92 +52,9 @@
|
||||
</dl>
|
||||
</div>
|
||||
<div>
|
||||
<div id="map" class="w-full h-full"></div>
|
||||
<script>
|
||||
let protocol = new pmtiles.Protocol();
|
||||
maplibregl.addProtocol("pmtiles",protocol.tile);
|
||||
var map = new maplibregl.Map({
|
||||
container: 'map', // container id
|
||||
style: "/public/maps/protomaps-light/style.json",
|
||||
});
|
||||
{{ template "journey_map" . }}
|
||||
|
||||
const geojsonPoints = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{{ json .driver_journey.DriverDeparture }},
|
||||
{{ json .driver_journey.PassengerPickup }},
|
||||
{{ json .driver_journey.PassengerDrop }},
|
||||
{{ json .driver_journey.DriverArrival }}
|
||||
]
|
||||
}
|
||||
const driverGeojsonPoints = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{{ json .driver_journey.DriverDeparture }},
|
||||
{{ json .driver_journey.DriverArrival }}
|
||||
]
|
||||
}
|
||||
const passengerGeojsonPoints = {
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{{ json .driver_journey.PassengerPickup }},
|
||||
{{ json .driver_journey.PassengerDrop }},
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
map.on('load', async () => {
|
||||
{{if .driver_journey.JourneyPolyline}}
|
||||
var linestring = polyline.toGeoJSON('{{.driver_journey.JourneyPolyline}}');
|
||||
map.addSource('trip', {
|
||||
type: "geojson",
|
||||
data: linestring
|
||||
})
|
||||
map.addLayer({
|
||||
'id': 'trip',
|
||||
'type': 'line',
|
||||
'source': 'trip',
|
||||
'layout': {
|
||||
'line-join': 'round',
|
||||
'line-cap': 'round',
|
||||
},
|
||||
'paint': {
|
||||
'line-color': '#243887',
|
||||
'line-width': 3
|
||||
},
|
||||
});
|
||||
{{end}}
|
||||
|
||||
map.addSource('driver_points', {
|
||||
type: "geojson",
|
||||
data: driverGeojsonPoints
|
||||
})
|
||||
map.addLayer({
|
||||
'id': 'driver_points',
|
||||
'type': 'circle',
|
||||
'source': 'driver_points',
|
||||
'paint': {
|
||||
'circle-color': '#000'
|
||||
},
|
||||
});
|
||||
map.addSource('passenger_points', {
|
||||
type: "geojson",
|
||||
data: passengerGeojsonPoints
|
||||
})
|
||||
map.addLayer({
|
||||
'id': 'passenger_points',
|
||||
'type': 'circle',
|
||||
'source': 'passenger_points',
|
||||
'paint': {
|
||||
'circle-color': '#243887',
|
||||
'circle-radius': 8
|
||||
},
|
||||
});
|
||||
var bbox=turf.bbox(geojsonPoints)
|
||||
map.fitBounds(bbox, { padding: 100 })
|
||||
})
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="py-4 grid grid-cols-1 gap-6 sm:grid-cols-2">
|
||||
|
||||
@@ -6,12 +6,22 @@
|
||||
<div class="max-w-7xl mx-auto py-8 px-4 sm:px-6 md:px-8">
|
||||
{{template "journey_preview" (dict "driver_journey" .ViewState.driver_journey "driver" .ViewState.driver "passenger" .ViewState.passenger "beneficiaries" .ViewState.beneficiaries)}}
|
||||
{{if ne .ViewState.passenger.ID ""}}
|
||||
<div class="max-w-7xl m-auto px-4 sm:px-6 md:px-8 flex justify-items-center">
|
||||
<div class="max-w-7xl m-auto px-4 sm:px-6 md:px-8 flex flex-col justify-items-center">
|
||||
{{if .ViewState.passenger}}
|
||||
{{$wallet := (or .ViewState.passenger.Data.wallet 0.0)}}
|
||||
{{if lt $wallet .ViewState.driver_journey.Price.Amount}}
|
||||
<p class="text-xl text-co-red text-center p-4">Le solde du compte mobilité est insuffisant.</p>
|
||||
{{end}}
|
||||
<form method="POST">
|
||||
<button class="w-100 bg-co-blue border-gray-300 border px-4 py-2 text-white items-center text-sm rounded-2xl focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-co-blue">
|
||||
Envoyer la mise en relation
|
||||
</button>
|
||||
{{template "submit_with_sms"
|
||||
dict "IconSet" .IconSet
|
||||
"Viewstate" .ViewState
|
||||
"ComponentState" (dict "submitText"
|
||||
"Envoyer la mise en relation")
|
||||
"SMSState" (dict "name" (.ViewState.config.GetString "service_name")
|
||||
"baseUrl" (.ViewState.config.GetString "base_url") )}}
|
||||
</form>
|
||||
{{end}}
|
||||
</div>
|
||||
{{end}}
|
||||
|
||||
|
||||
94
web/layouts/solidarity_transport/ext/booking_proposal.html
Normal file
94
web/layouts/solidarity_transport/ext/booking_proposal.html
Normal file
@@ -0,0 +1,94 @@
|
||||
|
||||
{{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}}
|
||||
Reference in New Issue
Block a user