From 92f18ce7f0e2ad2747cad9f33f988360b08ff174 Mon Sep 17 00:00:00 2001 From: Flatlogic Bot Date: Sat, 31 Jan 2026 03:42:41 +0000 Subject: [PATCH] Update shipment request map layout --- core/templates/core/shipment_request.html | 272 ++++++++++++++-------- 1 file changed, 169 insertions(+), 103 deletions(-) diff --git a/core/templates/core/shipment_request.html b/core/templates/core/shipment_request.html index fadb0fd..5ceca8c 100644 --- a/core/templates/core/shipment_request.html +++ b/core/templates/core/shipment_request.html @@ -5,7 +5,7 @@ {% block content %}
-
+
@@ -14,7 +14,7 @@
-

{% trans "Request a Shipment" %}

+

{% trans "Request a Shipment" %}

{% if not google_maps_api_key %}
@@ -35,112 +35,141 @@ {{ form.driver_amount }} {{ form.platform_fee_percentage }} -
- -
- - {{ form.description }} - {% if form.description.errors %} -
{{ form.description.errors }}
- {% endif %} -
-
- - {{ form.weight }} - {% if form.weight.errors %} -
{{ form.weight.errors }}
- {% endif %} -
-
- - {{ form.price }} - {% trans "Calculated automatically based on distance and weight." %} - {% if form.price.errors %} -
{{ form.price.errors }}
- {% endif %} -
- - -
-

- {% trans "Pickup Details" %} - {% if google_maps_api_key %} - - {% endif %} -

-
-
- - {{ form.pickup_country }} -
-
- - {{ form.pickup_governate }} -
-
- - {{ form.pickup_city }} -
-
- - {{ form.pickup_address }} -
- - -
-

- {% trans "Delivery Details" %} - {% if google_maps_api_key %} - - {% endif %} -

-
-
- - {{ form.delivery_country }} -
-
- - {{ form.delivery_governate }} -
-
- - {{ form.delivery_city }} -
-
- - {{ form.delivery_address }} -
- - -
-

{% trans "Receiver Details" %}

-
-
- - {{ form.receiver_name }} -
-
- -
-
- {{ form.receiver_phone_code }} + +
+
+
{% trans "Shipment Information" %}
+
+
+ + {{ form.description }} + {% if form.description.errors %} +
{{ form.description.errors }}
+ {% endif %}
-
- {{ form.receiver_phone }} +
+ + {{ form.weight }} + {% if form.weight.errors %} +
{{ form.weight.errors }}
+ {% endif %} +
+
+ + {{ form.price }} + {% trans "Calculated automatically based on distance and weight." %} + {% if form.price.errors %} +
{{ form.price.errors }}
+ {% endif %} +
+
+
+
+ +
+ +
+
+
+
+ {% trans "Pickup Details" %} +
+ {% if google_maps_api_key %} + + {% endif %} +
+
+
+
+ + {{ form.pickup_country }} +
+
+ + {{ form.pickup_governate }} +
+
+ + {{ form.pickup_city }} +
+
+ + {{ form.pickup_address }} +
+
-
- {% trans "Cancel" %} - + +
+
+
+
+ {% trans "Delivery Details" %} +
+ {% if google_maps_api_key %} + + {% endif %} +
+
+
+
+ + {{ form.delivery_country }} +
+
+ + {{ form.delivery_governate }} +
+
+ + {{ form.delivery_city }} +
+
+ + {{ form.delivery_address }} +
+
+
+
+ + +
+
+
{% trans "Receiver Details" %}
+
+
+
+
+ + {{ form.receiver_name }} +
+
+ +
+
+ {{ form.receiver_phone_code }} +
+
+ {{ form.receiver_phone }} +
+
+
+
+
+
+ +
+ {% trans "Cancel" %} + +
@@ -239,6 +268,14 @@ map.panTo(latLng); } + function getSelectedText(elementId) { + const el = document.getElementById(elementId); + if (el && el.selectedIndex !== -1 && el.options[el.selectedIndex].value) { + return el.options[el.selectedIndex].text; + } + return ''; + } + function openMap(mode) { currentMode = mode; const modalEl = document.getElementById('mapModal'); @@ -257,7 +294,7 @@ if (map) { google.maps.event.trigger(map, "resize"); - // Set marker if existing value + // 1. Check if lat/lng are already set (editing existing parcel or re-opening map) let latField = document.getElementById(`id_${mode}_lat`); let lngField = document.getElementById(`id_${mode}_lng`); @@ -265,6 +302,33 @@ let loc = { lat: parseFloat(latField.value), lng: parseFloat(lngField.value) }; marker.setPosition(loc); map.setCenter(loc); + map.setZoom(15); + } else { + // 2. If no lat/lng, try to find the selected City/Governate/Country + const city = getSelectedText(`id_${mode}_city`); + const governate = getSelectedText(`id_${mode}_governate`); + const country = getSelectedText(`id_${mode}_country`); + + if (city) { + let addressQuery = city; + if (governate) addressQuery += `, ${governate}`; + if (country) addressQuery += `, ${country}`; + + console.log(`Geocoding selected location: ${addressQuery}`); + + const geocoder = new google.maps.Geocoder(); + geocoder.geocode({ address: addressQuery }, (results, status) => { + if (status === "OK" && results[0]) { + const location = results[0].geometry.location; + map.setCenter(location); + map.setZoom(14); + // Optional: place marker at city center + marker.setPosition(location); + } else { + console.warn("Could not geocode city: " + status); + } + }); + } } } }, { once: true }); @@ -284,6 +348,8 @@ geocoder.geocode({ location: { lat: lat, lng: lng } }, (results, status) => { if (status === "OK" && results[0]) { const addrField = document.getElementById(`id_${currentMode}_address`); + // Only overwrite address if it's empty or user confirms? + // Currently existing behavior is to overwrite. addrField.value = results[0].formatted_address; } else { console.warn("Geocoder failed due to: " + status); @@ -400,4 +466,4 @@ document.addEventListener('DOMContentLoaded', function() { setupDependentDropdowns('id_delivery_country', 'id_delivery_governate', 'id_delivery_city'); }); -{% endblock %} \ No newline at end of file +{% endblock %}