<?php
session_start();
include 'koneksi.php';

if (!isset($_SESSION['username'])) {
    header("Location: login.php");
    exit();
}

$bulan = isset($_GET['bulan']) ? (int)$_GET['bulan'] : date('n');
$tahun = isset($_GET['tahun']) ? (int)$_GET['tahun'] : date('Y');
$jumlah_hari = cal_days_in_month(CAL_GREGORIAN, $bulan, $tahun);

// Query untuk mendapatkan data karyawan
$karyawan = mysqli_query($conn, "SELECT rfid, nama FROM karyawan");

// Array untuk menampung data absensi
$absensi = [];
$query = mysqli_query($conn, "SELECT rfid, DATE(tanggal) as tanggal, jam_masuk, jam_pulang FROM absensi 
    WHERE MONTH(tanggal) = $bulan AND YEAR(tanggal) = $tahun");
while ($row = mysqli_fetch_assoc($query)) {
    $absensi[$row['rfid']][$row['tanggal']] = [
        'masuk' => $row['jam_masuk'],
        'pulang' => $row['jam_pulang']
    ];
}
?>

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Rekap Absensi Bulanan</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <style>
        body {
            min-height: 100vh;
            display: flex;
            font-family: 'Poppins', sans-serif;
            background-color: #f4f6f9;
        }
        .sidebar {
            width: 250px;
            background-color: #1f2d3d;
            color: white;
            display: flex;
            flex-direction: column;
            padding-top: 20px;
            height: 100vh;
            position: fixed;
        }
        .sidebar h4 {
            font-weight: 600;
        }
        .sidebar a {
            color: #cfd8dc;
            text-decoration: none;
            display: flex;
            align-items: center;
            padding: 12px 20px;
            transition: background 0.2s, color 0.2s;
        }
        .sidebar a i {
            margin-right: 12px;
            font-size: 1.1rem;
        }
        .sidebar a:hover, .sidebar a.active {
            background-color: #273746;
            color: #ffffff;
        }
        .content {
            margin-left: 250px;
            padding: 30px;
            width: 100%;
        }
        th, td { text-align: center; vertical-align: middle; }
        .sticky-col { position: sticky; left: 0; background-color: #fff; z-index: 1; }
        .sticky-col-header { position: sticky; top: 0; z-index: 2; background-color: #e9ecef; }

        .header-tanggal {
            background-color: #f1f1f1;
            font-weight: bold;
        }

        .header-nama {
            background-color: #d1d8e0;
            font-weight: bold;
        }
    </style>
</head>

<body>
    <div class="sidebar">
        <h4 class="text-center text-white mb-4">ABSENSI RFID</h4>
        <a href="index.php"><i class="bi bi-house-door-fill"></i> Beranda</a>
        <a href="karyawan.php"><i class="bi bi-people-fill"></i> Data Karyawan</a>
        <a href="absensi.php"><i class="bi bi-clock-fill"></i> Absensi</a>
        <a href="rekap.php" class="active"><i class="bi bi-card-checklist"></i> Rekap Absensi</a>
          <a href="atur_jam.php"><i class="bi bi-clock-history"></i> Set Jam Masuk / Pulang</a> <!-- Tambahan tab baru -->
        <div class="mt-auto">
            <hr class="bg-secondary">
            <a href="logout.php"><i class="bi bi-box-arrow-right"></i> Logout</a>
        </div> 
    </div>

    <div class="content">
        <h3 class="mb-4">Rekap Absensi Bulanan</h3>

<!-- Filter Bulan & Tahun -->
<form method="get" class="mb-4" id="filterForm">
    <div class="row g-2 align-items-center">
        <div class="col-auto">
            <select name="bulan" id="bulan" class="form-select">
                <?php
                $currentMonth = isset($_GET['bulan']) ? $_GET['bulan'] : date('n');
                for ($i = 1; $i <= 12; $i++) {
                    $selected = ($i == $currentMonth) ? 'selected' : '';
                    echo "<option value='$i' $selected>" . date('F', mktime(0, 0, 0, $i, 1)) . "</option>";
                }
                ?>
            </select>
        </div>
        <div class="col-auto">
            <select name="tahun" id="tahun" class="form-select">
                <?php
                $currentYear = isset($_GET['tahun']) ? $_GET['tahun'] : date('Y');
                for ($i = $currentYear - 5; $i <= $currentYear + 1; $i++) {
                    $selected = ($i == $currentYear) ? 'selected' : '';
                    echo "<option value='$i' $selected>$i</option>";
                }
                ?>
            </select>
        </div>
        <div class="col-auto">
            <!-- Tombol Cetak otomatis update URL -->
            <a id="btnCetak" href="cetak_bulan.php?bulan=<?= $currentMonth ?>&tahun=<?= $currentYear ?>" class="btn btn-primary" target="_blank">
                <i class="bi bi-file-earmark-pdf"></i> Cetak Bulan ini
            </a>
        </div>
<div class="col-auto">
    <!-- Tombol Proses Penggajian otomatis update URL -->
    <a id="btnProsesGaji" href="proses_penggajian.php?bulan=<?= $currentMonth ?>&tahun=<?= $currentYear ?>" class="btn btn-success" target="_blank">
        <i class="fa fa-check-circle"></i> Proses Penggajian Bulan Ini
    </a>
</div>


</form>

<!-- Script agar tombol cetak ikut berubah saat user pilih bulan/tahun -->
<script>
const bulanSelect = document.getElementById('bulan');
const tahunSelect = document.getElementById('tahun');
const cetakBtn = document.getElementById('btnCetak');
const gajiBtn = document.getElementById('btnProsesGaji');  // Menambahkan tombol untuk proses gaji

function updateLink() {
    const bulan = bulanSelect.value;
    const tahun = tahunSelect.value;
    cetakBtn.href = `cetak_bulan.php?bulan=${bulan}&tahun=${tahun}`;
    gajiBtn.href = `proses_penggajian.php?bulan=${bulan}&tahun=${tahun}`;  // Perbarui URL proses gaji
}

bulanSelect.addEventListener('change', updateLink);
tahunSelect.addEventListener('change', updateLink);

// Panggil fungsi updateLink sekali untuk memastikan URL awal sudah benar
updateLink();

</script>



        <!-- Tabel Rekap -->
        <div class="table-responsive">
            <table class="table table-bordered table-sm" id="rekapAbsensi">
<thead id="theadRekap">
    <!-- Akan diisi oleh AJAX -->
</thead>

                <tbody id="dataAbsensi">
                    <!-- Data absensi akan dimuat oleh AJAX -->
                </tbody>
            </table>
        </div>
    </div>

    <!-- Modal Cetak PDF -->
    <div class="modal fade" id="modalCetak" tabindex="-1">
        <div class="modal-dialog">
            <form class="modal-content" action="cetak_pdf.php" method="POST" target="_blank">
                <div class="modal-header">
                    <h5 class="modal-title">Cetak Rekap Absensi</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <label>Dari Tanggal:</label>
                    <input type="date" name="tgl_awal" class="form-control" required>
                    <label class="mt-2">Sampai Tanggal:</label>
                    <input type="date" name="tgl_akhir" class="form-control" required>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Cetak PDF</button>
                </div>
            </form>
        </div>
    </div>

    <!-- JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        $(document).ready(function() {
            loadAbsensi(); // Load awal

            $("#bulan, #tahun").change(function() {
                loadAbsensi();
            });
function loadAbsensi() {
    var bulan = $('#bulan').val();
    var tahun = $('#tahun').val();

    $.ajax({
        url: 'get_rekap_absensi.php',
        method: 'GET',
        data: { bulan: bulan, tahun: tahun },
        dataType: 'json',
        success: function(response) {
            $('#theadRekap').html(response.thead);
            $('#dataAbsensi').html(response.tbody);
        }
    });
}

        });
    </script>

</body>
</html>
