@extends('layouts.admin')
@section('title', 'Delivery Zones')
@section('content')
<div class="tw-migrated space-y-4">
    <x-ui.page-header title="Delivery Zones" subtitle="Route online orders by pincode to preferred Fulfills-online locations" />

    @if(session('success'))
        <x-ui.alert type="success">{{ session('success') }}</x-ui.alert>
    @endif

    <div class="grid gap-4 lg:grid-cols-12">
        <div class="lg:col-span-4">
            <x-ui.card title="Add Zone">
                <form method="post" action="{{ route('admin.delivery-zones.store') }}">
                    @csrf
                    <div class="mb-2">
                        <label class="admin-form-label">Name *</label>
                        <input name="name" class="form-control admin-form-control" required placeholder="e.g. Warangal City">
                    </div>
                    <div class="mb-2">
                        <label class="admin-form-label">Exact Pincode</label>
                        <input name="pincode" class="form-control admin-form-control" placeholder="506002">
                    </div>
                    <div class="row g-2 mb-2">
                        <div class="col-6">
                            <label class="admin-form-label">Pincode From</label>
                            <input name="pincode_from" class="form-control admin-form-control">
                        </div>
                        <div class="col-6">
                            <label class="admin-form-label">Pincode To</label>
                            <input name="pincode_to" class="form-control admin-form-control">
                        </div>
                    </div>
                    <div class="mb-2">
                        <label class="admin-form-label">Preferred locations (Fulfills online)</label>
                        <select name="location_ids[]" class="form-select admin-form-control" multiple size="6">
                            @foreach($stores as $store)
                                <option value="{{ $store->id }}">
                                    {{ $store->name }}{{ $store->type === 'warehouse' ? ' (WH)' : '' }}
                                </option>
                            @endforeach
                        </select>
                        <small class="text-muted">Hold Ctrl/Cmd. Selection order = priority (first = highest).</small>
                    </div>
                    <div class="form-check mb-3">
                        <input type="checkbox" name="is_active" value="1" class="form-check-input" id="za" checked>
                        <label for="za" class="form-check-label">Active</label>
                    </div>
                    <button type="submit" class="tw-btn-primary w-100">Create Zone</button>
                </form>
            </x-ui.card>
        </div>
        <div class="lg:col-span-8 space-y-3">
            @forelse($zones as $zone)
                <x-ui.card :title="$zone->name">
                    <form method="post" action="{{ route('admin.delivery-zones.update', $zone) }}" class="row g-2">
                        @csrf
                        @method('PUT')
                        <div class="col-md-4">
                            <label class="admin-form-label">Name *</label>
                            <input name="name" class="form-control admin-form-control" required value="{{ $zone->name }}">
                        </div>
                        <div class="col-md-2">
                            <label class="admin-form-label">Exact pin</label>
                            <input name="pincode" class="form-control admin-form-control" value="{{ $zone->pincode }}">
                        </div>
                        <div class="col-md-2">
                            <label class="admin-form-label">From</label>
                            <input name="pincode_from" class="form-control admin-form-control" value="{{ $zone->pincode_from }}">
                        </div>
                        <div class="col-md-2">
                            <label class="admin-form-label">To</label>
                            <input name="pincode_to" class="form-control admin-form-control" value="{{ $zone->pincode_to }}">
                        </div>
                        <div class="col-md-2 d-flex align-items-end">
                            <div class="form-check mb-2">
                                <input type="checkbox" name="is_active" value="1" class="form-check-input" id="z{{ $zone->id }}" @checked($zone->is_active)>
                                <label for="z{{ $zone->id }}" class="form-check-label">Active</label>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <label class="admin-form-label">Preferred locations</label>
                            <select name="location_ids[]" class="form-select admin-form-control" multiple size="4">
                                @php $selected = $zone->locations->pluck('id')->all(); @endphp
                                @foreach($stores as $store)
                                    <option value="{{ $store->id }}" @selected(in_array($store->id, $selected, true))>
                                        {{ $store->name }}{{ $store->type === 'warehouse' ? ' (WH)' : '' }}
                                        @if($zone->locations->firstWhere('id', $store->id)?->pivot?->priority)
                                            (p{{ $zone->locations->firstWhere('id', $store->id)->pivot->priority }})
                                        @endif
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-4 d-flex align-items-end gap-2">
                            <button type="submit" class="tw-btn-primary">Save</button>
                            <button type="submit" form="delete-zone-{{ $zone->id }}" class="tw-btn-danger" onclick="return confirm('Delete zone?')">Delete</button>
                        </div>
                    </form>
                    <form id="delete-zone-{{ $zone->id }}" method="post" action="{{ route('admin.delivery-zones.destroy', $zone) }}" class="d-none">
                        @csrf @method('DELETE')
                    </form>
                </x-ui.card>
            @empty
                <x-ui.card>
                    <p class="text-muted mb-0">No zones yet. Add one to route online orders by pincode.</p>
                </x-ui.card>
            @endforelse
            {{ $zones->links() }}
        </div>
    </div>
</div>
@endsection