{{-- resources/views/admin/points/index.blade.php --}}
@extends('layouts.base')

@php
    $pt = $p ?? null;

@endphp

@section('title','Admin · Waypoints')

@section('content')
    <div class="wrap">

        {{-- Messages flash --}}
        @if(session('ok'))
            <div style="background:#ecfdf5;border:1px solid #10b98133;padding:10px;border-radius:8px;margin-bottom:12px">
                {{ session('ok') }}
            </div>
        @endif
        @if (session('status'))
            <div class="alert success" style="margin:8px 0">{{ session('status') }}</div>
        @endif

        <h1 style="margin:0 0 10px;">Admin · Waypoints</h1>

        {{-- Barre de recherche --}}
        <input
            id="point-filter-q"
            type="search"
            name="q"
            value="{{ $q ?? '' }}"
            placeholder="{{ __('Filter… (name, address, city, country, …)') }}"
            style="margin-left:auto; min-width:260px"
            autocomplete="off"
        >

        {{-- Actions bulk --}}
        <div style="display:flex;gap:8px;flex-wrap:wrap;margin:10px 0">
            {{-- boutons / formulaires bulk --}}
            <form method="POST" action="{{ route('admin.points.bulk.fillAddresses') }}">
                @csrf
                <button class="btn small " type="submit">{{ __('Compléter adresses (bulk)') }}</button>
            </form>

             <form method="POST" action="{{ route('admin.points.bulk.generateQrcodes') }}">
                @csrf
                <button type="submit" class="btn small ">
                    {{ __('Generate all QR codes') }}
                </button>
            </form>
            @if(session('qr_errors'))
                <details style="margin-top:.5rem">
                    <summary>{{ __('View errors') }} ({{ count(session('qr_errors')) }})</summary>
                    <ul>
                        @foreach(session('qr_errors') as $err)
                            <li>{{ $err }}</li>
                        @endforeach
                    </ul>
                </details>
            @endif

            {{-- <form method="POST" action="{{ route('admin.points.generateSerials') }}">
                @csrf
                <button class="btn small ghost" type="submit">{{ __('Generate missing Serials') }}</button>
            </form> --}}

            <form method="POST" action="{{ route('admin.points.serials.generate', app()->getLocale()) }}">
                @csrf
                <input type="hidden" name="force" value="1"> {{-- optionnel --}}
                <input type="hidden" name="qr" value="1">    {{-- regen QR aussi --}}
                <button class="btn small " type="submit">
                    {{ __('Generate all serials (+ QR)') }}
                </button>
            </form>

            <form method="POST" action="{{ route('admin.points.generateMissingQr') }}">
                @csrf
                <button class="btn small " type="submit">{{ __('Generate missing QR codes') }}</button>
            </form>

            {{-- lien Éditer dans le tableau --}}
            {{-- <a class="btn" href="{{ route('admin.points.edit', $p) }}">Éditer</a>             --}}
        </div>

        @if(session('status'))
            <div class="ok">{{ session('status') }}</div>
        @endif

        {{-- Tableau --}}
        <div id="points-table">
            @include('admin.points._table', ['points' => $points])
        </div>


        <div style="overflow:auto;border:1px solid #e5e7eb;border-radius:10px">

        </div>

        {{-- <div style="margin-top:12px">
            {{ $points->links() }}
        </div>

        Pagination si fournie --}}
        {{-- @if(method_exists($points, 'links'))
            <div style="margin-top:12px;">{{ $points->links() }}</div>
        @endif --}}

    </div>

    <script>
        (() => {
            const input = document.getElementById('point-filter-q');
            const target = document.getElementById('points-table');
            if (!input || !target) return;

            // petit debounce
            let t = null;
            function debouncedFetch() {
                clearTimeout(t);
                t = setTimeout(runFetch, 250);
            }

            async function runFetch(urlOverride) {
                const baseUrl = urlOverride || (new URL(window.location.href)).pathname;
                const url = new URL(baseUrl, window.location.origin);
                const q = (input.value || '').trim();
                if (q.length) url.searchParams.set('q', q);

                try {
                    const res = await safeFetch(url.toString(), {
                        method: 'GET',
                        headers: { 'X-Requested-With': 'XMLHttpRequest', 'Accept': 'text/html' },
                        credentials: 'same-origin'
                    });
                    const html = await res.text();
                    if (res.ok) {
                        target.innerHTML = html;
                        // met à jour l’URL (pour Back/Forward + partage)
                        const newUrl = url.toString();
                        if (newUrl !== window.location.href) history.replaceState({}, '', newUrl);
                        hookPagination(); // rebranche la pagination AJAX
                    } else {
                        console.error('Filter fetch failed', res.status, html);
                    }
                } catch(e) {
                    console.error('Network error', e);
                }
            }

            function hookPagination() {
                target.querySelectorAll('a.page-link, .pagination a').forEach(a => {
                    a.addEventListener('click', (ev) => {
                        ev.preventDefault();
                        runFetch(a.getAttribute('href'));
                    }, { once: true });
                });
            }

            // live input
            input.addEventListener('input', debouncedFetch);
            // rebranche la pagination initiale
            {{-- hookPagination(); --}}
        })();
    </script>

@endsection