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

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="row mx-1">
                    <div class="card">
                        <div class="card-header d-flex justify-content-between align-items-center">
                            <h5 class="mb-0">Detail {{ $title_menu }}</h5>
                            <div>
                                <a href="{{ URL::to($url_menu) }}" class="btn btn-secondary btn-sm">
                                    <i class="fas fa-arrow-left me-1"></i>Kembali
                                </a>
                            </div>
                        </div>
                        <div class="card-body">
                            @include('components.alert')

                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <div class="card">
                                        <div class="card-header bg-secondary">
                                            <h6 class="mb-0 text-white">Data Pemohon</h6>
                                        </div>
                                        <div class="card-body">
                                            <table class="table table-sm table-borderless">
                                                <tr><td width="150">NIK</td><td>: {{ $record->nik }}</td></tr>
                                                <tr><td>Nama</td><td>: {{ $record->nama }}</td></tr>
                                                <tr><td>Departemen</td><td>: {{ $record->departemen ?? '-' }}</td></tr>
                                                <tr><td>Jabatan</td><td>: {{ $record->jabatan ?? '-' }}</td></tr>
                                                <tr><td>Bagian</td><td>: {{ $record->bagian ?? '-' }}</td></tr>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="card">
                                        <div class="card-header bg-secondary">
                                            <h6 class="mb-0 text-white">Detail Permohonan</h6>
                                        </div>
                                        <div class="card-body">
                                            <table class="table table-sm table-borderless">
                                                <tr><td width="150">Tanggal</td><td>: {{ $record->tanggal ? $format->TanggalIndonesia($record->tanggal) : '-' }}</td></tr>
                                                <tr><td>Status</td><td>:
                                                    @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>
                                                <tr><td>Catatan</td><td>: {{ $record->catatan ?? '-' }}</td></tr>
                                                <tr><td>Diajukan</td><td>: {{ $record->created_at ? $format->TanggalIndonesia($record->created_at) . ' ' . date('H:i', strtotime($record->created_at)) : '-' }}</td></tr>
                                                @if($record->status != 'menunggu')
                                                    <tr><td>Approval Oleh</td><td>: {{ $record->approved_by_name ?? '-' }}</td></tr>
                                                    <tr><td>Waktu Keputusan</td><td>: {{ $record->approved_at ? $format->TanggalIndonesia($record->approved_at) . ' ' . date('H:i', strtotime($record->approved_at)) : '-' }}</td></tr>
                                                @endif
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="card">
                                <div class="card-header">
                                    <h6 class="mb-0">Daftar Peserta</h6>
                                </div>
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-bordered table-striped">
                                            <thead style="background-color: #00b7bd4f;">
                                                <tr>
                                                    <th>No</th>
                                                    <th>NIK</th>
                                                    <th>Nama</th>
                                                    <th>Departemen</th>
                                                    <th>Jabatan</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @forelse($record->participants as $idx => $p)
                                                    <tr>
                                                        <td>{{ $idx + 1 }}</td>
                                                        <td>{{ $p->nik }}</td>
                                                        <td>{{ $p->nama }}</td>
                                                        <td>{{ $p->departemen ?? '-' }}</td>
                                                        <td>{{ $p->jabatan ?? '-' }}</td>
                                                    </tr>
                                                @empty
                                                    <tr>
                                                        <td colspan="5" class="text-center text-muted">Tidak ada peserta tambahan</td>
                                                    </tr>
                                                @endforelse
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>

                            @if($record->status == 'menunggu')
                                <div class="mt-4 d-flex gap-2 justify-content-end">
                                    @if($canEdit)
                                        <a href="{{ url($url_menu . '/edit/' . encrypt($record->id)) }}" class="btn btn-warning">
                                            <i class="fas fa-edit me-1"></i>Edit
                                        </a>
                                    @endif
                                    @if($canApprove)
                                        <button type="button" class="btn btn-success" onclick="approveData('{{ encrypt($record->id) }}')">
                                            <i class="fas fa-check me-1"></i>Setuju
                                        </button>
                                        <button type="button" class="btn btn-danger" onclick="rejectData('{{ encrypt($record->id) }}')">
                                            <i class="fas fa-times me-1"></i>Tolak
                                        </button>
                                    @endif
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
    <script>
        function approveData(id) {
            Swal.fire({
                title: 'Konfirmasi',
                text: 'Apakah anda yakin ingin menyetujui permohonan ini?',
                icon: 'question',
                showCancelButton: true,
                confirmButtonText: 'Ya, Setuju',
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284'
            }).then((result) => {
                if (result.isConfirmed) {
                    fetch('{{ url("rdmcb1/approve") }}/' + id, {
                        method: 'POST',
                        headers: {
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        }
                    }).then(r => r.json()).then(data => {
                        if (data.success) {
                            Swal.fire('Berhasil!', data.message, 'success').then(() => location.reload());
                        } else {
                            Swal.fire('Gagal!', data.message, 'error');
                        }
                    }).catch(err => {
                        Swal.fire('Error!', 'Terjadi kesalahan saat memproses.', 'error');
                    });
                }
            });
        }

        function rejectData(id) {
            Swal.fire({
                title: 'Alasan Penolakan',
                input: 'textarea',
                inputLabel: 'Masukkan alasan penolakan:',
                inputPlaceholder: 'Wajib diisi...',
                showCancelButton: true,
                confirmButtonText: 'Tolak',
                confirmButtonColor: '#dc3545',
                cancelButtonText: 'Batal'
            }).then((result) => {
                if (result.isConfirmed && result.value) {
                    fetch('{{ url("rdmcb1/reject") }}/' + id, {
                        method: 'POST',
                        headers: {
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Content-Type': 'application/json',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify({ catatan: result.value })
                    }).then(r => r.json()).then(data => {
                        if (data.success) {
                            Swal.fire('Berhasil!', data.message, 'success').then(() => location.reload());
                        } else {
                            Swal.fire('Gagal!', data.message, 'error');
                        }
                    }).catch(err => {
                        Swal.fire('Error!', 'Terjadi kesalahan saat memproses.', 'error');
                    });
                }
            });
        }
    </script>
@endpush