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: mapel.php

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

// Proses tambah mapel
if (isset($_POST['tambah'])) {
    $nama_mapel = clean($_POST['nama_mapel']);
    
    // Cek duplikat
    $check = $conn->query("SELECT id FROM mata_pelajaran WHERE nama_mapel = '$nama_mapel'");
    if ($check->num_rows > 0) {
        $error = "Mata pelajaran sudah ada!";
    } else {
        $stmt = $conn->prepare("INSERT INTO mata_pelajaran (nama_mapel) VALUES (?)");
        $stmt->bind_param("s", $nama_mapel);
        
        if ($stmt->execute()) {
            $success = "Mata pelajaran berhasil ditambahkan!";
        } else {
            $error = "Gagal menambahkan mata pelajaran.";
        }
    }
}

// Proses update mapel
if (isset($_POST['update'])) {
    $id = $_POST['id'];
    $nama_mapel = clean($_POST['nama_mapel']);
    
    $stmt = $conn->prepare("UPDATE mata_pelajaran SET nama_mapel = ? WHERE id = ?");
    $stmt->bind_param("si", $nama_mapel, $id);
    
    if ($stmt->execute()) {
        echo "<script>alert('Mata pelajaran berhasil diperbarui!'); window.location.href='mapel.php';</script>";
        exit();
    } else {
        $error = "Gagal memperbarui mata pelajaran.";
    }
}

// Proses hapus mapel
if (isset($_GET['hapus'])) {
    $id = $_GET['hapus'];
    $stmt = $conn->prepare("DELETE FROM mata_pelajaran WHERE id = ?");
    $stmt->bind_param("i", $id);
    
    if ($stmt->execute()) {
        $success = "Mata pelajaran berhasil dihapus!";
    } else {
        $error = "Gagal menghapus mata pelajaran.";
    }
}

// Ambil data edit jika ada parameter edit
$data_edit = null;
if (isset($_GET['edit'])) {
    $id = $_GET['edit'];
    $stmt = $conn->prepare("SELECT * FROM mata_pelajaran WHERE id = ?");
    $stmt->bind_param("i", $id);
    $stmt->execute();
    $data_edit = $stmt->get_result()->fetch_assoc();
}

// Ambil semua mapel
$mapel_list = $conn->query("SELECT * FROM mata_pelajaran ORDER BY nama_mapel");
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Data Mata Pelajaran</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: #F4F7FE;
            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(67, 24, 255, 0.1);
            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; background: rgba(134, 140, 255, 0.1); }
        .circles li:nth-child(2) { left: 10%; width: 20px; height: 20px; animation-delay: 2s; animation-duration: 12s; background: rgba(67, 24, 255, 0.1); }
        .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; background: rgba(134, 140, 255, 0.1); }
        .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; background: rgba(67, 24, 255, 0.1); }
        .circles li:nth-child(7) { left: 35%; width: 150px; height: 150px; animation-delay: 7s; background: rgba(134, 140, 255, 0.1); }
        .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; background: rgba(67, 24, 255, 0.1); }
        .circles li:nth-child(10) { left: 85%; width: 150px; height: 150px; animation-delay: 0s; animation-duration: 11s; background: rgba(134, 140, 255, 0.1); }
        @keyframes bubble-animate { 0% { transform: translateY(0) rotate(0deg); opacity: 1; } 100% { transform: translateY(-1000px) rotate(360deg); opacity: 0; } }
        .container { max-width: 1000px; margin: 0 auto; }
        .header {
            background: linear-gradient(135deg, #4318FF 0%, #868CFF 100%); padding: 25px; border-radius: 20px;
            box-shadow: 0 10px 30px rgba(67, 24, 255, 0.2);
            margin-bottom: 30px;
            color: #fff;
            position: relative;
            text-align: center;
            border: none;
            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: 24px; box-shadow: 0 20px 50px rgba(0,0,0,0.05); margin-bottom: 20px; color: #444; animation: slideUp 0.6s ease-out; }
        .content h2 { color: #2b3674; margin-bottom: 20px; font-weight: 700; border-bottom: 2px solid #f0f0f0; padding-bottom: 10px; }
        .alert { padding: 15px; margin-bottom: 20px; border-radius: 10px; font-weight: 600; }
        .alert-success { background: #e6fffa; color: #06d6a0; border: 1px solid #06d6a0; }
        .alert-error { background: #fff5f5; color: #ef476f; border: 1px solid #ef476f; }
        .form-group { margin-bottom: 15px; }
        .form-group label { display: block; margin-bottom: 5px; font-weight: bold; color: #555; }
        .form-group input {
            width: 100%; padding: 12px; border: 1px solid #e0e5f2;
            border-radius: 10px; font-size: 16px; background: #fff; color: #333; transition: all 0.3s ease;
        }
        .form-group input:focus { outline: none; border-color: #4318FF; background: #fff; transform: scale(1.02); box-shadow: 0 0 0 3px rgba(67, 24, 255, 0.1); }
        .btn {
            padding: 10px 25px; color: white; border: none; border-radius: 50px;
            cursor: pointer; font-size: 16px; font-weight: 700; 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-danger { background: linear-gradient(to right, #EE5D50, #FF9B9B); }
        .btn-success { background: linear-gradient(to right, #05CD99, #00E096); }
        .btn-small { width: 40px; height: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 16px; }
        table { width: 100%; border-collapse: collapse; margin-top: 20px; }
        table th {
            padding: 15px; text-align: left; background-color: rgba(118, 75, 162, 0.1);
            color: #764ba2; font-weight: 800; text-transform: uppercase; font-size: 12px;
            letter-spacing: 1px;
        }
        table td { 
            padding: 15px; border-bottom: 1px solid #eee; 
            vertical-align: middle; color: #555; font-weight: 600;
        }
        table th:first-child, table td:first-child { border-radius: 10px 0 0 10px; }
        table th:last-child, table td:last-child { border-radius: 0 10px 10px 0; }
        table tbody tr {
            transition: all 0.2s ease-in-out;
        }
        table tbody tr:hover { background-color: rgba(118, 75, 162, 0.05); transform: scale(1.01); box-shadow: 0 10px 20px rgba(0,0,0,0.1); z-index: 10; position: relative; }
        .form-inline { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; background: rgba(255, 255, 255, 0.5); padding: 20px; border-radius: 15px; }
        .action-buttons { display: flex; gap: 10px; }
        @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; }
        }
        .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
        .mobile-scroll-hint { display: none; }
        @media (max-width: 768px) {
            body { padding: 15px; }
            .header { padding: 20px 15px; }
            .header h1 { font-size: 20px; }
            .form-inline { grid-template-columns: 1fr; gap: 15px; }
            .btn { width: 100%; justify-content: center; }
            .content { padding: 20px; }
            table th, table td { padding: 10px; font-size: 13px; }
            .mobile-scroll-hint { display: block; text-align: center; color: #777; font-size: 12px; margin-bottom: 10px; }
            .action-buttons {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
                gap: 10px;
            }
        }
    </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-book"></i> Data Mata Pelajaran</h1>
            <p>Kelola daftar mata pelajaran sekolah</p>
        </div>

<div class="content">
            <h2><?php echo $data_edit ? '<i class="fa-solid fa-pen-to-square"></i> Edit Mata Pelajaran' : '<i class="fa-solid fa-plus-circle"></i> Tambah Mata Pelajaran'; ?></h2>
            
            <?php if (isset($success)): ?>
                <div class="alert alert-success"><?php echo $success; ?></div>
            <?php endif; ?>
            
            <?php if (isset($error)): ?>
                <div class="alert alert-error"><?php echo $error; ?></div>
            <?php endif; ?>

<form method="POST" class="form-inline">
                <?php if ($data_edit): ?>
                    <input type="hidden" name="id" value="<?php echo $data_edit['id']; ?>">
                <?php endif; ?>
                
                <div class="form-group" style="margin-bottom: 0;">
                    <label>Nama Mata Pelajaran:</label>
                    <input type="text" name="nama_mapel" required value="<?php echo $data_edit ? $data_edit['nama_mapel'] : ''; ?>" placeholder="Contoh: Matematika">
                </div>
                <div class="form-group" style="margin-bottom: 0;">
                    <div class="action-buttons">
                        <?php if ($data_edit): ?>
                            <button type="submit" name="update" class="btn btn-success"><i class="fa-solid fa-save"></i> Simpan</button>
                            <a href="mapel.php" class="btn btn-danger"><i class="fa-solid fa-times"></i> Batal</a>
                        <?php else: ?>
                            <button type="submit" name="tambah" class="btn btn-primary"><i class="fa-solid fa-plus"></i> Tambah</button>
                        <?php endif; ?>
                    </div>
                </div>
            </form>
        </div>

<div class="content">
            <h2><i class="fa-solid fa-list"></i> Daftar Mata Pelajaran</h2>
            <div class="table-responsive">
                <p class="mobile-scroll-hint">
                    <i class="fa-solid fa-arrow-left"></i> Geser tabel untuk melihat data selengkapnya <i class="fa-solid fa-arrow-right"></i>
                </p>
                <table>
                    <thead>
                        <tr>
                            <th width="60">No</th>
                            <th><i class="fa-solid fa-book"></i> Nama Mata Pelajaran</th>
                            <th width="100"><i class="fa-solid fa-gears"></i> Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php 
                        $no = 1;
                        while($mapel = $mapel_list->fetch_assoc()): 
                        ?>
                            <tr>
                                <td style="text-align: center;"><?php echo $no++; ?></td>
                                <td>
                                    <?php echo $mapel['nama_mapel']; ?>
                                </td>
                                <td>
                                    <div class="action-buttons">
                                        <a href="mapel.php?hapus=<?php echo $mapel['id']; ?>" 
                                           class="btn btn-danger btn-small" title="Hapus"
                                           onclick="return confirm('Yakin hapus mapel ini? Data absensi terkait mungkin akan terpengaruh.')">
                                            <i class="fa-solid fa-trash"></i>
                                        </a>
                                    </div>
                                </td>
                            </tr>
                        <?php endwhile; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: mapel.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation