<?php
session_start();
require_once 'config.php';

// Query untuk mendapatkan data kehadiran terbaru
$query = "
    SELECT uk.nis, us.nama, us.kelas, uk.kode_mapel, ump.nama_mapel, uk.tanggal, uk.jam 
    FROM ujn_kehadiran uk
    JOIN ujn_siswa us ON uk.nis = us.nis
    JOIN ujn_mata_pelajaran ump ON uk.kode_mapel = ump.kode_mapel
    ORDER BY uk.tanggal DESC, uk.jam DESC
    LIMIT 50
";
$result = mysqli_query($conn, $query);
?>

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sistem Kehadiran Ujian</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <style>
        .hero-section {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 80px 0;
            margin-bottom: 40px;
        }
        .stats-card {
            background: white;
            border-radius: 10px;
            padding: 20px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            margin-bottom: 20px;
        }
        .table-container {
            background: white;
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            overflow: hidden;
        }
        .login-btn {
            position: absolute;
            top: 20px;
            right: 20px;
        }
    </style>
</head>
<body>
    <!-- Hero Section -->
    <div class="hero-section text-center position-relative">
       
            <a href="login.php" class="btn btn-light login-btn">
                <i class="fas fa-sign-in-alt"></i> Login
            </a>

        
        <div class="container">
            <h1 class="display-4 fw-bold mb-3">
                <i class="fas fa-clipboard-check"></i> Sistem Kehadiran Ujian
            </h1>
            <p class="lead mb-4">Sistem digital untuk memantau kehadiran siswa selama ujian</p>
            
            <div class="row justify-content-center">
                <div class="col-md-8">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="stats-card text-dark text-center">
                                <i class="fas fa-users fa-3x text-primary mb-3"></i>
                                <h3>
                                    <?php 
                                    $total_siswa = mysqli_query($conn, "SELECT COUNT(*) as total FROM ujn_siswa");
                                    echo mysqli_fetch_assoc($total_siswa)['total'];
                                    ?>
                                </h3>
                                <p class="mb-0">Total Siswa</p>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="stats-card text-dark text-center">
                                <i class="fas fa-book fa-3x text-success mb-3"></i>
                                <h3>
                                    <?php 
                                    $total_mapel = mysqli_query($conn, "SELECT COUNT(*) as total FROM ujn_mata_pelajaran");
                                    echo mysqli_fetch_assoc($total_mapel)['total'];
                                    ?>
                                </h3>
                                <p class="mb-0">Mata Pelajaran</p>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="stats-card text-dark text-center">
                                <i class="fas fa-calendar-check fa-3x text-warning mb-3"></i>
                                <h3>
                                    <?php 
                                    $total_kehadiran = mysqli_query($conn, "SELECT COUNT(*) as total FROM ujn_kehadiran");
                                    echo mysqli_fetch_assoc($total_kehadiran)['total'];
                                    ?>
                                </h3>
                                <p class="mb-0">Kehadiran Hari Ini</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Data Kehadiran Terbaru -->
    <div class="container">
        <div class="table-container">
            <div class="p-4 border-bottom">
                <h3 class="mb-0">
                    <i class="fas fa-history text-primary"></i> Data Kehadiran Terbaru
                </h3>
            </div>
            
            <div class="table-responsive">
                <table class="table table-striped table-hover mb-0">
                    <thead class="table-dark">
                        <tr>
                            <th>#</th>
                            <th>NIS</th>
                            <th>Nama Siswa</th>
                            <th>Kelas</th>
                            <th>Mata Pelajaran</th>
                            <th>Tanggal</th>
                            <th>Jam</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php if (mysqli_num_rows($result) > 0): ?>
                            <?php $no = 1; while ($row = mysqli_fetch_assoc($result)): ?>
                                <tr>
                                    <td><?= $no++; ?></td>
                                    <td><?= htmlspecialchars($row['nis']); ?></td>
                                    <td><?= htmlspecialchars($row['nama']); ?></td>
                                    <td><?= htmlspecialchars($row['kelas']); ?></td>
                                    <td><?= htmlspecialchars($row['nama_mapel']); ?></td>
                                    <td><?= date('d/m/Y', strtotime($row['tanggal'])); ?></td>
                                    <td><?= date('H:i', strtotime($row['jam'])); ?></td>
                                </tr>
                            <?php endwhile; ?>
                        <?php else: ?>
                            <tr>
                                <td colspan="7" class="text-center text-muted py-4">
                                    <i class="fas fa-info-circle fa-2x mb-3"></i><br>
                                    Belum ada data kehadiran
                                </td>
                            </tr>
                        <?php endif; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <footer class="bg-dark text-light text-center py-4 mt-5">
        <div class="container">
            <p class="mb-0">&copy; 2024 Sistem Kehadiran Ujian. All rights reserved.</p>
        </div>
    </footer>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

<?php mysqli_close($conn); ?>