Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-611.26.1.el9_7.x86_64

PHP Version:

8.4.15

User:

u892747680

Directory:

/home/u892747680/domains/sisteminformasic.com/public_html/absensi-kbnj

Free Space:

9.68 TB

🔧 Quick Actions

✏️ Editing: generate_qr.php

<?php
require_once 'config.php';
checkLogin();
$conn = getConnection();

// Proses generate QR
if (isset($_POST['generate'])) {
    $siswa_id = $_POST['siswa_id'];
    
    // Ambil data siswa
    $stmt = $conn->prepare("SELECT * FROM siswa WHERE id = ?");
    $stmt->bind_param("i", $siswa_id);
    $stmt->execute();
    $siswa = $stmt->get_result()->fetch_assoc();
    
    if ($siswa) {
        // Data untuk QR code
        $qr_data = json_encode([
            'nis' => $siswa['nis'],
            'nama' => $siswa['nama'],
            'kelas' => $siswa['kelas'],
            'uid' => uniqid() // Tambahkan ID unik agar pola QR terlihat berbeda
        ]);
        
        // Generate QR menggunakan API
        $qr_url = "https://api.qrserver.com/v1/create-qr-code/?size=300x300&data=" . urlencode($qr_data);
        
        // Update database
        $stmt = $conn->prepare("UPDATE siswa SET qr_code = ? WHERE id = ?");
        $stmt->bind_param("si", $qr_url, $siswa_id);
        $stmt->execute();
        
        $success = "QR Code berhasil digenerate untuk " . $siswa['nama'];
    }
}

// Ambil semua siswa
$siswa_list = $conn->query("SELECT * FROM siswa ORDER BY nama");
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Generate QR Code</title>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            font-family: 'Poppins', sans-serif;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            min-height: 100vh;
            padding: 20px;
            color: #444;
        }
        .circles {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            z-index: -1;
        }
        .circles li {
            position: absolute;
            display: block;
            list-style: none;
            width: 20px;
            height: 20px;
            background: rgba(255, 255, 255, 0.2);
            animation: bubble-animate 25s linear infinite;
            bottom: -150px;
            border-radius: 50%;
        }
        .circles li:nth-child(1) { left: 25%; width: 80px; height: 80px; animation-delay: 0s; }
        .circles li:nth-child(2) { left: 10%; width: 20px; height: 20px; animation-delay: 2s; animation-duration: 12s; }
        .circles li:nth-child(3) { left: 70%; width: 20px; height: 20px; animation-delay: 4s; }
        .circles li:nth-child(4) { left: 40%; width: 60px; height: 60px; animation-delay: 0s; animation-duration: 18s; }
        .circles li:nth-child(5) { left: 65%; width: 20px; height: 20px; animation-delay: 0s; }
        .circles li:nth-child(6) { left: 75%; width: 110px; height: 110px; animation-delay: 3s; }
        .circles li:nth-child(7) { left: 35%; width: 150px; height: 150px; animation-delay: 7s; }
        .circles li:nth-child(8) { left: 50%; width: 25px; height: 25px; animation-delay: 15s; animation-duration: 45s; }
        .circles li:nth-child(9) { left: 20%; width: 15px; height: 15px; animation-delay: 2s; animation-duration: 35s; }
        .circles li:nth-child(10) { left: 85%; width: 150px; height: 150px; animation-delay: 0s; animation-duration: 11s; }
        @keyframes bubble-animate { 0% { transform: translateY(0) rotate(0deg); opacity: 1; } 100% { transform: translateY(-1000px) rotate(360deg); opacity: 0; } }
        .container {
            max-width: 1200px;
            margin: 0 auto;
        }
        .header {
            background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); padding: 25px; border-radius: 20px;
            box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); border: 1px solid rgba(255, 255, 255, 0.18);
            margin-bottom: 30px;
            color: #fff;
            position: relative;
            text-align: center;
            animation: slideDown 0.5s ease-out;
        }
        .header h1 { color: #fff; margin-bottom: 10px; font-weight: 800; }
        .header p { color: rgba(255,255,255,0.9); }
        .back-btn {
            position: absolute; top: 20px; left: 20px; width: 45px; height: 45px;
            display: flex; align-items: center; justify-content: center;
            background: rgba(255,255,255,0.2); color: white; text-decoration: none;
            border-radius: 50%; transition: all 0.3s ease; font-size: 20px; border: none;
            backdrop-filter: blur(5px);
        }
        .back-btn:hover { background: #fff; color: #4318FF; transform: scale(1.1) rotate(360deg); }
        .content {
            background: #fff; padding: 30px; border-radius: 20px;
            box-shadow: 0 20px 50px rgba(0,0,0,0.05); color: #444;
            animation: slideUp 0.6s ease-out;
        }
        .alert {
            padding: 15px; margin-bottom: 20px; border-radius: 10px;
            font-weight: 600; background: #e6fffa; color: #06d6a0; border: 1px solid #06d6a0;
        }
        .form-group {
            margin-bottom: 20px;
        }
        .form-group label {
            display: block;
            margin-bottom: 5px;
            font-weight: bold;
            color: #555;
        }
        .form-group select {
            width: 100%;
            padding: 12px;
            border: 1px solid #e0e5f2;
            border-radius: 10px;
            font-size: 16px;
            font-family: inherit;
            background: #fff;
            color: #333;
            transition: all 0.3s ease;
        }
        .form-group select:focus {
            outline: none;
            border-color: #4318FF;
            background: #fff;
            transform: scale(1.02);
        }
        .form-group option {
            background: #fff;
            color: #333;
        }
        .btn {
            padding: 10px 25px;
            color: white;
            border: none;
            border-radius: 15px;
            cursor: pointer;
            font-size: 16px;
            font-weight: 700;
            margin-right: 10px;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
            box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        }
        .btn:hover { transform: translateY(-5px) scale(1.1) rotate(-2deg); box-shadow: 0 6px 15px rgba(0,0,0,0.15); }
        .btn-primary { background: linear-gradient(to right, #4318FF, #868CFF); }
        .btn-secondary { background: linear-gradient(to right, #FFB547, #FFD166); }
        .btn-info { background: linear-gradient(to right, #11CDEF, #1171EF); }
        .btn-success { background: linear-gradient(to right, #05CD99, #00E096); }
        .qr-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
            gap: 20px;
            margin-top: 30px;
        }
        .qr-card {
            border: none;
            border-radius: 24px;
            padding: 25px;
            text-align: center;
            background: rgba(255, 255, 255, 0.8);
            color: #444;
            transition: transform 0.3s, box-shadow 0.3s;
            box-shadow: 0 10px 20px rgba(0,0,0,0.05);
            animation: popIn 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) both;
        }
        .qr-card:hover {
            transform: translateY(-10px) scale(1.05);
            box-shadow: 0 15px 30px rgba(0,0,0,0.15);
        }
        .qr-card img {
            width: 100%;
            height: auto;
            margin-bottom: 10px;
            border-radius: 10px;
        }
        .qr-card h3 {
            color: #2b3674;
            margin-bottom: 5px;
            font-size: 16px;
            font-weight: 700;
        }
        .qr-card p {
            color: #a3aed0;
            font-size: 14px;
        }
        .download-btn {
            display: inline-block;
            padding: 8px 20px;
            background: #05CD99;
            color: white;
            text-decoration: none;
            border-radius: 50px;
            margin-top: 10px;
            font-size: 14px;
            font-weight: 600;
            transition: background 0.3s;
        }
        .download-btn:hover { background: #00E096; }
        @keyframes slideDown {
            from { transform: translateY(-50px); opacity: 0; }
            to { transform: translateY(0); opacity: 1; }
        }
        @keyframes slideUp {
            from { transform: translateY(50px); opacity: 0; }
            to { transform: translateY(0); opacity: 1; }
        }
        @keyframes popIn {
            from { transform: scale(0.5); opacity: 0; }
            to { transform: scale(1); opacity: 1; }
        }
        @media print {
            body {
                background: white;
            }
            .header, .back-btn, .content > form, .download-btn, .circles {
                display: none;
            }
            .qr-grid {
                grid-template-columns: repeat(3, 1fr);
            }
        }
        @media screen and (max-width: 768px) {
            body { padding: 15px; }
            .header { padding: 20px 15px; }
            .header h1 { font-size: 22px; }
            .form-actions {
                display: grid;
                grid-template-columns: 1fr;
                gap: 10px;
            }
            .btn { width: 100%; justify-content: center; }
        }
    </style>
</head>
<body>
    <ul class="circles"><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li></ul>
    <div class="container">
        <div class="header">
            <a href="index.php" class="back-btn" title="Kembali"><i class="fa-solid fa-arrow-left"></i></a>
            <h1><i class="fa-solid fa-qrcode"></i> Generate QR Code</h1>
            <p>Generate QR Code untuk Absensi Siswa</p>
        </div>

<form method="POST" style="background: rgba(255, 255, 255, 0.5); padding: 20px; border-radius: 15px;">
                <div class="form-group">
                    <label>Pilih Siswa:</label>
                    <select name="siswa_id" required>
                        <option value="">-- Pilih Siswa --</option>
                        <?php 
                        $siswa_list_select = $conn->query("SELECT * FROM siswa ORDER BY nama");
                        while($siswa = $siswa_list_select->fetch_assoc()): 
                        ?>
                            <option value="<?php echo $siswa['id']; ?>">
                                <?php echo $siswa['nama'] . " - " . $siswa['nis'] . " (" . $siswa['kelas'] . ")"; ?>
                            </option>
                        <?php endwhile; ?>
                    </select>
                </div>
                <div class="form-actions">
                    <button type="submit" name="generate" class="btn btn-primary"><i class="fa-solid fa-gear"></i> Generate QR</button>
                    <a href="cetak_kartu.php" target="_blank" class="btn btn-info">
                        <i class="fa-solid fa-id-card"></i> Cetak Kartu Pelajar
                    </a>
                </div>
            </form>

<div class="qr-grid">
                <?php 
                $siswa_with_qr = $conn->query("SELECT * FROM siswa WHERE qr_code IS NOT NULL ORDER BY nama");
                while($siswa = $siswa_with_qr->fetch_assoc()): 
                ?>
                    <div class="qr-card">
                        <img src="<?php echo $siswa['qr_code']; ?>" alt="QR Code">
                        <h3><?php echo $siswa['nama']; ?></h3>
                        <p>NIS: <?php echo $siswa['nis']; ?></p>
                        <p>Kelas: <?php echo $siswa['kelas']; ?></p>
                        <a href="cetak_kartu.php?id=<?php echo $siswa['id']; ?>" target="_blank" class="download-btn">
                            <i class="fa-solid fa-id-card"></i> Cetak
                        </a>
                    </div>
                <?php endwhile; ?>
            </div>
        </div>
    </div>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: generate_qr.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation