<?= $this->extend('layout/template'); ?>
<?= $this->section('content'); ?>

<nav class="page-breadcrumb">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><?= $Breadcumb ?></li>
        <li class="breadcrumb-item active" aria-current="page">Data <?= $Breadcumb ?></li>
    </ol>
</nav>

<div class="row">
    <div class="col-md-12 grid-margin stretch-card">
        <div class="card">
            <div class="card-body">

                <div class="col-md-2 grid-margin stretch-card">
                    <a class="btn btn-primary me-2" data-bs-toggle="modal" data-bs-target="#tambahModal">Tambah Data</a>

                    <!-- <a class="btn btn-success" data-bs-toggle="modal" data-bs-target="#importModal"> Import Data</a> -->
                </div>

                <h6 class="card-title">Data <?= $Breadcumb ?></h6>

                <!-- Tabel Pengajuan Cuti (Supervisor) -->
                <div class="table-responsive">
                    <table id="dataTableExample" class="table table-bordered table-hover table no-wrap">
                        <thead class="table-info text-dark">
                            <tr>
                                <th style="width: 5%;">#</th>
                                <th>NIP</th>
                                <th>Nama Pegawai</th>
                                <th>Jenis Cuti</th>
                                <th>Tgl Mulai</th>
                                <th>Tgl Selesai</th>
                                <th>Keterangan</th>
                                <th>Status Supervisor</th>
                                <th>Status Manager</th>
                                <th>Status Admin</th>
                                <th>Aksi</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php $no = 1; ?>
                            <?php if (!empty($pengajuancuti)): ?>
                                <?php foreach ($pengajuancuti as $row): ?>
                                    <tr>
                                        <td><?= $no++ ?></td>
                                        <td><?= esc($row['nip']) ?></td>
                                        <td><?= esc($row['nama']) ?></td>
                                        <td><?= esc($row['nama_jenis']) ?></td>
                                        <td><?= date('d-m-Y', strtotime($row['tanggal_mulai'])) ?></td>
                                        <td><?= date('d-m-Y', strtotime($row['tanggal_selesai'])) ?></td>
                                        <td><?= esc($row['keterangan']) ?></td>

                                        <!-- Status Supervisor -->
                                        <td>
                                            <span class="badge 
                                <?= $row['status_supervisor'] === 'disetujui' ? 'bg-success' : ($row['status_supervisor'] === 'ditolak' ? 'bg-danger' : 'bg-warning') ?>">
                                                <?= ucfirst($row['status_supervisor']) ?>
                                            </span>
                                        </td>

                                        <!-- Status Manager -->
                                        <td>
                                            <span class="badge 
                                <?= $row['status_manager'] === 'disetujui' ? 'bg-success' : ($row['status_manager'] === 'ditolak' ? 'bg-danger' : 'bg-warning') ?>">
                                                <?= ucfirst($row['status_manager']) ?>
                                            </span>
                                        </td>

                                        <!-- Status Admin -->
                                        <td>
                                            <span class="badge 
                                <?= $row['status_admin'] === 'dicetak' ? 'bg-success' : ($row['status_admin'] === 'diproses' ? 'bg-primary' : 'bg-secondary') ?>">
                                                <?= ucfirst($row['status_admin']) ?>
                                            </span>
                                        </td>

                                        <!-- Aksi Supervisor -->
                                        <td>
                                            <button type="button" class="btn btn-info btn-sm" title="Lihat Detail" onclick="showDetail('<?= $row['id'] ?>')">
                                                <i class="icon-sm" data-feather="eye"></i>
                                            </button>

                                            <?php if ($row['status_supervisor'] === 'pending'): ?>
                                                <!-- Tombol Setujui -->
                                                <button type="button" class="btn btn-success btn-sm" title="Setujui" onclick="showApproveModal('<?= $row['id'] ?>')">
                                                    <i class="icon-sm" data-feather="check"></i>
                                                </button>

                                                <!-- Tombol Tolak -->
                                                <button type="button" class="btn btn-danger btn-sm" title="Tolak" onclick="showRejectModal('<?= $row['id'] ?>')">
                                                    <i class="icon-sm" data-feather="x"></i>
                                                </button>
                                            <?php else: ?>
                                                <!-- Tombol Batalkan hanya jika tidak pending -->
                                                <button type="button" class="btn btn-secondary btn-sm" title="Batalkan Tindakan" onclick="cancelAction('<?= $row['id'] ?>', 'supervisor')">
                                                    <i class="icon-sm" data-feather="rotate-ccw"></i>
                                                </button>
                                            <?php endif; ?>
                                        </td>
                                    </tr>
                                <?php endforeach; ?>
                            <?php else: ?>
                                <tr>
                                    <td colspan="10" class="text-center" style="background-color: #f9f9f9; color: #888; font-style: italic; padding: 20px;">
                                        <i class="fas fa-folder-open" style="font-size: 24px; color: #ccc;"></i><br>
                                        <span style="font-size: 16px; font-weight: bold;">Tidak ada data yang tersedia.</span><br>
                                        <span style="font-size: 14px;">Semua pengajuan telah ditindaklanjuti atau tidak ada pengajuan baru.</span>
                                    </td>
                                </tr>
                            <?php endif; ?>
                        </tbody>
                    </table>
                </div>


            </div>

        </div>
    </div>
</div>


<!-- Modal Catatan Supervisor -->
<div class="modal fade" id="catatanModal" tabindex="-1" aria-labelledby="catatanModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <form id="formCatatanSupervisor">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="catatanModalLabel">Catatan Supervisor</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Tutup"></button>
                </div>
                <div class="modal-body">
                    <input type="hidden" name="id" id="id_pengajuan">
                    <input type="hidden" name="action" id="action_pengajuan">
                    <div class="mb-3">
                        <label for="catatan" class="form-label">Catatan</label>
                        <textarea class="form-control" name="catatan" id="catatan" rows="3" placeholder="Tulis catatan jika diperlukan..."></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Kirim</button>
                </div>
            </div>
        </form>
    </div>
</div>

<!-- Modal Detail Pengajuan Cuti -->
<div class="modal fade" id="modalDetail" tabindex="-1" aria-labelledby="modalDetailLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-info text-white">
                <h5 class="modal-title" id="modalDetailLabel">Detail Pengajuan Cuti</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Tutup"></button>
            </div>
            <div class="modal-body">
                <table class="table table-borderless">
                    <tr>
                        <th style="width: 30%;">Nama Pegawai</th>
                        <td id="detail_nama"></td>
                    </tr>
                    <tr>
                        <th>NIP</th>
                        <td id="detail_nip"></td>
                    </tr>
                    <tr>
                        <th>Jenis Cuti</th>
                        <td id="detail_jenis"></td>
                    </tr>
                    <tr>
                        <th>Tanggal Mulai</th>
                        <td id="detail_mulai"></td>
                    </tr>
                    <tr>
                        <th>Tanggal Selesai</th>
                        <td id="detail_selesai"></td>
                    </tr>
                    <tr>
                        <th>Keterangan</th>
                        <td id="detail_keterangan"></td>
                    </tr>
                    <tr>
                        <th>Status Supervisor</th>
                        <td id="detail_status_supervisor"></td>
                    </tr>
                    <tr>
                        <th>Catatan Supervisor</th>
                        <td id="detail_catatan_supervisor"></td>
                    </tr>
                    <tr>
                        <th>Status Manager</th>
                        <td id="detail_status_manager"></td>
                    </tr>
                    <tr>
                        <th>Catatan Manager</th>
                        <td id="detail_catatan_manager"></td>
                    </tr>
                    <tr>
                        <th>Status Admin</th>
                        <td id="detail_status_admin"></td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>

<!-- untuk showdetail cuti -->
<script>
    function showDetail(id) {
        $.ajax({
            url: "<?= base_url('PengajuanCuti/detail') ?>/" + id,
            type: "GET",
            dataType: "json",
            success: function(data) {
                $('#detail_nama').text(data.nama ?? '-');
                $('#detail_nip').text(data.nip ?? '-');
                $('#detail_jenis').text(data.nama_jenis ?? '-');
                $('#detail_mulai').text(formatTanggal(data.tanggal_mulai));
                $('#detail_selesai').text(formatTanggal(data.tanggal_selesai));
                $('#detail_keterangan').text(data.keterangan ?? '-');
                $('#detail_status_supervisor').html(formatStatus(data.status_supervisor));
                $('#detail_catatan_supervisor').text(data.catatan_supervisor ? data.catatan_supervisor : 'Tidak ada catatan');
                $('#detail_status_manager').html(formatStatus(data.status_manager));
                $('#detail_catatan_manager').text(data.catatan_manager ? data.catatan_manager : 'Tidak ada catatan');
                $('#detail_status_admin').html(formatStatus(data.status_admin));

                $('#modalDetail').modal('show');
            },
            error: function() {
                Swal.fire('Gagal', 'Data tidak ditemukan.', 'error');
            }
        });
    }

    // Format tanggal (jika perlu)
    function formatTanggal(tgl) {
        if (!tgl) return '-';
        const date = new Date(tgl);
        return date.toLocaleDateString('id-ID', {
            day: '2-digit',
            month: '2-digit',
            year: 'numeric'
        });
    }

    // Format status jadi badge
    function formatStatus(status) {
        let warna = 'secondary';
        if (status === 'disetujui') warna = 'success';
        else if (status === 'ditolak') warna = 'danger';
        else if (status === 'diproses') warna = 'primary';
        else if (status === 'pending') warna = 'warning';
        else if (status === 'dicetak') warna = 'success';

        return `<span class="badge bg-${warna}">${status ? status.charAt(0).toUpperCase() + status.slice(1) : '-'}</span>`;
    }
</script>

<!-- fungsi  untuk aksi status -->
<script>
    function showApproveModal(id) {
        $('#id_pengajuan').val(id);
        $('#action_pengajuan').val('setujui');
        $('#catatan').val('');
        $('#catatanModal').modal('show');
    }

    function showRejectModal(id) {
        $('#id_pengajuan').val(id);
        $('#action_pengajuan').val('tolak');
        $('#catatan').val('');
        $('#catatanModal').modal('show');
    }

    $('#formCatatanSupervisor').submit(function(e) {
        e.preventDefault();

        const id = $('#id_pengajuan').val();
        const action = $('#action_pengajuan').val();
        const catatan = $('#catatan').val();

        $.ajax({
            url: "<?= base_url('PengajuanCuti/prosesSupervisor') ?>",
            type: "POST",
            data: {
                id: id,
                action: action,
                catatan: catatan
            },
            dataType: "json",
            success: function(response) {
                $('#catatanModal').modal('hide');
                Swal.fire('Berhasil', response.message, 'success').then(() => {
                    location.reload();
                });
            },
            error: function() {
                Swal.fire('Gagal', 'Terjadi kesalahan saat mengirim data.', 'error');
            }
        });
    });
</script>

<!-- untuk tindakan pembatalan -->
<script>
    function cancelAction(id, role) {
        Swal.fire({
            title: 'Batalkan Tindakan?',
            text: 'Status akan dikembalikan ke pending.',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Ya, batalkan!',
            cancelButtonText: 'Batal'
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                    url: "<?= base_url('PengajuanCuti/batalkanTindakan') ?>",
                    type: "POST",
                    data: {
                        id: id,
                        role: role
                    },
                    dataType: "json",
                    success: function(response) {
                        Swal.fire('Berhasil', response.message, 'success').then(() => {
                            location.reload();
                        });
                    },
                    error: function() {
                        Swal.fire('Gagal', 'Terjadi kesalahan.', 'error');
                    }
                });
            }
        });
    }
</script>


<?= $this->endSection(); ?>