Sindbad~EG File Manager

Current Path : /home/copmadinaarea/thecopmadinaarea.org/conference/admin/
Upload File :
Current File : /home/copmadinaarea/thecopmadinaarea.org/conference/admin/events.php

<?php
require_once '../includes/functions.php';

// Check if user is logged in and has admin privileges
if (!isLoggedIn()) {
    header('Location: ' . BASE_URL . 'login.php');
    exit();
}

$user = getCurrentUser();
if (!in_array($user['role'], ['superuser', 'area_admin', 'district_admin', 'assembly_admin'])) {
    header('Location: ' . BASE_URL . 'dashboard.php');
    exit();
}

$db = new CopMadinaDB();
$conn = $db->getConnection();

// Handle form submissions
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $action = $_POST['action'] ?? '';
    
    if ($action === 'create') {
        $template_id = $_POST['template_id'] ?: null;
        $title = trim($_POST['title']);
        $description = trim($_POST['description']);
        $event_date = $_POST['event_date'];
        $event_time = $_POST['event_time'];
        $location = trim($_POST['location']);
        $capacity = $_POST['capacity'] ?: null;
        $registration_fee = $_POST['registration_fee'] ?: 0;
        $early_bird_fee = $_POST['early_bird_fee'] ?: 0;
        $early_bird_deadline = $_POST['early_bird_deadline'] ?: null;
        $registration_deadline = $_POST['registration_deadline'] ?: null;
        $area_id = $_POST['area_id'] ?: null;
        $district_id = $_POST['district_id'] ?: null;
        $assembly_id = $_POST['assembly_id'] ?: null;
        $event_template_id = $_POST['event_template_id'] ?: null;
        $form_template_id = $_POST['form_template_id'] ?: null;
        $status = $_POST['status'];
        
        // Combine date and time for start_date
        $start_date = $event_date . ($event_time ? ' ' . $event_time : ' 00:00:00');
        $end_date = $start_date; // Default end_date same as start_date
        $event_type = $area_id ? 'area' : ($district_id ? 'district' : 'assembly');
        $venue = $location;
        
        $stmt = executeQuery(
            "INSERT INTO events (title, description, event_type, area_id, district_id, assembly_id, start_date, end_date, venue, capacity, registration_fee, early_bird_fee, early_bird_deadline, registration_deadline, event_template_id, form_template_id, status, created_by) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)",
            [$title, $description, $event_type, $area_id, $district_id, $assembly_id, $start_date, $end_date, $venue, $capacity, $registration_fee, $early_bird_fee, $early_bird_deadline, $registration_deadline, $event_template_id, $form_template_id, $status, $user['id']]
        );
        
        if ($stmt) {
            $event_id = $conn->lastInsertId();
            logAudit('create', 'events', $event_id);
            
            // ===== DYNAMIC TABLE CREATION FEATURE - START =====
            // Create dynamic table based on event title and form template
            if ($form_template_id) {
                try {
                    // Get form template fields
                    $template_stmt = executeQuery("SELECT form_fields FROM event_form_templates WHERE id = ?", [$form_template_id]);
                    if ($template_stmt) {
                        $template_data = $template_stmt->fetch();
                        if ($template_data && $template_data['form_fields']) {
                            $form_fields = json_decode($template_data['form_fields'], true);
                            
                            // Create sanitized table name from event title
                            $table_name = 'event_' . $event_id . '_' . preg_replace('/[^a-zA-Z0-9_]/', '_', strtolower($title));
                            $table_name = substr($table_name, 0, 64); // MySQL table name limit
                            
                            // Build CREATE TABLE SQL
                            $create_sql = "CREATE TABLE `{$table_name}` (
                                `id` int(11) NOT NULL AUTO_INCREMENT,
                                `registration_id` int(11) DEFAULT NULL,
                                `user_id` int(11) DEFAULT NULL,
                                `registration_code` varchar(50) DEFAULT NULL,
                                `registration_type` enum('member','nonmember') DEFAULT 'member',";
                            
                            // Add columns based on form fields
                            foreach ($form_fields as $field) {
                                $field_name = preg_replace('/[^a-zA-Z0-9_]/', '_', strtolower($field['label']));
                                $field_name = substr($field_name, 0, 64); // Column name limit
                                
                                switch ($field['type']) {
                                    case 'textarea':
                                        $create_sql .= "`{$field_name}` TEXT,";
                                        break;
                                    case 'email':
                                        $create_sql .= "`{$field_name}` VARCHAR(255),";
                                        break;
                                    case 'tel':
                                        $create_sql .= "`{$field_name}` VARCHAR(20),";
                                        break;
                                    case 'date':
                                        $create_sql .= "`{$field_name}` DATE,";
                                        break;
                                    case 'number':
                                        $create_sql .= "`{$field_name}` DECIMAL(10,2),";
                                        break;
                                    case 'file':
                                        $create_sql .= "`{$field_name}` VARCHAR(500),";
                                        break;
                                    default:
                                        $create_sql .= "`{$field_name}` VARCHAR(255),";
                                        break;
                                }
                            }
                            
                            $create_sql .= "`created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
                                `updated_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
                                PRIMARY KEY (`id`),
                                KEY `registration_id` (`registration_id`),
                                KEY `user_id` (`user_id`)
                            ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci";
                            
                            // Execute table creation
                            $conn->exec($create_sql);
                            
                            // Store table name in events table for reference
                            executeQuery("UPDATE events SET custom_table_name = ? WHERE id = ?", [$table_name, $event_id]);
                            
                            logAudit('create', 'dynamic_table', $event_id, "Created table: {$table_name}");
                        }
                    }
                } catch (Exception $e) {
                    // Log error but don't fail event creation
                    error_log("Dynamic table creation failed for event {$event_id}: " . $e->getMessage());
                }
            }
            // ===== DYNAMIC TABLE CREATION FEATURE - END =====
            
            addNotification('success', 'Event created successfully!');
        } else {
            addNotification('error', 'Failed to create event.');
        }
    } elseif ($action === 'update') {
        $id = $_POST['id'];
        $title = trim($_POST['title']);
        $description = trim($_POST['description']);
        $event_date = $_POST['event_date'];
        $event_time = $_POST['event_time'];
        $location = trim($_POST['location']);
        $capacity = $_POST['capacity'] ?: null;
        $registration_fee = $_POST['registration_fee'] ?: 0;
        $early_bird_fee = $_POST['early_bird_fee'] ?: 0;
        $early_bird_deadline = $_POST['early_bird_deadline'] ?: null;
        $registration_deadline = $_POST['registration_deadline'] ?: null;
        $area_id = $_POST['area_id'] ?: null;
        $district_id = $_POST['district_id'] ?: null;
        $assembly_id = $_POST['assembly_id'] ?: null;
        $event_template_id = $_POST['event_template_id'] ?: null;
        $form_template_id = $_POST['form_template_id'] ?: null;
        $status = $_POST['status'];
        
        // Combine date and time for start_date
        $start_date = $event_date . ($event_time ? ' ' . $event_time : ' 00:00:00');
        $end_date = $start_date; // Default end_date same as start_date
        $event_type = $area_id ? 'area' : ($district_id ? 'district' : 'assembly');
        $venue = $location;
        
        $stmt = executeQuery(
            "UPDATE events SET title = ?, description = ?, event_type = ?, area_id = ?, district_id = ?, assembly_id = ?, start_date = ?, end_date = ?, venue = ?, capacity = ?, registration_fee = ?, early_bird_fee = ?, early_bird_deadline = ?, registration_deadline = ?, event_template_id = ?, form_template_id = ?, status = ? WHERE id = ?",
            [$title, $description, $event_type, $area_id, $district_id, $assembly_id, $start_date, $end_date, $venue, $capacity, $registration_fee, $early_bird_fee, $early_bird_deadline, $registration_deadline, $event_template_id, $form_template_id, $status, $id]
        );
        
        if ($stmt) {
            logAudit('update', 'events', $id);
            addNotification('success', 'Event updated successfully!');
        } else {
            addNotification('error', 'Failed to update event.');
        }
    } elseif ($action === 'delete') {
        $id = $_POST['id'];
        
        $stmt = executeQuery("DELETE FROM events WHERE id = ?", [$id]);
        
        if ($stmt) {
            logAudit('delete', 'events', $id);
            addNotification('success', 'Event deleted successfully!');
        } else {
            addNotification('error', 'Failed to delete event.');
        }
    }
    
    header('Location: events.php');
    exit();
}

// Get events with statistics based on user role
$events_query = "
    SELECT e.*, a.name as area_name, d.name as district_name, ass.name as assembly_name,
           COALESCE(
               (SELECT COUNT(*) FROM event_registrations er WHERE er.event_id = e.id AND er.status != 'cancelled') +
               (SELECT COUNT(*) FROM nonmember_registrations nr WHERE nr.event_id = e.id AND nr.status != 'cancelled'),
               0
           ) as registration_count,
           DATE(e.start_date) as event_date,
           TIME(e.start_date) as event_time,
           e.venue as location,
           e.early_bird_fee,
           e.early_bird_deadline,
           e.registration_deadline
    FROM events e
    LEFT JOIN areas a ON e.area_id = a.id
    LEFT JOIN districts d ON e.district_id = d.id
    LEFT JOIN assemblies ass ON e.assembly_id = ass.id
";

$params = [];
if ($user['role'] === 'area_admin') {
    $events_query .= " WHERE e.area_id = ?";
    $params[] = $user['area_id'];
} elseif ($user['role'] === 'district_admin') {
    $events_query .= " WHERE e.district_id = ?";
    $params[] = $user['district_id'];
} elseif ($user['role'] === 'assembly_admin') {
    $events_query .= " WHERE e.assembly_id = ?";
    $params[] = $user['assembly_id'];
}

$events_query .= " ORDER BY e.start_date DESC, e.created_at DESC";

$stmt = executeQuery($events_query, $params);
$events = $stmt ? $stmt->fetchAll() : [];

// Get areas, districts, assemblies for dropdowns based on user role
$areas = $districts = $assemblies = [];

if ($user['role'] === 'superuser') {
    $stmt = executeQuery("SELECT id, name FROM areas WHERE status = 'active' ORDER BY name");
    $areas = $stmt ? $stmt->fetchAll() : [];
    
    $stmt = executeQuery("SELECT id, name, area_id FROM districts WHERE status = 'active' ORDER BY name");
    $districts = $stmt ? $stmt->fetchAll() : [];
    
    $stmt = executeQuery("SELECT id, name, district_id FROM assemblies WHERE status = 'active' ORDER BY name");
    $assemblies = $stmt ? $stmt->fetchAll() : [];
} elseif ($user['role'] === 'area_admin') {
    $stmt = executeQuery("SELECT id, name FROM areas WHERE id = ? AND status = 'active'", [$user['area_id']]);
    $areas = $stmt ? $stmt->fetchAll() : [];
    
    $stmt = executeQuery("SELECT id, name, area_id FROM districts WHERE area_id = ? AND status = 'active' ORDER BY name", [$user['area_id']]);
    $districts = $stmt ? $stmt->fetchAll() : [];
    
    $stmt = executeQuery("SELECT ass.id, ass.name, ass.district_id FROM assemblies ass JOIN districts d ON ass.district_id = d.id WHERE d.area_id = ? AND ass.status = 'active' ORDER BY ass.name", [$user['area_id']]);
    $assemblies = $stmt ? $stmt->fetchAll() : [];
} elseif ($user['role'] === 'district_admin') {
    $stmt = executeQuery("SELECT d.id, d.name, d.area_id FROM districts d WHERE d.id = ? AND d.status = 'active'", [$user['district_id']]);
    $districts = $stmt ? $stmt->fetchAll() : [];
    
    $stmt = executeQuery("SELECT id, name, district_id FROM assemblies WHERE district_id = ? AND status = 'active' ORDER BY name", [$user['district_id']]);
    $assemblies = $stmt ? $stmt->fetchAll() : [];
}

// Get event templates and form templates for dropdowns
$event_templates = [];
$form_templates = [];

if (hasRole(['superuser', 'area_admin'])) {
    $stmt = executeQuery("SELECT id, name, description FROM event_templates WHERE status = 'active' ORDER BY name");
    $event_templates = $stmt ? $stmt->fetchAll() : [];
    
    $stmt = executeQuery("SELECT id, name, description FROM event_form_templates WHERE status = 'active' ORDER BY name");
    $form_templates = $stmt ? $stmt->fetchAll() : [];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Events Management - COP Madina Conference</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <script src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
    <script>
        tailwind.config = {
            theme: {
                extend: {
                    animation: {
                        'fade-in': 'fadeIn 0.5s ease-in-out',
                        'slide-up': 'slideUp 0.6s ease-out',
                        'scale-in': 'scaleIn 0.3s ease-out',
                    },
                    keyframes: {
                        fadeIn: {
                            '0%': { opacity: '0', transform: 'translateY(10px)' },
                            '100%': { opacity: '1', transform: 'translateY(0)' }
                        },
                        slideUp: {
                            '0%': { opacity: '0', transform: 'translateY(20px)' },
                            '100%': { opacity: '1', transform: 'translateY(0)' }
                        },
                        scaleIn: {
                            '0%': { opacity: '0', transform: 'scale(0.95)' },
                            '100%': { opacity: '1', transform: 'scale(1)' }
                        }
                    }
                }
            }
        }
    </script>
</head>
<body class="bg-gradient-to-br from-slate-50 to-blue-50 min-h-screen">
    <div id="app" class="flex h-screen">
        <!-- Sidebar -->
        <?php include 'includes/admin_sidebar.php'; ?>
        
        <!-- Main Content -->
        <div class="flex-1 flex flex-col overflow-hidden ml-72">
            <!-- Header -->
            <?php include 'includes/admin_header.php'; ?>

            <!-- Page Actions -->
            <div class="px-8 py-4 bg-white/50 border-b border-slate-200/50">
                <button @click="showCreateModal = true" 
                        class="px-6 py-3 bg-gradient-to-r from-orange-600 to-red-600 hover:from-orange-700 hover:to-red-700 text-white font-medium rounded-xl transition-all duration-200 flex items-center space-x-2 shadow-lg hover:shadow-xl animate-scale-in">
                    <i class="fas fa-plus"></i>
                    <span>Create New Event</span>
                </button>
            </div>

            <!-- Content -->
            <main class="flex-1 overflow-y-auto p-8">
                <!-- Events Grid -->
                <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-6">
                    <?php foreach ($events as $index => $event): ?>
                    <div class="group bg-white/70 backdrop-blur-sm rounded-2xl shadow-lg hover:shadow-xl transition-all duration-300 p-6 border border-slate-200/50 hover:border-orange-300/50 animate-slide-up" 
                         style="animation-delay: <?php echo $index * 0.1; ?>s">
                        <!-- Event Header -->
                        <div class="flex items-start justify-between mb-4">
                            <div class="flex-1">
                                <h3 class="text-xl font-bold text-slate-800 mb-2"><?php echo htmlspecialchars($event['title']); ?></h3>
                                <div class="space-y-1 text-sm">
                                    <?php if ($event['area_name']): ?>
                                    <p class="text-orange-600 font-medium"><?php echo htmlspecialchars($event['area_name']); ?></p>
                                    <?php endif; ?>
                                    <?php if ($event['district_name']): ?>
                                    <p class="text-slate-600"><?php echo htmlspecialchars($event['district_name']); ?></p>
                                    <?php endif; ?>
                                    <?php if ($event['assembly_name']): ?>
                                    <p class="text-slate-500"><?php echo htmlspecialchars($event['assembly_name']); ?></p>
                                    <?php endif; ?>
                                </div>
                            </div>
                            <span class="px-3 py-1 text-xs font-semibold rounded-full <?php 
                                echo $event['status'] === 'published' ? 'bg-emerald-100 text-emerald-800' : 
                                    ($event['status'] === 'completed' ? 'bg-blue-100 text-blue-800' : 
                                    ($event['status'] === 'draft' ? 'bg-yellow-100 text-yellow-800' : 'bg-red-100 text-red-800')); 
                            ?>">
                                <?php echo ucfirst($event['status']); ?>
                            </span>
                        </div>

                        <!-- Event Details -->
                        <div class="space-y-3 mb-4">
                            <div class="flex items-center text-sm text-slate-600">
                                <i class="fas fa-calendar mr-3 text-orange-500"></i>
                                <?php echo date('M j, Y', strtotime($event['start_date'])); ?>
                                <?php if ($event['event_time'] && $event['event_time'] !== '00:00:00'): ?>
                                at <?php echo date('g:i A', strtotime($event['event_time'])); ?>
                                <?php endif; ?>
                            </div>
                            
                            <?php if ($event['venue']): ?>
                            <div class="flex items-center text-sm text-slate-600">
                                <i class="fas fa-map-marker-alt mr-3 text-orange-500"></i>
                                <?php echo htmlspecialchars($event['venue']); ?>
                            </div>
                            <?php endif; ?>
                            
                            <?php if ($event['capacity']): ?>
                            <div class="flex items-center text-sm text-slate-600">
                                <i class="fas fa-users mr-3 text-orange-500"></i>
                                Capacity: <?php echo $event['capacity']; ?>
                            </div>
                            <?php endif; ?>
                            
                            <?php if ($event['registration_fee'] > 0): ?>
                            <div class="flex items-center text-sm text-slate-600">
                                <i class="fas fa-dollar-sign mr-3 text-orange-500"></i>
                                Fee: GH₵<?php echo number_format($event['registration_fee'], 2); ?>
                            </div>
                            <?php endif; ?>
                        </div>

                        <!-- Description -->
                        <?php if ($event['description']): ?>
                        <p class="text-sm text-slate-600 mb-4 line-clamp-3"><?php echo htmlspecialchars($event['description']); ?></p>
                        <?php endif; ?>

                        <!-- Statistics -->
                        <div class="text-center p-3 bg-orange-50 rounded-xl mb-4">
                            <div class="text-lg font-bold text-orange-600"><?php echo $event['registration_count']; ?></div>
                            <div class="text-xs text-slate-600">Registrations</div>
                        </div>

                        <!-- Actions -->
                        <div class="flex space-x-2">
                            <button @click="editEvent(<?php echo htmlspecialchars(json_encode($event)); ?>)"
                                    class="flex-1 px-3 py-2 bg-orange-100 hover:bg-orange-200 text-orange-700 font-medium rounded-lg transition-colors text-sm">
                                <i class="fas fa-edit mr-1"></i>
                                Edit
                            </button>
                            <button @click="confirmDelete(<?php echo $event['id']; ?>, '<?php echo htmlspecialchars($event['title']); ?>')"
                                    class="flex-1 px-3 py-2 bg-red-100 hover:bg-red-200 text-red-700 font-medium rounded-lg transition-colors text-sm">
                                <i class="fas fa-trash mr-1"></i>
                                Delete
                            </button>
                        </div>
                    </div>
                    <?php endforeach; ?>
                </div>

                <!-- Empty State -->
                <?php if (empty($events)): ?>
                <div class="text-center py-16">
                    <div class="mx-auto w-24 h-24 bg-slate-100 rounded-full flex items-center justify-center mb-6">
                        <i class="fas fa-calendar-alt text-3xl text-slate-400"></i>
                    </div>
                    <h3 class="text-xl font-semibold text-slate-700 mb-2">No Events Found</h3>
                    <p class="text-slate-500 mb-6">Get started by creating your first event.</p>
                    <button @click="showCreateModal = true" 
                            class="px-6 py-3 bg-gradient-to-r from-orange-600 to-red-600 hover:from-orange-700 hover:to-red-700 text-white font-medium rounded-xl transition-all duration-200">
                        <i class="fas fa-plus mr-2"></i>
                        Create First Event
                    </button>
                </div>
                <?php endif; ?>
            </main>
        </div>

        <!-- Create/Edit Modal -->
        <div v-if="showCreateModal || showEditModal" class="fixed inset-0 bg-black/50 backdrop-blur-sm z-50 flex items-center justify-center p-4">
            <div class="bg-white/95 backdrop-blur-sm rounded-2xl shadow-2xl w-full max-w-3xl max-h-[90vh] overflow-y-auto border border-slate-200/50 animate-scale-in">
                <div class="sticky top-0 bg-white/95 backdrop-blur-sm border-b border-slate-200/50 px-6 py-4 rounded-t-2xl">
                    <div class="flex items-center justify-between">
                        <h3 class="text-xl font-bold text-slate-800">
                            {{ showCreateModal ? 'Create New Event' : 'Edit Event' }}
                        </h3>
                        <button @click="closeModal()" class="p-2 rounded-lg hover:bg-slate-100 transition-colors">
                            <i class="fas fa-times text-slate-500"></i>
                        </button>
                    </div>
                </div>
                
                <form method="POST" class="p-6 space-y-6">
                    <input type="hidden" name="action" :value="showCreateModal ? 'create' : 'update'">
                    <input v-if="showEditModal" type="hidden" name="id" :value="editingEvent.id">
                    
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Event Title *</label>
                        <input type="text" name="title" :value="editingEvent.title" required
                               class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200"
                               placeholder="Enter event title">
                    </div>
                    
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Description</label>
                        <textarea name="description" rows="4" :value="editingEvent.description"
                                  class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200 resize-none"
                                  placeholder="Enter event description"></textarea>
                    </div>
                    
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Event Date *</label>
                            <input type="date" name="event_date" :value="editingEvent.event_date" required
                                   class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                        </div>
                        
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Event Time</label>
                            <input type="time" name="event_time" :value="editingEvent.event_time"
                                   class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                        </div>
                    </div>
                    
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Venue</label>
                        <input type="text" name="location" :value="editingEvent.venue || editingEvent.location"
                               class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200"
                               placeholder="Enter event venue">
                    </div>
                    
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Capacity</label>
                            <input type="number" name="capacity" :value="editingEvent.capacity" min="1"
                                   class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200"
                                   placeholder="Maximum attendees">
                        </div>
                        
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Registration Fee (GH₵)</label>
                            <input type="number" name="registration_fee" :value="editingEvent.registration_fee" min="0" step="0.01"
                                   class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200"
                                   placeholder="0.00">
                        </div>
                    </div>
                    
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Early Bird Fee (GH₵)</label>
                            <input type="number" name="early_bird_fee" :value="editingEvent.early_bird_fee" min="0" step="0.01"
                                   class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200"
                                   placeholder="0.00">
                            <p class="text-xs text-slate-500 mt-1">Discounted fee for early registrations</p>
                        </div>
                        
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Early Bird Deadline</label>
                            <input type="datetime-local" name="early_bird_deadline" :value="editingEvent.early_bird_deadline"
                                   class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                            <p class="text-xs text-slate-500 mt-1">When early bird pricing ends</p>
                        </div>
                    </div>
                    
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Registration Deadline</label>
                        <input type="datetime-local" name="registration_deadline" :value="editingEvent.registration_deadline"
                               class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                        <p class="text-xs text-slate-500 mt-1">Final date/time to accept registrations</p>
                    </div>
                    
                    <!-- Event Level Selection -->
                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                        <?php if (!empty($areas)): ?>
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Area</label>
                            <select name="area_id" :value="editingEvent.area_id"
                                    class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                                <option value="">Select Area</option>
                                <?php foreach ($areas as $area): ?>
                                <option value="<?php echo $area['id']; ?>"><?php echo htmlspecialchars($area['name']); ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <?php endif; ?>
                        
                        <?php if (!empty($districts)): ?>
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">District</label>
                            <select name="district_id" :value="editingEvent.district_id"
                                    class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                                <option value="">Select District</option>
                                <?php foreach ($districts as $district): ?>
                                <option value="<?php echo $district['id']; ?>"><?php echo htmlspecialchars($district['name']); ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <?php endif; ?>
                        
                        <?php if (!empty($assemblies)): ?>
                        <div>
                            <label class="block text-sm font-semibold text-slate-700 mb-2">Assembly</label>
                            <select name="assembly_id" :value="editingEvent.assembly_id" disabled
                                    class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200 bg-slate-100 cursor-not-allowed">
                                <option value="">Select Assembly (Disabled)</option>
                                <?php foreach ($assemblies as $assembly): ?>
                                <option value="<?php echo $assembly['id']; ?>"><?php echo htmlspecialchars($assembly['name']); ?></option>
                                <?php endforeach; ?>
                            </select>
                            <p class="text-xs text-slate-500 mt-1">Assembly selection is currently disabled</p>
                        </div>
                        <?php endif; ?>
                    </div>
                    
                    <?php if (!empty($event_templates)): ?>
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Event Template</label>
                        <select name="event_template_id" :value="editingEvent.event_template_id"
                                class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                            <option value="">Select Template (Optional)</option>
                            <?php foreach ($event_templates as $template): ?>
                            <option value="<?php echo $template['id']; ?>" title="<?php echo htmlspecialchars($template['description']); ?>">
                                <?php echo htmlspecialchars($template['name']); ?>
                            </option>
                            <?php endforeach; ?>
                        </select>
                        <p class="text-xs text-slate-500 mt-1">Choose a template to pre-fill event settings</p>
                    </div>
                    <?php endif; ?>
                    
                    <?php if (!empty($form_templates)): ?>
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Registration Form Template *</label>
                        <select name="form_template_id" :value="editingEvent.form_template_id" required
                                class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                            <option value="">Select Form Template</option>
                            <?php foreach ($form_templates as $template): ?>
                            <option value="<?php echo $template['id']; ?>" title="<?php echo htmlspecialchars($template['description']); ?>">
                                <?php echo htmlspecialchars($template['name']); ?>
                            </option>
                            <?php endforeach; ?>
                        </select>
                        <p class="text-xs text-slate-500 mt-1">This form will be used for event registrations</p>
                    </div>
                    <?php endif; ?>
                    
                    <div>
                        <label class="block text-sm font-semibold text-slate-700 mb-2">Status</label>
                        <select name="status" :value="editingEvent.status || 'draft'"
                                class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent transition-all duration-200">
                            <option value="draft">Draft</option>
                            <option value="published">Published</option>
                            <option value="completed" v-if="showEditModal">Completed</option>
                            <option value="cancelled" v-if="showEditModal">Cancelled</option>
                        </select>
                    </div>
                    
                    <div class="flex justify-end space-x-3 pt-4 border-t border-slate-200">
                        <button type="button" @click="closeModal()" 
                                class="px-6 py-3 bg-slate-100 hover:bg-slate-200 text-slate-700 font-medium rounded-xl transition-colors">
                            Cancel
                        </button>
                        <button type="submit" 
                                class="px-6 py-3 bg-gradient-to-r from-orange-600 to-red-600 hover:from-orange-700 hover:to-red-700 text-white font-medium rounded-xl transition-all duration-200 shadow-lg">
                            {{ showCreateModal ? 'Create Event' : 'Update Event' }}
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <!-- Delete Confirmation Modal -->
        <div v-if="showDeleteModal" class="fixed inset-0 bg-black/50 backdrop-blur-sm z-50 flex items-center justify-center p-4">
            <div class="bg-white/95 backdrop-blur-sm rounded-2xl shadow-2xl w-full max-w-md border border-slate-200/50 animate-scale-in">
                <div class="p-6 text-center">
                    <div class="mx-auto w-16 h-16 bg-red-100 rounded-full flex items-center justify-center mb-4">
                        <i class="fas fa-exclamation-triangle text-red-600 text-2xl"></i>
                    </div>
                    <h3 class="text-xl font-bold text-slate-800 mb-2">Delete Event</h3>
                    <p class="text-slate-600 mb-6">
                        Are you sure you want to delete <strong>"{{ deletingEventName }}"</strong>? This action cannot be undone.
                    </p>
                    <div class="flex justify-center space-x-3">
                        <form method="POST" class="flex space-x-3">
                            <input type="hidden" name="action" value="delete">
                            <input type="hidden" name="id" :value="deletingEventId">
                            <button type="button" @click="showDeleteModal = false" 
                                    class="px-6 py-3 bg-slate-100 hover:bg-slate-200 text-slate-700 font-medium rounded-xl transition-colors">
                                Cancel
                            </button>
                            <button type="submit" 
                                    class="px-6 py-3 bg-red-600 hover:bg-red-700 text-white font-medium rounded-xl transition-colors">
                                Delete
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        const { createApp } = Vue;
        
        createApp({
            data() {
                return {
                    showCreateModal: false,
                    showEditModal: false,
                    showDeleteModal: false,
                    editingEvent: {},
                    deletingEventId: null,
                    deletingEventName: ''
                }
            },
            methods: {
                editEvent(event) {
                    this.editingEvent = { ...event };
                    // Format datetime fields for datetime-local inputs (YYYY-MM-DDTHH:MM)
                    if (this.editingEvent.early_bird_deadline) {
                        this.editingEvent.early_bird_deadline = this.editingEvent.early_bird_deadline.replace(' ', 'T').substring(0, 16);
                    }
                    if (this.editingEvent.registration_deadline) {
                        this.editingEvent.registration_deadline = this.editingEvent.registration_deadline.replace(' ', 'T').substring(0, 16);
                    }
                    this.showEditModal = true;
                },
                confirmDelete(id, name) {
                    this.deletingEventId = id;
                    this.deletingEventName = name;
                    this.showDeleteModal = true;
                },
                closeModal() {
                    this.showCreateModal = false;
                    this.showEditModal = false;
                    this.editingEvent = {};
                }
            }
        }).mount('#app');
    </script>
</body>
</html>

Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists