Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

nginx/1.28.0

System:

Linux 6.8.0-90-generic

PHP Version:

8.4.15

User:

alqudsvolunteers

Directory:

/home/avi/htdocs/www.alqudsvolunteers.id/admin

Free Space:

81.75 GB

🔧 Quick Actions

✏️ Editing: group_program.php

<?php
// Include config dan check login
require_once 'config.php';
checkLogin();

// Set title
$title = "Kelola Group Program - Al Quds Volunteers Indonesia";

// Handle AJAX request untuk mengambil foto kategori
if (isset($_GET['action']) && $_GET['action'] == 'get_photos' && isset($_GET['category_id'])) {
    $category_id = intval($_GET['category_id']);
    
    // Query untuk mengambil foto
    $stmt = $conn->prepare("SELECT * FROM category_program_photo WHERE id_category = ? ORDER BY id DESC");
    $stmt->bind_param("i", $category_id);
    $stmt->execute();
    $result = $stmt->get_result();
    
    if ($result->num_rows > 0) {
        while ($photo = $result->fetch_assoc()) {
            $photo_url = 'uploads/category_photos/' . $photo['category_photo'];
            $file_exists = file_exists($photo_url);
            
            echo '
            <div class="relative group">
                <img src="' . $photo_url . '" alt="Category Photo" class="w-full h-32 object-cover rounded-lg border" onerror="this.src=\'https://via.placeholder.com/150/cccccc/969696?text=Image+Not+Found\'">
                <div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-50 transition-all duration-300 rounded-lg flex items-center justify-center opacity-0 group-hover:opacity-100">
                    <button type="button" onclick="deletePhoto(' . $photo['id'] . ', ' . $category_id . ')" class="bg-red-600 text-white p-2 rounded-full hover:bg-red-700">
                        <i class="fas fa-trash text-xs"></i>
                    </button>
                </div>
            </div>';
        }
    } else {
        echo '<p class="text-gray-500 col-span-3 text-center py-4">Belum ada foto untuk kategori ini</p>';
    }
    
    $stmt->close();
    $conn->close();
    exit;
}

// Handle form actions
$message = '';
$message_type = '';

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (isset($_POST['add_category'])) {
        // Tambah kategori baru
        $category_name = trim($_POST['category_name']);
        $category_description = trim($_POST['category_description']);
        
        if (!empty($category_name)) {
            $stmt = $conn->prepare("INSERT INTO category (program_category, description) VALUES (?, ?)");
            $stmt->bind_param("ss", $category_name, $category_description);
            
            if ($stmt->execute()) {
                $category_id = $stmt->insert_id;
                
                // Handle upload foto jika ada
                if (isset($_FILES['category_photos']) && !empty($_FILES['category_photos']['name'][0])) {
                    handlePhotoUpload($category_id, $_FILES['category_photos']);
                }
                
                $message = "Kategori berhasil ditambahkan";
                $message_type = "success";
            } else {
                $message = "Gagal menambahkan kategori: " . $stmt->error;
                $message_type = "error";
            }
            $stmt->close();
        } else {
            $message = "Nama kategori tidak boleh kosong";
            $message_type = "error";
        }
    } elseif (isset($_POST['edit_category'])) {
        // Edit kategori
        $category_id = $_POST['category_id'];
        $category_name = trim($_POST['category_name']);
        $category_description = trim($_POST['category_description']);
        
        if (!empty($category_name)) {
            $stmt = $conn->prepare("UPDATE category SET program_category = ?, description = ? WHERE id = ?");
            $stmt->bind_param("ssi", $category_name, $category_description, $category_id);
            
            if ($stmt->execute()) {
                // Handle upload foto baru jika ada
                if (isset($_FILES['category_photos']) && !empty($_FILES['category_photos']['name'][0])) {
                    handlePhotoUpload($category_id, $_FILES['category_photos']);
                }
                
                $message = "Kategori berhasil diperbarui";
                $message_type = "success";
            } else {
                $message = "Gagal memperbarui kategori: " . $stmt->error;
                $message_type = "error";
            }
            $stmt->close();
        } else {
            $message = "Nama kategori tidak boleh kosong";
            $message_type = "error";
        }
    } elseif (isset($_POST['delete_category'])) {
        // Hapus kategori
        $category_id = $_POST['category_id'];
        
        // Cek apakah kategori digunakan di program
        $possible_columns = ['category_id', 'category', 'program_category', 'category_name'];
        $program_count = 0;
        
        foreach ($possible_columns as $column) {
            $check_stmt = $conn->prepare("SELECT COUNT(*) FROM information_schema.columns 
                                        WHERE table_name = 'program' AND column_name = ?");
            $check_stmt->bind_param("s", $column);
            $check_stmt->execute();
            $check_stmt->bind_result($column_exists);
            $check_stmt->fetch();
            $check_stmt->close();
            
            if ($column_exists) {
                $check_stmt = $conn->prepare("SELECT COUNT(*) FROM program WHERE $column = ?");
                $check_stmt->bind_param("i", $category_id);
                $check_stmt->execute();
                $check_stmt->bind_result($program_count);
                $check_stmt->fetch();
                $check_stmt->close();
                break;
            }
        }
        
        if ($program_count > 0) {
            $message = "Tidak dapat menghapus kategori karena masih digunakan oleh $program_count program";
            $message_type = "error";
        } else {
            // Hapus foto-foto terkait kategori
            $delete_photos_stmt = $conn->prepare("SELECT category_photo FROM category_program_photo WHERE id_category = ?");
            $delete_photos_stmt->bind_param("i", $category_id);
            $delete_photos_stmt->execute();
            $photos_result = $delete_photos_stmt->get_result();
            
            while ($photo = $photos_result->fetch_assoc()) {
                $file_path = 'uploads/category_photos/' . $photo['category_photo'];
                if (file_exists($file_path)) {
                    unlink($file_path);
                }
            }
            $delete_photos_stmt->close();
            
            // Hapus dari database
            $stmt = $conn->prepare("DELETE FROM category_program_photo WHERE id_category = ?");
            $stmt->bind_param("i", $category_id);
            $stmt->execute();
            $stmt->close();
            
            // Hapus kategori
            $stmt = $conn->prepare("DELETE FROM category WHERE id = ?");
            $stmt->bind_param("i", $category_id);
            
            if ($stmt->execute()) {
                $message = "Kategori berhasil dihapus";
                $message_type = "success";
            } else {
                $message = "Gagal menghapus kategori: " . $stmt->error;
                $message_type = "error";
            }
            $stmt->close();
        }
    } elseif (isset($_POST['delete_photo'])) {
        // Hapus foto individual
        $photo_id = $_POST['photo_id'];
        
        // Ambil informasi foto sebelum dihapus
        $stmt = $conn->prepare("SELECT category_photo FROM category_program_photo WHERE id = ?");
        $stmt->bind_param("i", $photo_id);
        $stmt->execute();
        $stmt->bind_result($filename);
        $stmt->fetch();
        $stmt->close();
        
        // Hapus dari database
        $delete_stmt = $conn->prepare("DELETE FROM category_program_photo WHERE id = ?");
        $delete_stmt->bind_param("i", $photo_id);
        
        if ($delete_stmt->execute()) {
            // Hapus file fisik
            $file_path = 'uploads/category_photos/' . $filename;
            if (file_exists($file_path)) {
                unlink($file_path);
            }
            $message = "Foto berhasil dihapus";
            $message_type = "success";
        } else {
            $message = "Gagal menghapus foto: " . $delete_stmt->error;
            $message_type = "error";
        }
        $delete_stmt->close();
    }
}

// Fungsi untuk handle upload foto
function handlePhotoUpload($category_id, $files) {
    global $conn;
    
    $upload_dir = 'uploads/category_photos/';
    
    // Buat direktori jika belum ada
    if (!is_dir($upload_dir)) {
        mkdir($upload_dir, 0777, true);
    }
    
    // Loop melalui semua file yang diupload
    for ($i = 0; $i < count($files['name']); $i++) {
        if ($files['error'][$i] === UPLOAD_ERR_OK) {
            $file_extension = strtolower(pathinfo($files['name'][$i], PATHINFO_EXTENSION));
            $allowed_extensions = ['jpg', 'jpeg', 'png', 'gif', 'webp'];
            
            if (in_array($file_extension, $allowed_extensions)) {
                // Generate nama file unik
                $new_filename = uniqid() . '_' . time() . '_' . $i . '.' . $file_extension;
                $file_path = $upload_dir . $new_filename;
                
                // Pindahkan file tanpa kompresi (karena GD tidak tersedia)
                if (move_uploaded_file($files['tmp_name'][$i], $file_path)) {
                    // Simpan ke database
                    $stmt = $conn->prepare("INSERT INTO category_program_photo (id_category, category_photo) VALUES (?, ?)");
                    $stmt->bind_param("is", $category_id, $new_filename);
                    $stmt->execute();
                    $stmt->close();
                }
            }
        }
    }
}

// Ambil data kategori
$categories = [];
$result = $conn->query("SELECT * FROM category ORDER BY id DESC");
if ($result && $result->num_rows > 0) {
    while ($row = $result->fetch_assoc()) {
        $categories[] = $row;
    }
}

// Ambil foto untuk setiap kategori
$category_photos = [];
foreach ($categories as $category) {
    $category_id = $category['id'];
    $photos_result = $conn->query("SELECT * FROM category_program_photo WHERE id_category = $category_id ORDER BY id DESC");
    $photos = [];
    if ($photos_result && $photos_result->num_rows > 0) {
        while ($photo = $photos_result->fetch_assoc()) {
            $photos[] = $photo;
        }
    }
    $category_photos[$category_id] = $photos;
}
?>

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $title; ?></title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-100">
    <div class="flex">
        
        <?php include 'sidebar.php'; ?>
        
        
        <div class="flex-1 p-6">
            <div class="max-w-6xl mx-auto">
                <div class="flex justify-between items-center mb-6">
                    <h1 class="text-2xl font-bold text-gray-800">Kelola Group Program</h1>
                    <button id="addCategoryBtn" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center">
                        <i class="fas fa-plus mr-2"></i> Tambah Kategori
                    </button>
                </div>
                
                
                <?php if (!empty($message)): ?>
                <div class="mb-4 p-4 rounded-lg <?php echo $message_type == 'success' ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'; ?>">
                    <?php echo $message; ?>
                </div>
                <?php endif; ?>
                
                
                <div class="bg-white rounded-lg shadow overflow-hidden">
                    <table class="min-w-full divide-y divide-gray-200">
                        <thead class="bg-gray-50">
                            <tr>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nama Kategori</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Deskripsi</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Jumlah Foto</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Aksi</th>
                            </tr>
                        </thead>
                        <tbody class="bg-white divide-y divide-gray-200">
                            <?php if (empty($categories)): ?>
                            <tr>
                                <td colspan="5" class="px-6 py-4 text-center text-gray-500">Belum ada data kategori</td>
                            </tr>
                            <?php else: ?>
                            <?php foreach ($categories as $category): ?>
                            <?php 
                                $category_id = $category['id'];
                                $photo_count = isset($category_photos[$category_id]) ? count($category_photos[$category_id]) : 0;
                                $description = $category['description'] ?? '';
                                $short_description = strlen($description) > 100 ? substr($description, 0, 100) . '...' : $description;
                            ?>
                            <tr>
                                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"><?php echo $category['id']; ?></td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900"><?php echo htmlspecialchars($category['program_category']); ?></td>
                                <td class="px-6 py-4 text-sm text-gray-500">
                                    <?php if (!empty($description)): ?>
                                        <span title="<?php echo htmlspecialchars($description); ?>">
                                            <?php echo htmlspecialchars($short_description); ?>
                                        </span>
                                    <?php else: ?>
                                        <span class="text-gray-400">-</span>
                                    <?php endif; ?>
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                                    <?php echo $photo_count; ?> foto
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
                                    <button onclick="editCategory(<?php echo $category['id']; ?>, '<?php echo htmlspecialchars($category['program_category']); ?>', `<?php echo htmlspecialchars($description); ?>`)" class="text-indigo-600 hover:text-indigo-900 mr-3">
                                        <i class="fas fa-edit"></i> Edit
                                    </button>
                                    <button onclick="deleteCategory(<?php echo $category['id']; ?>, '<?php echo htmlspecialchars($category['program_category']); ?>')" class="text-red-600 hover:text-red-900">
                                        <i class="fas fa-trash"></i> Hapus
                                    </button>
                                </td>
                            </tr>
                            <?php endforeach; ?>
                            <?php endif; ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    
    
    <div id="categoryModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden z-50">
        <div class="bg-white rounded-lg shadow-xl w-full max-w-2xl mx-4 max-h-[90vh] overflow-hidden">
            <div class="px-6 py-4 border-b">
                <h3 id="modalTitle" class="text-lg font-medium text-gray-900">Tambah Kategori Program</h3>
            </div>
            <form id="categoryForm" method="POST" enctype="multipart/form-data" class="overflow-y-auto max-h-[70vh]">
                <div class="px-6 py-4">
                    <input type="hidden" id="category_id" name="category_id" value="">
                    <div class="mb-4">
                        <label for="category_name" class="block text-sm font-medium text-gray-700 mb-1">Nama Kategori <span class="text-red-500">*</span></label>
                        <input type="text" id="category_name" name="category_name" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                    </div>
                    
                    <div class="mb-4">
                        <label for="category_description" class="block text-sm font-medium text-gray-700 mb-1">Deskripsi Kategori</label>
                        <textarea id="category_description" name="category_description" rows="4" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Masukkan deskripsi kategori program..."></textarea>
                        <p class="text-xs text-gray-500 mt-1">Deskripsi opsional untuk memberikan informasi lebih detail tentang kategori program.</p>
                    </div>
                    
                    <div class="mb-4">
                        <label for="category_photos" class="block text-sm font-medium text-gray-700 mb-1">Upload Foto</label>
                        <input type="file" id="category_photos" name="category_photos[]" multiple accept="image/*" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                        <p class="text-xs text-gray-500 mt-1">Pilih satu atau beberapa foto (JPG, JPEG, PNG, GIF, WebP). Bisa memilih multiple file.</p>
                    </div>
                    
                    
                    <div id="existingPhotosSection" class="mb-4 hidden">
                        <label class="block text-sm font-medium text-gray-700 mb-2">Foto Saat Ini</label>
                        <div id="existingPhotos" class="grid grid-cols-2 md:grid-cols-3 gap-4">
                            
                        </div>
                    </div>
                </div>
                <div class="px-6 py-4 border-t bg-gray-50 flex justify-end space-x-3">
                    <button type="button" id="cancelBtn" class="px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500">
                        Batal
                    </button>
                    <button type="submit" id="submitBtn" name="add_category" class="px-4 py-2 text-sm font-medium text-white bg-blue-600 border border-transparent rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
                        Simpan
                    </button>
                </div>
            </form>
        </div>
    </div>
    
    
    <div id="deleteModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden z-50">
        <div class="bg-white rounded-lg shadow-xl w-full max-w-md mx-4">
            <div class="px-6 py-4 border-b">
                <h3 class="text-lg font-medium text-gray-900">Konfirmasi Hapus</h3>
            </div>
            <div class="px-6 py-4">
                <p id="deleteMessage" class="text-gray-700">Apakah Anda yakin ingin menghapus kategori ini?</p>
            </div>
            <div class="px-6 py-4 border-t bg-gray-50 flex justify-end space-x-3">
                <button type="button" id="cancelDeleteBtn" class="px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500">
                    Batal
                </button>
                <form id="deleteForm" method="POST">
                    <input type="hidden" id="delete_category_id" name="category_id" value="">
                    <button type="submit" name="delete_category" class="px-4 py-2 text-sm font-medium text-white bg-red-600 border border-transparent rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500">
                        Hapus
                    </button>
                </form>
            </div>
        </div>
    </div>
    
    <script>
        // Modal elements
        const categoryModal = document.getElementById('categoryModal');
        const deleteModal = document.getElementById('deleteModal');
        const addCategoryBtn = document.getElementById('addCategoryBtn');
        const cancelBtn = document.getElementById('cancelBtn');
        const cancelDeleteBtn = document.getElementById('cancelDeleteBtn');
        const modalTitle = document.getElementById('modalTitle');
        const categoryForm = document.getElementById('categoryForm');
        const categoryIdInput = document.getElementById('category_id');
        const categoryNameInput = document.getElementById('category_name');
        const categoryDescriptionInput = document.getElementById('category_description');
        const submitBtn = document.getElementById('submitBtn');
        const deleteForm = document.getElementById('deleteForm');
        const deleteCategoryIdInput = document.getElementById('delete_category_id');
        const deleteMessage = document.getElementById('deleteMessage');
        const existingPhotosSection = document.getElementById('existingPhotosSection');
        const existingPhotos = document.getElementById('existingPhotos');
        
        // Show add category modal
        addCategoryBtn.addEventListener('click', () => {
            modalTitle.textContent = 'Tambah Kategori Program';
            categoryIdInput.value = '';
            categoryNameInput.value = '';
            categoryDescriptionInput.value = '';
            submitBtn.name = 'add_category';
            submitBtn.textContent = 'Simpan';
            existingPhotosSection.classList.add('hidden');
            categoryModal.classList.remove('hidden');
        });
        
        // Edit category function
        function editCategory(id, name, description) {
            modalTitle.textContent = 'Edit Kategori Program';
            categoryIdInput.value = id;
            categoryNameInput.value = name;
            categoryDescriptionInput.value = description;
            submitBtn.name = 'edit_category';
            submitBtn.textContent = 'Perbarui';
            
            // Load existing photos
            loadExistingPhotos(id);
            
            categoryModal.classList.remove('hidden');
        }
        
        // Load existing photos - FIXED VERSION
        function loadExistingPhotos(categoryId) {
            // Show loading
            existingPhotos.innerHTML = '<div class="col-span-3 text-center py-4"><div class="inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div><p class="text-gray-500 mt-2">Memuat foto...</p></div>';
            existingPhotosSection.classList.remove('hidden');
            
            // Use AJAX request to current page with action parameter
            const xhr = new XMLHttpRequest();
            xhr.open('GET', 'group_program.php?action=get_photos&category_id=' + categoryId, true);
            
            xhr.onload = function() {
                if (xhr.status === 200) {
                    existingPhotos.innerHTML = xhr.responseText;
                    if (existingPhotos.innerHTML.trim() === '') {
                        existingPhotos.innerHTML = '<p class="text-gray-500 col-span-3 text-center py-4">Belum ada foto untuk kategori ini</p>';
                    }
                } else {
                    existingPhotos.innerHTML = '<p class="text-red-500 col-span-3 text-center py-4">Gagal memuat foto. Status: ' + xhr.status + '</p>';
                }
            };
            
            xhr.onerror = function() {
                existingPhotos.innerHTML = '<p class="text-red-500 col-span-3 text-center py-4">Gagal memuat foto. Periksa koneksi internet Anda.</p>';
            };
            
            xhr.send();
        }
        
        // Delete category function
        function deleteCategory(id, name) {
            deleteMessage.textContent = `Apakah Anda yakin ingin menghapus kategori "${name}"? Semua foto yang terkait juga akan dihapus.`;
            deleteCategoryIdInput.value = id;
            deleteModal.classList.remove('hidden');
        }
        
        // Delete photo function
        function deletePhoto(photoId, categoryId) {
            if (confirm('Apakah Anda yakin ingin menghapus foto ini?')) {
                // Create form and submit
                const form = document.createElement('form');
                form.method = 'POST';
                form.action = '';
                
                const photoIdInput = document.createElement('input');
                photoIdInput.type = 'hidden';
                photoIdInput.name = 'photo_id';
                photoIdInput.value = photoId;
                
                const submitInput = document.createElement('input');
                submitInput.type = 'hidden';
                submitInput.name = 'delete_photo';
                submitInput.value = '1';
                
                form.appendChild(photoIdInput);
                form.appendChild(submitInput);
                document.body.appendChild(form);
                form.submit();
            }
        }
        
        // Close modals
        cancelBtn.addEventListener('click', () => {
            categoryModal.classList.add('hidden');
        });
        
        cancelDeleteBtn.addEventListener('click', () => {
            deleteModal.classList.add('hidden');
        });
        
        // Close modals when clicking outside
        window.addEventListener('click', (e) => {
            if (e.target === categoryModal) {
                categoryModal.classList.add('hidden');
            }
            if (e.target === deleteModal) {
                deleteModal.classList.add('hidden');
            }
        });
    </script>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: group_program.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation