<?php

/**

 * Manual Data Entry Interface

 * Allows schools to enter data directly through forms

 */



define('MIGRATION_ACCESS', true);

session_start();



// Fix the path to config.php - go up two levels to reach the root

require_once '../../config.php';



// Check authentication

if (!isset($_SESSION['user_id']) || $_SESSION['role'] !== 'admin') {

    header('Location: ../../index.php');

    exit;

}



$conn = getDBConnection();

$step = $_GET['step'] ?? 1;

$type = $_GET['type'] ?? 'students';

?>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Manual Data Entry - School Management System</title>

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

    <style>

        .entry-container {

            max-width: 1400px;

            margin: 30px auto;

            padding: 20px;

        }

        .data-type-selector {

            display: flex;

            gap: 10px;

            margin-bottom: 30px;

            flex-wrap: wrap;

        }

        .type-btn {

            flex: 1;

            min-width: 120px;

            padding: 15px;

            text-align: center;

            background: #f8f9fa;

            border: 2px solid #dee2e6;

            border-radius: 8px;

            cursor: pointer;

            transition: all 0.3s;

        }

        .type-btn:hover {

            border-color: #667eea;

            background: #f0f3ff;

        }

        .type-btn.active {

            border-color: #667eea;

            background: #667eea;

            color: white;

        }

        .type-btn i {

            font-size: 24px;

            margin-bottom: 8px;

        }

        .entry-form {

            background: white;

            border-radius: 10px;

            padding: 25px;

            box-shadow: 0 2px 15px rgba(0,0,0,0.1);

        }

        .form-section {

            margin-bottom: 30px;

            padding-bottom: 20px;

            border-bottom: 1px solid #dee2e6;

        }

        .form-section h5 {

            color: #667eea;

            margin-bottom: 20px;

        }

        .row-counter {

            background: #f8f9fa;

            padding: 10px 15px;

            border-radius: 8px;

            margin-bottom: 20px;

            display: flex;

            justify-content: space-between;

            align-items: center;

        }

        .add-row-btn {

            border: 2px dashed #667eea;

            background: white;

            padding: 10px;

            border-radius: 8px;

            text-align: center;

            cursor: pointer;

            transition: all 0.3s;

        }

        .add-row-btn:hover {

            background: #f0f3ff;

        }

        .remove-row {

            color: #e74c3c;

            cursor: pointer;

            margin-left: 10px;

            font-size: 1.2em;

        }

        .remove-row:hover {

            color: #c0392b;

        }

        .summary-card {

            background: #f8f9fa;

            border-radius: 8px;

            padding: 15px;

            margin-bottom: 15px;

        }

        .summary-item {

            display: flex;

            justify-content: space-between;

            padding: 8px 0;

            border-bottom: 1px solid #dee2e6;

        }

        .summary-item:last-child {

            border-bottom: none;

        }

        .nav-tabs .nav-link {

            color: #495057;

            font-weight: 500;

        }

        .nav-tabs .nav-link.active {

            color: #667eea;

            font-weight: bold;

            border-bottom: 3px solid #667eea;

        }

        .tab-pane {

            padding: 20px 0;

        }

        .is-invalid {

            border-color: #dc3545;

        }

        .invalid-feedback {

            display: block;

        }

    </style>

</head>

<body>

    <div class="entry-container">

        <div class="d-flex justify-content-between align-items-center mb-4">

            <h2><i class="fas fa-pencil-alt me-3 text-primary"></i>Manual Data Entry</h2>

            <div>

                <a href="../index.php" class="btn btn-outline-secondary">

                    <i class="fas fa-arrow-left me-2"></i>Back to Migration

                </a>

            </div>

        </div>



        <!-- Data Type Selector -->

        <div class="data-type-selector">

            <div class="type-btn <?php echo $type == 'students' ? 'active' : ''; ?>" onclick="selectType('students')">

                <i class="fas fa-users"></i>

                <div>Students</div>

            </div>

            <div class="type-btn <?php echo $type == 'staff' ? 'active' : ''; ?>" onclick="selectType('staff')">

                <i class="fas fa-chalkboard-teacher"></i>

                <div>Staff</div>

            </div>

            <div class="type-btn <?php echo $type == 'fees' ? 'active' : ''; ?>" onclick="selectType('fees')">

                <i class="fas fa-money-bill-wave"></i>

                <div>Fees</div>

            </div>

            <div class="type-btn <?php echo $type == 'payments' ? 'active' : ''; ?>" onclick="selectType('payments')">

                <i class="fas fa-credit-card"></i>

                <div>Payments</div>

            </div>

            <div class="type-btn <?php echo $type == 'subjects' ? 'active' : ''; ?>" onclick="selectType('subjects')">

                <i class="fas fa-book"></i>

                <div>Subjects</div>

            </div>

            <div class="type-btn <?php echo $type == 'scores' ? 'active' : ''; ?>" onclick="selectType('scores')">

                <i class="fas fa-chart-line"></i>

                <div>Scores</div>

            </div>

        </div>



        <!-- Entry Form -->

        <div class="entry-form">

            <form id="manualEntryForm" method="POST" action="save_manual.php">

                <input type="hidden" name="type" value="<?php echo $type; ?>">

                

                <?php if ($type == 'students'): ?>

                    <!-- Students Form with Tabs -->

                    <ul class="nav nav-tabs mb-4" id="studentTabs" role="tablist">

                        <li class="nav-item" role="presentation">

                            <button class="nav-link active" id="student-basic-tab" data-bs-toggle="tab" data-bs-target="#student-basic" type="button" role="tab" aria-controls="student-basic" aria-selected="true">

                                <i class="fas fa-user me-2"></i>Basic Info

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="student-parents-tab" data-bs-toggle="tab" data-bs-target="#student-parents" type="button" role="tab" aria-controls="student-parents" aria-selected="false">

                                <i class="fas fa-users me-2"></i>Parents/Guardian

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="student-contact-tab" data-bs-toggle="tab" data-bs-target="#student-contact" type="button" role="tab" aria-controls="student-contact" aria-selected="false">

                                <i class="fas fa-address-book me-2"></i>Contact

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="student-medical-tab" data-bs-toggle="tab" data-bs-target="#student-medical" type="button" role="tab" aria-controls="student-medical" aria-selected="false">

                                <i class="fas fa-notes-medical me-2"></i>Medical & Additional

                            </button>

                        </li>

                    </ul>

                    

                    <div class="tab-content" id="studentTabsContent">

                        <div class="tab-pane fade show active" id="student-basic" role="tabpanel" aria-labelledby="student-basic-tab">

                            <?php include 'forms/students_basic.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="student-parents" role="tabpanel" aria-labelledby="student-parents-tab">

                            <?php include 'forms/students_parents.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="student-contact" role="tabpanel" aria-labelledby="student-contact-tab">

                            <?php include 'forms/students_contact.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="student-medical" role="tabpanel" aria-labelledby="student-medical-tab">

                            <?php include 'forms/students_medical.php'; ?>

                        </div>

                    </div>

                    

                <?php elseif ($type == 'staff'): ?>

                    <!-- Staff Form with Tabs -->

                    <ul class="nav nav-tabs mb-4" id="staffTabs" role="tablist">

                        <li class="nav-item" role="presentation">

                            <button class="nav-link active" id="staff-basic-tab" data-bs-toggle="tab" data-bs-target="#staff-basic" type="button" role="tab" aria-controls="staff-basic" aria-selected="true">

                                <i class="fas fa-user me-2"></i>Basic Info

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="staff-professional-tab" data-bs-toggle="tab" data-bs-target="#staff-professional" type="button" role="tab" aria-controls="staff-professional" aria-selected="false">

                                <i class="fas fa-graduation-cap me-2"></i>Professional

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="staff-contact-tab" data-bs-toggle="tab" data-bs-target="#staff-contact" type="button" role="tab" aria-controls="staff-contact" aria-selected="false">

                                <i class="fas fa-address-book me-2"></i>Contact

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="staff-bank-tab" data-bs-toggle="tab" data-bs-target="#staff-bank" type="button" role="tab" aria-controls="staff-bank" aria-selected="false">

                                <i class="fas fa-university me-2"></i>Bank & SSNIT

                            </button>

                        </li>

                        <li class="nav-item" role="presentation">

                            <button class="nav-link" id="staff-nextofkin-tab" data-bs-toggle="tab" data-bs-target="#staff-nextofkin" type="button" role="tab" aria-controls="staff-nextofkin" aria-selected="false">

                                <i class="fas fa-heart me-2"></i>Next of Kin

                            </button>

                        </li>

                    </ul>

                    

                    <div class="tab-content" id="staffTabsContent">

                        <div class="tab-pane fade show active" id="staff-basic" role="tabpanel" aria-labelledby="staff-basic-tab">

                            <?php include 'forms/staff_basic.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="staff-professional" role="tabpanel" aria-labelledby="staff-professional-tab">

                            <?php include 'forms/staff_professional.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="staff-contact" role="tabpanel" aria-labelledby="staff-contact-tab">

                            <?php include 'forms/staff_contact.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="staff-bank" role="tabpanel" aria-labelledby="staff-bank-tab">

                            <?php include 'forms/staff_bank.php'; ?>

                        </div>

                        <div class="tab-pane fade" id="staff-nextofkin" role="tabpanel" aria-labelledby="staff-nextofkin-tab">

                            <?php include 'forms/staff_nextofkin.php'; ?>

                        </div>

                    </div>

                    

                <?php elseif ($type == 'fees'): ?>

                    <!-- Fees Form (No Tabs Needed) -->

                    <?php include 'forms/fees_form.php'; ?>

                    

                <?php elseif ($type == 'payments'): ?>

                    <!-- Payments Form (No Tabs Needed) -->

                    <?php include 'forms/payments_form.php'; ?>

                    

                <?php elseif ($type == 'subjects'): ?>

                    <!-- Subjects Form (No Tabs Needed) -->

                    <?php include 'forms/subjects_form.php'; ?>

                    

                <?php elseif ($type == 'scores'): ?>

                    <!-- Scores Form (No Tabs Needed) -->

                    <?php include 'forms/scores_form.php'; ?>

                    

                <?php endif; ?>



                <div class="text-center mt-4">

                    <button type="submit" class="btn btn-primary btn-lg">

                        <i class="fas fa-save me-2"></i>Save All Entries

                    </button>

                </div>

            </form>

        </div>

    </div>



    <script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>

    <script>

// Global function to get field values (to be enhanced)

function getFieldValue(rowIndex, fieldName) {

    // This would need to be enhanced to actually get values from existing fields

    // For now, return empty string

    return '';

}



// Generic addRow function

function addRow(type) {

    const container = document.getElementById('rows-container');

    const template = container.children[0].cloneNode(true);

    const rowCount = container.children.length;

    

    // Update indices

    template.querySelectorAll('[name^="' + type + '"]').forEach(input => {

        const name = input.getAttribute('name');

        input.setAttribute('name', name.replace(/\[\d+\]/, `[${rowCount}]`));

        if (input.type !== 'select-one') {

            input.value = '';

        } else {

            input.selectedIndex = 0;

        }

    });

    

    // Update header

    template.querySelector('h6.text-primary').textContent = type.charAt(0).toUpperCase() + type.slice(1) + ' #' + (rowCount + 1);

    

    container.appendChild(template);

    document.getElementById('row-count').textContent = rowCount + 1;

}



// Generic removeRow function

function removeRow(btn, type) {

    const container = document.getElementById('rows-container');

    const rowCount = container.children.length;

    

    if (rowCount > 1) {

        btn.closest('.data-row').remove();

        

        // Renumber remaining rows

        document.querySelectorAll('.data-row').forEach((row, index) => {

            row.querySelector('h6.text-primary').textContent = type.charAt(0).toUpperCase() + type.slice(1) + ' #' + (index + 1);

            row.querySelectorAll('[name^="' + type + '"]').forEach(input => {

                const name = input.getAttribute('name');

                input.setAttribute('name', name.replace(/\[\d+\]/, `[${index}]`));

            });

        });

        

        document.getElementById('row-count').textContent = container.children.length;

    }

}

        function selectType(type) {

            window.location.href = 'manual_entry.php?type=' + type;

        }



        // Form validation

        document.getElementById('manualEntryForm')?.addEventListener('submit', function(e) {

            let isValid = true;

            const requiredFields = document.querySelectorAll('[required]');

            

            requiredFields.forEach(field => {

                if (!field.value.trim()) {

                    field.classList.add('is-invalid');

                    

                    // Create or update invalid feedback

                    let feedback = field.nextElementSibling;

                    if (!feedback || !feedback.classList.contains('invalid-feedback')) {

                        feedback = document.createElement('div');

                        feedback.className = 'invalid-feedback';

                        field.parentNode.insertBefore(feedback, field.nextSibling);

                    }

                    feedback.textContent = 'This field is required';

                    

                    isValid = false;

                } else {

                    field.classList.remove('is-invalid');

                }

            });



            if (!isValid) {

                e.preventDefault();

                

                // Switch to the tab containing the first invalid field

                const firstInvalid = document.querySelector('.is-invalid');

                if (firstInvalid) {

                    const tabPane = firstInvalid.closest('.tab-pane');

                    if (tabPane) {

                        const tabId = tabPane.id;

                        const tabButton = document.querySelector(`[data-bs-target="#${tabId}"]`);

                        if (tabButton) {

                            const tab = new bootstrap.Tab(tabButton);

                            tab.show();

                        }

                    }

                }

                

                alert('Please fill in all required fields');

            }

        });



        // Initialize tooltips if needed

        const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));

        tooltipTriggerList.map(function (tooltipTriggerEl) {

            return new bootstrap.Tooltip(tooltipTriggerEl);

        });

    </script>

</body>

</html>