<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            <i class="fa fa-gavel"></i> <?php echo $this->lang->line('discipline'); ?> <small><?php echo $this->lang->line('student_fee1'); ?></small>
        </h1>
         <a href="<?php echo base_url(); ?>admin/discipline/incident_reports" class="col-md pull-right">Report New Incident</a>
        <b style="padding-left:5px;padding-right:5px;" class="pull-right"> | </b>
        <a href="<?php echo base_url(); ?>admin/discipline/incident_categories" class="col-md pull-right">Incident Categories</a>
        <b style="padding-left:5px;padding-right:5px;" class="pull-right"> | </b>
        <a href="<?php echo base_url(); ?>admin/discipline/incident_types" class="col-md pull-right">Incident Types</a>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <!-- Left Column - Form -->
            <div class="col-md-6">
                <div class="box box-primary">
                    <div class="box-header with-border">
                        <h3 class="box-title">Create Incident Report</h3>
                    </div>
                    <!-- form start -->
                    <form id="form1" action="<?php echo base_url() ?>admin/discipline/create_incident" method="post" accept-charset="utf-8">
                        <div class="box-body">
                            <?php if ($this->session->flashdata('msg')) { ?>
                                <?php echo $this->session->flashdata('msg') ?>
                            <?php } ?>
                            
                            <?php echo $this->customlib->getCSRF(); ?>
                            
                            <!-- Class and Section Selection -->
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="class_id">Level <small class="req"> *</small></label>
                                        <select id="class_id" name="class_id" class="form-control" required>
                                            <option value="">Select Class</option>
                                            <?php
                                            foreach ($classlist as $class) {
                                                ?>
                                                <option value="<?php echo $class['id'] ?>" <?php echo set_select('class_id', $class['id']); ?>><?php echo $class['class'] ?></option>
                                                <?php
                                            }
                                            ?>
                                        </select>
                                        <span class="text-danger"><?php echo form_error('class_id'); ?></span>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="section_id">Class <small class="req"> *</small></label>
                                        <select id="section_id" name="section_id" class="form-control" required>
                                            <option value="">Select Section</option>
                                            <?php
                                            if (set_value('class_id')) {
                                                $sections = $this->section_model->getByClass(set_value('class_id'));
                                                foreach ($sections as $section) {
                                                    ?>
                                                    <option value="<?php echo $section['section_id'] ?>" <?php echo set_select('section_id', $section['section_id']); ?>><?php echo $section['section'] ?></option>
                                                    <?php
                                                }
                                            }
                                            ?>
                                        </select>
                                        <span class="text-danger"><?php echo form_error('section_id'); ?></span>
                                    </div>
                                </div>
                            </div>

                            <!-- Student Selection -->
                            <div class="form-group">
                                <label for="student_id">Learner <small class="req"> *</small></label>
                                <select id="student_id" name="student_id" class="form-control" required>
                                    <option value="">Select Learner</option>
                                    <?php
                                    if (set_value('class_id') && set_value('section_id')) {
                                        $students = $this->student_model->searchByClassSection(set_value('class_id'), set_value('section_id'));
                                        foreach ($students as $student) {
                                            ?>
                                            <option value="<?php echo $student['id'] ?>" <?php echo set_select('student_id', $student['id']); ?>>
                                                <?php echo $student['firstname'] . ' ' . $student['lastname'] . ' (' . $student['admission_no'] . ')'; ?>
                                            </option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select>
                                <span class="text-danger"><?php echo form_error('student_id'); ?></span>
                            </div>

                            <!-- Incident Type and Category -->
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="incident_type_id">Incident Type <small class="req"> *</small></label>
                                        <select id="incident_type_id" name="incident_type_id" class="form-control" required>
                                            <option value="">Select Incident Type</option>
                                            <?php foreach ($incident_types as $type) { ?>
                                                <option value="<?php echo $type['id']; ?>" <?php echo set_select('incident_type_id', $type['id']); ?>><?php echo $type['name']; ?></option>
                                            <?php } ?>
                                        </select>
                                        <span class="text-danger"><?php echo form_error('incident_type_id'); ?></span>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="incident_category_id">Incident Category <small class="req"> *</small></label>
                                        <select id="incident_category_id" name="incident_category_id" class="form-control" required>
                                            <option value="">Select Incident Category</option>
                                            <?php foreach ($incident_categories as $category) { ?>
                                                <option value="<?php echo $category['id']; ?>" <?php echo set_select('incident_category_id', $category['id']); ?>><?php echo $category['name']; ?></option>
                                            <?php } ?>
                                        </select>
                                        <span class="text-danger"><?php echo form_error('incident_category_id'); ?></span>
                                    </div>
                                </div>
                            </div>

                            <!-- Reported To and By -->
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="reported_to">Reported To <small class="req"> *</small></label>
                                        <input type="text" id="reported_to" name="reported_to" class="form-control" placeholder="Name of person reported to" value="<?php echo set_value('reported_to'); ?>" required>
                                        <span class="text-danger"><?php echo form_error('reported_to'); ?></span>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="reported_by">Reported By <small class="req"> *</small></label>
                                        <input type="text" id="reported_by" name="reported_by" class="form-control" placeholder="Name of reporter" value="<?php echo set_value('reported_by'); ?>" required>
                                        <span class="text-danger"><?php echo form_error('reported_by'); ?></span>
                                    </div>
                                </div>
                            </div>

                            <!-- Incident Date -->
                            <div class="form-group">
                                <label for="incident_date">Incident Date <small class="req"> *</small></label>
                                <input type="text" id="incident_date" name="incident_date" class="form-control date" placeholder="Incident Date" value="<?php echo set_value('incident_date'); ?>" required>
                                <span class="text-danger"><?php echo form_error('incident_date'); ?></span>
                            </div>

                            <!-- Description -->
                            <div class="form-group">
                                <label for="description">Description of Incident <small class="req"> *</small></label>
                                <textarea id="description" name="description" class="form-control" rows="3" placeholder="Describe the incident in detail" required><?php echo set_value('description'); ?></textarea>
                                <span class="text-danger"><?php echo form_error('description'); ?></span>
                            </div>

                            <!-- Action Taken -->
                            <div class="form-group">
                                <label for="action_taken">Action Taken</label>
                                <textarea id="action_taken" name="action_taken" class="form-control" rows="2" placeholder="Actions taken to address the incident"><?php echo set_value('action_taken'); ?></textarea>
                                <span class="text-danger"><?php echo form_error('action_taken'); ?></span>
                            </div>

                            <!-- Outcome -->
                            <div class="form-group">
                                <label for="outcome">Outcome</label>
                                <textarea id="outcome" name="outcome" class="form-control" rows="2" placeholder="Result or outcome of the incident"><?php echo set_value('outcome'); ?></textarea>
                                <span class="text-danger"><?php echo form_error('outcome'); ?></span>
                            </div>
                        </div>
                        <!-- /.box-body -->

                        <div class="box-footer">
                            <button type="submit" class="btn btn-primary pull-right">Create Incident Report</button>
                        </div>
                    </form>
                </div>
            </div>

            <!-- Right Column - Student List (Optional) -->
            <!-- Right Column - Student List (Optional) -->
<div class="col-md-6">
    <div class="box box-info">
        <div class="box-header with-border">
            <h3 class="box-title">Students with Incident Reports</h3>
        </div>
        <div class="box-body">
            <div id="students_with_incidents">
                <?php if (empty($students_with_incidents)) { ?>
                    <p class="text-muted">No students with incident reports found</p>
                <?php } else { ?>
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th>Student</th>
                                    <th>Level</th>
                                    <th>Incident Type</th>
                                    <th>Category</th>
                                    <th>Incident Date</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php foreach ($students_with_incidents as $student) { ?>
                                    <tr>
                                        <td>
                                            <strong><?php echo $student['firstname'] . ' ' . $student['lastname']; ?></strong><br>
                                            <small class="text-muted"><?php echo $student['admission_no']; ?></small>
                                        </td>
                                        <td><?php echo $student['class'] . ' ' . $student['section']; ?></td>
                                        <td>
                                            <span class="label label-warning"><?php echo $student['incident_type']; ?></span>
                                        </td>
                                        <td>
                                            <span class="label label-info"><?php echo $student['incident_category']; ?></span>
                                        </td>
                                        <td>
                                            <small><?php echo date('d M Y', strtotime($student['latest_incident'])); ?></small>
                                            <?php if ($student['incident_count'] > 1) { ?>
                                                <br><small class="text-danger"><?php echo $student['incident_count']; ?> incidents</small>
                                            <?php } ?>
                                        </td>
                                    </tr>
                                <?php } ?>
                            </tbody>
                        </table>
                    </div>
                <?php } ?>
            </div>
        </div>
    </div>
</div>
        </div>
    </section>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        // Initialize datepicker
        $('.date').datepicker({
            format: "dd-mm-yyyy",
            autoclose: true
        });

        // Get sections when class changes
        $(document).on('change', '#class_id', function (e) {
            var class_id = $(this).val();
            var base_url = '<?php echo base_url() ?>';
            
            // Clear section and student dropdowns
            $('#section_id').html('<option value="">Select Section</option>');
            $('#student_id').html('<option value="">Select Learner</option>');
            $('#student_list_container').html('<p class="text-muted">Select a class and section to view learners</p>');
            
            if (class_id) {
                $.ajax({
                    type: "GET",
                    url: base_url + "sections/getByClass",
                    data: {'class_id': class_id},
                    dataType: "json",
                    success: function (data) {
                        $.each(data, function (i, obj) {
                            $('#section_id').append("<option value=" + obj.section_id + ">" + obj.section + "</option>");
                        });
                    }
                });
            }
        });

        // Get students when section changes
        $(document).on('change', '#section_id', function (e) {
            var class_id = $('#class_id').val();
            var section_id = $(this).val();
            var base_url = '<?php echo base_url() ?>';
            
            // Clear student dropdown
            $('#student_id').html('<option value="">Select Learner</option>');
            $('#student_list_container').html('<div class="text-center"><i class="fa fa-spinner fa-spin"></i> Loading learners...</div>');
            
            if (class_id && section_id) {
                $.ajax({
                    type: "POST",
                    url: base_url + "admin/discipline/get_students_by_class_section",
                    data: {'class_id': class_id, 'section_id': section_id},
                    dataType: "json",
                    success: function (data) {
                        $('#student_id').html('<option value="">Select Learner</option>');
                        $('#student_list_container').html('');
                        
                        if (data.status == 'success') {
                            $.each(data.students, function (i, student) {
                                $('#student_id').append("<option value='" + student.id + "'>" + student.firstname + " " + student.lastname + " (" + student.admission_no + ")" + "</option>");
                                
                                // Add to student list display
                                $('#student_list_container').append(
                                    '<div class="student-item">' +
                                    '<strong>' + student.firstname + ' ' + student.lastname + '</strong><br>' +
                                    '<small class="text-muted">Admission No: ' + student.admission_no + '</small>' +
                                    '<hr>' +
                                    '</div>'
                                );
                            });
                            
                            if (data.students.length === 0) {
                                $('#student_list_container').html('<p class="text-danger">No learners found in this class and section</p>');
                            }
                        } else {
                            $('#student_list_container').html('<p class="text-danger">Error loading learners</p>');
                        }
                    },
                    error: function () {
                        $('#student_list_container').html('<p class="text-danger">Error loading learners</p>');
                    }
                });
            } else {
                $('#student_list_container').html('<p class="text-muted">Select a class and section to view learners</p>');
            }
        });
    });
    // Get students when section changes for dropdown only
$(document).on('change', '#section_id', function (e) {
    var class_id = $('#class_id').val();
    var section_id = $(this).val();
    var base_url = '<?php echo base_url() ?>';
    
    // Clear student dropdown
    $('#student_id').html('<option value="">Select Learner</option>');
    
    if (class_id && section_id) {
        $.ajax({
            type: "POST",
            url: base_url + "admin/discipline/get_students_by_class_section",
            data: {'class_id': class_id, 'section_id': section_id},
            dataType: "json",
            success: function (data) {
                $('#student_id').html('<option value="">Select Learner</option>');
                
                if (data.status == 'success') {
                    $.each(data.students, function (i, student) {
                        $('#student_id').append("<option value='" + student.id + "'>" + student.firstname + " " + student.lastname + " (" + student.admission_no + ")" + "</option>");
                    });
                }
            }
        });
    }
});
</script>

<style>
.student-item {
    padding: 10px;
    border-bottom: 1px solid #f4f4f4;
}
.student-item:last-child {
    border-bottom: none;
}
</style>