@extends('template.layout')
@section('styles')
    <link href="{{ asset('plugins/datatables/datatables.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('plugins/datatables/plugins/bootstrap/datatables.bootstrap.css') }}" rel="stylesheet" type="text/css" />
    <style>
        .portlet-title{
        }
        .icon-notebook{
            color: #FFF;
            font-size: 100%;
        }
        .btn-success,.btn-success.active, .btn-success:active, .btn-success:hover, .open>.btn-success.dropdown-toggle{
            background-color: #5cb85c !important;
            border-color: #4cae4c !important;
        }
        .col-button{
            margin-top: 2.5%;
            margin-left: 2%;
        }

        .dataTables_filter{
            display: none !important;
        }
        .caption{
            padding: 0 !important;
        }
    </style>
@endsection
@section('content')

    <div class="portlet light portlet-fit portlet-datatable bordered">
        {{ csrf_field() }}
        <input type="hidden" id="date" value="{{$dias_pretamo }}"/>
        <input type="hidden" id="usuario" value="{{ Session::get('datosUsuario')['id']}}"/>
        <div class="portlet-title">
            <div class="caption">
                <h4><i class="icon-notebook" aria-hidden="true" style="color: black !important;"></i><span class="caption-subject font-white sbold" style="color: black !important;"> Consulta y Reserva de Bibliografias</span></h4>
            </div>
        </div>
        <div class="portlet-body">
            <div class="row">
                <div class="col-md-4">
                    <div class="col-md-10">
                        <h4>Filtro</h4>
                        <input type="search" class="form-control input-sm" id="text-filter" aria-controls="tbEncuestas">
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="col-md-8">
                        <h4>Tipo de bibliografia</h4>
                        <select class="form-control form-filter input-sm" id="lstType" name="lstType">
                            <option value="">Todos</option>
                            <option value="Revista">Revista</option>
                            <option value="Libro">Libro</option>
                            <option value="Tésis">Tésis</option>
                            <option value="Archivo virtual">Archivo virtual</option>
                            <option value="Paper">Paper</option>
                        </select>
                    </div>
                </div>


            </div>
            <div class="Forum-ForumTopicList row" style="margin:20px">
                <table class="table table-striped table-hover tbEncuestas" id="tbEncuestas"
                       width="100%" role="grid" aria-describedby="tbEncuestas_info">
                    <thead class="thead-default">
                    <tr>
                        <th>Título del libro.</th>
                        <th>Autor</th>
                        <th>Tipo de bibliografia</th>
                        <th>Materia</th>
                        <th>Editorial</th>
                        <th>Disponibles</th>
                        <th>Ver detalle</th>
                        <th>Estado</th>
                        <th>Reservar</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($reservas as $item )
                        <tr>
                            <td class="NBibliografia">{{$item->Bibliografia}}</td>
                            <td>{{$item->Autor}}</td>
                            <td>{{$item->type}}</td>
                            <td>{{$item->Materia}}</td>
                            <td>{{$item->Editorial}}</td>
                            <td style="text-align: center">{{$item->Disponibles}}</td>
                            <td style="text-align:left !important;">

                                <a  style="margin-top: 0px !important; "  @if($item->Disponibles > 0) @else disabled @endif type="text" class="waves-effect waves-light m-t-10" href="{{ url('/detalle/bibliografia/'.$item->id) }}">
                                    Ver detalle
                                </a>

                            </td>
                            <td style="text-align:left !important;">

                                <span style="color: @if($item->Disponibles > 0 ) #edbf08 @else red @endif">
                                    @if($item->Disponibles > 0 || $item->path != "")
                                        @if($item->path != "")
                                            <a  style="margin-top: 0px !important; " type="text" class="waves-effect waves-light m-t-10" href="{{ url('/bibliografia/descargar/'.$item->id) }}">
                                                Descargar
                                            </a>
                                        @else
                                            Disponible
                                        @endif
                                    @else
                                        No Disponible
                                    @endif
                                </span>

                            </td>
                            <td style="text-align:left !important;">
                                <button  style="margin-top: 0px; !important;" @if($item->Disponibles > 0) @else disabled @endif  type="button" class="btn btn-outline btn-circle dark btn-sm black"  @if($item->Disponibles > 0) data-bibliografia="{{$item->id}}" @endif data-toggle="modal" data-target="#con-close-modal" id="reserva_text">
                                    @if($item->Disponibles > 0) Reservar @else No Disponible @endif
                                </button>
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>

@endsection
@section('scripts')
<script src="{{ asset('plugins/datatables/datatables.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('plugins/datatables/plugins/bootstrap/datatables.bootstrap.js') }}" type="text/javascript"></script>
<script>
    $(document).ready(function () {

        var tablebibliografias = $('#tbEncuestas').DataTable({
            "iDisplayLength": 5,
            "bLengthChange": false,
            "responsive": true,
            "searching": true,
            "language": {
                "sProcessing": "Procesando...",
                "sLengthMenu": "Mostrar _MENU_ datos por página",
                "sZeroRecords": "No hubo resultados",
                "sInfo": "Mostrando página _PAGE_ de _PAGES_",
                "sInfoFiltered":"(filtrado de un total de _MAX_ registros)",
                "sInfoPostFix": "",
                "sSearch": "Buscar: ",
                "emptyTable": "El contribuyente no posee deudas",
                "infoEmpty": "No hay informacion",
                "sUrl": "",
                "sInfoThousands": ",",
                "sLoadingRecords": "Cargando...",
                "oPaginate":{
                    "sFirst": "Primero",
                    "sLast": "Último",
                    "sNext": "Siguiente",
                    "sPrevious": "Anterior"
                },
                "oAria": {
                    "sSortAscending": ": Activar para ordenar la columna de manera ascendente",
                    "sSortDescending": ": Activar para ordenar la columna de manera descendente"
                }
            }
        });

        $("#tablebibliografias_filter").hide();


        $("#lstType").change(function () {
            tablebibliografias.column(2)
                .search($("#lstType").val())
                .draw();
        });

        $("#text-filter").on('keyup',function () {
            tablebibliografias
                .search($(this).val())
                .draw();
        });


    });




    $("#tbEncuestas").on('click','#reserva_text',function (e) {

        if(typeof $(this).attr('data-bibliografia') !== "undefined"){
            if ( $(this).data('reserva') !== "undefined"){

                var dates = $('#date').val();
                var nameB = $(this).parent('td').parent('tr').children('td.NBibliografia').text();
                var ID = $(this).data('bibliografia');
                var myDate = new Date();
                var myDateIni = new Date();
                myDate.setDate(myDate.getDate()+parseInt(dates));
                var displayDate = (myDate.getDate()) + '/' + (myDate.getMonth()+1) + '/' + myDate.getFullYear();
                var horus = (myDateIni.getHours()+':'+myDateIni.getMinutes()+':'+myDateIni.getSeconds());
                var GetDate = (myDateIni.getDate()) + '/' + (myDateIni.getMonth()+1) + '/' + myDateIni.getFullYear();


                swal({
                    title: "Usted está reservando '"+nameB+"' el día "+GetDate+"",
                    text: "Desea confirmar la reserva.",
                    type: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Aceptar',
                    cancelButtonText: 'Cancelar',
                    closeOnConfirm: false
                }, function () {
                    var FI = (myDateIni.getFullYear()) + '-' + (myDateIni.getMonth()+1) + '-' + myDateIni.getDate();
                    var FF = (myDate.getFullYear()) + '-' + (myDate.getMonth()+1) + '-' + myDate.getDate();
                    var datos ={
                        'FI' : FI,
                        'FF' : FF,
                        'bibliografia' : ID
                    };
                //    var URL = '/post/reserva';










                    $.ajax({
                        type: 'post',
                        url: "{{url('post/reserva')}}",
                        data: datos,
                        success: function (data) {

                            if(data == 500 ){
                                swal("Advertencia",'Tiene una reserva de la biliografia escogida','warning');
                            }else {

                                swal({
                                        title: 'Usted tiene hasta el ' + displayDate + ' para realizar el préstamo del libro.',
                                        text: 'Reserva exitosa',
                                        type: "success",
                                        showCancelButton: false,
                                        showConfirmButton: true,
                                        confirmButtonColor: "#DD6B55",
                                        confirmButtonText: "Ok",
                                        closeOnConfirm: true,
                                        closeOnCancel: false
                                    },
                                    function (isConfirm) {
                                        if (isConfirm) {
                                            setTimeout(function () {
                                                location.reload();
                                            }, 350);
                                        }
                                    });
                            }


                        },
                        error: function (data) {

                            swal('error','','warning');
                        }
                    });


                });


            }
        }



    });




</script>
@endsection