{{--Vista Creada por Junior Medina 07/01/18--}}
@extends('layouts/master')
@section('content')
    <meta charset="UTF-8">
    <link href="{!! asset('/plugins/fontawesome/font-awesome.css')  !!}" rel="stylesheet">
    <link href="{!! asset('/plugins/DataTables/1-10-9/css/dataTables.bootstrap4.min.css')  !!}" rel="stylesheet">
    <link href="{!! asset('/plugins/DataTables/1-10-9/css/buttons.bootstrap4.min.css')  !!}" rel="stylesheet">

    <style>
        .panel-body {
            padding: 0px !important;
        }
        .section__content--p35 {
            padding: 0 35px;
        }
        .table-responsive.table--no-card {
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 10px;
            -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
            -moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
            box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
        }
        .m-b-30 {
            margin-top: 0px;
            margin-bottom: 15px;
            margin-left: 20px;
        }
        .table-earning thead th {
            background: rgb(30, 115, 183);
            font-size: 12px;
            color: #fff;
            vertical-align: middle;
            font-weight: 200;
            text-transform: capitalize;
        }
        .table-earning thead th.text-right {
            padding-left: 15px;
            padding-right: 65px;
        }
        .table-earning tbody td {
            color: #808080;
            white-space: nowrap;
            font-size: 11px;
        }
        .table-earning tbody td.text-right {
            padding-left: 15px;
            padding-right: 65px;
        }
        .table-earning tbody tr:hover td {
            color: #555;
            cursor: pointer;
        }
        .card-subtitle {
            margin-top: -0.375rem;
            margin-bottom: 0;
        }
        .panel-theme {
            background-color: #FFFFFF;
            border: none;
            box-shadow: 1px 2px 6px rgba(0, 0, 0, .2);
        }
        .panel-heading {
            background-color: #0076be;
            border: none;
        }
        .panel-footer {
            background-color: white;
            border: none;
        }
        .badge {
            color:#FFFFFF;
            background-color: #000000;
        }
        .panel-title {
            font-weight: bold;
        }
        .panel-primary {
        extend(. panel-theme);
        }
        .panel-heading {
            padding: 0.75rem 1.25rem;
            margin-bottom: 0;
            background-color: #0076be;
            color: white;
        }
        .panel-footer {
            padding: 0.75rem 1.25rem;
            margin-bottom: 0;
            background-color: white;
        }
        .margen{
            margin-top: 0%;
        }
        p{
            color: #0b5fc6;
        }
        .tooltip-inner {
            background-color: #0076C0;
            color: #FFFFFF;
            border: 1px solid #004672;-
        padding: 2px;
            font-size: 12px;
        }
        td{
            text-align:center;
        }
        th{
            text-align:center;
        }

        .excel {
            margin-top: -15px;
            margin-bottom: 2px;
            background-color: #3ca23c !important;
            color: white;
            border-color: #3ca23c !important; ;
            margin-right: 5px;
            margin-left: 5px;
        }

        .excel:hover{
            transform: scale(1.1);
            border-color: #aaa;
            transition: all .2s;
            color: white;
        }
        .pdf {
            margin-top: -15px;
            background-color: #dc2f2f !important;
            color: white;
            border-color:#dc2f2f !important ;
            margin-right: 5px;
            margin-left: 5px;
        }
        .pdf:hover{
            transform: scale(1.1);
            border-color: #aaa;
            transition: all .2s;
            color: white;
        }
        .imprimir {
            margin-top: -15px;
            background-color: #8766b1 !important;
            color: white;
            border-color:#8766b1 !important ;
            margin-right: 5px;
            margin-left: 5px;
        }
        .imprimir:hover{
            transform: scale(1.1);
            border-color: #aaa;
            transition: all .2s;
            color: white;
        }

    </style>
    <input type="hidden" id="url" data-url="{{ route('getConsumirAjax') }}">
    <div style="margin-right:20px; color: #2aabd2;" align="Right"><p><i class="glyphicon glyphicon-chevron-left" data-toggle="tooltip" ></i><a href="{{ url($rutaSession.'/'.'FormReporteMaestro') }}" class="hover_color">Volver a la página anterior</a></p></div>
    <div class="col-lg-12 margen">
        <div class="panel panel-theme">
            <div class="panel-heading"><h5 class="text-center card-subtitle panel-title">Reporte de Maestros y Tarifas Actualizados de Cinaruco</h5></div>
            <div class="panel-body">
                <div class="row col-md-12">
                    <div class="table-responsive table--no-card m-b-30">
                        <br>
                        <table id="Reporte" class="table table-borderless table-striped table-earning">
                            <thead>
                            <tr>
                                <th>ID</th>
                                <th>Nombre</th>
                                <th>Maestro</th>
                                <th>Fecha Maestro Canguro</th>
                                <th>Fecha Maestro Cinaruco</th>
                                <th>Actualizadas</th>
                            </tr>
                            </thead>
                            <tbody>
                            @php
                                $i=1;
                            if(!empty($response['entidadRespuesta']) && $response['entidadRespuesta'] != ''){
                            @endphp
                            @foreach($response['entidadRespuesta'] as $reporte)
                                @php
                                    if($reporte['fecha_maestro'] != null){
                                        $date = date_create($reporte['fecha_maestro']);
                                        $fecha_maestro = date_format($date, 'd-m-Y');
                                    }else{
                                        $fecha_maestro = '';
                                    }
                                    if($reporte['fecha_act_ofi'] != null){
                                        $date = date_create($reporte['fecha_act_ofi']);
                                        $fecha_act_ofi = date_format($date, 'd-m-Y');
                                    }else{
                                        $fecha_act_ofi = '';
                                    }

                                @endphp
                                <tr>
                                    <td>{{$i}}</td>
                                    <td>{{$reporte['nombre']}}</td>
                                    <td>{{$reporte['nombretab']}}</td>
                                    <td>{{$fecha_maestro}}</td>
                                    <td>{{$fecha_act_ofi}}</td>
                                    <td>{{$reporte['actualizada']}}</td>
                                </tr>
                                @php $i++ @endphp
                            @endforeach
                            @php } @endphp
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/datatables.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/datatables-1.10.9.bootstrap4.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/datatables.buttons.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/buttons.bootstrap4.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/jszip.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/pdfmake.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/vfs_fonts.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/buttons.html5.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/buttons.print.min.js')!!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/plugins/DataTables/1-10-9/buttons.colVis.min.js')!!}"></script>
    <script>
        $(document).ready(function () {
            $('[data-toggle="tooltip"]').tooltip();
            var Fecha_ = new Date();
            var options = { year: 'numeric', month: 'long', day: 'numeric' };
            Fecha_ = Fecha_.toLocaleDateString("es-ES", options);

            $('#Reporte').DataTable({
                language: {
                    "sProcessing": "Procesando...",
                    "sLengthMenu": "Mostrar _MENU_ registros",
                    "sZeroRecords": "No se encontraron resultados",
                    "sEmptyTable": "Ningún dato disponible.",
                    "sInfo": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                    "sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
                    "sInfoFiltered": "(filtrado de un total de _MAX_ registros)",
                    "sInfoPostFix": "",
                    "sSearch": "Buscar:",
                    "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"
                    }
                },
                "pageLength": -1,
                "paging":   false,
                "info":     false,
                dom: 'Bfrtip',
                buttons: [
                    {
                        extend: 'excel',
                        text: '<i class="fa fa-file-excel-o"></i> Excel',
                        className: 'btn excel',
                        title: 'Reporte de Maestros '+Fecha_,
                        filename: 'Reporte de Maestros '+Fecha_
                    },
                    {
                        extend: 'pdf',
                        text: '<i class="fa fa-file-pdf-o"></i> PDF',
                        className: 'btn pdf',
                        title: 'Reporte de Maestros '+Fecha_,
                        filename: 'Reporte de Maestros '+Fecha_,
                        customize: function(doc) {
                            doc.styles.tableHeader = {
                                fillColor:'#F0EEED',
                                color:'black'
                            }
                            doc.styles.tableBodyEven = {
                                background: 'white',
                            }
                            doc.styles.tableBodyOdd = {
                                background: 'white',
                            }
                        }
                    },
                    {
                        extend: 'print',
                        text: '<i class="fa fa-print"></i> Print',
                        className: 'btn imprimir',
                        title: 'Reporte de Maestros '+Fecha_
                    }
                ]
            });
        });
    </script>
@endsection