One Hat Cyber Team

View File Name : cottages.php

<?php
require_once 'config.php';

if (!isLoggedIn()) {
    redirect('index.php');
}

// Handle form submission for new cottage
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    if (isset($_POST['add_cottage'])) {
        $cottage_name = sanitize($_POST['cottage_name']);
        $cottage_leader = sanitize($_POST['cottage_leader']);
        $meeting_day = sanitize($_POST['meeting_day']);
        $meeting_time = $_POST['meeting_time'];
        $location = sanitize($_POST['location']);
        $contact_person = sanitize($_POST['contact_person']);
        $contact_phone = sanitize($_POST['contact_phone']);
        $status = $_POST['status'];
        
        $stmt = $pdo->prepare("INSERT INTO cottages (cottage_name, cottage_leader, meeting_day, meeting_time, location, contact_person, contact_phone, status) VALUES (?, ?, ?, ?, ?, ?, ?, ?)");
        $stmt->execute([$cottage_name, $cottage_leader, $meeting_day, $meeting_time, $location, $contact_person, $contact_phone, $status]);
        
        $success = "Cottage created successfully!";
    }
    
    if (isset($_POST['add_member_to_cottage'])) {
        $cottage_id = $_POST['cottage_id'];
        $member_id = $_POST['member_id'];
        $role = $_POST['role'];
        $join_date = $_POST['join_date'];
        
        // Check if member already in cottage
        $check = $pdo->prepare("SELECT COUNT(*) as count FROM cottage_members WHERE cottage_id = ? AND member_id = ?");
        $check->execute([$cottage_id, $member_id]);
        
        if ($check->fetch()['count'] == 0) {
            $stmt = $pdo->prepare("INSERT INTO cottage_members (cottage_id, member_id, role, join_date) VALUES (?, ?, ?, ?)");
            $stmt->execute([$cottage_id, $member_id, $role, $join_date]);
            $member_success = "Member added to cottage successfully!";
        } else {
            $member_error = "Member is already in this cottage!";
        }
    }
}

// Get all cottages
$cottages = $pdo->query("SELECT c.*, 
    (SELECT COUNT(*) FROM cottage_members WHERE cottage_id = c.id) as member_count
    FROM cottages c 
    ORDER BY c.cottage_name")->fetchAll();

// Get all members for dropdown
$members = $pdo->query("SELECT id, CONCAT(first_name, ' ', last_name) as name, member_id FROM members WHERE membership_status = 'Active' ORDER BY first_name")->fetchAll();

// Get cottage members for selected cottage
$selected_cottage = isset($_GET['cottage_id']) ? $_GET['cottage_id'] : 0;
$cottage_members = [];
$cottage_details = null;

if ($selected_cottage) {
    $stmt = $pdo->prepare("SELECT cm.*, m.first_name, m.last_name, m.member_id, m.phone 
        FROM cottage_members cm 
        JOIN members m ON cm.member_id = m.id 
        WHERE cm.cottage_id = ? 
        ORDER BY cm.role, m.first_name");
    $stmt->execute([$selected_cottage]);
    $cottage_members = $stmt->fetchAll();
    
    $stmt = $pdo->prepare("SELECT * FROM cottages WHERE id = ?");
    $stmt->execute([$selected_cottage]);
    $cottage_details = $stmt->fetch();
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cottage Management - Church MS</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        :root {
            --primary: #4f46e5;
            --primary-dark: #4338ca;
            --secondary: #7c3aed;
            --success: #10b981;
            --warning: #f59e0b;
            --danger: #ef4444;
            --light: #f8fafc;
            --dark: #1e293b;
            --gray: #64748b;
        }
        
        .cottage-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
            gap: 20px;
            margin-bottom: 30px;
        }
        
        .cottage-card {
            background: white;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            transition: transform 0.3s ease;
        }
        
        .cottage-card:hover {
            transform: translateY(-5px);
        }
        
        .cottage-header {
            background: linear-gradient(135deg, var(--primary), var(--secondary));
            color: white;
            padding: 20px;
        }
        
        .cottage-header h3 {
            font-size: 18px;
            margin-bottom: 5px;
        }
        
        .cottage-status {
            display: inline-block;
            padding: 4px 12px;
            background: rgba(255,255,255,0.2);
            border-radius: 20px;
            font-size: 12px;
            font-weight: 600;
        }
        
        .cottage-body {
            padding: 20px;
        }
        
        .cottage-info {
            display: grid;
            gap: 10px;
            margin-bottom: 15px;
        }
        
        .info-item {
            display: flex;
            align-items: center;
            gap: 10px;
            color: var(--gray);
            font-size: 14px;
        }
        
        .info-item i {
            width: 20px;
            color: var(--primary);
        }
        
        .member-count {
            font-size: 24px;
            font-weight: 700;
            color: var(--primary);
            text-align: center;
        }
        
        .cottage-actions {
            display: flex;
            gap: 10px;
            margin-top: 15px;
        }
        
        .cottage-details {
            background: white;
            border-radius: 15px;
            padding: 30px;
            margin-bottom: 30px;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
        }
        
        .details-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20px;
        }
        
        .role-badge {
            padding: 4px 12px;
            border-radius: 20px;
            font-size: 12px;
            font-weight: 600;
        }
        
        .role-leader {
            background: rgba(245, 158, 11, 0.1);
            color: var(--warning);
        }
        
        .role-assistant {
            background: rgba(79, 70, 229, 0.1);
            color: var(--primary);
        }
        
        .role-member {
            background: rgba(16, 185, 129, 0.1);
            color: var(--success);
        }
        
        .members-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
            gap: 15px;
            margin-top: 20px;
        }
        
        .member-card {
            background: var(--light);
            padding: 15px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            gap: 15px;
        }
        
        .member-avatar {
            width: 50px;
            height: 50px;
            background: var(--primary);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: 600;
        }
        
        .member-info h4 {
            margin-bottom: 5px;
            color: var(--dark);
        }
        
        .member-info p {
            color: var(--gray);
            font-size: 14px;
        }
        
        .empty-state {
            text-align: center;
            padding: 40px;
            color: var(--gray);
        }
        
        .empty-state i {
            font-size: 48px;
            margin-bottom: 15px;
            color: var(--light);
        }
        
        .tab-container {
            margin-bottom: 30px;
        }
        
        .tabs {
            display: flex;
            border-bottom: 2px solid var(--light);
            margin-bottom: 20px;
        }
        
        .tab {
            padding: 15px 30px;
            background: none;
            border: none;
            font-size: 16px;
            cursor: pointer;
            color: var(--gray);
            position: relative;
        }
        
        .tab.active {
            color: var(--primary);
        }
        
        .tab.active::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            right: 0;
            height: 2px;
            background: var(--primary);
        }
        
        .tab-content {
            display: none;
        }
        
        .tab-content.active {
            display: block;
        }
    </style>
</head>
<body>
    <div class="dashboard-container">
        <!-- Sidebar -->
        <div class="sidebar">
            <div class="sidebar-header">
                <h2><i class="fas fa-church"></i> Church MS</h2>
                <div class="user-info">
                    <p>Welcome, <?php echo $_SESSION['full_name']; ?></p>
                    <p><?php echo $_SESSION['role']; ?></p>
                </div>
            </div>
            
            <nav class="sidebar-menu">
                <a href="dashboard.php" class="menu-item">
                    <i class="fas fa-tachometer-alt"></i>
                    <span>Dashboard</span>
                </a>
                <a href="members.php" class="menu-item">
                    <i class="fas fa-users"></i>
                    <span>Members</span>
                </a>
                <a href="tithes.php" class="menu-item">
                    <i class="fas fa-hand-holding-usd"></i>
                    <span>Tithes</span>
                </a>
                <a href="offerings.php" class="menu-item">
                    <i class="fas fa-donate"></i>
                    <span>Offerings</span>
                </a>
                <a href="cottages.php" class="menu-item active">
                    <i class="fas fa-home"></i>
                    <span>Cottages</span>
                </a>
                <a href="procurement.php" class="menu-item">
                    <i class="fas fa-shopping-cart"></i>
                    <span>Procurement</span>
                </a>
                <a href="reports.php" class="menu-item">
                    <i class="fas fa-chart-bar"></i>
                    <span>Reports</span>
                </a>
                <a href="users.php" class="menu-item">
                    <i class="fas fa-user-cog"></i>
                    <span>Users</span>
                </a>
            </nav>
        </div>
        
        <!-- Main Content -->
        <div class="main-content">
            <!-- Top Bar -->
            <div class="top-bar">
                <h1>Cottage Management</h1>
                <div class="user-menu">
                    <form action="logout.php" method="POST">
                        <button type="submit" class="logout-btn">
                            <i class="fas fa-sign-out-alt"></i> Logout
                        </button>
                    </form>
                </div>
            </div>
            
            <div class="page-header">
                <h2>Church Cottages</h2>
                <button class="btn btn-primary" onclick="openCottageModal()">
                    <i class="fas fa-plus-circle"></i> Create New Cottage
                </button>
            </div>
            
            <?php if (isset($success)): ?>
                <div class="alert alert-success">
                    <i class="fas fa-check-circle"></i>
                    <?php echo $success; ?>
                </div>
            <?php endif; ?>
            
            <?php if (isset($member_success)): ?>
                <div class="alert alert-success">
                    <i class="fas fa-check-circle"></i>
                    <?php echo $member_success; ?>
                </div>
            <?php endif; ?>
            
            <?php if (isset($member_error)): ?>
                <div class="alert alert-error">
                    <i class="fas fa-exclamation-circle"></i>
                    <?php echo $member_error; ?>
                </div>
            <?php endif; ?>
            
            <!-- Cottage Cards -->
            <div class="cottage-grid">
                <?php foreach ($cottages as $cottage): ?>
                <div class="cottage-card">
                    <div class="cottage-header">
                        <h3><?php echo $cottage['cottage_name']; ?></h3>
                        <span class="cottage-status"><?php echo $cottage['status']; ?></span>
                    </div>
                    <div class="cottage-body">
                        <div class="cottage-info">
                            <div class="info-item">
                                <i class="fas fa-user"></i>
                                <span><?php echo $cottage['cottage_leader']; ?></span>
                            </div>
                            <div class="info-item">
                                <i class="fas fa-calendar-day"></i>
                                <span><?php echo $cottage['meeting_day']; ?> at <?php echo date('h:i A', strtotime($cottage['meeting_time'])); ?></span>
                            </div>
                            <div class="info-item">
                                <i class="fas fa-map-marker-alt"></i>
                                <span><?php echo $cottage['location']; ?></span>
                            </div>
                            <div class="info-item">
                                <i class="fas fa-phone"></i>
                                <span><?php echo $cottage['contact_phone']; ?></span>
                            </div>
                        </div>
                        <div class="member-count">
                            <?php echo $cottage['member_count']; ?> Members
                        </div>
                        <div class="cottage-actions">
                            <a href="cottages.php?cottage_id=<?php echo $cottage['id']; ?>" class="btn btn-sm btn-primary">
                                <i class="fas fa-eye"></i> View Members
                            </a>
                            <button class="btn btn-sm" onclick="editCottage(<?php echo $cottage['id']; ?>)">
                                <i class="fas fa-edit"></i> Edit
                            </button>
                        </div>
                    </div>
                </div>
                <?php endforeach; ?>
            </div>
            
            <!-- Cottage Details Section -->
            <?php if ($selected_cottage && $cottage_details): ?>
            <div class="cottage-details">
                <div class="details-header">
                    <div>
                        <h2><?php echo $cottage_details['cottage_name']; ?> Members</h2>
                        <p class="text-gray"><?php echo $cottage_details['location']; ?></p>
                    </div>
                    <button class="btn btn-success" onclick="openAddMemberModal()">
                        <i class="fas fa-user-plus"></i> Add Member
                    </button>
                </div>
                
                <?php if (count($cottage_members) > 0): ?>
                <div class="members-grid">
                    <?php foreach ($cottage_members as $member): ?>
                    <div class="member-card">
                        <div class="member-avatar">
                            <?php echo substr($member['first_name'], 0, 1) . substr($member['last_name'], 0, 1); ?>
                        </div>
                        <div class="member-info">
                            <h4><?php echo $member['first_name'] . ' ' . $member['last_name']; ?></h4>
                            <p><?php echo $member['member_id']; ?> • <?php echo $member['phone']; ?></p>
                            <span class="role-badge role-<?php echo strtolower($member['role']); ?>">
                                <?php echo $member['role']; ?>
                            </span>
                        </div>
                    </div>
                    <?php endforeach; ?>
                </div>
                <?php else: ?>
                <div class="empty-state">
                    <i class="fas fa-users-slash"></i>
                    <h3>No Members Yet</h3>
                    <p>Add members to this cottage to get started</p>
                </div>
                <?php endif; ?>
            </div>
            <?php endif; ?>
        </div>
    </div>
    
    <!-- Add Cottage Modal -->
    <div class="modal" id="addCottageModal">
        <div class="modal-content">
            <div class="modal-header">
                <h3><i class="fas fa-home"></i> Create New Cottage</h3>
                <button class="close-modal" onclick="closeCottageModal()">&times;</button>
            </div>
            <div class="modal-body">
                <form method="POST" action="">
                    <div class="form-group">
                        <label>Cottage Name *</label>
                        <input type="text" name="cottage_name" class="form-control" required>
                    </div>
                    
                    <div class="form-group">
                        <label>Cottage Leader</label>
                        <input type="text" name="cottage_leader" class="form-control">
                    </div>
                    
                    <div class="form-group">
                        <label>Meeting Day *</label>
                        <select name="meeting_day" class="form-control" required>
                            <option value="">Select Day</option>
                            <option value="Sunday">Sunday</option>
                            <option value="Monday">Monday</option>
                            <option value="Tuesday">Tuesday</option>
                            <option value="Wednesday">Wednesday</option>
                            <option value="Thursday">Thursday</option>
                            <option value="Friday">Friday</option>
                            <option value="Saturday">Saturday</option>
                        </select>
                    </div>
                    
                    <div class="form-group">
                        <label>Meeting Time *</label>
                        <input type="time" name="meeting_time" class="form-control" required>
                    </div>
                    
                    <div class="form-group">
                        <label>Location *</label>
                        <input type="text" name="location" class="form-control" required>
                    </div>
                    
                    <div class="form-group">
                        <label>Contact Person</label>
                        <input type="text" name="contact_person" class="form-control">
                    </div>
                    
                    <div class="form-group">
                        <label>Contact Phone</label>
                        <input type="tel" name="contact_phone" class="form-control">
                    </div>
                    
                    <div class="form-group">
                        <label>Status</label>
                        <select name="status" class="form-control">
                            <option value="Active">Active</option>
                            <option value="Inactive">Inactive</option>
                        </select>
                    </div>
                    
                    <div style="display: flex; gap: 10px; justify-content: flex-end;">
                        <button type="button" class="btn" onclick="closeCottageModal()">Cancel</button>
                        <button type="submit" name="add_cottage" class="btn btn-primary">
                            <i class="fas fa-save"></i> Create Cottage
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    
    <!-- Add Member to Cottage Modal -->
    <?php if ($selected_cottage): ?>
    <div class="modal" id="addMemberModal">
        <div class="modal-content">
            <div class="modal-header">
                <h3><i class="fas fa-user-plus"></i> Add Member to Cottage</h3>
                <button class="close-modal" onclick="closeAddMemberModal()">&times;</button>
            </div>
            <div class="modal-body">
                <form method="POST" action="">
                    <input type="hidden" name="cottage_id" value="<?php echo $selected_cottage; ?>">
                    
                    <div class="form-group">
                        <label>Select Member *</label>
                        <select name="member_id" class="form-control" required>
                            <option value="">Select Member</option>
                            <?php foreach ($members as $member): ?>
                                <option value="<?php echo $member['id']; ?>">
                                    <?php echo $member['name']; ?> (<?php echo $member['member_id']; ?>)
                                </option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                    
                    <div class="form-group">
                        <label>Role *</label>
                        <select name="role" class="form-control" required>
                            <option value="Member">Member</option>
                            <option value="Leader">Leader</option>
                            <option value="Assistant">Assistant Leader</option>
                        </select>
                    </div>
                    
                    <div class="form-group">
                        <label>Join Date *</label>
                        <input type="date" name="join_date" class="form-control" required value="<?php echo date('Y-m-d'); ?>">
                    </div>
                    
                    <div style="display: flex; gap: 10px; justify-content: flex-end;">
                        <button type="button" class="btn" onclick="closeAddMemberModal()">Cancel</button>
                        <button type="submit" name="add_member_to_cottage" class="btn btn-primary">
                            <i class="fas fa-save"></i> Add Member
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <?php endif; ?>
    
    <script>
        function openCottageModal() {
            document.getElementById('addCottageModal').style.display = 'flex';
        }
        
        function closeCottageModal() {
            document.getElementById('addCottageModal').style.display = 'none';
        }
        
        function openAddMemberModal() {
            document.getElementById('addMemberModal').style.display = 'flex';
        }
        
        function closeAddMemberModal() {
            document.getElementById('addMemberModal').style.display = 'none';
        }
        
        function editCottage(id) {
            window.location.href = 'edit_cottage.php?id=' + id;
        }
        
        // Close modals when clicking outside
        window.onclick = function(event) {
            const cottageModal = document.getElementById('addCottageModal');
            const memberModal = document.getElementById('addMemberModal');
            
            if (event.target === cottageModal) {
                closeCottageModal();
            }
            if (event.target === memberModal) {
                closeAddMemberModal();
            }
        }
    </script>
</body>
</html>