@extends('auth::layouts.morvinnav_novue')

@section('main')
  <div class="page-title-box">
    <div class="container-fluid">
      <div class="row align-items-center">
        <div class="col-sm-6">
          <div class="page-title">
            <h4>REPORT DATA</h4>
            <ol class="breadcrumb m-0">
              @foreach ($routes as $key => $route)
                <li class="breadcrumb-item"><a href="{{ $route }}">{{ $key }}</a></li>
              @endforeach
            </ol>
          </div>
        </div>

      </div>
    </div>
  </div>

  <div class="container-fluid">
    <div class="page-content-wrapper">

      <div class="card">

        <div class="card-header p-3 pb-0">

          <form class="d-flex flex-md-row flex-column gap-2 mb-2" action="/masterdata/report-data" method="GET">
            <div class="">
              <select name="tahun" value="{{ request()->tahun }}" class=" form-select" required value=''
                id="pilihan-tahun">
                <option value="">Pilih Tahun...</option>
                @foreach ($pilihan_tahun as $tahun)
                  <option value="{{ $tahun->id }}" @if (request()->tahun == $tahun->id) selected @endif>
                    {{ $tahun->year }}
                  </option>
                @endforeach
              </select>
            </div>

            <div class="">
              <select name="gelombang" value="{{ request()->gelombang }}" class=" form-select" required
                value='{{ request('gelombang') }}' onchange="submit()" id="pilihan-gelombang">
                <option value="">Pilih Gelombang...</option>
                @foreach ($pilihan_gelombang as $gelombang)
                  <option value="{{ $gelombang->id }}" @if (request()->gelombang == $gelombang->id) selected @endif>
                    {{ $gelombang->name }}
                  </option>
                @endforeach
              </select>
            </div>
          </form>



          <ul class="nav nav-tabs nav-fill " id='gelombang-tab' style="">
            <li class="nav-item ">
              <a class="nav-link
							@if (last(request()->segments()) == 'pendaftar') active @endif
							"
                href="/masterdata/report-data/pendaftar?tahun={{ request('tahun') }}&gelombang={{ request('gelombang') }}">
                <i class="fa-solid fa-file-lines"></i>
                Semua Pendaftar
              </a>
            </li>

            <li class="nav-item ">
              <a class="nav-link
							@if (last(request()->segments()) == 'lunas') active @endif
							"
                href="/masterdata/report-data/lunas?tahun={{ request('tahun') }}&gelombang={{ request('gelombang') }}">
                <i class="fa-solid fa-file-invoice-dollar"></i>
                Pembayaran Pendaftaran
              </a>
            </li>

            <li class="nav-item ">
              <a class="nav-link
							@if (last(request()->segments()) == 'lulus') active @endif
							"
                href="/masterdata/report-data/lulus?tahun={{ request('tahun') }}&gelombang={{ request('gelombang') }}">
                <i class="fa-solid fa-file-circle-check"></i>
                Pendaftar Lulus Ujian
              </a>
            </li>

            <li class="nav-item ">
              <a class="nav-link
							@if (last(request()->segments()) == 'registrasi') active @endif
							"
                href="/masterdata/report-data/registrasi?tahun={{ request('tahun') }}&gelombang={{ request('gelombang') }}">
                <i class="fa-solid fa-file-invoice"></i>
                Pembayaran Daftar Ulang
              </a>
            </li>
            <li class="nav-item ">
              <a class="nav-link
							@if (last(request()->segments()) == 'data-berkas') active @endif
							"
                href="/masterdata/report-data/data-berkas?tahun={{ request('tahun') }}&gelombang={{ request('gelombang') }}">
                <i class="fa-solid fa-file"></i>
                Data Berkas
              </a>
            </li>
        </div>

        @if (request('gelombang'))
          <div class="p-3">
            @yield('report-data')

          </div>
        @else
          <div class="ps-2 pe-2 pb-2 pt-2">
            <div class="alert alert-warning">
              <i class="fa-solid fa-exclamation-triangle"></i>
              Pilih Gelombang terlebih dahulu
            </div>
          </div>
        @endif


      </div>


    </div>
  </div>

  <script type="text/javascript" src='/Resources/assets/js/app.js'></script>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $('#pilihan-tahun').on('change', function() {
        var tahun = $(this).val();

        $.ajax({
          url: '/masterdata/gelombang/by-year',
          type: 'GET',
          dataType: 'json',
          data: {
            'id_tahun': tahun
          },
          success: function(data) {
            $("#pilihan-gelombang").empty();
            $("#pilihan-gelombang").append(
              '<option value=""> Pilih Gelombang... </option>'
            );
            $.each(data, function(index, value) {
              $("#pilihan-gelombang").append(
                '<option value="' + value.id + '">' + value.name + '</option>'
              );
            });
          }
        });
      });
    })
  </script>
@endsection