@extends('admin.sidebar')
@section('content')
    @php
        use Carbon\Carbon;
    @endphp
    {{-- TABLE --}}
    <div class="card">
        <div class="card-header center">
            <h5 class="card-title">
                Event Yang Bisa Kamu Ikuti
            </h5>
        </div>
        @include('message')
        <div class="card-body" style="overflow-x:auto;">

            <table class="table table-striped" id="table1">
                <thead>
                    <tr>
                        <th>Logo</th>
                        <th>Nama Acara</th>
                        <th>Cabor</th>
                        <th>Tanggal Mulai </th>
                        <th>Tanggal Berakhir </th>
                        <th>Tanggal Batas Daftar</th>

                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($event as $item)
                        <tr>
                            <td>
                                <img src="{{ asset('images/event') . '/' . $item->photo }}" alt="profile image"
                                    style="width: 150px" class="rounded">
                            </td>
                            <td>{{ $item->nama }}</td>
                            <td>{{ $item->cabor }}</td>
                            <td>{{ Carbon::parse($item->tanggal_mulai)->formatLocalized('%d %b %Y') }}</td>
                            <td>{{ Carbon::parse($item->tanggal_berakhir)->formatLocalized('%d %b %Y') }}</td>
                            <td>{{ Carbon::parse($item->batas_daftar)->formatLocalized('%d %b %Y') }}</td>

                            <td>

                                @if ($now > $item->batas_daftar)
                                    <a class="btn btn-secondary m-1"
                                        onclick="alert('Batas Waktu Pendaftaran Telah Terlewat.')">Daftar</a>
                                @else
                                    <a data-bs-toggle="modal" data-bs-target="#modalEdit" id="edit"
                                        data-nama_lengkap="{{ auth()->user()->atlit->nama_lengkap }}"
                                        data-user_id="{{ auth()->user()->atlit->id }}" data-event_id="{{ $item->id }}"
                                        data-nomor_tanding="{{ $item->nomor_tanding }}"
                                        data-email="{{ auth()->user()->email }}"
                                        data-cabor="{{ auth()->user()->atlit->cabor }}"
                                        data-tempat_lahir="{{ auth()->user()->atlit->tempat_lahir }}"
                                        data-tanggal_lahir="{{ auth()->user()->atlit->tanggal_lahir }}"
                                        class="open-AddBookDialog btn btn-success m-1" href=""></i> Daftar</a>
                                @endif

                            </td>
                        </tr>
                    @endforeach

                </tbody>
            </table>
        </div>
    </div>
    {{-- TABLE --}}


    {{-- Modal add||START|| --}}
    <div class="modal fade text-left modal-borderless" id="modalEdit" 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">Mendaftar</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 action="{{ route('pendaftar.store') }}" method="POST" id="formEdit"
                        enctype="multipart/form-data">
                        @csrf

                        <div class="form-group">

                            {{-- <label for="nama_lengkap-edit">Nama Lengkap</label>
                            <input type="text" class="form-control" id="nama_lengkap-edit" name="nama_lengkap" disabled> --}}
                            <input type="hidden" class="form-control" id="event_id-edit" name="event_id">
                            <input type="hidden" class="form-control" id="user_id-edit" name="atlit_id">
                        </div>

                        {{-- <div class="form-group">
                            <label for="email-edit">Email</label>
                            <input type="email" class="form-control" id="email-edit" name="email" disabled>
                        </div>
                        <div class="form-group">
                            <label for="cabor-edit">Cabor</label>
                            <input type="text" class="form-control" id="cabor-edit" name="cabor" disabled>
                        </div>
                        <div class="form-group">
                            <label for="tempat_lahir-edit">Tempat Lahir</label>
                            <input type="text"placeholder="Masukan link yang mengarah ke website event"
                                class="form-control" id="tempat_lahir-edit" name="tempat_lahir" disabled>
                        </div>
                        <div class="form-group">
                            <label for="tanggal_lahir-edit">Tanggal Lahir</label>
                            <input type="date"placeholder="Masukan link yang mengarah ke website event"
                                class="form-control" id="tanggal_lahir-edit" name="tanggal_lahir" disabled>
                        </div> --}}
                        <div class="form-group">
                            <label for="nomor_tanding">Nomor Tanding</label>
                            <select class="form-control" name="nomor_tanding" id="nomor_tanding">

                                {{-- @foreach ($nomor_tanding as $item)
                                    <option value="{{ $item->name }}">{{ $item->name }}</option>
                                @endforeach --}}
                            </select>
                        </div>

                        <div class="form-group">
                            <label for="file">Surat Rekomendasi</label>
                            <input type="file" class="form-control" id="file" name="file">
                            <i>*File yang dimasukan tidak boleh lebih dari 2mb!</i>
                        </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-success ml-1">
                                <i class="bx bx-check d-block d-sm-none"></i>
                                <span class="">Submit</span>
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    {{-- Modal UPDATE||END|| --}}




    {{-- script --}}
    @push('script-modal')
        {{-- data modal Update --}}
        <script>
            $(document).on('click', '#edit', function() {
                let nama_lengkap = $(this).data('nama_lengkap')
                let email = $(this).data('email')
                let cabor = $(this).data('cabor');
                let tempat_lahir = $(this).data('tempat_lahir')
                let tanggal_lahir = $(this).data('tanggal_lahir')
                let user_id = $(this).data('user_id')
                let event_id = $(this).data('event_id')
                let nomor_tanding = $(this).data('nomor_tanding')
                let no_tanding = nomor_tanding.split(',')
                console.log(no_tanding)

                console.log(tanggal_lahir);
                $('.form-group #nama_lengkap-edit').val(nama_lengkap)
                $('.form-group #email-edit').val(email)
                $('.form-group #cabor-edit').val(cabor)
                $('.form-group #tempat_lahir-edit').val(tempat_lahir);
                $('.form-group #tanggal_lahir-edit').val(tanggal_lahir);
                $('.form-group #user_id-edit').val(user_id);
                $('.form-group #event_id-edit').val(event_id);

                //mengisi nomor tanding
                let nomorTandingDropdown = $('.form-group #nomor_tanding');
                nomorTandingDropdown.empty();
                nomorTandingDropdown.append('<option selected disabled>--pilih nomor tanding--</option>')
                $.each(no_tanding, function(index, no_tanding) {
                    nomorTandingDropdown.append(
                        '<option value="' + no_tanding + '">' + no_tanding +
                        '</option>');
                });




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