Sindbad~EG File Manager
<?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'])) {
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') {
$name = trim($_POST['name']);
$area_id = $_POST['area_id'];
$location = trim($_POST['location']);
$description = trim($_POST['description']);
$contact_person = trim($_POST['contact_person']);
$contact_email = trim($_POST['contact_email']);
$contact_phone = trim($_POST['contact_phone']);
$stmt = executeQuery(
"INSERT INTO districts (name, area_id, location, description, contact_person, contact_email, contact_phone, created_by) VALUES (?, ?, ?, ?, ?, ?, ?, ?)",
[$name, $area_id, $location, $description, $contact_person, $contact_email, $contact_phone, $user['id']]
);
if ($stmt) {
logAudit('create', 'districts', $conn->lastInsertId());
addNotification('success', 'District created successfully!', $user['id']);
} else {
addNotification('error', 'Failed to create district.', $user['id']);
}
} elseif ($action === 'update') {
$id = $_POST['id'];
$name = trim($_POST['name']);
$area_id = $_POST['area_id'];
$location = trim($_POST['location']);
$description = trim($_POST['description']);
$contact_person = trim($_POST['contact_person']);
$contact_email = trim($_POST['contact_email']);
$contact_phone = trim($_POST['contact_phone']);
$status = $_POST['status'];
$stmt = executeQuery(
"UPDATE districts SET name = ?, area_id = ?, location = ?, description = ?, contact_person = ?, contact_email = ?, contact_phone = ?, status = ? WHERE id = ?",
[$name, $area_id, $location, $description, $contact_person, $contact_email, $contact_phone, $status, $id]
);
if ($stmt) {
logAudit('update', 'districts', $id);
addNotification('success', 'District updated successfully!', $user['id']);
} else {
addNotification('error', 'Failed to update district.', $user['id']);
}
} elseif ($action === 'delete') {
$id = $_POST['id'];
$stmt = executeQuery("DELETE FROM districts WHERE id = ?", [$id]);
if ($stmt) {
logAudit('delete', 'districts', $id);
addNotification('success', 'District deleted successfully!', $user['id']);
} else {
addNotification('error', 'Failed to delete district.', $user['id']);
}
}
header('Location: districts.php');
exit();
}
// Get districts with statistics based on user role
$districts_query = "
SELECT d.*, a.name as area_name,
COUNT(DISTINCT ass.id) as assembly_count,
COUNT(DISTINCT e.id) as event_count
FROM districts d
LEFT JOIN areas a ON d.area_id = a.id
LEFT JOIN assemblies ass ON d.id = ass.district_id AND ass.status = 'active'
LEFT JOIN events e ON d.id = e.district_id AND e.status = 'active'
";
$params = [];
if ($user['role'] === 'area_admin') {
$districts_query .= " WHERE d.area_id = ?";
$params[] = $user['area_id'];
} elseif ($user['role'] === 'district_admin') {
$districts_query .= " WHERE d.id = ?";
$params[] = $user['district_id'];
}
$districts_query .= " GROUP BY d.id ORDER BY a.name, d.name";
$stmt = executeQuery($districts_query, $params);
$districts = $stmt ? $stmt->fetchAll() : [];
// Get areas for dropdown (based on user role)
$areas_query = "SELECT id, name FROM areas WHERE status = 'active'";
$areas_params = [];
if ($user['role'] === 'area_admin') {
$areas_query .= " AND id = ?";
$areas_params[] = $user['area_id'];
}
$areas_query .= " ORDER BY name";
$stmt = executeQuery($areas_query, $areas_params);
$areas = $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>Districts 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>
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 -->
<header class="bg-white/80 backdrop-blur-sm shadow-lg border-b border-slate-200/50">
<div class="flex items-center justify-between px-8 py-6">
<div class="animate-fade-in">
<h1 class="text-3xl font-bold bg-gradient-to-r from-emerald-600 to-cyan-600 bg-clip-text text-transparent flex items-center">
<div class="p-2 rounded-xl bg-gradient-to-br from-emerald-500 to-cyan-600 mr-3">
<i class="fas fa-building text-white"></i>
</div>
Districts Management
</h1>
<p class="text-slate-600 mt-1">Manage church districts and regions</p>
</div>
<button @click="showCreateModal = true"
class="px-6 py-3 bg-gradient-to-r from-emerald-600 to-cyan-600 hover:from-emerald-700 hover:to-cyan-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>Add New District</span>
</button>
</div>
</header>
<!-- Content -->
<main class="flex-1 overflow-y-auto p-8">
<!-- Districts Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<?php foreach ($districts as $index => $district): ?>
<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-emerald-300/50 animate-slide-up"
style="animation-delay: <?php echo $index * 0.1; ?>s">
<!-- District Header -->
<div class="flex items-start justify-between mb-4">
<div class="flex-1">
<h3 class="text-xl font-bold text-slate-800 mb-1"><?php echo htmlspecialchars($district['name']); ?></h3>
<p class="text-sm text-emerald-600 font-medium mb-1"><?php echo htmlspecialchars($district['area_name']); ?></p>
<?php if ($district['location']): ?>
<p class="text-sm text-slate-600 flex items-center">
<i class="fas fa-map-marker-alt mr-2 text-emerald-500"></i>
<?php echo htmlspecialchars($district['location']); ?>
</p>
<?php endif; ?>
</div>
<span class="px-3 py-1 text-xs font-semibold rounded-full <?php echo $district['status'] === 'active' ? 'bg-emerald-100 text-emerald-800' : 'bg-red-100 text-red-800'; ?>">
<?php echo ucfirst($district['status']); ?>
</span>
</div>
<!-- Description -->
<?php if ($district['description']): ?>
<p class="text-sm text-slate-600 mb-4 line-clamp-2"><?php echo htmlspecialchars($district['description']); ?></p>
<?php endif; ?>
<!-- Statistics -->
<div class="grid grid-cols-2 gap-3 mb-4">
<div class="text-center p-3 bg-emerald-50 rounded-xl">
<div class="text-lg font-bold text-emerald-600"><?php echo $district['assembly_count']; ?></div>
<div class="text-xs text-slate-600">Assemblies</div>
</div>
<div class="text-center p-3 bg-cyan-50 rounded-xl">
<div class="text-lg font-bold text-cyan-600"><?php echo $district['event_count']; ?></div>
<div class="text-xs text-slate-600">Events</div>
</div>
</div>
<!-- Contact Info -->
<?php if ($district['contact_person'] || $district['contact_email'] || $district['contact_phone']): ?>
<div class="border-t border-slate-200 pt-4 mb-4">
<h4 class="text-sm font-semibold text-slate-700 mb-2">Contact Information</h4>
<?php if ($district['contact_person']): ?>
<p class="text-xs text-slate-600 flex items-center mb-1">
<i class="fas fa-user mr-2 text-slate-400"></i>
<?php echo htmlspecialchars($district['contact_person']); ?>
</p>
<?php endif; ?>
<?php if ($district['contact_email']): ?>
<p class="text-xs text-slate-600 flex items-center mb-1">
<i class="fas fa-envelope mr-2 text-slate-400"></i>
<?php echo htmlspecialchars($district['contact_email']); ?>
</p>
<?php endif; ?>
<?php if ($district['contact_phone']): ?>
<p class="text-xs text-slate-600 flex items-center">
<i class="fas fa-phone mr-2 text-slate-400"></i>
<?php echo htmlspecialchars($district['contact_phone']); ?>
</p>
<?php endif; ?>
</div>
<?php endif; ?>
<!-- Actions -->
<div class="flex space-x-2">
<button @click="editDistrict(<?php echo htmlspecialchars(json_encode($district)); ?>)"
class="flex-1 px-3 py-2 bg-emerald-100 hover:bg-emerald-200 text-emerald-700 font-medium rounded-lg transition-colors text-sm">
<i class="fas fa-edit mr-1"></i>
Edit
</button>
<button @click="confirmDelete(<?php echo $district['id']; ?>, '<?php echo htmlspecialchars($district['name']); ?>')"
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($districts)): ?>
<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-building text-3xl text-slate-400"></i>
</div>
<h3 class="text-xl font-semibold text-slate-700 mb-2">No Districts Found</h3>
<p class="text-slate-500 mb-6">Get started by creating your first district.</p>
<button @click="showCreateModal = true"
class="px-6 py-3 bg-gradient-to-r from-emerald-600 to-cyan-600 hover:from-emerald-700 hover:to-cyan-700 text-white font-medium rounded-xl transition-all duration-200">
<i class="fas fa-plus mr-2"></i>
Create First District
</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-2xl 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 District' : 'Edit District' }}
</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="editingDistrict.id">
<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">District Name *</label>
<input type="text" name="name" :value="editingDistrict.name" required
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200"
placeholder="Enter district name">
</div>
<div>
<label class="block text-sm font-semibold text-slate-700 mb-2">Area *</label>
<select name="area_id" :value="editingDistrict.area_id" required
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-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>
</div>
<div>
<label class="block text-sm font-semibold text-slate-700 mb-2">Location</label>
<input type="text" name="location" :value="editingDistrict.location"
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200"
placeholder="Enter location">
</div>
<div>
<label class="block text-sm font-semibold text-slate-700 mb-2">Description</label>
<textarea name="description" rows="3" :value="editingDistrict.description"
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200 resize-none"
placeholder="Enter district description"></textarea>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div>
<label class="block text-sm font-semibold text-slate-700 mb-2">Contact Person</label>
<input type="text" name="contact_person" :value="editingDistrict.contact_person"
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200"
placeholder="Contact person">
</div>
<div>
<label class="block text-sm font-semibold text-slate-700 mb-2">Contact Email</label>
<input type="email" name="contact_email" :value="editingDistrict.contact_email"
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200"
placeholder="Email address">
</div>
<div>
<label class="block text-sm font-semibold text-slate-700 mb-2">Contact Phone</label>
<input type="tel" name="contact_phone" :value="editingDistrict.contact_phone"
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200"
placeholder="Phone number">
</div>
</div>
<div v-if="showEditModal">
<label class="block text-sm font-semibold text-slate-700 mb-2">Status</label>
<select name="status" :value="editingDistrict.status"
class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:outline-none focus:ring-2 focus:ring-emerald-500 focus:border-transparent transition-all duration-200">
<option value="active">Active</option>
<option value="inactive">Inactive</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-emerald-600 to-cyan-600 hover:from-emerald-700 hover:to-cyan-700 text-white font-medium rounded-xl transition-all duration-200 shadow-lg">
{{ showCreateModal ? 'Create District' : 'Update District' }}
</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 District</h3>
<p class="text-slate-600 mb-6">
Are you sure you want to delete <strong>"{{ deletingDistrictName }}"</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="deletingDistrictId">
<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,
editingDistrict: {},
deletingDistrictId: null,
deletingDistrictName: ''
}
},
methods: {
editDistrict(district) {
this.editingDistrict = { ...district };
this.showEditModal = true;
},
confirmDelete(id, name) {
this.deletingDistrictId = id;
this.deletingDistrictName = name;
this.showDeleteModal = true;
},
closeModal() {
this.showCreateModal = false;
this.showEditModal = false;
this.editingDistrict = {};
}
}
}).mount('#app');
</script>
</body>
</html>
Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists