@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    {{-- Sweet Alert handlers untuk session error/success --}}
    @if (session('error'))
        <script>
            document.addEventListener("DOMContentLoaded", function () {
                Swal.fire({
                    icon: 'error',
                    title: 'Gagal',
                    text: @json(session('error')),
                    confirmButtonColor: '#028284',
                    confirmButtonText: 'OK'
                });
            });
        </script>
    @endif
    @if (session('success'))
        <script>
            document.addEventListener("DOMContentLoaded", function () {
                Swal.fire({
                    icon: 'success',
                    title: 'Berhasil',
                    text: @json(session('success')),
                    confirmButtonColor: '#028284',
                    confirmButtonText: 'OK'
                });
            });
        </script>
    @endif
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="row mx-1">
                    <div class="card">
                        <div class="row">
                            <div class="card-header col-md-auto">
                                <h5 class="mb-0">List {{ $title_menu }}</h5>
                            </div>
                            <div class="col">
                                @include('components.alert')
                            </div>
                        </div>

                        <hr class="horizontal dark mt-0">
                        <div class="row px-4 py-2">
                            <div class="col-lg">
                                <div class="nav-wrapper">
                                    @if ($authorize->add == '1')
                                        <button class="btn btn-primary mb-0" onclick="window.location='{{ URL::to($url_menu . '/add') }}'">
                                            <i class="fas fa-plus me-1"></i><span class="font-weight-bold">Tambah</span>
                                        </button>
                                    @endif
                                </div>
                            </div>
                        </div>

                        <div class="row px-4 py-2">
                            <div class="table-responsive">
                                <table class="table display" id="list_{{ $dmenu }}">
                                    <thead class="thead-light" style="background-color: #00b7bd4f;">
                                        <tr>
                                            <th>No</th>
                                            <th>Action</th>
                                            <th>Nama Pemohon</th>
                                            <th>NIK</th>
                                            <th>Departemen</th>
                                            <th>Jabatan</th>
                                            <th>Tanggal</th>
                                            <th>Peserta</th>
                                            <th>Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($records as $index => $record)
                                            <tr {{ $record->status == 'disetujui' ? 'style=background-color:#c5ffbc;' : '' }}>
                                                <td class="text-sm font-weight-normal">{{ $index + 1 }}</td>
                                                <td class="text-sm font-weight-normal">
                                                    <div class="btn-group">
                                                        <button class="btn btn-sm btn-primary mb-0" type="button" title="View Data" onclick="window.location='{{ url($url_menu . '/show/' . encrypt($record->id)) }}'">
                                                            <i class="fas fa-eye"></i> <span class="font-weight-bold">View</span>
                                                        </button>
                                                        <button type="button" class="btn btn-sm btn-primary dropdown-toggle dropdown-toggle-split mb-0" data-bs-toggle="dropdown" aria-expanded="false"></button>
                                                        <ul class="dropdown-menu">
                                                            @if ($authorize->edit == '1' && $record->status == 'menunggu')
                                                                <li>
                                                                    <button class="dropdown-item text-warning" title="Edit Data" onclick="window.location='{{ url($url_menu . '/edit/' . encrypt($record->id)) }}'">
                                                                        <i class="fas fa-edit"></i> Edit
                                                                    </button>
                                                                </li>
                                                            @endif

                                                            @if ($authorize->delete == '1' && $record->status == 'menunggu')
                                                                <li>
                                                                    <form action="{{ url($url_menu . '/' . encrypt($record->id)) }}" method="POST">
                                                                        @csrf
                                                                        @method('DELETE')
                                                                        <button type="submit" class="dropdown-item text-danger" title="Hapus Data" onclick="return deleteData(event, '{{ $record->id }}','Batalkan')">
                                                                            <i class="fas fa-trash"></i> Batalkan Permohonan
                                                                        </button>
                                                                    </form>
                                                                </li>
                                                            @endif

                                                            @if ($authorize->approval == '1')
                                                                @if ($record->status == 'disetujui')
                                                                    <li>
                                                                        <button type="button" class="dropdown-item text-secondary" onclick="showSwal('Anda telah menyetujui')" title="Telah disetujui">
                                                                            <i class="fas fa-circle"></i> Anda telah menyetujui
                                                                        </button>
                                                                    </li>
                                                                @elseif ($record->status == 'ditolak')
                                                                    <li>
                                                                        <button type="button" class="dropdown-item text-secondary" onclick="showSwal('Anda telah menolak')" title="Telah ditolak">
                                                                            <i class="fas fa-ban"></i> Anda telah menolak
                                                                        </button>
                                                                    </li>
                                                                @else
                                                                    <li>
                                                                        <button type="button" class="dropdown-item text-primary" onclick="openModal('{{ encrypt($record->id) }}')" title="Setujui Data">
                                                                            <i class="fas fa-check"></i> Beri Keputusan
                                                                        </button>
                                                                    </li>
                                                                @endif
                                                            @endif
                                                        </ul>
                                                    </div>
                                                </td>
                                                <td class="text-sm font-weight-normal">{{ $record->nama }}</td>
                                                <td class="text-sm font-weight-normal">{{ $record->nik }}</td>
                                                <td class="text-sm font-weight-normal">{{ $record->departemen ?? '-' }}</td>
                                                <td class="text-sm font-weight-normal">{{ $record->jabatan ?? '-' }}</td>
                                                <td class="text-sm font-weight-normal">{{ $record->tanggal ? $format->TanggalIndonesia($record->tanggal) : '-' }}</td>
                                                <td class="text-sm font-weight-normal">
                                                    @forelse($record->participants as $p)
                                                        {{ $p->nama }}@if(!$loop->last)<br>@endif
                                                    @empty
                                                        -
                                                    @endforelse
                                                </td>
                                                <td class="text-sm font-weight-normal">
                                                    @if($record->status == 'disetujui')
                                                        <span class="badge bg-success">Disetujui</span>
                                                    @elseif($record->status == 'ditolak')
                                                        <span class="badge bg-danger">Ditolak</span>
                                                    @else
                                                        <span class="badge bg-warning">Menunggu</span>
                                                    @endif
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
    <script>
        $(document).ready(function() {
            var dtOptions = {
                pageLength: 10,
                lengthChange: true,
                ordering: true,
                responsive: true,
                language: {
                    search: "Cari :",
                    lengthMenu: "Tampilkan _MENU_ baris",
                    zeroRecords: "Maaf - Data tidak ada",
                    info: "Data _START_ - _END_ dari _TOTAL_",
                    infoEmpty: "Tidak ada data",
                    infoFiltered: "(pencarian dari _MAX_ data)"
                }
            };
            $('#list_{{ $dmenu }}').DataTable(dtOptions);
        });

        function showSwal(message) {
            Swal.fire({
                icon: 'info',
                title: message,
                confirmButtonColor: '#028284'
            });
        }

        @if ($authorize->approval == '1')
            const baseUrlApprove = "{{ URL::to('rdmcb1/approve') }}";
            const baseUrlReject = "{{ URL::to('rdmcb1/reject') }}";

            function openModal(primary) {
                window.currentPrimary = primary;

                Swal.fire({
                    title: 'Konfirmasi Keputusan',
                    html: `
                        <div style="text-align:left;">
                            <label for="swalNote" style="font-weight:600; margin-bottom:6px; display:block;">
                                Catatan (Bisa dikosongkan jika menyetujui):
                            </label>
                            <textarea id="swalNote" placeholder="Masukkan catatan..."
                                style="width:100%; max-width:100%; box-sizing:border-box; min-height:120px; font-size:14px;"></textarea>
                        </div>
                    `,
                    showCancelButton: true,
                    showDenyButton: true,
                    confirmButtonText: 'Setujui',
                    denyButtonText: 'Tolak',
                    cancelButtonText: 'Batal',
                    confirmButtonColor: '#028284',
                    denyButtonColor: '#dc3545',
                    preConfirm: () => {
                        return {
                            note: document.getElementById('swalNote').value
                        };
                    },
                    preDeny: () => {
                        return {
                            note: document.getElementById('swalNote').value.trim()
                        };
                    }
                }).then((result) => {
                    if (result.isConfirmed) {
                        submitFormSweet('approve', result.value);
                    }

                    if (result.isDenied) {
                        if (!result.value.note) {
                            Swal.fire('Alasan wajib diisi', '', 'warning');
                            return;
                        }
                        submitFormSweet('reject', result.value);
                    }
                });
            }

            function submitFormSweet(type, data) {
                const url = type === 'approve'
                    ? `${baseUrlApprove}/${window.currentPrimary}`
                    : `${baseUrlReject}/${window.currentPrimary}`;

                const requestBody = {
                    catatan: data.note
                };

                Swal.fire({
                    title: 'Memproses...',
                    allowOutsideClick: false,
                    didOpen: () => Swal.showLoading()
                });

                fetch(url, {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': '{{ csrf_token() }}',
                        'Accept': 'application/json'
                    },
                    body: JSON.stringify(requestBody)
                })
                    .then(res => res.json())
                    .then(data => {
                        if (data.success) {
                            Swal.fire('Berhasil!', data.message, 'success')
                                .then(() => location.reload());
                        } else {
                            Swal.fire('Gagal!', data.message, 'error');
                        }
                    })
                    .catch(() => {
                        Swal.fire('Error', 'Terjadi kesalahan sistem', 'error');
                    });
            }
        @endif
    </script>
@endpush