@extends('layouts/master')
@section('content')
    <!-- Metas para la Página -->
    <meta charset="UTF-8">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Last-Modified" content="0">
    <meta http-equiv="Cache-Control" content="no-cache, mustrevalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <!-- Librerias Styles para la Página -->
    <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">
    <!-- Styles página -->
    <style>
        .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: 15px;
            margin-bottom: 15px;
            margin-left: 20px;
        }

        .table-earning thead th {
            background: rgb(30, 115, 183);
            font-size: 14px;
            color: #fff;
            vertical-align: middle;
            font-weight: 200;
            text-transform: capitalize;
            line-height: 1;
            /*padding: 12px 22px;*/
            /*white-space: nowrap;*/
        }

        .table-earning thead th.text-right {
            padding-left: 15px;
            padding-right: 65px;
        }

        .table-earning tbody td {
            color: #808080;
            /*padding: 12px 22px;*/
            white-space: nowrap;
            font-size: 12px;

        }

        .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;
        }
        /*Estilos Carmen Gomez Para Modulo de Liquidacion Alaidos Creados 05-09-2018*/

        .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: #00000;
        }

        .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: 5%;
        }
        td{
            text-align:center;
        }
        th{
            text-align:center;
        }
        .tooltip-inner {
            background-color: #0076C0;
            color: #FFFFFF;
            border: 1px solid #004672;-
        padding: 2px;
            font-size: 12px;
        }
        .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 class="col-md-12 margen">
    <div class="panel panel-theme">
        <div class="panel-heading"><h5 class="text-center card-subtitle panel-title">REPORTE CALIDAD ALIADOS</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="ReporteCalidad" class="table table-borderless table-striped table-earning">
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th>Nro Guia</th>
                            <th>Fecha de recepción</th>
                            <th>Código Aliado</th>
                            <th>Nombre Aliado</th>
                            <th>Teléfono Aliado</th>
                            <th>Anulada</th>
                            <th>Existe</th>
                            <th></th>
                            <th></th>
                        </tr>
                        </thead>
                        <tbody>
                        @php $i=1;
                        @endphp
                        @foreach($response['entidadRespuesta'] as $reporte)
                            @php
                                $date = date_create($reporte['fecha']);
                                $fecha = date_format($date, 'd-m-Y');
                                if($reporte['anulada']==true){
                                $anualada= 'Anulada';
                                }else{
                                $anualada= '';
                                }
                                 if($reporte['existe']==false){
                                $existe= 'No Existe';
                                }else{
                                $existe= '';
                                }
                                $nombre = substr($reporte['listcliente']['nombre'],0, 30);
                            @endphp
                            <tr>
                                <td>{{$i}}</td>
                                <td><a href="TrackingReporteCalidad?id={{$reporte['codguia']}}" target="_blank">{{$reporte['codguia']}}</a></td>
                                <td>{{$fecha}}</td>
                                <td>{{$reporte['codcliente']}}</td>
                                <td><p data-toggle="tooltip" data-placement="top" title="{{$reporte['listcliente']['nombre']}}">{{$nombre}}<p/></td>
                                <td>{{$reporte['listclientetelefono']['telefono']}}</td>
                                <td>{{$anualada}}</td>
                                <td>{{$existe}}</td>
                                @php if($reporte['existe']==false){ @endphp
                                <td><a class="btn btn-primary" href='javascript:;' onclick="modal_conf('{{$reporte['codguia']}}');" role="button">Existe</a></td>
                                <td><a class="btn btn-danger" href='javascript:;' onclick="modal_conf_quitar('{{$reporte['codguia']}}');" role="button">Quitar</a></td>
                            @php }else{@endphp
                                <td></td>
                                <td><a class="btn btn-danger" href='javascript:;' onclick="modal_conf_quitar('{{$reporte['codguia']}}');" role="button">Quitar</a></td>
                            @php }
                                $i++
                            @endphp
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
    <div id="id_modal_conf"></div>
    <div id="id_modal_conf_quitar"></div>
@endsection
@section('script')
    <script src="/faaszoom/public/bootstrap_3_3_6/datepicker/bootstrap-datetimepicker.min.js"></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);
            $('#ReporteCalidad').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"
                    }
                },
                dom: 'Bfrtip',
                buttons: [
                    {
                        extend: 'excel',
                        text: '<i class="fa fa-file-excel-o"></i> Excel',
                        className: 'btn excel',
                        exportOptions: {
                            columns: [ 0, 1, 2, 3, 4, 5, 6 ,7]
                        },
                        title: 'REPORTE CALIDAD ALIADOS '+Fecha_,
                        filename: 'REPORTE CALIDAD ALIADOS '+Fecha_
                    },
                    {
                        extend: 'pdf',
                        text: '<i class="fa fa-file-pdf-o"></i> PDF',
                        className: 'btn pdf',
                        exportOptions: {
                            columns: [ 0, 1, 2, 3, 4, 5, 6 ,7]
                        },
                        title: 'REPORTE CALIDAD ALIADOS '+Fecha_,
                        filename: 'REPORTE CALIDAD ALIADOS '+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',
                        exportOptions: {
                            columns: [ 0, 1, 2, 3, 4, 5, 6 ,7]
                        },
                        title: 'REPORTE CALIDAD ALIADOS '+Fecha_
                    }
                ]
            });
        });

        function modal_conf(codguia) {
            $( "#modal_conf" ).remove();
            var html = '';
            html += '<div class="modal fade" id="modal_conf" style="margin-top: 150px;">';
            html += '   <div class="modal-dialog">';
            html += '       <div class="modal-content">';
            html += '           <div class="panel panel-primary modal_style_2">';
            html += '               <div class="panel-heading">';
            html += '                   <strong>';
            html += '                       <h3 class="panel-title">';
            html += '                           <div align="center">';
            html += '                               <button class="close glyphicon glyphicon-remove" aria-hidden="true" data-dismiss="modal"></button>';
            html += '                               <b class="font">';
            html += '                                   <b>Validar Guía N°: '+codguia+'</b>';
            html += '                               </b>';
            html += '                           </div>';
            html += '                       </h3>'
            html += '                   </strong>';
            html += '               </div>';
            html += '               <div>';
            html += '                   <center>¿Esta seguro que la guia existe?</center>';
            html += '                   <div class="modal-footer">';
            html += '                       <button class="btn btn-primary" href="javascript:;" onclick="actualiza_existe('+codguia+');">Si</button>';
            html += '                       <button class="btn btn-danger" data-dismiss="modal">No</button>';
            html += '                   </div>';
            html += '               </div>';
            html += '           </div>';
            html += '       </div>';
            html += '   </div>';
            html += '</div>';
            $('#id_modal_conf').append(html);
            $('#modal_conf').modal('show'); // abrir modal admin
        }
        function modal_conf_quitar(codguia) {
            $( "#modal_conf_quitar" ).remove();
            var html = '';
            html += '<div class="modal fade" id="modal_conf_quitar" style="margin-top: 150px;">';
            html += '   <div class="modal-dialog">';
            html += '       <div class="modal-content">';
            html += '           <div class="panel panel-primary modal_style_2">';
            html += '               <div class="panel-heading">';
            html += '                   <strong>';
            html += '                       <h3 class="panel-title">';
            html += '                           <div align="center">';
            html += '                               <button class="close glyphicon glyphicon-remove" aria-hidden="true" data-dismiss="modal"></button>';
            html += '                               <b class="font">';
            html += '                                   <b>Validar Guía N°: '+codguia+'</b>';
            html += '                               </b>';
            html += '                           </div>';
            html += '                       </h3>'
            html += '                   </strong>';
            html += '               </div>';
            html += '               <div>';
            html += '                   <center>¿Esta seguro que desea quitar el envió del reporte?</center>';
            html += '                   <div class="modal-footer">';
            html += '                       <button class="btn btn-primary" href="javascript:;" onclick="quitar_envio('+codguia+');">Si</button>';
            html += '                       <button class="btn btn-danger" data-dismiss="modal">No</button>';
            html += '                   </div>';
            html += '               </div>';
            html += '           </div>';
            html += '       </div>';
            html += '   </div>';
            html += '</div>';
            $('#id_modal_conf_quitar').append(html);
            $('#modal_conf_quitar').modal('show'); // abrir modal admin
        }

        function actualiza_existe(codguia) {
            var url = $("#url").data('url'),
                method = 'POST',
                pagina = 'canguroazul/',
                params = {
                    webservice: 'existeUpdateGuiaAliadoWs',
                    pagina: pagina,
                    method: method,
                    campos: ['codguia'],
                    valores: [codguia]
                };
            $.ajax({
                async : false,
                type: 'GET',
                url: url,
                data: params,
                datatype: 'JSON',
                success: function (data) {
                    var obj = data;
                    setTimeout('document.location.reload()',1);
                }, error: function (mensaje) {
                    console.log(mensaje)
                }
            });
        }
        function quitar_envio(codguia) {
            var url = $("#url").data('url'),
                method = 'POST',
                pagina = 'canguroazul/',
                params = {
                    webservice: 'removerGuiaAliadoWs',
                    pagina: pagina,
                    method: method,
                    campos: ['codguia'],
                    valores: [codguia]
                };
            $.ajax({
                async : false,
                type: 'GET',
                url: url,
                data: params,
                datatype: 'JSON',
                success: function (data) {
                    var obj = data;
                    setTimeout('document.location.reload()',1);
                }, error: function (mensaje) {
                    console.log(mensaje)
                }
            });
        }
        setTimeout('document.location.reload()',3000000);
    </script>
@endsection