@extends("admin.admin_app")

@section("content")

<div class="content-page">
    <div class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="card-box table-responsive">
                        <div class="row">
                            <!-- Filtre par statut -->
                            <div class="col-sm-3">
                                <select class="form-control" name="status_filter" id="status_filter">
                                    <option value="">{{ trans('words.filter_by_status') }}</option>
                                    <option value="Demandé" {{ request('status') == 'Demandé' ? 'selected' : '' }}>Demandé</option>
                                    <option value="En cours" {{ request('status') == 'En cours' ? 'selected' : '' }}>En cours</option>
                                    <option value="Traité" {{ request('status') == 'Traité' ? 'selected' : '' }}>Traité</option>
                                    <option value="Actuellement Indisponible" {{ request('status') == 'Actuellement Indisponible' ? 'selected' : '' }}>Actuellement Indisponible</option>
                                </select>
                            </div>

                            <!-- Recherche par titre -->
                            <div class="col-md-3">
                                {!! Form::open(['url' => 'admin/requests', 'class' => 'app-search', 'id' => 'search', 'role' => 'form', 'method' => 'get']) !!}
                                    @if(request('status'))
                                        <input type="hidden" name="status" value="{{ request('status') }}"> <!-- Conserve le filtre de statut -->
                                    @endif
                                    <input type="text" name="s" placeholder="{{ trans('words.search_by_title') }}" class="form-control" value="{{ request('s') }}" id="search_field">
                                    <button type="submit"><i class="fa fa-search"></i></button>
                                {!! Form::close() !!}
                            </div>
                        </div>

                        @if(Session::has('flash_message'))
                            <div class="alert alert-success">
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                                {{ Session::get('flash_message') }}
                            </div>
                        @endif

                        
    @include('admin.pages.requests.partials.results', ['requests' => $requests])
  

                        
                    </div>
                </div>
            </div>
        </div>
    </div>
    @include("admin.copyright")
</div>

<script src="{{ URL::asset('admin_assets/js/jquery.min.js') }}"></script>

<script type="text/javascript">
    $(document).ready(function () {
        // Mise à jour dynamique du filtre par statut
        $(document).on("change", "#status_filter", function () {
            const selectedStatus = $(this).val();
            const url = new URL(window.location.href);
            const searchParams = url.searchParams;

            if (selectedStatus) {
                searchParams.set('status', selectedStatus);
            } else {
                searchParams.delete('status');
            }

            window.history.replaceState({}, '', url.toString());

            fetchFilteredResults(url.toString());
        });

        // Recherche en temps réel
        $('#search_field').on('input', function () {
            const query = $(this).val().trim();
            const url = new URL(window.location.href);
            const searchParams = url.searchParams;

            if (query) {
                searchParams.set('s', query);
            } else {
                searchParams.delete('s');
            }

            window.history.replaceState({}, '', url.toString());

            fetchFilteredResults(url.toString());
        });

        // Gestion de la pagination en temps réel
        $(document).on('click', '.paging_simple_numbers a', function (e) {
            e.preventDefault();
            const url = $(this).attr('href'); // Récupère l'URL du lien

            window.history.replaceState({}, '', url); // Met à jour l'URL

            fetchFilteredResults(url);
        });

        // Fonction pour effectuer la requête AJAX
        function fetchFilteredResults(url) {
            $.ajax({
                url: url,
                type: 'GET',
                success: function (data) {
                    // Met à jour les résultats
                    $('#requests-container').html($(data).find('#requests-container').html());

                    // Met à jour la pagination
                    const pagination = $(data).find('.paging_simple_numbers');
                    if (pagination.length) {
                        $('.paging_simple_numbers').html(pagination.html()).show();
                    } else {
                        $('.paging_simple_numbers').hide();
                    }
                },
                error: function () {
                    $('#requests-container').html('<tr><td colspan="8" class="text-danger text-center">Erreur lors de la récupération des données.</td></tr>');
                    $('.paging_simple_numbers').hide();
                }
            });
        }
    });
</script>



@endsection