@extends('dashboard.base')
@section('content')


@if(session('success'))
  <div class="container mt-3">
      <div class="alert alert-success alert-dismissible fade show" role="alert">
          {{ session('success') }}
          <button type="button" class="close" data-dismiss="alert" aria-label="Close">
              <span aria-hidden="true">&times;</span>
          </button>
      </div>
  </div>
@endif

@if(session('error'))
  <div class="container mt-3">
      <div class="alert alert-danger alert-dismissible fade show" role="alert">
          {{ session('error') }}
          <button type="button" class="close" data-dismiss="alert" aria-label="Close">
              <span aria-hidden="true">&times;</span>
          </button>
      </div>
  </div>
@endif


<div class="container my-4">
    <form>
        @csrf
        <div class="card">
            <div class="card-header">  
                @foreach(collect($vacancies)->unique('form_type') as $vacancy)
                    <h3>{{ $vacancy['form_type'] }} opportunities</h3>
                @endforeach
            </div>   
            <div class="card-body">
                <div class="container my-5">
                    <div class="card mb-4">
                        <div class="card-body">
                            <p class="lead">
                                This is a career management system that provides job vacancy details to the public. 
                                The system allows you to search and apply for jobs. We encourage you to take your time and look at the open positions we have available.
                            </p>
                            <p><strong>How does it work?</strong></p>
                            <p>
                                The process of applying for a job is as follows:
                                <ul>
                                    <li>View the job openings which are listed below</li>
                                    <li>Click the apply button which is available when you open the job details</li>
                                    <!-- <li>
                                        For first-timers, you will be taken to a screen where you will sign up otherwise you will be required to log in
                                    </li>
                                    <li>
                                        Once logged in, an easy step-by-step wizard is launched, and it guides you through the application process
                                    </li> -->
                                </ul>
                            </p>
                        </div>
                    </div>

                    <div class="table-responsive">
                        <table class="table table-bordered">
                            <thead class="table-warning">
                                <tr>
                                    <th>Vacancy No</th>
                                    <th>Position</th>
                                    <th>Deadline</th>
                                    <th>Status</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($vacancies as $vacancy)
                                    <tr>
                                        <td>{{ $vacancy['vacancy_no'] }}</td>
                                        <td>
                                            <a href="{{ route('job.details', ['id' => $vacancy['id']]) }}">
                                                {{ $vacancy['position'] }}
                                            </a>
                                        </td>
                                        <td>{{ \Carbon\Carbon::parse($vacancy['deadline'] ?? '2025-01-01')->format('d F Y') }}</td>
                                        <td class="{{ strtolower($vacancy['status']) === 'Open' ? 'text-danger' : 'text-muted' }}">
                                            {{ ucfirst($vacancy['status']) }}
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="4" class="text-center">No vacanciesss found.</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                </div>
            </div>
        </div>
    </form>
</div>
@endsection