@extends('template.layout')

@section('styles')
    <link href="{{asset('css/icheck/skins/all.css')}}" rel="stylesheet" type="text/css"/>

    <style>
        option{
            background-color: white;
        }
        .min-tardanza{
            width: 10%;
        }
        /*.tbPersonal_filter,table.dataTable.dtr-column>tbody>tr>td.control:before, table.dataTable.dtr-column>tbody>tr>th.control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child:before{*/
            /*display: none;*/
        /*}*/
    </style>
@endsection


@section('content')
    <h1 class="page-title">
        Proyecciones Sociales
    </h1>
    <div class="portlet light bordered">
        <div class="portlet-title">
            <div class="caption">
                <h1 class="caption-subject font-green sbold uppercase"> Lista de Proyecciones Sociales </h1>
            </div>
            <div class="actions">
                <div class="btn-group">
                    <a class="btn btn-primary sbold" href="{{url('gestionarproyecto/agregar')}}"> Agregar Proyección Social</a>
                </div>
            </div>
        </div>
        <div class="portlet-body">
            <div class="row">
                <div class="col-md-6">
                    <div class="col-md-10">
                        <div class="col-md-12" style="padding-left: 0;">
                            <h4><i class="glyphicon glyphicon-search"></i>  Busqueda avanzada de Autores</h4>
                        </div>
                        <input type="search" class="form-control input-md" id="text-filter" aria-controls="tbEncuestas">
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="col-md-12">
                        <h4><i class="fa fa-clipboard"></i>  Proyecciones Sociales</h4>
                        <select class="form-control form-filter input-md" id="lstType" name="lstType">
                            <option value="">Todos</option>
                            @foreach($list as $proyeccion)
                                <option value="{{$proyeccion->nombre}}">{{$proyeccion->nombre}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>

            <div class="Forum-ForumTopicList row" style="margin:20px">
                <table class="table fixed table-hover dataTable dtr-inline collapsed tbPersonal" id="tbPersonal" role="grid" aria-describedby="tbPersonal_info">
                    <thead class="thead-default">
                    <tr>
                        <th>Proyecto social</th>
                        <th>Autores</th>
                        <th>Publicado</th>
                        <th>Campo de proyecci&oacute;n</th>
                        <th>Archivo pdf</th>
                        <th>Editar</th>
                        <th>Eliminar</th>

                    </tr>

                    </thead>
                    <tbody>

                    @foreach($proyectos as $item)
                        <tr>
                            <td class="col-md-2">{{ $item->nombre }}</td>
                            <td class="col-md-2">{{ $item->Autores }}</td>
                            <td class="col-md-1">{{ $item->Fecha }}</td>
                            <td class="col-md-2">{{ $item->descripcion }}</td>
                            <td class="col-md-1">
                                @if($item->url == "")
                                    <button onclick="Aviso()" class="btn btn-outline btn-circle btn-sm blue">
                                        <i class="fa fa-file-pdf-o"></i> Descargar
                                    </button>
                                @else
                                    <a class="" href="{!! $item->url !!}" download="{{ $item->nombre }}">
                                        <button class="btn btn-outline btn-circle btn-sm blue">
                                            <i class="fa fa-file-pdf-o"></i> Descargar
                                        </button>
                                    </a>
                                @endif
                            </td>
                            <td class="col-md-1">
                                <button onclick="Editar({{$item->id}})"
                                        class="btn btn-outline btn-circle btn-sm purple">
                                    <i class="fa fa-edit"></i> Editar
                                </button>
                            </td>
                            <td class="col-md-2">
                                <button onclick="Eliminar({{$item->id}})"
                                        class="btn btn-outline btn-circle dark btn-sm black">
                                    <i class="fa fa-trash-o"></i> Eliminar
                                </button>
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>

@endsection

@section('scripts')
    <script src="{{asset('css/icheck/icheck.min.js')}}" type="text/javascript"></script>

    <script>

        function Aviso() {
            swal("Atención", "no existen archivos asignados para el proyecto social", "warning")
        }

        function Editar($id) {
            window.location.href = "{{url('gestionarproyecto/editar')}}" + "/" + $id;
        }

        function Eliminar($id) {

            swal({
                    title: "Esta seguro de eliminar la proyeccion social?",
                    text: "Una vez eliminada no se podrá recuperar la proyeccion social!",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Si, eliminalo!",
                    closeOnConfirm: false
                },
                function(){
                    window.location.href = "{{url('gestionarproyecto/eliminar')}}" + "/" + $id;
                });

        }


        $(document).ready(function () {

            $("#form-validation").validate({});

            var tablePersonal = $('#tbPersonal').DataTable({
                "bFilter": false,
                "bLengthChange": false,
                bInfo: true,
                "searching": true,
                responsive: true,
                "autoWidth": false,
                "language": {
                    "lengthMenu": "Mostrar _MENU_ Entradas",
                    "zeroRecords": "No se encontraron registros",
                    "info": "Mostrando la página _PAGE_ de _PAGES_",
                    "infoEmpty": "No hay registros disponibles",
                    "infoFiltered": "(filtrado de _MAX_ registros totales)",
                    "search": "Buscar: ",
                    "paginate": {
                        "first": "Primero",
                        "last": "Último",
                        "next": "Siguiente",
                        "previous": "Anterior"
                    }
                },
                "order": [],
                "aoColumns": [
                    {"bSearchable": true},
                    {"bSearchable": true},
                    {"bSearchable": true},
                    {"bSearchable": true},
                    {"bSearchable": false},
                    {"bSearchable": false},
                    {"bSearchable": false}
                ],
                "columns": [
                    {"orderable": true},
                    {"orderable": true},
                    {"orderable": true},
                    {"orderable": true},
                    {"orderable": false},
                    {"orderable": false},
                    {"orderable": false}
                ],
                dom: 'Bfrtip',
                buttons: [
                    {
                        extend: 'excel',
                        exportOptions: {
                            columns: [0, 1, 2,3]
                        },
                        title: 'Proyecciones sociales'
                    }, {
                        extend: 'pdf',
                        exportOptions: {
                            columns: [0, 1, 2,3]
                        },
                        pageSize: 'LEGAL',
                        customize: function (doc) {
                            //pageMargins [left, top, right, bottom]
                            doc.pageMargins = [120, 20, 20, 20];
                        },
                        title: 'Proyecciones sociales'
                    }


                ]
            });

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


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

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



            $("#tbPersonal").on('change','#TypeAsist',function () {
                console.log($(this).val());
                if($(this).val() == "Tardanza"){
                    $(this).parent('td').parent('tr').children("td").children(".min-tardanza").css('border-color','rgba(227, 36, 36, 0.77)');
                    $(this).parent('td').parent('tr').children("td").children(".min-tardanza").prop("disabled",false);
                }
                else{
                    $(this).parent('td').parent('tr').children("td").children(".min-tardanza").css('border-color','initial');
                    $(this).parent('td').parent('tr').children("td").children(".min-tardanza").val('0');
                    $(this).parent('td').parent('tr').children("td").children(".min-tardanza").prop("disabled",true);
                }
            });

            $('.btn.confirm').on('click',function () {

                var list = {};

                list['codigos'] = $('input[name=min-tardanza]').map(function (){return this.id; }).get();
                list['asistencia'] = $('select[name=Asistencia]').map(function (){return this.value; }).get();
                list['minutos'] = $('input[name=min-tardanza]').map(function (){return this.value; }).get();

                $.ajax({
                    type: "post",
                    url: "{{url('asistencia')}}",
                    data: list,
                    success: function (data) {
                        swal({
                            title: "Asistencia",
                            type: "success",
                            text: "Se ha registrado la asistencia con éxito.",
                            showConfirmButton: false
                        });
                        setTimeout(' document.location.href = "/"',2000);
                    }
                });

            });



        });

    </script>
@endsection