@extends('template.layout')

@section('content')
    @include('sweet::alert')
    <h1 class="page-title">
        Reporte estadístico Titulados
    </h1>
    <div class="portlet light portlet-fit portlet-datatable bordered">

        <div class="portlet-body">

            <div class=" row" style="padding-top: 3%;">
                <div class="col-lg-12 ">
                    <div class="row">
                        <div class="col-lg-12" style="text-align: center;">
                            <span class="caption-subject font-green sbold uppercase"> Cantidad de Alumnos titulados por periodo </span>
                            <div id="graph1">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class=" row" style="padding-top: 5%;">
                <div class="col-lg-12 ">
                    <div class="row">
                        <div class="col-lg-12" style="text-align: center;">
                            <span class="caption-subject font-green sbold uppercase"> Cantidad de Alumnos titulados por promoción </span>
                            <div id="graph2">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>


@endsection
@section('scripts')
    <script>

        $(document).ready(function () {

            var color_array = ['#03658C', '#7CA69E', '#F2594A', '#F28C4B', '#7E6F6A', '#36AFB2', '#9c6db2', '#d24a67', '#89a958', '#00739a', '#BDBDBD'];

            $.ajax({
                url: "{{ url('reportesestadisticos/tituladosporperiodo') }}",
                type: "GET",
                success: function (result) {

                    $('#graph1').empty();

                    if (result.length == 0) {
                        $("#graph1").html("<div class='well' style='text-align: center;'> No se tiene información registrada</div>");
                    } else {
                        Morris.Bar({
                            element: 'graph1',
                            data: result,
                            xkey: 'y',
                            ykeys: ['a'],
                            labels: ['Cantidad titulados'],
                            barColors: color_array
                        });
                    }

                }
            });

            $.ajax({
                url: "{{ url('reportesestadisticos/tituladosporpromocion') }}",
                type: "GET",
                success: function (result) {

                    $('#graph2').empty();

                    if (result.length == 0) {
                        $("#graph2").html("<div class='well' style='text-align: center;'> No se tiene información registrada</div>");
                    } else {
                        Morris.Bar({
                            element: 'graph2',
                            data: result,
                            xkey: 'y',
                            ykeys: ['a'],
                            labels: ['Cantidad titulados'],
                            barColors: color_array
                        });
                    }

                }
            });

        });

    </script>
@endsection