feat: Add Google Places autocomplete for address search

- Add address search input field with autocomplete
- Integrate Google Places API to provide address suggestions
- Parse selected address components and auto-populate form fields
- Address fields initially hidden, show when address is selected
- Add clear button to reset address selection
- Support South Africa locations with country restriction
- Add Google Places API key config to services.php
- Hide/show address fields based on selection and validation errors
This commit is contained in:
twotalesanimation
2026-01-03 00:15:30 +02:00
parent dd950b5aba
commit b8cc8bd421
5 changed files with 260 additions and 34 deletions
@@ -0,0 +1,49 @@
<!-- Read-Only State -->
<div class="bg-blue-50 border-2 border-blue-200 rounded-lg p-6 mb-8">
<div class="flex items-start">
<div class="flex-1">
<h2 class="text-2xl font-bold text-blue-900 mb-2">📋 Order Status: Read-Only</h2>
<p class="text-blue-800 mb-4">
This order is in the <strong><?php echo e(str_replace('_', ' ', ucfirst($order->status))); ?></strong> phase.
No actions are available at this stage.
</p>
<?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($order->status === 'ready_to_ship'): ?>
<div class="bg-white border-l-4 border-blue-500 p-4 rounded">
<p class="text-gray-700">
<strong>Next Step:</strong> Move Trello card to "Ready to Ship" to trigger automatic shipment creation.
</p>
</div>
<?php elseif($order->status === 'awaiting_collection'): ?>
<div class="bg-white border-l-4 border-blue-500 p-4 rounded">
<p class="text-gray-700">
<strong>Status:</strong> Parcel is awaiting collection from courier.
</p>
<?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($order->courier_waybill_id): ?>
<p class="text-gray-700 mt-2">
<strong>Waybill:</strong> <code class="bg-gray-100 px-2 py-1 rounded"><?php echo e($order->courier_waybill_id); ?></code>
</p>
<?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
</div>
<?php elseif($order->status === 'in_transit'): ?>
<div class="bg-white border-l-4 border-green-500 p-4 rounded">
<p class="text-gray-700">
<strong>Status:</strong> Parcel is in transit to the customer.
</p>
<?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($order->courier_tracking_number): ?>
<p class="text-gray-700 mt-2">
<strong>Tracking:</strong> <code class="bg-gray-100 px-2 py-1 rounded"><?php echo e($order->courier_tracking_number); ?></code>
</p>
<?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
</div>
<?php else: ?>
<div class="bg-white border-l-4 border-gray-500 p-4 rounded">
<p class="text-gray-700">
The order is progressing through the fulfillment pipeline.
</p>
</div>
<?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
</div>
</div>
</div>
<?php /**PATH /var/www/additional_design/resources/views/ops/actions/read-only.blade.php ENDPATH**/ ?>