@extends('layouts.app')
@section('content')
    <link rel="stylesheet" href="{{asset("css/calendar.css")}}">
    <script src="{{asset("js/calendar.js")}}"></script>
    <meta name="csrf-token" content="{!! csrf_token() !!}">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-10">
                <div class="btn-group btn-group-toggle" data-toggle="buttons">
                    <span id="check_calendar" class="btn btn-primary button-radio-aba active">
                        <input type="radio" name="options" id="option1" checked ><button id="button_calendar" class="button_hidden">Agenda</button>
                    </span>
                    <span id="check_list" class="btn btn-primary button-radio-aba">
                        <input type="radio" name="options" id="option2"><button id="button_list" class="button_hidden">Relatório</button>
                    </span>
                </div>
                <div class="card">
                    <input id="client-filter" type="hidden" value="">
                    <input id="grade-filter" type="hidden" value="">

                    @include('grades.topBar')

                    <div id="container-data" style="display: none">
                        @include('grades.calendar.index')
                    </div>
                </div>
            </div>
        </div>
    </div>

    @include('grades.modal.schedule', ['grade' => $filters['grade_id']])
    @include('grades.modal.forbidden')
    @if(session()->has('confirmDeleteGrade'))
        @include('grades.delete',[
            'description' => session()->get('description'),
        ])
    @endif
    <script>
        $(document).ready(function(){
            let client = "{{$schedule_id_client}}"
            var grade = "{{$schedule_id_grade}}"

            if(client != ''){
                $.ajax({
                    method: "POST",
                    url: "/grades/get/agenda",
                    data: {
                        "_token": $('meta[name="csrf-token"]').attr('content'),
                        'id': client,
                    }
                }).done(function(resp) {
                    const languagesSelect = document.getElementById('selectCalendar')

                    for (key in resp) {
                        option = new Option(resp[key], key);
                        languagesSelect.options[languagesSelect.options.length] = option;
                    }
                    $("#selectCalendar").val(grade)
                    $("#container-selectCalendar").show()
                    if (grade != 0) {
                        $("#client-filter").val($("#selectLoja").val())
                        $("#grade-filter").val(grade)
                        $("#createGrade").val(grade)
                        $("#gradeSchedule").val(grade)
                        $("#idRemoveGrade").val(grade)
                        $.ajax({
                            method: "POST",
                            url: "/grades/get/calendar",
                            data: {
                                "_token": $('meta[name="csrf-token"]').attr('content'),
                                'grade': grade,
                                'client': $("#selectLoja").val(),
                                'layout': $("#layout").val(),
                            }
                        }).done(function(resp) {
                            $("#container-data").html(resp)
                            if ($("#layout").val() == 0) {
                                $("#editAgenda").show()
                                $("#container-data").show()
                            }
                        })
                    }
                })
            }
        })
    </script>

@endsection