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/ponpes/admin

Free Space:

9.88 TB

🔧 Quick Actions

✏️ Editing: kelola_kontak.php

<?php
require_once '../includes/config.php';
require_once '../includes/functions.php';
require_once '../includes/email_config.php';
require_once '../includes/email_function.php';

// Cek login
if (!is_logged_in()) {
    redirect('../login.php');
}

// Pastikan koneksi database tersedia
if (!isset($conn) || !$conn) {
    $_SESSION['error'] = "Koneksi database gagal.";
    redirect('dashboard.php');
}

// Set jumlah data per halaman
 $limit = 10;

// Ambil halaman saat ini
 $page = isset($_GET['page']) ? (int)$_GET['page'] : 1;
 $offset = ($page - 1) * $limit;

// Query untuk menghitung total data
 $count_query = "SELECT COUNT(*) as total FROM kontak";
 $count_result = mysqli_query($conn, $count_query);
 $total_data = mysqli_fetch_assoc($count_result)['total'];
 $total_pages = ceil($total_data / $limit);

// Pencarian
 $search = isset($_GET['search']) ? mysqli_real_escape_string($conn, $_GET['search']) : '';
 $search_query = '';
if (!empty($search)) {
    $search_query = "WHERE nama LIKE '%$search%' OR email LIKE '%$search%' OR subjek LIKE '%$search%' OR pesan LIKE '%$search%'";
}

// Proses aksi
if (isset($_GET['aksi'])) {
    $aksi = $_GET['aksi'];
    $id = isset($_GET['id']) ? (int)$_GET['id'] : 0;
    
    if ($aksi == 'hapus') {
        // Validasi ID
        if ($id <= 0) {
            $_SESSION['error'] = "ID pesan tidak valid.";
            redirect('kelola_kontak.php');
        }
        
        // Hapus data menggunakan prepared statement
        $stmt = mysqli_prepare($conn, "DELETE FROM kontak WHERE id = ?");
        mysqli_stmt_bind_param($stmt, "i", $id);
        
        if (mysqli_stmt_execute($stmt)) {
            $_SESSION['success'] = "Pesan berhasil dihapus.";
        } else {
            $_SESSION['error'] = "Gagal menghapus pesan: " . mysqli_error($conn);
        }
        
        mysqli_stmt_close($stmt);
        redirect('kelola_kontak.php');
    } elseif ($aksi == 'baca') {
        // Validasi ID
        if ($id <= 0) {
            $_SESSION['error'] = "ID pesan tidak valid.";
            redirect('kelola_kontak.php');
        }
        
        // Update status menjadi dibaca
        $stmt = mysqli_prepare($conn, "UPDATE kontak SET status = 'dibaca' WHERE id = ?");
        mysqli_stmt_bind_param($stmt, "i", $id);
        
        if (mysqli_stmt_execute($stmt)) {
            $_SESSION['success'] = "Status pesan berhasil diperbarui.";
        } else {
            $_SESSION['error'] = "Gagal memperbarui status pesan: " . mysqli_error($conn);
        }
        
        mysqli_stmt_close($stmt);
        redirect('kelola_kontak.php');
    }
}

// Proses balas pesan
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['balas'])) {
    $id_kontak = (int)$_POST['id_kontak'];
    $balasan = mysqli_real_escape_string($conn, $_POST['balasan']);
    
    if (empty($balasan)) {
        $_SESSION['error'] = "Balasan tidak boleh kosong.";
        redirect("kelola_kontak.php?aksi=detail&id=$id_kontak");
    }
    
    // Ambil data pesan asli
    $stmt = mysqli_prepare($conn, "SELECT * FROM kontak WHERE id = ?");
    mysqli_stmt_bind_param($stmt, "i", $id_kontak);
    mysqli_stmt_execute($stmt);
    $result = mysqli_stmt_get_result($stmt);
    $pesan_asli = mysqli_fetch_assoc($result);
    mysqli_stmt_close($stmt);
    
    if (!$pesan_asli) {
        $_SESSION['error'] = "Pesan tidak ditemukan.";
        redirect('kelola_kontak.php');
    }
    
    // Simpan balasan ke database
    $stmt = mysqli_prepare($conn, "INSERT INTO kontak_balasan (id_kontak, id_admin, balasan) VALUES (?, ?, ?)");
    $id_admin = $_SESSION['admin']['id_admin'];
    mysqli_stmt_bind_param($stmt, "iis", $id_kontak, $id_admin, $balasan);
    
    if (mysqli_stmt_execute($stmt)) {
        // Update status pesan menjadi dibalas
        $update_stmt = mysqli_prepare($conn, "UPDATE kontak SET status = 'dibalas' WHERE id = ?");
        mysqli_stmt_bind_param($update_stmt, "i", $id_kontak);
        mysqli_stmt_execute($update_stmt);
        mysqli_stmt_close($update_stmt);
        
        // Kirim email ke pengguna
        $email_subject = "Balasan: " . $pesan_asli['subjek'];
        
        // Buat template email
        $email_body = "
        <!DOCTYPE html>
        <html>
        <head>
            <meta charset='UTF-8'>
            <title>Balasan Pesan</title>
            <style>
                body {
                    font-family: Arial, sans-serif;
                    line-height: 1.6;
                    color: #333;
                    max-width: 600px;
                    margin: 0 auto;
                    padding: 20px;
                }
                .header {
                    background-color: #0d6efd;
                    color: white;
                    padding: 20px;
                    text-align: center;
                    border-radius: 5px 5px 0 0;
                }
                .content {
                    background-color: #f9f9f9;
                    padding: 20px;
                    border: 1px solid #ddd;
                    border-top: none;
                    border-radius: 0 0 5px 5px;
                }
                .pesan-asli {
                    background-color: #f1f1f1;
                    padding: 15px;
                    border-left: 4px solid #0d6efd;
                    margin-bottom: 20px;
                }
                .balasan {
                    background-color: #e9f7fe;
                    padding: 15px;
                    border-left: 4px solid #28a745;
                }
                .footer {
                    margin-top: 20px;
                    font-size: 12px;
                    color: #777;
                    text-align: center;
                }
            </style>
        </head>
        <body>
            <div class='header'>
                <h2>Pondok Pesantren Al-Hikmah</h2>
                <p>Balasan Pesan Kontak</p>
            </div>
            <div class='content'>
                <p>Yth. Bapak/Ibu " . htmlspecialchars($pesan_asli['nama']) . ",</p>
                <p>Terima kasih telah menghubungi kami. Berikut adalah balasan untuk pesan Anda:</p>
                
                <div class='pesan-asli'>
                    <h4>Pesan Anda:</h4>
                    <p><strong>Subjek:</strong> " . htmlspecialchars($pesan_asli['subjek']) . "</p>
                    <p><strong>Tanggal:</strong> " . date('d/m/Y H:i', strtotime($pesan_asli['tanggal'])) . "</p>
                    <p><strong>Pesan:</strong></p>
                    <p>" . nl2br(htmlspecialchars($pesan_asli['pesan'])) . "</p>
                </div>
                
                <div class='balasan'>
                    <h4>Balasan Kami:</h4>
                    <p>" . nl2br(htmlspecialchars($balasan)) . "</p>
                </div>
                
                <p>Jika Anda memiliki pertanyaan lebih lanjut, jangan ragu untuk menghubungi kami kembali.</p>
                
                <div class='footer'>
                    <p>&copy; " . date('Y') . " Pondok Pesantren Al-Hikmah. All rights reserved.</p>
                    <p>Jl. Contoh No. 123, Kota, Provinsi, Indonesia</p>
                    <p>Email: info@ponpes-alhikmah.ac.id | Telepon: (0123) 456-789</p>
                </div>
            </div>
        </body>
        </html>
        ";
        
        // Kirim email
        $email_sent = sendEmail($pesan_asli['email'], $email_subject, $email_body, $pesan_asli['nama']);
        
        if ($email_sent === true) {
            $_SESSION['success'] = "Balasan berhasil dikirim dan email telah terkirim ke pengguna.";
        } else {
            $_SESSION['warning'] = "Balasan berhasil disimpan, tetapi gagal mengirim email: " . $email_sent;
        }
    } else {
        $_SESSION['error'] = "Gagal mengirim balasan: " . mysqli_error($conn);
    }
    
    mysqli_stmt_close($stmt);
    redirect("kelola_kontak.php?aksi=detail&id=$id_kontak");
}

// Get data untuk detail
 $detail_data = null;
if (isset($_GET['aksi']) && $_GET['aksi'] == 'detail' && isset($_GET['id'])) {
    $id = (int)$_GET['id'];
    if ($id > 0) {
        $stmt = mysqli_prepare($conn, "SELECT * FROM kontak WHERE id = ?");
        mysqli_stmt_bind_param($stmt, "i", $id);
        mysqli_stmt_execute($stmt);
        $result = mysqli_stmt_get_result($stmt);
        
        if (mysqli_num_rows($result) == 1) {
            $detail_data = mysqli_fetch_assoc($result);
            
            // Update status menjadi dibaca
            $update_stmt = mysqli_prepare($conn, "UPDATE kontak SET status = 'dibaca' WHERE id = ?");
            mysqli_stmt_bind_param($update_stmt, "i", $id);
            mysqli_stmt_execute($update_stmt);
            mysqli_stmt_close($update_stmt);
            
            // Get balasan if any
            $balas_stmt = mysqli_prepare($conn, "SELECT kb.*, a.nama_admin FROM kontak_balasan kb JOIN admin a ON kb.id_admin = a.id_admin WHERE kb.id_kontak = ? ORDER BY kb.tanggal_balas DESC");
            mysqli_stmt_bind_param($balas_stmt, "i", $id);
            mysqli_stmt_execute($balas_stmt);
            $balas_result = mysqli_stmt_get_result($balas_stmt);
            $detail_data['balasan'] = [];
            while ($row = mysqli_fetch_assoc($balas_result)) {
                $detail_data['balasan'][] = $row;
            }
            mysqli_stmt_close($balas_stmt);
        }
        
        mysqli_stmt_close($stmt);
    }
}

// Get data pesan dengan pencarian dan pagination
 $query = "SELECT * FROM kontak $search_query ORDER BY tanggal DESC LIMIT $limit OFFSET $offset";
 $result = mysqli_query($conn, $query);
 $kontaks = [];
if ($result) {
    while ($row = mysqli_fetch_assoc($result)) {
        $kontaks[] = $row;
    }
    mysqli_free_result($result);
}
?>

<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Kelola Kontak</title>
    
    
    <link rel="stylesheet" href="../assets/css/bootstrap.min.css">
    
    
    <link rel="stylesheet" href="../assets/css/style.css">
    
    
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    
    
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
    
    
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/dataTables.bootstrap5.min.css">
    
    
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
    
    <style>
        /* Reset dan Base Styles */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        html, body {
            height: 100%;
            font-family: 'Poppins', sans-serif;
            overflow-x: hidden;
        }
        
        /* Navbar Fixed Top */
        .sb-topnav {
            position: fixed !important;
            top: 0;
            left: 0;
            right: 0;
            z-index: 1039;
            height: 56px;
        }
        
        /* Main Layout Container */
        #layoutSidenav {
            display: flex;
            min-height: 100vh;
            padding-top: 56px; /* Height of navbar */
        }
        
        /* Sidebar Full Height */
        #layoutSidenav_nav {
            flex: 0 0 250px;
            position: fixed !important;
            top: 56px; /* Same as navbar height */
            left: 0;
            bottom: 0;
            width: 250px;
            height: calc(100vh - 56px);
            z-index: 1038;
            transition: all 0.3s ease;
            overflow-y: auto;
        }
        
        /* Main Content Area */
        #layoutSidenav_content {
            flex: 1;
            margin-left: 250px;
            min-height: calc(100vh - 56px);
            transition: all 0.3s ease;
            overflow-y: auto;
        }
        
        /* Sidebar Toggle State */
        body.sb-sidenav-toggled #layoutSidenav_nav {
            width: 0;
            overflow: hidden;
        }
        
        body.sb-sidenav-toggled #layoutSidenav_content {
            margin-left: 0;
        }
        
        /* Sidenav Styles */
        .sb-sidenav {
            background-color: #212529;
            height: 100%;
        }
        
        .sb-sidenav .sb-sidenav-menu {
            flex-grow: 1;
            height: 100%;
        }
        
        .sb-sidenav .nav {
            flex-direction: column;
            flex-wrap: nowrap;
            padding-bottom: 2rem; /* Extra padding at bottom */
        }
        
        .sb-sidenav .nav .nav-link {
            display: flex;
            align-items: center;
            padding-top: 0.75rem;
            padding-bottom: 0.75rem;
            position: relative;
            color: rgba(255, 255, 255, 0.8);
            transition: all 0.2s ease;
        }
        
        .sb-sidenav .nav .nav-link:hover {
            color: #fff;
            background-color: rgba(255, 255, 255, 0.1);
            padding-left: 1.5rem;
        }
        
        .sb-sidenav .nav .nav-link.active {
            color: #fff;
            background-color: #0d6efd;
        }
        
        .sb-sidenav .sb-sidenav-menu-heading {
            padding: 1.75rem 1rem 0.75rem;
            font-size: 0.75rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: rgba(255, 255, 255, 0.5);
        }
        
        .sb-nav-link-icon {
            font-size: 0.9rem;
            margin-right: 0.5rem;
            width: 20px;
            text-align: center;
        }
        
        /* Main Content Styles */
        main {
            padding-bottom: 2rem;
        }
        
        /* Card Styles */
        .card {
            box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15);
            border: 1px solid #e3e6f0;
            transition: transform 0.2s ease;
        }
        
        .card:hover {
            transform: translateY(-2px);
        }
        
        .card-header {
            background-color: #f8f9fc;
            border-bottom: 1px solid #e3e6f0;
            font-weight: 600;
        }
        
        /* Table Styles */
        .table-responsive {
            border-radius: 0.35rem;
        }
        
        .table th {
            border-top: none;
            font-weight: 600;
            font-size: 0.85rem;
            color: #5a5c69;
            background-color: #f8f9fc;
        }
        
        .table td {
            vertical-align: middle;
        }
        
        /* Footer */
        footer {
            background-color: #f8f9fc;
            border-top: 1px solid #e3e6f0;
            margin-top: auto;
        }
        
        /* Responsive */
        @media (max-width: 768px) {
            #layoutSidenav_nav {
                width: 0;
                overflow: hidden;
            }
            
            #layoutSidenav_content {
                margin-left: 0;
            }
            
            body.sb-sidenav-toggled #layoutSidenav_nav {
                width: 250px;
            }
            
            body.sb-sidenav-toggled #layoutSidenav_content {
                margin-left: 250px;
            }
        }
        
        /* Scrollbar Styles */
        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }
        
        ::-webkit-scrollbar-track {
            background: #f1f1f1;
        }
        
        ::-webkit-scrollbar-thumb {
            background: #888;
            border-radius: 4px;
        }
        
        ::-webkit-scrollbar-thumb:hover {
            background: #555;
        }
        
        /* Button Styles */
        .btn-sm {
            padding: 0.25rem 0.5rem;
            font-size: 0.875rem;
        }
        
        /* Breadcrumb Styles */
        .breadcrumb {
            background-color: transparent;
            padding: 0;
            margin-bottom: 1rem;
        }
        
        .breadcrumb-item {
            font-size: 0.875rem;
        }
        
        /* Status Badge */
        .badge {
            font-size: 0.75rem;
        }
        
        /* DataTables Custom Styles */
        .dataTables_wrapper .dataTables_length {
            margin-bottom: 1rem;
        }
        
        .dataTables_wrapper .dataTables_filter {
            margin-bottom: 1rem;
        }
        
        .dataTables_wrapper .dataTables_info {
            margin-top: 1rem;
        }
        
        .dataTables_wrapper .dataTables_paginate {
            margin-top: 1rem;
        }
        
        /* Custom button group */
        .btn-action {
            padding: 0.25rem 0.5rem;
            font-size: 0.8rem;
            margin-right: 0.2rem;
        }
        
        /* Balasan Styles */
        .balasan-container {
            background-color: #f8f9fc;
            border-radius: 0.35rem;
            padding: 1rem;
            margin-bottom: 1rem;
        }
        
        .balasan-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 0.5rem;
        }
        
        .balasan-content {
            border-left: 3px solid #0d6efd;
            padding-left: 1rem;
        }
        
        .balasan-form {
            background-color: #f8f9fc;
            border-radius: 0.35rem;
            padding: 1rem;
            margin-top: 1rem;
        }
        
        /* Email Preview */
        .email-preview {
            border: 1px solid #ddd;
            border-radius: 5px;
            margin-top: 15px;
            overflow: hidden;
        }
        
        .email-preview-header {
            background-color: #f1f1f1;
            padding: 10px 15px;
            border-bottom: 1px solid #ddd;
            font-size: 14px;
        }
        
        .email-preview-body {
            padding: 15px;
            max-height: 300px;
            overflow-y: auto;
        }
        
        /* Search Form */
        .search-form {
            margin-bottom: 1rem;
        }
    </style>
</head>
<body class="sb-nav-fixed">
    
    <nav class="sb-topnav navbar navbar-expand navbar-dark bg-success">
        <a class="navbar-brand ps-3" href="dashboard.php">
            <i class="fas fa-mosque"></i> Pondok Pesantren Admin
        </a>
        <button class="btn btn-link btn-sm order-1 order-lg-0 me-4 me-lg-0" id="sidebarToggle">
            <i class="bi bi-list"></i>
        </button>
        <form class="d-none d-md-inline-block form-inline ms-auto me-0 me-md-3 my-2 my-md-0">
            <div class="input-group">
                <input class="form-control" type="text" placeholder="Cari..." aria-label="Cari" aria-describedby="btnNavbarSearch" />
                <button class="btn btn-primary" id="btnNavbarSearch" type="button">
                    <i class="bi bi-search"></i>
                </button>
            </div>
        </form>
        <ul class="navbar-nav ms-auto ms-md-0 me-3 me-lg-4">
            <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" id="navbarDropdown" href="#" role="button" data-bs-toggle="dropdown">
                    <i class="bi bi-person-circle fs-5"></i> <?= htmlspecialchars($_SESSION['admin']['nama_admin']) ?>
                </a>
                <ul class="dropdown-menu dropdown-menu-end">
                    <li><a class="dropdown-item" href="#"><i class="bi bi-person me-2"></i>Profil</a></li>
                    <li><a class="dropdown-item" href="#"><i class="bi bi-gear me-2"></i>Pengaturan</a></li>
                    <li><hr class="dropdown-divider" /></li>
                    <li><a class="dropdown-item" href="logout.php"><i class="bi bi-box-arrow-right me-2"></i>Logout</a></li>
                </ul>
            </li>
        </ul>
    </nav>
    
    <div id="layoutSidenav">
        <div id="layoutSidenav_nav">
            <nav class="sb-sidenav accordion sb-sidenav-dark" id="sidenavAccordion">
                <div class="sb-sidenav-menu">
                    <div class="nav">
                        <div class="sb-sidenav-menu-heading">Core</div>
                        <a class="nav-link" href="dashboard.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-speedometer2"></i></div>
                            Dashboard
                        </a>
                        
                        <div class="sb-sidenav-menu-heading">Management</div>
                        <a class="nav-link" href="kelola_profil.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-building"></i></div>
                            Kelola Profil
                        </a>
                        <a class="nav-link" href="kelola_kegiatan.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-calendar-event"></i></div>
                            Kelola Kegiatan
                        </a>
                        <a class="nav-link" href="kelola_galeri.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-images"></i></div>
                            Kelola Galeri
                        </a>
                        <a class="nav-link" href="kelola_santri.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-people"></i></div>
                            Kelola Santri
                        </a>
                        <a class="nav-link" href="kelola_admin.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-person-badge"></i></div>
                            Kelola Admin
                        </a>
                        <a class="nav-link active" href="kelola_kontak.php">
                            <div class="sb-nav-link-icon"><i class="bi bi-envelope"></i></div>
                            Kelola Kontak
                            <?php 
                                // Hitung pesan baru
                                $count_query = "SELECT COUNT(*) as total FROM kontak WHERE status = 'baru'";
                                $count_result = mysqli_query($conn, $count_query);
                                $count_new = mysqli_fetch_assoc($count_result)['total'];
                                if ($count_new > 0) {
                                    echo '<span class="badge bg-danger float-end">' . $count_new . '</span>';
                                }
                            ?>
                        </a>
                    </div>
                </div>
            </nav>
        </div>
        
        <div id="layoutSidenav_content">
            <main>
                <div class="container-fluid px-4">
                    <h1 class="mt-4">Kelola Kontak</h1>
                    <ol class="breadcrumb mb-4">
                        <li class="breadcrumb-item"><a href="dashboard.php">Dashboard</a></li>
                        <li class="breadcrumb-item active">Kelola Kontak</li>
                    </ol>
                    
                    <?php if (isset($_SESSION['success'])): ?>
                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                            <i class="bi bi-check-circle-fill me-2"></i><?= htmlspecialchars($_SESSION['success']) ?>
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                        <?php unset($_SESSION['success']); ?>
                    <?php endif; ?>
                    
                    <?php if (isset($_SESSION['warning'])): ?>
                        <div class="alert alert-warning alert-dismissible fade show" role="alert">
                            <i class="bi bi-exclamation-triangle-fill me-2"></i><?= htmlspecialchars($_SESSION['warning']) ?>
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                        <?php unset($_SESSION['warning']); ?>
                    <?php endif; ?>
                    
                    <?php if (isset($_SESSION['error'])): ?>
                        <div class="alert alert-danger alert-dismissible fade show" role="alert">
                            <i class="bi bi-exclamation-triangle-fill me-2"></i><?= htmlspecialchars($_SESSION['error']) ?>
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                        <?php unset($_SESSION['error']); ?>
                    <?php endif; ?>
                    
                    <?php if ($detail_data): ?>
                        
                        <div class="card mb-4">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h5 class="mb-0">Detail Pesan</h5>
                                <a href="kelola_kontak.php" class="btn btn-sm btn-secondary">
                                    <i class="bi bi-arrow-left me-1"></i> Kembali
                                </a>
                            </div>
                            <div class="card-body">
                                <div class="row mb-3">
                                    <div class="col-md-6">
                                        <p><strong>Nama:</strong> <?= htmlspecialchars($detail_data['nama']) ?></p>
                                        <p><strong>Email:</strong> <?= htmlspecialchars($detail_data['email']) ?></p>
                                        <p><strong>Subjek:</strong> <?= htmlspecialchars($detail_data['subjek']) ?></p>
                                    </div>
                                    <div class="col-md-6">
                                        <p><strong>Tanggal:</strong> <?= date('d/m/Y H:i', strtotime($detail_data['tanggal'])) ?></p>
                                        <p><strong>Status:</strong> 
                                            <?php if ($detail_data['status'] == 'baru'): ?>
                                                <span class="badge bg-primary">Baru</span>
                                            <?php elseif ($detail_data['status'] == 'dibaca'): ?>
                                                <span class="badge bg-info">Dibaca</span>
                                            <?php else: ?>
                                                <span class="badge bg-success">Dibalas</span>
                                            <?php endif; ?>
                                        </p>
                                    </div>
                                </div>
                                <div class="mb-3">
                                    <p><strong>Pesan:</strong></p>
                                    <div class="border p-3 bg-light">
                                        <?= nl2br(htmlspecialchars($detail_data['pesan'])) ?>
                                    </div>
                                </div>
                                
                                
                                <?php if (!empty($detail_data['balasan'])): ?>
                                    <h5 class="mt-4 mb-3">Riwayat Balasan</h5>
                                    <?php foreach ($detail_data['balasan'] as $balasan): ?>
                                        <div class="balasan-container">
                                            <div class="balasan-header">
                                                <strong><?= htmlspecialchars($balasan['nama_admin']) ?></strong>
                                                <small class="text-muted"><?= date('d/m/Y H:i', strtotime($balasan['tanggal_balas'])) ?></small>
                                            </div>
                                            <div class="balasan-content">
                                                <?= nl2br(htmlspecialchars($balasan['balasan'])) ?>
                                            </div>
                                        </div>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                                
                                
                                <div class="balasan-form">
                                    <h5 class="mb-3">Balas Pesan</h5>
                                    <form action="kelola_kontak.php" method="post" id="formBalas">
                                        <input type="hidden" name="id_kontak" value="<?= htmlspecialchars($detail_data['id']) ?>">
                                        <div class="mb-3">
                                            <textarea class="form-control" id="balasan" name="balasan" rows="4" required placeholder="Tulis balasan Anda di sini..."></textarea>
                                        </div>
                                        
                                        
                                        <div class="mb-3">
                                            <div class="form-check">
                                                <input class="form-check-input" type="checkbox" id="showPreview">
                                                <label class="form-check-label" for="showPreview">
                                                    Lihat preview email
                                                </label>
                                            </div>
                                            
                                            <div class="email-preview" id="emailPreview" style="display: none;">
                                                <div class="email-preview-header">
                                                    <strong>Preview Email yang akan dikirim ke:</strong> <?= htmlspecialchars($detail_data['email']) ?>
                                                </div>
                                                <div class="email-preview-body" id="emailPreviewBody">
                                                    
                                                </div>
                                            </div>
                                        </div>
                                        
                                        <div class="d-flex gap-2">
                                            <button type="submit" name="balas" class="btn btn-primary" id="btnKirim">
                                                <i class="bi bi-send-fill me-1"></i> Kirim Balasan & Email
                                            </button>
                                            <a href="mailto:<?= htmlspecialchars($detail_data['email']) ?>?subject=Re: <?= urlencode($detail_data['subjek']) ?>" class="btn btn-outline-primary">
                                                <i class="bi bi-envelope me-1"></i> Balas via Email Client
                                            </a>
                                        </div>
                                    </form>
                                </div>
                                
                                <div class="d-flex gap-2 mt-4">
                                    <a href="kelola_kontak.php?aksi=hapus&id=<?= htmlspecialchars($detail_data['id']) ?>" class="btn btn-danger" onclick="return confirm('Apakah Anda yakin ingin menghapus pesan ini?')">
                                        <i class="bi bi-trash-fill me-1"></i> Hapus
                                    </a>
                                </div>
                            </div>
                        </div>
                    <?php else: ?>
                        
                        <div class="card mb-4">
                            <div class="card-body">
                                <form action="kelola_kontak.php" method="get" class="search-form">
                                    <div class="row g-3">
                                        <div class="col-md-10">
                                            <input type="text" class="form-control" name="search" placeholder="Cari berdasarkan nama, email, subjek, atau pesan..." value="<?= htmlspecialchars($search) ?>">
                                        </div>
                                        <div class="col-md-2">
                                            <button type="submit" class="btn btn-primary w-100">
                                                <i class="bi bi-search me-1"></i> Cari
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        
                        
                        <div class="card">
                            <div class="card-header">
                                <i class="bi bi-table me-1"></i>
                                Data Pesan Kontak
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table id="kontakTable" class="table table-bordered table-hover" width="100%" cellspacing="0">
                                        <thead>
                                            <tr>
                                                <th>No</th>
                                                <th>Nama</th>
                                                <th>Email</th>
                                                <th>Subjek</th>
                                                <th>Tanggal</th>
                                                <th>Status</th>
                                                <th>Aksi</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <?php $no = $offset + 1; if (is_array($kontaks) && count($kontaks) > 0): foreach ($kontaks as $kontak): ?>
                                            <tr>
                                                <td><?= $no++ ?></td>
                                                <td><?= htmlspecialchars($kontak['nama']) ?></td>
                                                <td><?= htmlspecialchars($kontak['email']) ?></td>
                                                <td><?= htmlspecialchars($kontak['subjek']) ?></td>
                                                <td><?= date('d/m/Y H:i', strtotime($kontak['tanggal'])) ?></td>
                                                <td>
                                                    <?php if ($kontak['status'] == 'baru'): ?>
                                                        <span class="badge bg-primary">Baru</span>
                                                    <?php elseif ($kontak['status'] == 'dibaca'): ?>
                                                        <span class="badge bg-info">Dibaca</span>
                                                    <?php else: ?>
                                                        <span class="badge bg-success">Dibalas</span>
                                                    <?php endif; ?>
                                                </td>
                                                <td>
                                                    <div class="btn-group btn-group-sm">
                                                        <a href="kelola_kontak.php?aksi=detail&id=<?= htmlspecialchars($kontak['id']) ?>" class="btn btn-info" title="Detail">
                                                            <i class="bi bi-eye-fill"></i>
                                                        </a>
                                                        <?php if ($kontak['status'] == 'baru'): ?>
                                                            <a href="kelola_kontak.php?aksi=baca&id=<?= htmlspecialchars($kontak['id']) ?>" class="btn btn-warning" title="Tandai dibaca">
                                                                <i class="bi bi-envelope-open-fill"></i>
                                                            </a>
                                                        <?php endif; ?>
                                                        <a href="mailto:<?= htmlspecialchars($kontak['email']) ?>?subject=Re: <?= urlencode($kontak['subjek']) ?>" class="btn btn-primary" title="Balas">
                                                            <i class="bi bi-reply-fill"></i>
                                                        </a>
                                                       
                                                    </div>
                                                </td>
                                            </tr>
                                            <?php endforeach; else: ?>
                                            <tr>
                                                <td colspan="7" class="text-center">Tidak ada data pesan</td>
                                            </tr>
                                            <?php endif; ?>
                                        </tbody>
                                    </table>
                                </div>
                                
                                
                                <?php if ($total_pages > 1): ?>
                                    <nav aria-label="Page navigation">
                                        <ul class="pagination justify-content-center">
                                            <li class="page-item <?= ($page <= 1) ? 'disabled' : '' ?>">
                                                <a class="page-link" href="?page=<?= $page - 1 ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" aria-label="Previous">
                                                    <span aria-hidden="true">&laquo;</span>
                                                </a>
                                            </li>
                                            
                                            <?php for ($i = 1; $i <= $total_pages; $i++): ?>
                                                <li class="page-item <?= ($i == $page) ? 'active' : '' ?>">
                                                    <a class="page-link" href="?page=<?= $i ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>"><?= $i ?></a>
                                                </li>
                                            <?php endfor; ?>
                                            
                                            <li class="page-item <?= ($page >= $total_pages) ? 'disabled' : '' ?>">
                                                <a class="page-link" href="?page=<?= $page + 1 ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" aria-label="Next">
                                                    <span aria-hidden="true">&raquo;</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </nav>
                                <?php endif; ?>
                            </div>
                        </div>
                    <?php endif; ?>
                </div>
            </main>
            
            <footer class="py-4 bg-light mt-auto">
                <div class="container-fluid px-4">
                    <div class="d-flex align-items-center justify-content-between small">
                        <div class="text-muted">Copyright &copy; <?= date('Y') ?> Pondok Pesantren Al-Hikmah</div>
                        <div>
                            <a href="#">Privacy Policy</a>
                            &middot;
                            <a href="#">Terms &amp; Conditions</a>
                        </div>
                    </div>
                </div>
            </footer>
        </div>
    </div>
    
    
    <script src="../assets/js/bootstrap.bundle.min.js"></script>
    
    
    <script src="../assets/js/jquery.min.js"></script>
    
    
    <script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.4/js/dataTables.bootstrap5.min.js"></script>
    
    
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    
    
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Sidebar Toggle Logic
            const sidebarToggle = document.getElementById('sidebarToggle');
            const body = document.body;
            
            // Load saved state
            if (localStorage.getItem('sb|sidebar-toggle') === 'true') {
                body.classList.add('sb-sidenav-toggled');
            }
            
            // Toggle sidebar
            sidebarToggle.addEventListener('click', function(e) {
                e.preventDefault();
                body.classList.toggle('sb-sidenav-toggled');
                localStorage.setItem('sb|sidebar-toggle', body.classList.contains('sb-sidenav-toggled'));
            });
            
            // Initialize DataTable
            $('#kontakTable').DataTable({
                responsive: true,
                language: {
                    url: 'https://cdn.datatables.net/plug-ins/1.13.4/i18n/id.json'
                },
                pageLength: 10,
                lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "Semua"]],
                columnDefs: [
                    { 
                        searchable: false,
                        orderable: false,
                        targets: [0, 6] // No dan Aksi column
                    }
                ],
                order: [[4, 'desc']] // Sort by Tanggal column (index 4) descending
            });
            
            // Add numbering to DataTable
            $('#kontakTable').on('draw.dt', function() {
                var info = $('#kontakTable').DataTable().page.info();
                $('#kontakTable tbody tr').each(function(i) {
                    // Add numbering starting from the current page start
                    $(this).find('td:first').html(info.start + i + 1);
                });
            });
            
            // Delete confirmation - PERBAIKAN DI SINI
            $(document).on('click', '.btn-delete', function(e) {
                e.preventDefault();
                const id = $(this).data('id');
                
                Swal.fire({
                    title: 'Apakah Anda yakin?',
                    text: "Pesan ini akan dihapus dan tidak dapat dikembalikan!",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#d33',
                    cancelButtonColor: '#3085d6',
                    confirmButtonText: 'Ya, hapus!',
                    cancelButtonText: 'Batal'
                }).then((result) => {
                    if (result.isConfirmed) {
                        // Redirect ke halaman hapus dengan parameter
                        window.location.href = 'kelola_kontak.php?aksi=hapus&id=' + id;
                    }
                });
            });
            
            // Email Preview
            const showPreview = document.getElementById('showPreview');
            const emailPreview = document.getElementById('emailPreview');
            const emailPreviewBody = document.getElementById('emailPreviewBody');
            const balasanTextarea = document.getElementById('balasan');
            const formBalas = document.getElementById('formBalas');
            const btnKirim = document.getElementById('btnKirim');
            
            if (showPreview) {
                showPreview.addEventListener('change', function() {
                    if (this.checked) {
                        // Generate email preview
                        const nama = "<?= htmlspecialchars($detail_data['nama']) ?>";
                        const subjek = "<?= htmlspecialchars($detail_data['subjek']) ?>";
                        const tanggal = "<?= date('d/m/Y H:i', strtotime($detail_data['tanggal'])) ?>";
                        const pesan = "<?= nl2br(htmlspecialchars($detail_data['pesan'])) ?>";
                        const balasan = balasanTextarea.value.replace(/\n/g, '<br>');
                        
                        const previewHTML = `
                            <!DOCTYPE html>
                            <html>
                            <head>
                                <meta charset='UTF-8'>
                                <title>Balasan Pesan</title>
                                <style>
                                    body {
                                        font-family: Arial, sans-serif;
                                        line-height: 1.6;
                                        color: #333;
                                        max-width: 600px;
                                        margin: 0 auto;
                                        padding: 20px;
                                    }
                                    .header {
                                        background-color: #0d6efd;
                                        color: white;
                                        padding: 20px;
                                        text-align: center;
                                        border-radius: 5px 5px 0 0;
                                    }
                                    .content {
                                        background-color: #f9f9f9;
                                        padding: 20px;
                                        border: 1px solid #ddd;
                                        border-top: none;
                                        border-radius: 0 0 5px 5px;
                                    }
                                    .pesan-asli {
                                        background-color: #f1f1f1;
                                        padding: 15px;
                                        border-left: 4px solid #0d6efd;
                                        margin-bottom: 20px;
                                    }
                                    .balasan {
                                        background-color: #e9f7fe;
                                        padding: 15px;
                                        border-left: 4px solid #28a745;
                                    }
                                    .footer {
                                        margin-top: 20px;
                                        font-size: 12px;
                                        color: #777;
                                        text-align: center;
                                    }
                                </style>
                            </head>
                            <body>
                                <div class='header'>
                                    <h2>Pondok Pesantren Al-Hikmah</h2>
                                    <p>Balasan Pesan Kontak</p>
                                </div>
                                <div class='content'>
                                    <p>Yth. Bapak/Ibu "${nama}",</p>
                                    <p>Terima kasih telah menghubungi kami. Berikut adalah balasan untuk pesan Anda:</p>
                                    
                                    <div class='pesan-asli'>
                                        <h4>Pesan Anda:</h4>
                                        <p><strong>Subjek:</strong> "${subjek}"</p>
                                        <p><strong>Tanggal:</strong> ${tanggal}</p>
                                        <p><strong>Pesan:</strong></p>
                                        <p>${pesan}</p>
                                    </div>
                                    
                                    <div class='balasan'>
                                        <h4>Balasan Kami:</h4>
                                        <p>${balasan}</p>
                                    </div>
                                    
                                    <p>Jika Anda memiliki pertanyaan lebih lanjut, jangan ragu untuk menghubungi kami kembali.</p>
                                    
                                    <div class='footer'>
                                        <p>&copy; <?= date('Y') ?> Pondok Pesantren Al-Hikmah. All rights reserved.</p>
                                        <p>Jl. Contoh No. 123, Kota, Provinsi, Indonesia</p>
                                        <p>Email: info@ponpes-alhikmah.ac.id | Telepon: (0123) 456-789</p>
                                    </div>
                                </div>
                            </body>
                            </html>
                        `;
                        
                        emailPreviewBody.innerHTML = previewHTML;
                        emailPreview.style.display = 'block';
                    } else {
                        emailPreview.style.display = 'none';
                    }
                });
            }
            
            // Form submission with loading state
            if (formBalas) {
                formBalas.addEventListener('submit', function(e) {
                    if (balasanTextarea.value.trim() === '') {
                        e.preventDefault();
                        Swal.fire({
                            icon: 'warning',
                            title: 'Peringatan',
                            text: 'Balasan tidak boleh kosong!',
                        });
                        return;
                    }
                    
                    // Show loading state
                    btnKirim.disabled = true;
                    btnKirim.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Mengirim...';
                });
            }
        });
    </script>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: kelola_kontak.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation