@extends('layouts.landing')

@section('title')
    Hasil Seleksi
@endsection

@section('content')
    <div style="background-image:url('{{ asset('assets2/img/learning-app/bg-01.png') }}');background-position-y: 0;background-size: cover;background-repeat: no-repeat;width: 100vw;height: 200vh;position: fixed;overflow: hidden;z-index: -1;">
    </div>
    <div class="header-area  header-bg-05  header-learning">
        <div class="container">
            <div class="card border-0" style="box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;">
                <div class="card-body">

                    @if($sekolah_id == null)
                        <h4 class="mb-4"># Pilih Sekolah</h4>
                        <input type="text" class="form-control" id="search_name" placeholder="Cari Nama Sekolah" />
                        <div id="list_sekolah"></div>
                    @else
                        <h4 class="mb-1"><a href="{{ route('hasil_seleksi') }}"><i class="fa fa-chevron-left fa-fw"></i> </a>{{ $sekolah->nama }}, Pagu : {{ $pagu }}</h4>
                        <h4 class="mb-4">Hasil Seleksi Akhir</h4>
                        <div class="table-responsive">
                            <table class="table align-middle gs-0 gy-4">
                                <thead>
                                <tr class="fw-bolder text-muted bg-light">
                                    <th class="ps-4 rounded-start w-30px">#</th>
                                    <th>Nama</th>
                                    <th class="text-center">Tanggal Lahir</th>
                                    <th class="text-center">Alamat</th>
                                    <th class="text-center">Skor</th>
                                    <th class="text-center">Pilihan Ke</th>
                                    <th class="text-center pe-4">Waktu Daftar</th>
                                </tr>
                                </thead>
                                <tbody>
                                @php($no = 1)
                                @foreach($hasil_seleksi as $value)
                                    <tr>
                                        <td class="text-end">{{ $no++ }}</td>
                                        <td class="text-nowrap">{{ $value->siswa->nama }}</td>
                                        <td class="text-nowrap">{{ $value->siswa->tanggal_lahir }}</td>
                                        <td>{{ $value->siswa->lokasi }}</td>
                                        <td class="text-nowrap">{{ $value->skor }}</td>
                                        <td class="text-center">{{ $value->pilihan_ke }}</td>
                                        <td class="text-nowrap text-center pe-4">{{ $value->created_at }}</td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
    <div style="height:100px;width:100%"></div>
@endsection

@push('scripts')
    <script>
        $search_name = $('#search_name');
        $search_name.keyup(() => {
            let nama = $search_name.val();
            $.post("{{ route('search_sekolah') }}", {
                _token: '{{ csrf_token() }}', nama
            }, (result) => {
                $('#list_sekolah').html(result);
            }).fail((xhr) => {
                $('#list_sekolah').html(xhr.responseText);
            });
        });
        $search_name.keyup();
    </script>
@endpush