@extends('template.layout')
@section('content')
    <h1 class="page-title">
        Estadísticas
    </h1>

    <div class="portlet light portlet-fit portlet-form bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject sbold uppercase">Libros mas prestados durante el ciclo por mes </span>
            </div>
        </div>
        <div class="portlet-body">
            <div class="row" style="padding-bottom: 15px">
                <div class="col-xs-12">
                    <div class="col-xs-6">
                        <select class="col-xs-6 form-control" id="meses">
                            <option value="1">Enero</option>
                            <option value="2">Febrero</option>
                            <option value="3">Marzo</option>
                            <option value="4">Abril</option>
                            <option value="5">Mayo</option>
                            <option value="6">Junio</option>
                            <option value="7">Julio</option>
                            <option value="8">Agosto</option>
                            <option value="9">Septimebre</option>
                            <option value="10">Octubre</option>
                            <option value="11">Noviembre</option>
                            <option value="12">Diciembre</option>
                        </select>
                    </div>
                    <div class="col-xs-6">
                        <select class="col-xs-6 form-control" id="ciclos">
                            @foreach($ciclos as $ciclo)
                                <option value="{{$ciclo->id}}">{{$ciclo->nombre}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12">
                    <div class="col-xs-12">
                        <div id="bibliografias" style="padding-top: 4%;">

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

    <div class="portlet light portlet-fit portlet-form bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject sbold uppercase"> Libros más prestados por especialidad</span>
            </div>
        </div>

        <div class="portlet-body">
            <div class="row" style="padding-bottom: 15px">
                <div class="col-xs-12">
                    <div class="col-xs-12">
                        <select class="col-xs-6 form-control" id="carreras">
                            @foreach($especialidades as $especialidad)
                                <option value="{{$especialidad->id}}">{{$especialidad->nombre}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12">
                    <div class="col-xs-12">

                        <div id="Especialidades" style="padding-top: 4%;">

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

        </div>
    </div>

    <div class="portlet light portlet-fit portlet-form bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject sbold uppercase"> Libros virtuales mas descargados</span>
            </div>
        </div>

        <div class="portlet-body">
            <div class="row">
                <div class="col-xs-12">
                    <div class="col-xs-12">
                        <div id="bibliografiasmasdescargadas">

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

        </div>
    </div>

    <div class="portlet light portlet-fit portlet-form bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject sbold uppercase"> Investigaciones mas descargadas</span>
            </div>
        </div>

        <div class="portlet-body">
            <div class="row">
                <div class="col-xs-12">
                    <div class="col-xs-12">
                        <div id="investigacionesmasdescargadas">

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

        </div>
    </div>

    <div class="row">

        <div class="col-xs-12 col-lg-12">
            <div class="portlet light portlet-fit portlet-form bordered">
                <div class="portlet-title">
                    <div class="caption">
                        <span class="caption-subject sbold uppercase">Comportamiento de préstamos por año</span>
                    </div>
                    <div class="row">
                        <div class="col-lg-12" style="text-align: right;">
                            <select id="selectAnio" class="form-control" style="width: 50%">
                                @foreach($anios as $item)
                                    <option value="{{$item->Anio}}">{{$item->Anio}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                <div class="portlet-body">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="col-xs-12">
                                <div id="prestamoanio">\
                                </div>
                            </div>
                        </div>
                    </div>

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

    <div class="row">
        <div class="col-xs-6">
            <div class="portlet light portlet-fit portlet-form bordered">
                <div class="portlet-title">
                    <div class="caption">
                        <span class="caption-subject sbold uppercase"> Top 10 personas que mas reservan</span>
                    </div>
                </div>
                <div class="portlet-body">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="col-xs-12">
                                <div id="Ranking"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-6">
            <div class="portlet light portlet-fit portlet-form bordered">
                <div class="portlet-title">
                    <div class="caption">
                        <span class="caption-subject sbold uppercase">Reservas vs en Préstamos</span>
                    </div>
                </div>
                <div class="portlet-body">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="col-xs-12">
                                <div id="ReservasVsPrestamos"></div>
                            </div>
                        </div>
                    </div>

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

@endsection
@section('scripts')
    <script>
        $('#selectAnio').select2();

        $("#carreras").change(function () {
            var id = $("#carreras option:selected").val();
            console.log(id);
            $.ajax({
                url: "{{ url('reporte/bibliografiascarrera') }}",
                type: "GET",
                data: {
                    id_carrera: id
                },
                cache: false,
                success: function (result) {
                    $('#Especialidades').html(result);
                }
            });
        });

        $("#selectAnio").change(function () {
            var id = $("#selectAnio option:selected").val();
            $.ajax({
                url: "{{ url('reporte/reporteprestamosporaniomes') }}",
                data: {
                    Anio: id
                },
                type: "GET",
                success: function (result) {
                    $('#prestamoanio').html(result);
                }
            });
        });

        $("#meses").change(function () {
            var id_ciclo = $("#ciclos option:selected").val();
            var id_mes = $("#meses option:selected").val();
            $.ajax({
                url: "{{ url('reporte/bibliografiasciclomes') }}",
                type: "GET",
                data: {
                    id_mes: id_mes,
                    id_ciclo: id_ciclo
                },
                cache: false,
                success: function (result) {
                    $('#bibliografias').html(result);
                }
            });
        });
        $("#ciclos").change(function () {
            var id_ciclo = $("#ciclos option:selected").val();
            var id_mes = $("#meses option:selected").val();
            $.ajax({
                url: "{{ url('reporte/bibliografiasciclomes') }}",
                type: "GET",
                data: {
                    id_mes: id_mes,
                    id_ciclo: id_ciclo
                },
                cache: false,
                success: function (result) {
                    $('#bibliografias').html(result);
                }
            });
        });

        $(document).ready(function () {

            $.ajax({
                url: "{{ url('reporte/bibliografiasciclomes') }}",
                type: "GET",
                data: {
                    id_mes: 1,
                    id_ciclo: 1
                },
                cache: false,
                success: function (result) {
                    $('#bibliografias').html(result);
                }
            });

            $.ajax({
                url: "{{ url('reporte/reportedescargasporbibliografias') }}",
                type: "GET",
                cache: false,
                success: function (result) {
                    $('#bibliografiasmasdescargadas').html(result);
                }
            });

            $.ajax({
                url: "{{ url('reporte/reportedescargasporinvestigaciones') }}",
                type: "GET",
                cache: false,
                success: function (result) {
                    $('#investigacionesmasdescargadas').html(result);
                }
            });

            var id = $("#selectAnio option:selected").val();
            $.ajax({
                url: "{{ url('reporte/reporteprestamosporaniomes') }}",
                data: {
                    Anio: id
                },
                type: "GET",
                success: function (result) {
                    $('#prestamoanio').html(result);
                }
            });


            $.ajax({
                url: "{{ url('reporte/bibliografiascarrera') }}",
                type: "GET",
                data: {
                    id_carrera: 1
                },
                cache: false,
                success: function (result) {
                    $('#Especialidades').html(result);
                }
            });

            $.ajax({
                url: "{{ url('reporte/reservasprestamos') }}",
                data: {},
                type: "GET",
                success: function (result) {

                    if (result.length != 0) {
                        new Morris.Donut({
                            element: 'ReservasVsPrestamos',
                            data: result
                        }).on('click', function (i, row) {
                            console.log(i, row);
                        });
                    } else {
                        $("#ReservasVsPrestamos").html('<div class="well" style="text-align: center;"> No se tiene información registrada</div>');
                    }

                }
            });

            $.ajax({
                url: "{{ url('reporte/reservasporpersona') }}",
                data: {},
                type: "GET",
                success: function (result) {
                    if (result.length != 0) {
                        new Morris.Bar({
                            element: 'Ranking',
                            data: result,
                            xkey: 'label',
                            ykeys: ['value'],
                            labels: ['Reservas']
                        });
                    } else {
                        $("#Ranking").html('<div class="well" style="text-align: center;"> No se tiene información registrada</div>');
                    }

                }
            });


        });
    </script>
@endsection