@extends('layouts.admin')

@section('content')
<!--App-Content-->
<div class="app-content my-3 my-md-5">
    <div class="side-app">
        <x-page.header>Academic Year Sessions</x-page.header>
        @include('admin.errors.form-errors')
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Add New Academic Year for a Session</h3>
                    </div>

                    <div class="card-body">
                        <form method="POST" action="{{route('academicyearsessions.post')}}" class="form-horizontal">
                            @csrf

                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_name_create">Session <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select name="sid" class="form-control select2-show-search" id="session_name_create" required>
                                            <option value="0" selected disabled>Select</option>
                                            @foreach ($sessions as $item)
                                            <option value="{{$item->sid}}">
                                                {{$educationSystems->firstWhere('esid',$item->esid)->esname.'-'.	$boards->firstWhere('bid',$item->bid)->bname .'-'.$item->sname}}
                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>

                            <!-- Hidden price input field -->
                            <div class="form-group" id="price_container" style="display: none;">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="price_create">Annual fees <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <input type="number" class="form-control" id="price_create" name="price" placeholder="Enter price">
                                        {{-- <input type="hidden" name="annual" id="annual_create" value="1"> --}}
                                        <span class="text-muted">you selected a session belongs to an annual education system, so you have to insert an annual price for this session </span>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Status <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <div class="form-check form-check-inline pt-2">
                                            <input class="form-check-input" type="radio" name="status" id="is_current_create"
                                                value="1" checked>
                                            <label class="form-check-label" for="is_current_create">Current</label>
                                        </div>
                                        <div class="form-check form-check-inline pt-2">
                                            <input class="form-check-input" type="radio" name="status" id="is_next_create"
                                                value="2">
                                            <label class="form-check-label" for="is_next_create">Next</label>
                                        </div>
                                        {{-- <select name="status" class="form-control select2-show-search"   required>
                                                       <option value="1">Current</option>
                                                       <option value="2">Next</option>

                                                        </select> --}}
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_year_create">Year <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <select name="year" id="session_year_create" class="form-control select2-show-search" required>

                                            @foreach(range(date('Y')-1, date('Y')+1) as $y)


                                            <option value="{{$y}}">{{$y}}</option>


                                            @endforeach





                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_start_date_create">Start Date <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <input type="date" class="form-control start_date" name="acystartdate" value="{{ old('acystartdate')}}"
                                            id="session_start_date_create" min="{{date('Y-m-d',strtotime(now()->subYear()))}}">

                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_end_date_create">End Date</label>
                                    </div>
                                    <div class="col-md-9">

                                        {{-- <input type="date" class="form-control end_date" name="acyenddate" value="{{ old('acyenddate')}}"
                                            id="session_end_date_create" min="{{date('Y-m-d',strtotime(now()->subYear()))}}" max="{{date('Y-m-d',strtotime(now()->addYear()))}}"> --}}

                                            <input type="date" class="form-control end_date" name="acyenddate" value="{{ old('acyenddate')}}"
                                            id="session_end_date_create" min="{{date('Y-m-d',strtotime(now()->subYear()))}}">

                                     </div>
                                </div>
                            </div>

                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Active <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <label class="form-swich">
                                        <input type="checkbox" name="is_active" class="form-switch-input">
                                        <span class="form-switch-indicator"></span>
                                        <span class="form-switch-description"></span>
                                        </label>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group mb-0 row justify-content-end">
                                <div class="col-md-3">
                                    <button type="submit" class="btn btn-primary waves-effect waves-light">Add New
                                        Academic Year</button>
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Academic Year Sessions List</h3>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table
                                class="data-table-example table table-striped table-bordered table-vcenter text-nowrap">
                                <thead>
                                    <tr>

                                        <th style="text-align: center;">Id</th>
                                        <th style="text-align: center;">Education System</th>
                                        <th style="text-align: center;">Board</th>
                                        <th style="text-align: center;">Session</th>
                                        <th style="text-align: center;">Name</th>
                                        <th style="text-align: center;">Status</th>
                                        <th style="text-align: center;">Year</th>
                                        <th style="text-align: center;">Start Date</th>
                                        <th style="text-align: center;">End Date</th>

                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                    $count=0
                                    @endphp
                                    @foreach ($academicyearsessions as $acys )
                                    <tr>
                                        <td>{{++$count}}</td>
                                        <td>{{$educationSystems->firstWhere('esid',$sessions->firstWhere('sid',$acys->sid)->esid)->esname}}
                                        </td>
                                        <td>{{$boards->firstWhere('bid',$sessions->firstWhere('sid',$acys->sid)->bid)->bname}}
                                        </td>
                                        <td>{{$sessions->firstWhere('sid',$acys->sid)->sname}}</td>

                                        <td>{{$acys->acyname}}</td>

                                        @if ($acys->is_current)
                                        <td>Current</td>
                                        @elseif ($acys->is_next)
                                        <td>Next</td>
                                        @else
                                        <td>Finished</td>
                                        @endif
                                        <td>{{$acys->year}}</td>
                                        <td>{{$acys->acystartdate}}</td>

                                        <td>{{$acys->acyenddate}}</td>

                                        <td style="text-align: center;">
										<button type="button" value="{{$acys->acysid}}"
                                                    class="modal-effect btn btn-outline-light btn-sm waves-effect waves-light edit"
                                                    data-bs-effect="effect-sign" data-bs-toggle="modal"
                                                    data-bs-original-title="Edit" data-bs-target="#edit"><i
                                                        class="fa fa-edit fs-16"></i></button>
                                        <a href="javascript:void(0)" onClick="confirmDelete(event,{{$acys->acysid}})" class="btn btn-outline-light btn-sm waves-effect waves-light"
                                                    data-bs-toggle="tooltip" data-bs-original-title="Delete"
                                                    title='Delete'>
                                                    <i class="fa fa-trash fs-16"></i>
                                            <form method="POST"
                                                action="{{ route('academicyearsessions.destroy', $acys->acysid) }}" id="delete-form-{{$acys->acysid}}">
                                                @csrf
                                                <input name="_method" type="hidden" value="DELETE">

                                            </form>
                                        </a>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<!-- Edit form modal -->
<div class="modal  fade effect-sign show" id="edit" tabdocumentation="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="example-Modal3">Edit</h5>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <form method="POST" action="" id="academic_year_sessionform" name="AcademicYearSessionform"
                    enctype="multipart/form-data">
                    @csrf
					<div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_name_update">Session <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <select id="session_name_update" name="sid" class="form-control select2-show-search" required>
                                            @foreach ($sessions as $item)
                                            <option value="{{$item->sid}}">
                                                {{$educationSystems->firstWhere('esid',$item->esid)->esname.'-'.	$boards->firstWhere('bid',$item->bid)->bname .'-'.$item->sname}}

                                            </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <!-- Hidden price input field -->
                            <div class="form-group" id="update_price_container" style="display: none;">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="price_create">Annual fees <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <input type="number" class="form-control" id="price_update" name="price" placeholder="Enter price">
                                        {{-- <input type="hidden" name="annual" id="annual_update" value="1"> --}}
                                        <span class="text-muted">you selected a session belongs to an annual education system, so you have to insert an annual price for this session </span>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Status <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9" >
                                        <div class="form-check form-check-inline pt-2">
                                            <input class="form-check-input" type="radio" name="status" id="is_current_update"
                                               value="1">
                                            <label class="form-check-label" for="is_current_update">Current</label>
                                        </div>
                                        <div class="form-check form-check-inline pt-2">
                                            <input class="form-check-input" type="radio" name="status" id="is_next_update"
											value="2" >
                                            <label class="form-check-label" for="is_next_update">Next</label>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_year_update">Year <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <select id="session_year_update" name="year" class="form-control select2-show-search" required>

                                            @foreach(range(date('Y')-1, date('Y')+1) as $y)


                                            <option value="{{$y}}">{{$y}}</option>


                                            @endforeach

                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_start_date_update">Start Date <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">

                                        <input type="date" class="form-control start_date" name="acystartdate"
                                            id="session_start_date_update" min="{{date('Y-m-d',strtotime(now()->subYear()))}}" >

                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2" for="session_end_date_update">End Date</label>
                                    </div>
                                    <div class="col-md-9">

                                        {{-- <input type="date" class="form-control end_date" name="acyenddate"
                                            id="session_end_date_update" min="{{date('Y-m-d',strtotime(now()->subYear()))}}" max="{{date('Y-m-d',strtotime(now()->addYear()))}}"> --}}
                                            <input type="date" class="form-control end_date" name="acyenddate"
                                            id="session_end_date_update" min="{{date('Y-m-d',strtotime(now()->subYear()))}}">

                                    </div>
                                </div>
                            </div>
                            <div class="form-group ">
                                <div class="row">
                                    <div class="col-md-3">
                                        <label class="form-label mt-2">Active <i
                                                class="text-danger">(required)</i></label>
                                    </div>
                                    <div class="col-md-9">
                                        <label class="form-swich">
                                        <input type="checkbox" name="is_active" id="is_active_update" class="form-switch-input" >
                                        <span class="form-switch-indicator"></span>
                                        <span class="form-switch-description"></span>
                                        </label>
                                    </div>
                                </div>
                            </div>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                <button type="submit" id="submit" class="btn btn-primary" value="">Submit</button>
                <input type="hidden" id="session_id" name="acys" value="0">
            </div>

            </form>
        </div>
    </div>
</div>
@endsection
@section('admin-js')
<script>
    $(document).ready(function () {
                //Check if the end date is less than start date
                $( "form" ).submit(function(event){

                    var startDate = new Date($('.start_date').val());
                    var endDate = new Date($('.end_date').val());

                    if (startDate > endDate){
                    event.preventDefault()
                    notif({
						type: "error",
						msg: "The End Date Show be Greater Than The Start Date",
						position: "center",
						opacity: 0.8,
						autohide: true
						});
                    }
                })

                // Get Record data using it's id
                jQuery('body').on('click', '.edit', function () {
                    var session_id = $(this).val();
                    $.get('/staff/academicyearsessions/' + session_id, function (data) {
                        jQuery('#session_name_update').val(data.sid).change();
                        jQuery('#session_year_update').val(data.year).change();
                        if(data.is_current == 1){
                            jQuery('#is_current_update').attr("checked", "checked");
                        }else{
                            jQuery('#is_next_update').attr("checked", "checked");
                        }
                        jQuery('#session_start_date_update').val(data.acystartdate).change();
                        jQuery('#session_end_date_update').val(data.acyenddate).change();
                        jQuery('#price_update').val(data.price).change();
                        if(data.is_active == 1){
                            jQuery('#is_active_update').attr("checked", true);
                        }else{
                            jQuery('#is_active_update').attr("checked", false);
                        }

                        if(data.price != null){
                            jQuery('#update_price_container').show();
                        }else{
                            jQuery('#update_price_container').hide();
                        }

                        jQuery('#submit').val("update");
                        jQuery('#academic_year_sessionform').attr('action', '/staff/academicyearsessions/' + session_id)
                    })
                });
	})

</script>

<script>
    $(document).ready(function() {
    $('#session_name_create, #session_name_update').on('change', function() {
        var selectedSid = $(this).val();

        // Make an AJAX call to fetch details for the selected session
        $.ajax({
            url: '{{ route("getEducationSystemBySession") }}',  // Replace with your API endpoint
            type: 'GET',
            data: {
                sid: selectedSid
            },
            success: function(response) {
                // Check if the response contains is_annual
                if (response.is_annual) {
                    // If true, show the price input field
                    $('#price_container').show();
                    $('#update_price_container').show();
                    $('#price_container,#update_price_container').append(`
                        <input type="hidden" name="annual" id="annual_create" value="1">
                    `)
                    $('#update_price_container').append(`
                        <input type="hidden" name="annual" id="annual_update" value="1">
                    `)
                } else {
                    // If false, hide the price input field
                    $('#price_container').hide();
                    $('#update_price_container').hide();
                    $('#annual_create').remove();
                    $('#annual_update').remove();
                }
            },
            error: function(error) {
                console.log("Error fetching session data:", error);
            }
        });
    });
});

</script>

@endsection