@extends('admin.sidebar')
@section('content')
    {{-- TABLE --}}
    <div class="card">
        <div class="card-header center">
            <h5 class="card-title">
                Data Pendaftar Event {{ $event->nama }}
            </h5>
        </div>
        @include('message')
        <div class="card-body" style="overflow-x:auto;">
            <div class="d-flex justify-content-between">

                <a href="{{ route('exportPendaftar', Crypt::encryptString($event->id)) }}" id="add"
                    class="btn btn-info mb-3 "><i class="bi bi-file-earmark-spreadsheet-fill"></i>
                    Export Data Pendaftar</a>
                <div class="">
                    <form class="row" id="filterForm" method="post"
                        action="{{ route('filterPendaftar', Crypt::encryptString($event->id)) }}" style="margin-right:50px">
                        @csrf

                        <div class="form-group col">

                            <select class="form-control selectpicker" name="nomor_tanding"
                                id="nomor_tanding"data-show-subtext="true" onchange="submitFilter()"
                                data-live-search="true">
                                <option selected disabled>--Sesuai Nomor Tanding--</option>
                                @foreach ($nomor_tanding as $item)
                                    <option value="{{ $item->name }}">{{ $item->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-1 ">

                            <button type="button" onclick="submitFilter()" class="btn m-auto"><i
                                    class="bi bi-funnel-fill"></i></button>
                        </div>
                    </form>
                </div>
            </div>

            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>photo</th>
                        <th>Nama Lengkap</th>
                        <th>Nomor Tanding</th>
                        <th>Email</th>
                        <th>Asal Kab/Kota</th>
                        <th>Tanggal Daftar</th>
                        <th>File Rekomendasi</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($pendaftar as $item)
                        <tr>
                            <td>

                                <img src="{{ asset('images/atlit') . '/' . $item->atlit->user->photo }}" alt="profile image"
                                    style="width: 150px" class="rounded">
                            </td>
                            <td>{{ $item->atlit->nama_lengkap }}</td>
                            <td>{{ $item->nomor_tanding }}</td>
                            <td>{{ $item->atlit->user->email }}</td>
                            <td>{{ $item->atlit->asal_kota }}</td>
                            <td>{{ $item->tanggal }}</td>
                            <td><a href="{{ asset('documents/pendaftaran') . '/' . $item->file }}" class="btn btn-success"
                                    download><i class="bi bi-file-earmark-pdf-fill"></i> Download</a></td>
                            <td>

                                <a href="#" class="btn btn-danger m-1"data-bs-toggle="modal"
                                    data-bs-target="#modalDelete"
                                    onclick="$('#modalDelete #formDelete').attr('action', '{{ route('pendaftar.destroy', Crypt::encryptString($item->id)) }}')"><i
                                        class="bi bi-trash-fill"></i></a>

                            </td>
                        </tr>
                    @endforeach

                </tbody>
            </table>
            <div class="center">

                {{ $pendaftar->links('pagination::bootstrap-4') }}
            </div>
        </div>
    </div>
    {{-- TABLE --}}


    {{-- Modal DESTROY||START|| --}}
    <div class="modal fade text-left modal-borderless" id="modalDelete" tabindex="-1" role="dialog"
        aria-labelledby="myModalLabel1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-scrollable" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Hapus Galeri</h5>
                    <button type="button" class="close rounded-pill" data-bs-dismiss="modal" aria-label="Close">
                        <i data-feather="x"></i>
                    </button>
                </div>
                <div class="modal-body">

                    <form id="formDelete" action="" method="post">
                        @csrf
                        @method('delete')
                        <div class="form-group" id="pass">
                            <h5>Apakah anda yakin ingin menghapus item?</h5>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-light-primary" data-bs-dismiss="modal">
                                <i class="bx bx-x d-block d-sm-none"></i>
                                <span class="  center">Close</span>
                            </button>
                            <button type="submit" class="btn btn-primary ml-1">
                                <i class="bx bx-check d-block d-sm-none"></i>
                                <span class="  center">Delete</span>
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    {{-- Modal DESTROY||END|| --}}




    {{-- script --}}
    <script>
        function submitFilter() {
            var cabor = document.getElementById("nomor_tanding").value;

            if (cabor !== "") {
                document.getElementById("filterForm").submit();
            }
        }
    </script>
    @push('script-modal')
        {{-- data modal Update --}}
        <script>
            $(document).on('click', '#edit', function() {
                let deskripsi = $(this).data('deskripsi')
                let kategori = $(this).data('kategori')


                $('.form-group #deskripsi-edit').val(deskripsi)
                $('.form-group #kategori-edit').val(kategori)



            });
        </script>
    @endpush
    {{-- script --}}
@endsection