<x-layout bodyClass="g-sidenav-show  bg-gray-200">

  <x-navbars.sidebar_triage
    role="{{ $request->user()->role }}"
    activePage="show_applicable_schedules"
    teacherId="{{ $current_teacher->id }}"
  >
  </x-navbars.sidebar_triage>

  <main
    class="main-content position-relative max-height-vh-100 h-100 border-radius-lg"
  >

    <!-- Navbar -->
    <x-navbars.navs.auth
      titlePage="Update student attendance"
      role="{{ $request->user()->role }}"
      firstName="{{ $current_teacher->firstName }}"
      last_name="{{ $current_teacher->lastName }}"
    >
    </x-navbars.navs.auth>
    <!-- End Navbar -->

    <div class="container-fluid py-4">

      @if ($message = Session::get('success'))
        <div
          class="alert alert-success"
          style="display: flex; align-items: center; gap: 0.5rem; color: white; opacity: 0.9;"
        >
          <!-- <p>{{ $message }}</p> -->
          <i class="material-icons opacity-10">check</i>
          <p style="padding: 0; margin: 0;">{{ $message }}</p>
        </div>
      @endif

      <form
        action="{{ route('teacherUpdateAttendance', [$current_teacher->id, $schedule_id]) }}"
        method="POST"
        enctype="multipart/form-data"
      >
        @csrf
        @method('PUT')

        <div class="container">
          <div class="row">
            <div class="col-3">
              <span style="font-weight: bold">Present</span>
            </div>
            <div class="col-3">
              <span style="font-weight: bold">Student email</span>
            </div>

          </div>

          @foreach ($students as $student)
            <div class="row mt-2">
              <div class="form-check col-3">
                <input
                  class="form-check-input"
                  id="flexCheckDefault"
                  name="present.student_id_{{ $student->id }}"
                  type="checkbox"
                  {{ in_array($student->id, $present_student_ids) ? 'checked' : '' }}
                />
              </div>

              <div class="col-3">
                {{ $student->email }}
              </div>

            </div>

            <div class="form-check mt-2">

            </div>
          @endforeach
        </div>

        <div class="mt-4">

          <button
            class="btn bg-gradient-dark"
            type="submit"
          >
            <i class="material-icons opacity-10">save</i> Save
          </button>

          <a
            class="btn bg-gradient-dark"
            href="{{ route('teacherShowApplicableSchedules') }}"
          >
            Cancel
          </a>

        </div>
      </form>

      <x-footers.auth></x-footers.auth>
    </div>

  </main>

</x-layout>
