@extends('layouts.email')

@push('css')
    <style>
        body {
            background-color: #f8f9fa;
        }

        .card-header {
            background-color: #028284;
            color: white;
            font-weight: bold;
        }

        .btn-approval {
            background-color: #028284;
            border-color: #028284;
            color: white;
        }

        .btn-approval:hover {
            background-color: #026b6b;
            border-color: #026b6b;
        }

        input[readonly],
        textarea[readonly] {
            background-color: #e9ecef !important;
            opacity: 1;
        }

        .horizontal.dark {
            background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
            height: 1px;
            border: 0;
        }

        hr {
            margin: 1rem 0;
            color: inherit;
            background-color: currentColor;
            border: 0;
            opacity: 0.25;
        }

        h3,
        h5 {
            color: white;
        }
    </style>
@endpush

@php
    \Carbon\Carbon::setLocale('id');
@endphp

<div class="container mt-4">
    <div class="text-center mb-4">
        {{-- Pastikan path ke logo benar. Jika email dikirim dari server, URL absolut lebih baik. --}}
        <img src="{{ asset('img/logomsjnew.jpg') }}" alt="Logo MSJ" width="150">
    </div>

    <div class="card shadow mb-4">
        <div class="card-header text-center">
            <h3 class="mb-0">Detail Pengajuan Izin/Tugas</h3>
        </div>
        <div class="card-body">

            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0">Detail Pengaju</h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="nik" class="form-label">NIK</label>
                            <input type="text" id="nik" class="form-control" value="{{ $pengaju->nik }}"
                                readonly>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label for="nama" class="form-label">Nama</label>
                            <input type="text" id="nama" class="form-control" value="{{ $pengaju->nama }}"
                                readonly>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mt-3">
                <div class="card-header">
                    <h5 class="mb-0">Detail Pengajuan Izin/Tugas</h5>
                </div>
                <div class="card-body">
                    {{-- Kategori Izin/Tugas --}}
                    <div class="row">
                        <div class="col-md-12 mb-3">
                            <label class="form-label">Kategori Izin/Tugas</label>
                            <input type="text" class="form-control"
                                value="{{ $permohonanPerizinan->kategori_perizinan_nama ?? 'N/A' }}" readonly>
                        </div>
                    </div>

                    {{-- ================================================================= --}}
                    {{-- SECTION UNTUK KATEGORI: IZIN (ID: 1) --}}
                    {{-- ================================================================= --}}
                    @if ($permohonanPerizinan->kategori_perizinan_id == 1)
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Jenis Izin</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->jenis_izin_nama ?? 'N/A' }}" readonly>
                            </div>
                            {{-- Tampilkan Shift Selection hanya jika ada jenis_izin --}}
                            @if (isset($permohonanPerizinan->jenis_izin_id) && $permohonanPerizinan->jenis_izin_id)
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Status Shift</label>
                                    <input type="text" class="form-control"
                                        value="{{ $permohonanPerizinan->is_shift ? 'Karyawan Shift' : 'Karyawan Non-Shift' }}"
                                        readonly>
                                </div>
                            @endif
                            @php
                                // Set label berdasarkan jenis izin
                                $labelJamKeluar = 'Jam Keluar';
                                $labelJamMasuk = 'Jam Masuk';
                                if ($permohonanPerizinan->jenis_izin_id == 1) {
                                    // Terlambat Masuk Kerja
                                    $labelJamKeluar = 'Jam Masuk Kerja';
                                    $labelJamMasuk = 'Jam Masuk Aktual';
                                } elseif ($permohonanPerizinan->jenis_izin_id == 2) {
                                    // Izin Keluar Kantor
                                    $labelJamKeluar = 'Jam Keluar Kantor';
                                    $labelJamMasuk = 'Jam Kembali ke Kantor';
                                } elseif ($permohonanPerizinan->jenis_izin_id == 3) {
                                    // Izin Pulang Cepat
                                    $labelJamKeluar = 'Jam Pulang Cepat';
                                    $labelJamMasuk = 'Jam Pulang Seharusnya';
                                } elseif ($permohonanPerizinan->jenis_izin_id == 4) {
                                    // Izin Dinas
                                    $labelJamKeluar = 'Jam Keluar Kantor';
                                    $labelJamMasuk = 'Jam Kembali ke Kantor';
                                }
                            @endphp
                        </div>
                        <div class="row">
                            <div class="col-md-12 mb-3">
                                <label class="form-label">Alasan/Deskripsi Izin/Tugas</label>
                                <textarea class="form-control" readonly>{{ $permohonanPerizinan->alasan ?? '-' }}</textarea>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">{{ $labelJamKeluar }}</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->jam_keluar ? \Carbon\Carbon::parse($permohonanPerizinan->jam_keluar)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">{{ $labelJamMasuk }}</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->jam_masuk ? \Carbon\Carbon::parse($permohonanPerizinan->jam_masuk)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Check Out</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->check_out ? \Carbon\Carbon::parse($permohonanPerizinan->check_out)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Check In</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->check_in ? \Carbon\Carbon::parse($permohonanPerizinan->check_in)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                        </div>

                        {{-- Tampilkan daftar karyawan jika Izin Dinas --}}
                        @if ($permohonanPerizinan->jenis_izin_id == 4 && !empty($karyawanPemohon) && count($karyawanPemohon) > 0)
                            <div class="row mt-2">
                                <div class="col-md-12 mb-3">
                                    <label class="form-label">Karyawan yang Dipilih</label>
                                    <div class="table-responsive">
                                        <table id="karyawan_dinas_table"
                                            class="table table-bordered table-striped w-100">
                                            <thead class="thead-light" style="background-color: #00b7bd4f;">
                                                <tr>
                                                    <th>NIK</th>
                                                    <th>Nama</th>
                                                    <th>Departemen</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach ($karyawanPemohon as $karyawan)
                                                    <tr>
                                                        <td>{{ $karyawan->nik }}</td>
                                                        <td>{{ $karyawan->nama }}</td>
                                                        <td>{{ $karyawan->departemen ?? 'N/A' }}</td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        @endif
                    @endif

                    {{-- ================================================================= --}}
                    {{-- SECTION UNTUK KATEGORI: TUGAS (ID: 2) --}}
                    {{-- ================================================================= --}}
                    @if ($permohonanPerizinan->kategori_perizinan_id == 2)
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Tipe Tugas</label>
                                <input type="text" class="form-control"
                                    value="{{ ucfirst($permohonanPerizinan->tipe_tugas ?? 'N/A') }}" readonly>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Tujuan</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->tujuan_tugas == 'dalam_negeri' ? 'Dalam Negeri' : 'Luar Negeri' }}"
                                    readonly>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Total Hari</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->total_hari ?? 0 }} hari" readonly>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12 mb-3">
                                <label class="form-label">Keperluan</label>
                                <textarea class="form-control" readonly>{{ $permohonanPerizinan->alasan ?? '-' }}</textarea>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Waktu Berangkat</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->jam_keluar ? \Carbon\Carbon::parse($permohonanPerizinan->jam_keluar)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Waktu Kepulangan</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->jam_masuk ? \Carbon\Carbon::parse($permohonanPerizinan->jam_masuk)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Check Out</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->check_out ? \Carbon\Carbon::parse($permohonanPerizinan->check_out)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Check In</label>
                                <input type="text" class="form-control"
                                    value="{{ $permohonanPerizinan->check_in ? \Carbon\Carbon::parse($permohonanPerizinan->check_in)->isoFormat('D MMMM YYYY, HH:mm') : '-' }}"
                                    readonly>
                            </div>
                        </div>

                        {{-- Reorder sections: Tanggal -> Karyawan -> Rincian Tujuan --}}
                        {{-- Daftar Tanggal (dipindah ke atas) --}}
                        <h6 class="mt-4">Tanggal yang Diajukan</h6>
                        <hr class="horizontal dark mt-1 mb-3">
                        <div class="row">
                            <div class="col-md-12 mb-3">
                                @php
                                    // Laravel 8+ akan otomatis decode, tapi untuk jaga-jaga
                                    $dates = is_string($tanggalArray)
                                        ? json_decode($tanggalArray, true)
                                        : (array) $tanggalArray;
                                @endphp
                                @if (!empty($dates))
                                    <div class="table-responsive">
                                        <table id="tanggal_table" class="table table-bordered table-striped w-100">
                                            <thead class="thead-light" style="background-color: #00b7bd4f;">
                                                <tr>
                                                    <th class="text-center">No</th>
                                                    <th class="text-center">Tanggal</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach ($dates as $index => $dateStr)
                                                    <tr>
                                                        <td class="text-center">{{ $index + 1 }}</td>
                                                        <td class="text-center">{{ $dateStr }}</td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                @else
                                    <p class="text-muted">Tidak ada tanggal yang diajukan.</p>
                                @endif
                            </div>
                        </div>

                        {{-- Karyawan yang Ditugaskan (dipindah di atas rincian tujuan) --}}
                        @if (!empty($karyawanPemohon))
                            <h6 class="mt-4">Karyawan yang Ditugaskan</h6>
                            <hr class="horizontal dark mt-1 mb-3">
                            <div class="row mt-2">
                                <div class="col-md-12 mb-3">
                                    <div class="table-responsive">
                                        <table id="karyawan_tugas_table"
                                            class="table table-bordered table-striped w-100">
                                            <thead class="thead-light" style="background-color: #00b7bd4f;">
                                                <tr>
                                                    <th class="text-center">No</th>
                                                    <th class="text-center">NIK</th>
                                                    <th class="text-center">Nama</th>
                                                    <th class="text-center">Departemen</th>
                                                    <th class="text-center">Jabatan</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach ($karyawanPemohon as $index => $karyawan)
                                                    <tr>
                                                        <td class="text-center">{{ $index + 1 }}</td>
                                                        <td class="text-center">{{ $karyawan->nik }}</td>
                                                        <td>{{ $karyawan->nama }}</td>
                                                        <td>{{ $karyawan->departemen }}</td>
                                                        <td>{{ $karyawan->jabatan ?? '-' }}</td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        @endif

                        {{-- Rincian Tujuan (dipindah ke bawah) --}}
                        @php $rincianTujuan = $rincianTujuan ?? []; @endphp
                        @if (!empty($rincianTujuan))
                            <h6 class="mt-4">Rincian Tujuan</h6>
                            <hr class="horizontal dark mt-1 mb-3">
                            <div class="table-responsive">
                                <table class="table table-bordered table-striped w-100">
                                    <thead class="thead-light" style="background-color: #00b7bd4f;">
                                        <tr>
                                            <th class="text-center">No</th>
                                            <th class="text-center">Tujuan</th>
                                            <th class="text-center">Status</th>
                                            <th class="text-center">Keterangan</th>
                                            <th class="text-center">Tanggal Mulai</th>
                                            <th class="text-center">Tanggal Berakhir</th>
                                            <th class="text-center">Jumlah Hari</th>
                                            <th class="text-center">Karyawan</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($rincianTujuan as $index => $tujuan)
                                            <tr>
                                                <td class="text-center">{{ $index + 1 }}</td>
                                                <td>{{ $tujuan['tujuan'] ?? '-' }}</td>
                                                <td class="text-center">
                                                    @if (($tujuan['status'] ?? '') === 'domestic')
                                                        <span class="badge badge-primary">Dalam Negeri</span>
                                                    @elseif (($tujuan['status'] ?? '') === 'international')
                                                        <span class="badge badge-info">Luar Negeri</span>
                                                    @else
                                                        <span
                                                            class="badge badge-secondary">{{ ucfirst($tujuan['status'] ?? 'N/A') }}</span>
                                                    @endif
                                                </td>
                                                <td>{{ $tujuan['keterangan'] ?? '-' }}</td>
                                                <td class="text-center">
                                                    {{ $tujuan['tanggal_mulai'] ? \Carbon\Carbon::parse($tujuan['tanggal_mulai'])->format('d/m/Y') : '-' }}
                                                </td>
                                                <td class="text-center">
                                                    {{ $tujuan['tanggal_berakhir'] ? \Carbon\Carbon::parse($tujuan['tanggal_berakhir'])->format('d/m/Y') : '-' }}
                                                </td>
                                                <td class="text-center">{{ $tujuan['jumlah_hari'] ?? 0 }} hari</td>
                                                <td>
                                                    @if (!empty($tujuan['karyawan']))
                                                        @foreach ($tujuan['karyawan'] as $karyawan)
                                                            <div>{{ $karyawan['nama'] ?? ($karyawan['nik'] ?? '') }}
                                                            </div>
                                                        @endforeach
                                                    @else
                                                        -
                                                    @endif
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        @endif

                        {{-- Detail Anggaran per Karyawan --}}
                        <h6 class="mt-4">Detail Anggaran per Karyawan</h6>
                        <hr class="horizontal dark mt-1 mb-3">
                        @php
                            $defaultBiaya = $defaultBiaya ?? collect();
                            $byNik = $anggaranDataForJs ?? [];
                        @endphp
                        @if (!empty($byNik))
                            @foreach ($karyawanPemohon as $emp)
                                @php
                                    $nik = $emp->nik ?? '';
                                    $nama = $emp->nama ?? 'N/A';
                                    $empData = $byNik[$nik] ?? ['default' => [], 'lain' => []];
                                @endphp
                                @if (!empty($empData['default']) || !empty($empData['lain']))
                                    <div class="card mb-3">
                                        <div class="card-header">
                                            <h5 class="mb-0">{{ $nama }}
                                                <small>({{ $nik }})</small>
                                            </h5>
                                        </div>
                                        <div class="card-body">
                                            {{-- Biaya Standard --}}
                                            <h6>Biaya Standard</h6>
                                            <div class="row">
                                                @foreach ($defaultBiaya as $biaya)
                                                    @if (isset($empData['default'][$biaya->id]))
                                                        @php $entries = $empData['default'][$biaya->id]; @endphp
                                                        @foreach ($entries as $entry)
                                                            <div class="col-md-3 mb-3">
                                                                <label class="form-label">{{ $biaya->nama_biaya }}
                                                                    ({{ $entry['currency'] ?? 'IDR' }})
                                                                </label>
                                                                <input type="text" class="form-control"
                                                                    value="{{ number_format($entry['jumlah'] ?? 0, 2, ',', '.') }}"
                                                                    readonly>
                                                            </div>
                                                        @endforeach
                                                    @endif
                                                @endforeach
                                            </div>

                                            {{-- Biaya Lain --}}
                                            <h6>Biaya Lainnya</h6>
                                            <div class="table-responsive">
                                                <table class="table table-bordered table-striped">
                                                    <thead>
                                                        <tr>
                                                            <th>Deskripsi</th>
                                                            <th>Jumlah</th>
                                                            <th>Mata Uang</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach ($empData['lain'] as $item)
                                                            <tr>
                                                                <td>{{ $item['deskripsi'] ?? '-' }}</td>
                                                                <td class="text-right">
                                                                    {{ number_format($item['jumlah'] ?? 0, 2, ',', '.') }}
                                                                </td>
                                                                <td class="text-center">
                                                                    {{ $item['currency'] ?? 'IDR' }}</td>
                                                            </tr>
                                                        @endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                @endif
                            @endforeach
                        @else
                            <p class="text-muted">Tidak ada rincian anggaran untuk pengajuan ini.</p>
                        @endif

                        {{-- ================================================================= --}}
                        {{-- SECTION BERSAMA: LAMPIRAN (untuk kategori 1) --}}
                        {{-- ================================================================= --}}
                        @if ($permohonanPerizinan->kategori_perizinan_id != 2)
                            <h6 class="mt-4">Lampiran</h6>
                            <hr class="horizontal dark mt-1 mb-3">
                            <div class="row">
                                <div class="col-md-12 mb-3">
                                    <div id="lampiran-preview" class="d-flex flex-wrap gap-2">
                                        @if (isset($lampiran) && !$lampiran->isEmpty())
                                            @foreach ($lampiran as $item)
                                                <div class="preview-item">
                                                    <img src="{{ asset('storage/' . $item->gambar_lampiran) }}"
                                                        onclick="openAttachmentModal('{{ asset('storage/' . $item->gambar_lampiran) }}')"
                                                        class="img-thumbnail"
                                                        style="width: 100px; height: 100px; cursor: pointer;"
                                                        alt="Lampiran {{ $loop->iteration }}">
                                                </div>
                                            @endforeach
                                        @else
                                            <div>Tidak ada lampiran yang tersedia.</div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endif
                    @endif

                    {{-- Modal untuk Menampilkan Lampiran (dari template email asli, lebih aman untuk email client) -->
                    <div class="modal fade" id="attachmentModal" tabindex="-1"
                        aria-labelledby="attachmentModalLabel" aria-hidden="true">
                        <div class="modal-dialog modal-dialog-centered modal-lg">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="attachmentModalLabel">Lampiran</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal"
                                        aria-label="Close"></button>
                                </div>
                                <div class="modal-body d-flex justify-content-center">
                                    <img id="modalImage" src="" alt="Lampiran Gambar" class="img-fluid">
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- Card untuk Persetujuan oleh Atasan --}}
                    @if (!collect($persetujuanAtasan)->isEmpty())
                        <div class="card mb-4 mt-4">
                            <div class="card-header">Persetujuan oleh Atasan</div>
                            <div class="card-body">
                                @foreach ($persetujuanAtasan as $approval)
                                    <div class="mb-3">
                                        <h6 class="card-subtitle mb-2 text-muted">On Step: {{ $approval->on_step }}
                                        </h6>
                                        <p><strong>Atasan Pemberi Keputusan:</strong>
                                            {{ $approval->atasan_pemberi_keputusan }}</p>
                                        @if ($approval->status == 'menyetujui')
                                            <p><strong>Status:</strong> <span
                                                    style="color: green; font-weight: bold;">{{ ucfirst($approval->status) }}</span>
                                            </p>
                                        @elseif ($approval->status == 'menolak')
                                            <p><strong>Status:</strong> <span
                                                    style="color: red; font-weight: bold;">{{ ucfirst($approval->status) }}</span>
                                            </p>
                                        @else
                                            <p><strong>Status:</strong> <span
                                                    style="color: gray; font-weight: bold;">{{ ucfirst($approval->status) }}</span>
                                            </p>
                                        @endif
                                        <p><strong>Catatan:</strong> {{ $approval->catatan ?? '-' }}</p>
                                        @if (!$loop->last)
                                            <hr>
                                        @endif
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    @endif

                    {{-- Card untuk Persetujuan oleh Feat --}}
                    @if (isset($persetujuanFeat))
                        <div class="card mb-4">
                            <div class="card-header">Persetujuan oleh Feat</div>
                            <div class="card-body">
                                @if ($persetujuanFeat->status == 'disetujui')
                                    <p><strong>Status:</strong> <span
                                            style="color: green; font-weight: bold;">Menyetujui</span></p>
                                @elseif ($persetujuanFeat->status == 'ditolak')
                                    <p><strong>Status:</strong> <span
                                            style="color: red; font-weight: bold;">Menolak</span></p>
                                @else
                                    <p><strong>Status:</strong> <span style="color: gray; font-weight: bold;">Belum
                                            Memutuskan</span></p>
                                @endif
                                <p><strong>Catatan:</strong> {{ $persetujuanFeat->catatan_dari_personalia ?? '-' }}</p>
                            </div>
                        </div>
                    @endif

                    {{-- Card untuk Persetujuan oleh Personalia --}}
                    @if (isset($persetujuanPersonalia))
                        <div class="card mb-4">
                            <div class="card-header">Persetujuan oleh Personalia</div>
                            <div class="card-body">
                                @if ($persetujuanPersonalia->status == 'disetujui')
                                    <p><strong>Status:</strong> <span
                                            style="color: green; font-weight: bold;">Menyetujui</span></p>
                                @elseif ($persetujuanPersonalia->status == 'ditolak')
                                    <p><strong>Status:</strong> <span
                                            style="color: red; font-weight: bold;">Menolak</span></p>
                                @else
                                    <p><strong>Status:</strong> <span style="color: gray; font-weight: bold;">Belum
                                            Memutuskan</span></p>
                                @endif
                                <p><strong>Catatan:</strong>
                                    {{ $persetujuanPersonalia->catatan_dari_personalia ?? '-' }}</p>
                            </div>
                        </div>
                    @endif

                    @if ($approvalStatus == 'menyetujui' || $approvalStatus == 'menolak')
                        <div class="d-flex justify-content-end gap-2">
                            <button class="btn btn-secondary text-white" disabled>Anda telah memberikan
                                keputusan</button>
                        </div>
                    @else
                        <h5 class="mt-4"><span class="text-danger">*</span> Persetujuan</h5>
                        <textarea id="catatan" class="form-control mb-3" placeholder="Tambahkan catatan..."></textarea>
                        <small class="text-muted d-block mb-3">Catatan wajib diisi jika menolak.</small>
                        <div class="d-flex justify-content-end gap-2">
                            <button class="btn btn-approval" onclick="tampilkanKonfirmasi(true)">Setujui</button>
                            <button class="btn btn-danger" onclick="tampilkanKonfirmasi(false)">Tolak</button>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>

    @push('js')
        {{-- Script untuk approval/rejection --}}
        <script>
            function tampilkanKonfirmasi(setuju) {
                const catatan = document.getElementById('catatan').value;
                if (!setuju && catatan.trim() === '') {
                    Swal.fire({
                        title: 'Peringatan',
                        text: 'Catatan wajib diisi jika Anda menolak pengajuan.',
                        icon: 'warning',
                        confirmButtonColor: '#028284'
                    });
                    return;
                }

                let text = setuju ? 'Anda yakin ingin menyetujui pengajuan izin/tugas ini?' :
                    'Anda yakin ingin menolak pengajuan izin/tugas ini?';
                Swal.fire({
                    title: 'Konfirmasi',
                    text: text,
                    icon: 'question',
                    showCancelButton: true,
                    confirmButtonColor: '#028284',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Ya, Lanjutkan!',
                    cancelButtonText: 'Batal'
                }).then((result) => {
                    if (result.isConfirmed) {
                        kirimApproval(setuju);
                    }
                });
            }

            function kirimApproval(setuju) {
                let token = @json($token);
                let url = "{{ url('/approval/perizinan/email/') }}";
                let catatan = document.getElementById('catatan').value;

                Swal.fire({
                    title: 'Memproses...',
                    html: 'Mohon tunggu sebentar...',
                    allowOutsideClick: false,
                    showConfirmButton: false,
                    didOpen: () => {
                        Swal.showLoading();
                    }
                });

                $.ajax({
                    url: url,
                    type: 'POST',
                    data: {
                        token: token,
                        catatan: catatan,
                        setuju: setuju
                    },
                    success: function(response) {
                        Swal.close();
                        Swal.fire({
                            title: response.status === 'success' ? 'Berhasil!' : 'Gagal!',
                            text: response.message,
                            icon: response.status === 'success' ? 'success' : 'error',
                            confirmButtonColor: '#028284'
                        }).then(() => {
                            window.location.reload();
                        });
                    },
                    error: function(xhr) {
                        Swal.close();
                        let errorMessage = 'Terjadi kesalahan. Silakan coba lagi.';
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            errorMessage = xhr.responseJSON.message;
                        }
                        Swal.fire({
                            title: 'Gagal!',
                            text: errorMessage,
                            icon: 'error',
                            confirmButtonColor: '#028284'
                        });
                    }
                });
            }
        </script>

        {{-- Script untuk modal lampiran --}}
        <script>
            function openAttachmentModal(imageUrl) {
                document.getElementById('modalImage').src = imageUrl;
                var modal = new bootstrap.Modal(document.getElementById('attachmentModal'));
                modal.show();
            }
        </script>

        {{-- Inisialisasi DataTables --}}
        <script>
            $(document).ready(function() {
                const dataTableOptions = {
                    "paging": true,
                    "lengthChange": true,
                    "searching": true,
                    "ordering": true,
                    "info": true,
                    "autoWidth": false,
                    "responsive": true
                };

                $('#tanggal_table').DataTable(dataTableOptions);
                if (document.getElementById('karyawan_dinas_table')) {
                    $('#karyawan_dinas_table').DataTable(dataTableOptions);
                }
                if (document.getElementById('karyawan_tugas_table')) {
                    $('#karyawan_tugas_table').DataTable(dataTableOptions);
                }
            });
        </script>
    @endpush
</div>