@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

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

    <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">Teaching Diary</p>
                    <div class="d-flex m-2 ms-auto">
                        <button type="submit" class="btn btn-primary btn-sm me-2" id="saveButton">Save</button>
                        <a href="{{ route('teaching_plan.index') }}" class="btn btn-secondary btn-sm mb-3">Cancel</a>
                    </div>
                </div>
                <div class="card-body px-0 pt-0 pb-2">
                    <div class="table-responsive p-0">
                        <!-- Form for Date Selection -->
                        <form method="GET" id="dateForm" action="{{ route('teaching_diary.index') }}">
                            @csrf
                            <div class="row card-header">
                                <div class="col-md-12">
                                    <div class="form-group row">
                                        <div class="col-sm-3"></div>
                                        <label class="col-sm-2 control-label" for="fromdate">Date:</label>
                                        <div class="col-sm-3">
                                            <input type="date" class="form-control" name="fromdate" value="{{ old('fromdate','') }}">

                                        </div>
                                        <div class="col-sm-3">
                                            <button type="button" class="btn btn-primary" id="getDataButton">Get Data</button>
                                        </div>
                                    </div>
                                    <p class="text-center text-danger">
                                        We will display teaching diary data from only the last three days for modifications, and additionally, you can input new teaching diary entries.
                                    </p>
                                    @if($noData)
                                        <p class="text-center text-danger">No records found for the given date. Please try again.</p>
                                    @endif
                                </div>
                            </div>
                        </form>

                        <!-- Form for Saving Teaching Diary Entries -->
                        <form method="POST" action="{{ route('teaching_diary.save') }}" id="saveForm">
                            @csrf
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <th>Date</th>
                                        <th>Day</th>
                                        <th>Class</th>
                                        <th>Period/Time</th>
                                        <th>Theory/Practical</th>
                                        <th>Topics Covered</th>
                                        <th>Methodology Adopted</th>
                                        <th>No. of Students Attended</th>
                                        <th>Teaching Aids Used</th>
                                        <th>Student Activity Conducted</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @for ($i = 0; $i < 10; $i++)
                                        <tr>
                                            <!-- Hidden Field for cms_teaching_direct_diary_sid -->
                                            <input type="hidden" name="cms_teaching_direct_diary_sid_{{ $i }}" value="{{ old('cms_teaching_direct_diary_sid_' . $i, isset($diaries[$i]) ? $diaries[$i]->cms_teaching_direct_diary_sid : 0) }}">
                        
                                            <td><input type="date" class="form-control" name="teaching_plan_date_{{ $i }}" value="{{ old('teaching_plan_date_' . $i, isset($diaries[$i]) ? $diaries[$i]->teaching_plan_date->format('Y-m-d') : '') }}"></td>
                                            <td><input type="text" class="form-control" name="teaching_plan_day_{{ $i }}" value="{{ old('teaching_plan_day_' . $i, isset($diaries[$i]) ? $diaries[$i]->teaching_plan_day : '') }}"></td>
                                            <td><input type="text" class="form-control" name="teaching_class_{{ $i }}" value="{{ old('teaching_class_' . $i, isset($diaries[$i]) ? $diaries[$i]->teaching_class : '') }}"></td>
                                            <td><input type="text" class="form-control" name="teaching_period_{{ $i }}" value="{{ old('teaching_period_' . $i, isset($diaries[$i]) ? $diaries[$i]->teaching_period : '') }}"></td>
                                            <td><input type="text" class="form-control" name="teaching_type_{{ $i }}" value="{{ old('teaching_type_' . $i, isset($diaries[$i]) ? $diaries[$i]->teaching_type : '') }}"></td>
                                            <td><input type="text" class="form-control" name="topics_covered_{{ $i }}" value="{{ old('topics_covered_' . $i, isset($diaries[$i]) ? $diaries[$i]->topics_covered : '') }}"></td>
                                            <td><input type="text" class="form-control" name="methodology_adopt_{{ $i }}" value="{{ old('methodology_adopt_' . $i, isset($diaries[$i]) ? $diaries[$i]->methodology_adopt : '') }}"></td>
                                            <td><input type="number" class="form-control" name="noofstudent_attend_{{ $i }}" value="{{ old('noofstudent_attend_' . $i, isset($diaries[$i]) ? $diaries[$i]->noofstudent_attend : '') }}"></td>
                                            <td><input type="text" class="form-control" name="teaching_aid_used_{{ $i }}" value="{{ old('teaching_aid_used_' . $i, isset($diaries[$i]) ? $diaries[$i]->teaching_aid_used : '') }}"></td>
                                            <td><input type="text" class="form-control" name="student_activity_conducted_{{ $i }}" value="{{ old('student_activity_conducted_' . $i, isset($diaries[$i]) ? $diaries[$i]->student_activity_conducted : '') }}"></td>
                                        </tr>
                                    @endfor
                                </tbody>
                            </table>
                        </form>
                        
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script type="text/javascript">
        // Trigger GET form submission on "Get Data" button click
        document.getElementById('getDataButton').addEventListener('click', function(event) {
            event.preventDefault(); // Prevent the default button click behavior
            document.getElementById('dateForm').submit(); // Submit the date form
        });

        // Trigger POST form submission on "Save" button click
        document.getElementById('saveButton').addEventListener('click', function(event) {
            event.preventDefault(); // Prevent default button behavior
            document.getElementById('saveForm').submit(); // Submit the save form
        });
        
    </script>
    
@endpush