@extends('layouts.app')

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => $title])

    <div class="row mt-4 mx-4">
        <div class="col-12">
            <div class="card mb-4">
                <div class="d-flex align-items-center">
                    <p class="mb-0 ms-2 mt-2">{{ $title }}</p>
                </div>
                <div class="card-body px-0 pt-0 pb-2">
                    <div class="d-flex justify-content-center">
                        <div class="col-md-8">
                            <!-- Load Form -->
                            <form id="loadForm" method="GET" action="{{ route('students.progress_report', $student->cms_student_sid ) }}">
                                @csrf
                                <div class="container col-lg-6">
                                    <!-- Start row for inputs -->
                                    <div class="row">
                                        <!-- First input field (register_no) -->
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="register_no">Student Register #:</label>
                                                <input type="text" id="register_no" class="form-control" name="register_no" value="{{ old('register_no', $register_no) }}" required readonly>
                                            </div>
                                        </div>

                                        <!-- Second input field (class selection) -->
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label for="first_cms_class_sid">Class:</label>
                                                <select name="first_cms_class_sid" id="first_cms_class_sid" class="form-control" required>
                                                    <option value="">--Select Any--</option>
                                                    @foreach($classes as $class)
                                                        <option value="{{ $class->cms_class_sid }}" {{ old('first_cms_class_sid') == $class->cms_class_sid ? 'selected' : '' }}>{{ $class->class_name }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- End row for inputs -->

                                    <!-- Load button centered -->
                                    <div class="d-flex justify-content-center mt-3">
                                        <button type="button" id="loadButton" class="btn btn-secondary me-2">Load</button>
                                    </div>
                                </div>
                            </form>

                            <!-- Generate Report Form -->
                            <form method="POST" action="{{ route('students.save_progress_report', $student->cms_student_sid) }}">

                                @csrf
                                <div class="mt-4">
                                    <!-- Table with Months as Columns and Text Inputs for Each Month -->
                                    <table class="table table-bordered">
                                        <thead>
                                            <tr>
                                                <th>Month</th>
                                                @foreach(['January', 'February', 'March', 'April', 'May', 'Jun', 'July', 'August', 'September', 'October', 'November', 'December'] as $month)
                                                    <th>{{ $month }}</th>
                                                @endforeach
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>Working Days</td>
                                                @foreach(['jan', 'feb', 'mar', 'apr', 'may', 'june', 'july', 'aug', 'sep', 'oct', 'nov', 'dec'] as $month)
                                                    <td>
                                                        <input type="number" class="form-control" name="working_days[{{ $month }}]" value="{{ old('working_days.' . $month, $workingDays[$month] ?? '') }}">
                                                    </td>
                                                @endforeach
                                            </tr>
                                            <tr>
                                                <td>Present Days</td>
                                                @foreach(['jan', 'feb', 'mar', 'apr', 'may', 'june', 'july', 'aug', 'sep', 'oct', 'nov', 'dec'] as $month)
                                                    <td>
                                                        <input type="number" class="form-control" name="present_days[{{ $month }}]" value="{{ old('present_days.' . $month, $presentDays[$month] ?? '') }}">
                                                    </td>
                                                @endforeach
                                            </tr>
                                        </tbody>
                                    </table>

                                    <!-- Generate Report button centered -->
                                    <div class="d-flex justify-content-center mt-3">
                                        <button type="submit" class="btn btn-primary mr-2 me-2">Save & Generate Certificate</button>
                                        <a href="{{ route('student.index') }}" class="btn btn-secondary mr-2">Cancel</a>


                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $('#loadButton').click(function() {
            // Get form data
            var register_no = $('#register_no').val();
            var first_cms_class_sid = $('#first_cms_class_sid').val();

            // Dynamically get the student SID from your Blade variable (if available)
            var studentSid = "{{ $student->cms_student_sid }}"; // Assuming $student is available in the blade

            // Perform AJAX request to load data
            $.ajax({
                url: "/students/loadreport/" + studentSid,  // Ensure this URL is correct
                type: "GET",  // Use GET for retrieving data
                data: {
                    register_no: register_no,
                    first_cms_class_sid: first_cms_class_sid,
                },
                success: function(response) {
                    console.log(response);  // Log the response to verify the data structure
                    if (response.success) {
                        // Loop through the months and populate the fields for working_days
                        $.each(response.data.working_days, function(month, value) {
                            $('input[name="working_days[' + month + ']"]').val(value);
                        });
                        // Loop through the months and populate the fields for present_days
                        $.each(response.data.present_days, function(month, value) {
                            $('input[name="present_days[' + month + ']"]').val(value);
                        });
                    } else {
                        alert('No data found or invalid data');
                    }
                },
                error: function(xhr, status, error) {
                    console.error("Error:", error);  // Log the error
                    alert('There was an error fetching the data.');
                }
            });
        });
    </script>
@endpush