<h1 class="mb-5">{{$name}}</h1>
@if(!$data)
    <x-noData/>
@else
        <table class="table table-bordered" id="detail-expense-tab">
            <thead>
            <tr class="bg-primary text-white">
                @php
                    $fields = [
                        'date' => 'Date',
                        'domaine' => 'Domaine',
                        'segment' => 'Segment',
                        'sous_segment' => 'Sous-segment',
                        'nature_de_la_prestation' => 'Nature de la prestation',
                        'tiers_nom' => 'Fournisseur',
                        'montant_ht' => 'Montant HT'
                    ];
                @endphp
                @foreach($fields as $field => $display)
                    @php
                        $url = url()->current() . '?' . http_build_query(array_merge(request()->except('sort_by', 'sort_order'), ['sort_by' => $field, 'sort_order' => ($sortField === $field && $sortOrder === 'asc') ? 'desc' : 'asc']));
                        $urlWithFragment = $url . '#detail-expense-tab';
                    @endphp
                    <th scope="col">{{ $display }}
                        <a class="ml-2"
                           href="{{ $urlWithFragment }}">
                            @if ($sortField === $field)
                                @if ($sortOrder === 'asc')
                                    <i class="fas fa-sort-down text-white"></i>
                                @else
                                    <i class="fas fa-sort-up text-white"></i>
                                @endif
                            @else
                                <i class="fas fa-sort text-white"></i>
                            @endif
                        </a>
                    </th>
                @endforeach
            </tr>
            </thead>
            <tbody>
            @foreach($detailsOfExpenses['detailsOfExpenses']->items() as $detailOfExpenses)
                <tr>
                    <th scope="row">{{ $detailOfExpenses->date }}</th>
                    <td>{{ $detailOfExpenses->domaine }}</td>
                    <td>{{ $detailOfExpenses->segment }}</td>
                    <td>{{ $detailOfExpenses->sous_segment }}</td>
                    <td>{{ $detailOfExpenses->nature_de_la_prestation }}</td>
                    <td>{{ $detailOfExpenses->tiers_nom }}</td>
                    <td>{{ number_format($detailOfExpenses->montant_ht, 2, ',', ' ') }} €</td>
                </tr>
            @endforeach
            </tbody>
        </table>
    {{ $detailsOfExpenses['detailsOfExpenses']->appends(request()->except('page'))->fragment('detail-expense-tab')->links() }}
    <x-saveAsExcel :data="$detailsOfExpenses['allData']" :nameFile="'Détail des dépenses'"/>
    <script>

        document.getElementById('selectDetailsOfExpenseLimit').addEventListener('change', function () {
            document.getElementById('paginationExpensesForm').submit();
        });

    </script>
@endif
