<?php $__env->startSection('title', 'Shipment Details'); ?>

<?php $__env->startPush('scripts'); ?>
<script src="https://maps.googleapis.com/maps/api/js?key=<?php echo e(config('services.google.maps_api_key')); ?>"></script>
<script>
    function initMap() {
        const shipment = <?php echo json_encode($shipment, 15, 512) ?>;
        const path = <?php echo json_encode($shipment->getLocationHistory(), 15, 512) ?>;

        const map = new google.maps.Map(document.getElementById("tracking-map"), {
            zoom: 4,
            center: { lat: 0, lng: 0 },
        });

        // Create path
        const flightPath = new google.maps.Polyline({
            path: path,
            geodesic: true,
            strokeColor: "#4F46E5",
            strokeOpacity: 1.0,
            strokeWeight: 2,
        });

        // Add markers
        path.forEach((location, index) => {
            const marker = new google.maps.Marker({
                position: { lat: location.lat, lng: location.lng },
                map: map,
                title: location.name,
                label: (index + 1).toString()
            });

            const infoWindow = new google.maps.InfoWindow({
                content: `
                    <div class="p-2">
                        <h3 class="font-bold">${location.name}</h3>
                        <p>${location.date}</p>
                        <p>${location.status}</p>
                    </div>
                `
            });

            marker.addListener("click", () => {
                infoWindow.open({
                    anchor: marker,
                    map,
                });
            });
        });

        flightPath.setMap(map);

        // Fit bounds to show all markers
        const bounds = new google.maps.LatLngBounds();
        path.forEach(location => bounds.extend({ lat: location.lat, lng: location.lng }));
        map.fitBounds(bounds);
    }

    window.addEventListener('load', initMap);
</script>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
<div class="container mx-auto px-4">
    <div class="max-w-5xl mx-auto">
        <?php if(session('success')): ?>
            <div class="mb-4 bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded">
                <?php echo e(session('success')); ?>

            </div>
        <?php endif; ?>

        <!-- Top Actions -->
        <div class="mb-6 flex justify-between items-center">
            <h1 class="text-2xl font-bold text-gray-900">
                Shipment #<?php echo e($shipment->tracking_number); ?>

            </h1>
            <div class="flex space-x-3">
                <a href="<?php echo e(route('admin.shipments.edit', $shipment)); ?>" 
                   class="bg-indigo-600 text-white px-4 py-2 rounded-md hover:bg-indigo-700">
                    Edit Shipment
                </a>
                <a href="<?php echo e(route('admin.shipments.invoice', $shipment)); ?>" 
                   class="bg-gray-600 text-white px-4 py-2 rounded-md hover:bg-gray-700">
                    Download Invoice
                </a>
            </div>
        </div>

        <!-- Status Timeline -->
        <div class="bg-white rounded-lg shadow mb-6 p-6">
            <h2 class="text-lg font-medium text-gray-900 mb-4">Current Status</h2>
            <div class="relative">
                <div class="h-2 bg-gray-200">
                    <div class="h-2 bg-indigo-600" style="width: <?php echo e($shipment->travel_progress); ?>%"></div>
                </div>
                <div class="flex justify-between mt-4">
                    <div class="text-center">
                        <div class="w-8 h-8 mx-auto rounded-full <?php echo e($shipment->status == 'pending' ? 'bg-indigo-600' : 'bg-gray-200'); ?> flex items-center justify-center">
                            <span class="text-white text-sm">1</span>
                        </div>
                        <div class="mt-2 text-sm text-gray-600">Order Placed</div>
                    </div>
                    <div class="text-center">
                        <div class="w-8 h-8 mx-auto rounded-full <?php echo e($shipment->status == 'in_transit' ? 'bg-indigo-600' : 'bg-gray-200'); ?> flex items-center justify-center">
                            <span class="text-white text-sm">2</span>
                        </div>
                        <div class="mt-2 text-sm text-gray-600">In Transit</div>
                    </div>
                    <div class="text-center">
                        <div class="w-8 h-8 mx-auto rounded-full <?php echo e($shipment->status == 'delivered' ? 'bg-indigo-600' : 'bg-gray-200'); ?> flex items-center justify-center">
                            <span class="text-white text-sm">3</span>
                        </div>
                        <div class="mt-2 text-sm text-gray-600">Delivered</div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Main Information Grid -->
        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
            <!-- Sender Information -->
            <div class="bg-white rounded-lg shadow p-6">
                <h2 class="text-lg font-medium text-gray-900 mb-4">Sender Information</h2>
                <dl class="space-y-3">
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Name</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->sender_name); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Email</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->sender_email); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Contact</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->sender_contact); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Address</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->sender_address); ?></dd>
                    </div>
                </dl>
            </div>

            <!-- Receiver Information -->
            <div class="bg-white rounded-lg shadow p-6">
                <h2 class="text-lg font-medium text-gray-900 mb-4">Receiver Information</h2>
                <dl class="space-y-3">
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Name</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->receiver_name); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Email</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->receiver_email); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Contact</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->receiver_contact); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Address</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->receiver_address); ?></dd>
                    </div>
                </dl>
            </div>

            <!-- Shipment Details -->
            <div class="bg-white rounded-lg shadow p-6">
                <h2 class="text-lg font-medium text-gray-900 mb-4">Shipment Details</h2>
                <dl class="space-y-3">
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Description</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->pdesc); ?></dd>
                    </div>
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <dt class="text-sm font-medium text-gray-500">Weight</dt>
                            <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->weight); ?></dd>
                        </div>
                        <div>
                            <dt class="text-sm font-medium text-gray-500">Quantity</dt>
                            <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->quantity); ?></dd>
                        </div>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Package Image</dt>
                        <dd class="mt-1">
                            <?php if($shipment->image): ?>
                                <img src="<?php echo e(Storage::url($shipment->image)); ?>" 
                                     alt="Package Image" 
                                     class="h-32 w-auto rounded">
                            <?php else: ?>
                                <span class="text-sm text-gray-500">No image available</span>
                            <?php endif; ?>
                        </dd>
                    </div>
                </dl>
            </div>

            <!-- Delivery Information -->
            <div class="bg-white rounded-lg shadow p-6">
                <h2 class="text-lg font-medium text-gray-900 mb-4">Delivery Information</h2>
                <dl class="space-y-3">
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Status</dt>
                        <dd class="mt-1">
                            <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full
                                <?php echo e($shipment->status === 'delivered' ? 'bg-green-100 text-green-800' : 
                                   ($shipment->status === 'in_transit' ? 'bg-yellow-100 text-yellow-800' : 
                                   'bg-gray-100 text-gray-800')); ?>">
                                <?php echo e(ucfirst($shipment->status)); ?>

                            </span>
                        </dd>
                    </div>
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <dt class="text-sm font-medium text-gray-500">Dispatch Date</dt>
                            <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->dispatch_date); ?></dd>
                        </div>
                        <div>
                            <dt class="text-sm font-medium text-gray-500">Delivery Date</dt>
                            <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->delivery_date); ?></dd>
                        </div>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Current Location</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->current_location ?? 'Not available'); ?></dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Carrier</dt>
                        <dd class="mt-1 text-sm text-gray-900"><?php echo e($shipment->carrier); ?> (Ref: <?php echo e($shipment->carrier_ref); ?>)</dd>
                    </div>
                    <div>
                        <dt class="text-sm font-medium text-gray-500">Payment Information</dt>
                        <dd class="mt-1 text-sm text-gray-900">
                            Mode: <?php echo e(ucfirst($shipment->payment_mode)); ?><br>
                            Total: <?php echo e($shipment->total_f); ?>

                        </dd>
                    </div>
                </dl>
            </div>
        </div>

        <!-- Map -->
        <?php if($shipment->show_map): ?>
            <div class="mt-6 bg-white rounded-lg shadow p-6">
                <h2 class="text-lg font-medium text-gray-900 mb-4">Tracking Map</h2>
                <div id="tracking-map" class="h-96 w-full rounded-lg"></div>
            </div>
        <?php endif; ?>
    </div>
</div>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('admin.layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/test/public_html/resources/views/admin/shipments/show.blade.php ENDPATH**/ ?>