@extends('admin.layout.main')
@section('content')
    <div class="main-content">
        <section class="section">
            <div class="section-header">
                <h1>User</h1>
                <div class="section-header-breadcrumb">
                    <div class="breadcrumb-item active"><a href="{{ route('admin.index') }}">Dashboard</a></div>
                    <div class="breadcrumb-item">User</div>
                </div>
            </div>
            <div class="col-12">
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-striped" id="table-1">
                                <thead>
                                    <tr>
                                        <th class="text-center">#</th>
                                        <th>UID</th>
                                        <th>Foto Profil</th>
                                        <th>Nama Panjang</th>
                                        <th>Email</th>
                                        {{-- <th>Gender</th> --}}
                                        <th>Tanggal Daftar</th>
                                        <th>Status</th>
                                        <th>Aksi</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($users as $user)
                                        <tr>
                                            <td>{{ $loop->iteration }}</td>
                                            <td>{{ $user->id }}</td>
                                            <td>
                                                <figure class="avatar mr-2 avatar-xl">
                                                    <img src="{{ $user->foto_profil != null ? asset('storage') : asset('assets/img/avatar/avatar-6.png') }}" alt="...">
                                                </figure>
                                            </td>
                                            <td>{{ $user->nama }}</td>
                                            <td>{{ $user->email }}</td>
                                            <td>{{ $user->created_at }}</td>
                                            <td>
                                                <div
                                                    class="badge {{ $user->status == 'Finished' ? 'badge-success' : ($user->status == 'Progress' ? 'badge-info' : 'badge-warning') }}">
                                                    {{ $user->status }}</div>
                                            </td>
                                            <td>
                                                <div class="btn-group">
                                                    <button type="button" class="btn btn-primary dropdown-toggle"
                                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                        Aksi
                                                    </button>
                                                    <div class="dropdown-menu">
                                                        <a class="dropdown-item"
                                                            href="{{ route('admin-user.show', $user->id) }}">Keterangan</a>
                                                        <a class="dropdown-item" href="#"
                                                            data-id="{{ $user->id }}" id="deleteUser">Hapus</a>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
    <script>
        $(function() {
            // Hapus data
            $('#table-1').on('click', '#deleteUser', function() {
                const csrfToken = $('meta[name="csrf-token"]').attr('content');
                let dataId = $(this).data("id");

                Swal.fire({
                    title: 'Hapus data',
                    text: 'Apakah yakin ingin menghapus data user ini?',
                    icon: 'question',
                    confirmButtonText: 'Ya, hapus!',
                    showDenyButton: true,
                    denyButtonText: 'Tidak, jangan hapus!',
                }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajaxSetup({
                            headers: {
                                'X-CSRF-TOKEN': csrfToken
                            }
                        });

                        $.ajax({
                            url: "{{ route('admin-user.destroy', ':admin_user') }}"
                                .replace(
                                    ':admin_user',
                                    dataId),
                            type: 'DELETE',
                            processData: false,
                            contentType: false,
                            success: function(response) {
                                Swal.fire({
                                    title: response.status ? 'Berhasil!' :
                                        'Gagal!',
                                    text: response.message,
                                    icon: response.status ? 'success' : 'error',
                                    confirmButtonText: 'OK'
                                }).then(function() {
                                    // location.reload();
                                    console.log(response);
                                });
                            },
                            error: function(error) {
                                Swal.fire({
                                    title: 'Gagal!',
                                    text: 'Tidak ada data yang dihapus, karena ' +
                                        error,
                                    icon: 'info'
                                });
                            }
                        });
                    } else if (result.isDenied) {
                        Swal.fire({
                            title: 'Gagal!',
                            text: 'Tidak ada data yang dihapus',
                            icon: 'info'
                        });
                    }
                });
            });
        });
    </script>
@endsection