@extends('layouts.base')

@section('menu')
    @include('admin.menu')
@endsection



@php
    $stats = [
        'pending' => "en attente", 
        'published' => "publié",  
        'stopped' => "arrêté",
    ];
    $i = 1;
@endphp

@section('content')
@if(session('success'))
    <div class="alert alert-success">
        {{ session('success') }}
    </div>
@endif

<section class="courses-listing bg-gray">
    <div class="container">
      <nav class="nav nav-pills nav-justified d-flex justify-content-center">
        <a href="{{ route('admin.offres') }}" 
           class="nav-link {{ Route::currentRouteName() === 'admin.offres' ? 'active' : '' }}" >
            Les offres
        </a>
        <a href="{{ route('admin.type-offres') }}" 
           class="nav-link {{ Route::currentRouteName() === 'admin.type-offres' ? 'active' : '' }}">
            Les types d'offres
        </a>
        <a href="{{ route('admin.domaines') }}" 
           class="nav-link {{ Route::currentRouteName() === 'admin.domaines' ? 'active' : '' }}">
            Les domaines
        </a>
    </nav>
              <div class="header d-flex justify-content-between align-items-center mb-4">
                  <h1 style=" color: black">Les offres </h1>
              </div>

       
            <!-- Barre de Recherche -->
            <form method="GET" action="{{ route('admin.offres') }}" class="mb-4" id="search-form">
                <div class="row">
                    <div class="col-md-6">
                        <input 
                            type="text" 
                            name="query" 
                            class="form-control" 
                            placeholder="Rechercher..." 
                            value="{{ request('query') }}" 
                        />
                    </div>
                    <div class="col-md-2">
                        <button type="submit" class="btn btn-primary">Rechercher</button>
                    </div>
                </div>
            </form>

          <div class="courses-table" >
             <div class="courses-table-header  d-flex justify-content-between align-items-center flex-column flex-md-row"
             style="background-color: {{ session('etablissementCouleur1') }};">
          
          <div class="left">
            <ul class="list-inline mb-0">
              
            </ul>
          </div>
           
          <form id="filterForm" method="GET" action="{{ route('admin.offres') }}">
            <div class="right">
                <select title="Trie par:" data-style="btn-outline-light" class="selectpicker" name="status" onchange="this.form.submit()">
                    <option value="" {{ request('status') == '' ? 'selected' : '' }}>Tous</option>
                    <option value="pending" {{ request('status') == 'pending' ? 'selected' : '' }}>En attente</option>
                    <option value="published" {{ request('status') == 'published' ? 'selected' : '' }}>Publié</option>
                    <option value="stopped" {{ request('status') == 'stopped' ? 'selected' : '' }}>Suspendu</option>
                </select>
                <a href="{{ route('admin.offres.create') }}" class="btn btn-success ml-3"><i class="fa fa-plus" aria-hidden="true"></i> Nouveau </a>
            </div>
        </form>

        </div>
        <div class="courses-table-body">
            
          <table id="offresTable" class="table table-hover table-responsive-xl" style="width: 100%;"> 
                <thead>
                    <tr>
                        <th>Code</th>
                        <th>Intitulé de l'offre</th>
                      <!--  <th>Description</th> -->
                        <th>Entreprise</th>
                        <th>Date de debut</th>
                        <th style="color: red">Date limite</th>
                        <th>Status</th>
                        <th style="width: 200px;">Actions</th>
                    </tr>
                </thead>  
                <tbody>
                  @if($offres->isEmpty())
                  <tr>
                      <td colspan="7" class="text-center">Aucune offre disponible pour le moment.</td>
                  </tr>
                  @else
                      @foreach($offres as $offre)
                      <tr>
                          <td>{{ $offre->reference }}</td>
                          <td>{{ $offre->title }}</td>
                          <td>{{ $offre->company_name }}</td>
                          <td>{{ $offre->start_date ? (new \DateTime($offre->start_date))->format('d/m/Y') : 'Date non disponible' }}</td>
                          <td style="color: red">{{ $offre->end_date ? (new \DateTime($offre->end_date))->format('d/m/Y') : 'Date non disponible' }}</td>
                          <td>{{ $stats[$offre->status] }}</td>
                          <td class="d-flex align-items-center">
                              <a style="margin-bottom: 5px;" href="{{ route('admin.show-offres', $offre->id) }}" class="btn btn-success" title="Voir">
                                  <i class="fa fa-eye" aria-hidden="true"></i>
                              </a>
                              <a style="margin-bottom: 5px;" href="{{ route('admin.edite-offres', $offre->id) }}" class="btn btn-primary ml-2" title="Modifier">
                                  <i class="fa fa-edit" aria-hidden="true"></i>
                              </a>
                              <a style="margin-bottom: 5px;" href="{{ route('admin.delete-offres', $offre->id) }}" class="btn btn-danger ml-2" title="Supprimer">
                                  <i class="fa fa-trash" aria-hidden="true"></i>
                              </a>
                          </td>
                      </tr>
                      @endforeach
                  @endif
              </tbody>
              
          </table>
          <!-- Affichage des éléments visibles -->
                <div class="d-flex justify-content-between mb-4">
                    <div>
                        <p class="text-muted small mb-0">
                            Affichage de {{ $offres->firstItem() }} à {{ $offres->lastItem() }} sur {{ $offres->total() }} offres
                        </p>
                    </div>
                </div>

          @if ($offres instanceof \Illuminate\Pagination\LengthAwarePaginator)
                <nav aria-label="Page navigation example" class="d-flex justify-content-center">
                    <ul class="pagination">
                        {{-- Bouton "Précédent" --}}
                        @if ($offres->onFirstPage())
                            <li class="page-item disabled"><a class="page-link">«</a></li>
                        @else
                            <li class="page-item"><a class="page-link" href="{{ $offres->previousPageUrl() }}">«</a></li>
                        @endif

                        {{-- Pages dynamiques --}}
                        @php
                            $start = max(1, $offres->currentPage() - 1);
                            $end = min($offres->lastPage(), $offres->currentPage() + 1);
                        @endphp

                        @if ($start > 1)
                            <li class="page-item"><a class="page-link" href="{{ $offres->url(1) }}">1</a></li>
                            @if ($start > 2)
                                <li class="page-item disabled"><a class="page-link">...</a></li>
                            @endif
                        @endif

                        @for ($page = $start; $page <= $end; $page++)
                            <li class="page-item {{ $offres->currentPage() == $page ? 'active' : '' }}">
                                <a class="page-link" href="{{ $offres->url($page) }}">{{ $page }}</a>
                            </li>
                        @endfor

                        @if ($end < $offres->lastPage())
                            @if ($end < $offres->lastPage() - 1)
                                <li class="page-item disabled"><a class="page-link">...</a></li>
                            @endif
                            <li class="page-item"><a class="page-link" href="{{ $offres->url($offres->lastPage()) }}">{{ $offres->lastPage() }}</a></li>
                        @endif

                        {{-- Bouton "Suivant" --}}
                        @if ($offres->hasMorePages())
                            <li class="page-item"><a class="page-link" href="{{ $offres->nextPageUrl() }}">»</a></li>
                        @else
                            <li class="page-item disabled"><a class="page-link">»</a></li>
                        @endif
                    </ul>
                </nav>
            @endif

        </div>
      </div>
      
    </div>
  </section>
<!-- Scripts -->
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
 
@endsection