@extends('masterdata::report-data')

@section('report-data')
  <div style="overflow-x: auto" class="mt-2">
    <div class="d-flex flex-column flex-md-row justify-content-between mb-2">
      <form class="mb-1 d-flex  flex-column flex-md-row gap-1 " method="GET">
        @foreach (request()->all() as $key => $value)
          @if ($key != 'page' && $key != 'per_page' && $key != 'jalur' && $key != 'fakultas' && $key != 'prodi' && $key != 'lengkap')
            <input type="hidden" name="{{ $key }}" value="{{ $value }}">
          @endif
        @endforeach
        <select name="jalur" value="{{ request()->jalur }}" class=" form-select" value='{{ request('jalur') }}'
          id="pilihan-jalur">
          <option value="">Semua Jalur</option>
          @foreach ($pilihan_jalur as $jalur)
            <option value="{{ $jalur->id }}" @if (request()->jalur == $jalur->id) selected @endif>
              {{ $jalur->name }}
            </option>
          @endforeach
        </select>

        <select name="fakultas" value="{{ request()->fakultas }}" class="form-select" value='{{ request('fakultas') }}'
          id="pilihan-fakultas">

          <option value="">Semua Fakultas</option>
          @foreach ($pilihan_fakultas as $fakultas)
            <option value="{{ $fakultas->id }}" @if (request()->fakultas == $fakultas->id) selected @endif>
              {{ $fakultas->name }}
            </option>
          @endforeach

        </select>

        <select name="prodi" value="{{ request()->prodi }}" class=" form-select" value='{{ request('prodi') }}'
          id="pilihan-prodi">
          <option value="">Semua Prodi</option>
          @foreach ($pilihan_prodi as $prodi)
            <option value="{{ $prodi->id }}" @if (request()->prodi == $prodi->id) selected @endif>
              {{ $prodi->name }}
            </option>
          @endforeach
        </select>

        <select name="kelengkapan" class="form-select">
          <option value="all" selected>
            Semua Status
          </option>
          <option value="yes" @if (request('kelengkapan') == 'yes') selected @endif>
            Lengkap
          </option>
          <option value="no" @if (request('kelengkapan') == 'no') selected @endif>
            Belum Lengkap
          </option>
        </select>

        <button type="submit" class="btn btn-primary">
          <i class="fa fa-search"></i>
        </button>
      </form>

      <div class="">
        <button class="btn btn-success" id="export-pendaftar-berkas">
          <i class="fa-solid fa-file-excel me-1"></i>
          Download Report</button>
      </div>
    </div>

    <div class="overflow-auto">

      <table id="" class="table  table-striped table-bordered rounded table-hover">
        <thead class="bg-primary text-white">
          <tr>
            <th>No</th>
            <th>Nama Mahasiswa</th>
            <th>No Peserta</th>
            <th>Jalur</th>
            <th>Kelulusan Fakultas/prodi</th>
            <th>Kelengkapan Berkas</th>
          </tr>
        </thead>

        <tbody>
          @foreach ($mahasiswas as $index => $mahasiswa)
            <tr>
              <td>{{ $index + 1 + ($page_detail['page'] - 1) * $page_detail['per_page'] }}</td>
              <td>{{ $mahasiswa->name }}</td>
              <td>{{ $mahasiswa->no_peserta }}</td>
              <td>{{ $mahasiswa->nama_jalur }}</td>
              <td>
                {{ $mahasiswa->nama_fakultas }} / {{ $mahasiswa->nama_prodi }}
              </td>

              <td>
                @if ($mahasiswa->jumlah_berkas_valid == $mahasiswa->jumlah_berkas_total)
                  <span class="badge p-2 rounded-pill bg-success">Lengkap</span>
                @else
                  <span class="badge p-2 rounded-pill bg-danger">Belum Lengkap</span>
                @endif
                {{-- {{ $mahasiswa->jumlah_berkas_valid }} -
                {{ $mahasiswa->jumlah_berkas_total }} --}}
              </td>

            </tr>
          @endforeach
        </tbody>
      </table>

      {{ $mahasiswas->appends([
              'tahun' => request('tahun'),
              'gelombang' => request('gelombang'),
              'jalur' => request('jalur'),
              'fakultas' => request('fakultas'),
              'prodi' => request('prodi'),
          ])->links('pagination::bootstrap-4') }}
    </div>
  </div>


  <script>
    $(document).ready(function() {
      $('#pilihan-jalur').on(
        'change',
        function() {
          var jalur = this.value;
          if (jalur && jalur !== '') {
            $.ajax({
              url: '/masterdata/gelombang/berkas/dependant-fakultas/' + {{ request('gelombang') }} + '/' +
                jalur,
              type: 'GET',
              success: function(data) {
                $('#pilihan-fakultas').empty();
                $('#pilihan-fakultas').append(
                  '<option value="">Semua fakultas</option>'
                )
                $.each(data, function(key, value) {
                  $('#pilihan-fakultas').append(
                    '<option value="' + value.id + '">' + value.name + '</option>'
                  )
                })
              },
              error: function(data) {}

            })
          }
        }
      )

      $('#pilihan-fakultas').on('change', function() {
        var id_fakultas = this.value;
        $("#pilihan-prodi").empty();
        $("#pilihan-prodi").append(
          '<option value=""> Semua Prodi </option>'
        );
        $.ajax({
          url: '/masterdata/gelombang/berkas/dependant-prodi/' + {{ request('gelombang') }} + "/" + $(
            '#pilihan-jalur').val() + "/" + id_fakultas,
          type: 'GET',
          dataType: 'json',
          success: function(data) {

            $.each(data, function(index, value) {
              $("#pilihan-prodi").append(
                '<option value="' + value.id + '">' + value.name + '</option>'
              );
            });
          },
          error: function(data) {
            // console.log(data);
          }

        });

      });
    });
  </script>
@endsection