@extends('layouts.master')
@section('title')
    Movilización de Casillero Internacional
@endsection
@section('header')
    <link href="{!! asset('/css/datatables.css') !!}" type="text/css" rel="stylesheet">
    <style>
        .dataTables_filter {
            display: none;
        }
    </style>
@endsection
@section('content')



    <input type="hidden" id="urlFiltro" data-url="{{ route('getConsumirAjax') }}">

    <div class="panel panel-primary">
        <div class="panel-heading">
            <h3 class="panel-title">Movilización de Casillero Internacional - Totales por Cliente</h3>
        </div>
        <div class="panel-body">
            <table class="table table-condensed table-bordered small" id="totales" width="100%">
                <thead>
                <tr>
                    <th class="text-left" align="left" width="40%">Oficina</th>
                    <th class="text-center" align="center" width="12%">Total Guías</th>
                    <th class="text-center" align="center" width="12%">Total Peso (Kgs.)</th>
                    <th class="text-center" align="center" width="12%">Total Medios Kilos (Kgs.)</th>
                    <th class="text-center" align="center" width="12%">Total Piezas</th>
                    <th class="text-right" align="right" width="12%">Total $</th>
                </tr>
                </thead>
                <tbody class="text-right">
                @php
                    $totalguias = 0;
                    $totalpesos = 0;
                    $totalmedioskilos = 0;
                    $totalpiezas = 0;
                    $totaldolares = 0;
                @endphp
                @foreach($totales['entidadRespuesta'] as $total)
                    <tr>
                        <td align="left">{{ $total['oficina'] }}</td>
                        <td align="center">{{ $total['totalguia'] }}</td>
                        <td align="center">{{ $total['totalpeso'] }}</td>
                        <td align="center">{{ number_format($total['totalmedioskilos'], 2) }}</td>
                        <td align="center">{{ $total['totalpiezas'] }}</td>
                        <td align="right">{{ $total['total'] }}</td>
                    </tr>
                    @php
                        $totalguias = (float)$totalguias + (float)$total['totalguia'];
                        $totalpesos = (float)$totalpesos + (float)$total['totalpeso'];
                        $totalmedioskilos = (float)$totalmedioskilos + (float)$total['totalmedioskilos'];
                        $totalpiezas = (float)$totalpiezas + (float)$total['totalpiezas'];
                        $totales = (float)$totales + (float)$total['total'];
                    @endphp
                @endforeach
                </tbody>
                <tfoot>
                    <tr>
                        <td align="right" class="bg-info"><b>Totales:</b></td>
                        <td align="center" class="bg-info"><b>{{ $totalguias }}</b></td>
                        <td align="center" class="bg-info"><b>{{ number_format($totalpesos, 2) }}</b></td>
                        <td align="center" class="bg-info"><b>{{ number_format($totalmedioskilos, 2) }}</b></td>
                        <td align="center" class="bg-info"><b>{{ $totalpiezas }}</b></td>
                        <td align="right" class="bg-info"><b>{{ $totales }}</b></td>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>

    <div align="center"><a  type="button" href="#detalle" class="btn btn-success inf">Ver Detalle</a></div>
    <br>

    <div class="panel panel-primary oculto" id="detalle">
        <div class="panel-heading">
            <h3 class="panel-title">Movilización de Casillero Internacional - Cantidad de Envíos</h3>
        </div>
        <div class="panel-body">
            <div class="row">
                <div class="col-sm-12">
                    <span class="glyphicon glyphicon-info-sign text-primary small"></span> <span
                            class="small"><b>Nota:</b> Se muestran los registros del
                    día. Usar los filtros de <b>Fecha de Pago</b> para consultar registros de días anteriores.</span>
                </div>
            </div>
            <br>
            <div class="row text-left">
                <div class="col-sm-4">
                    <label for="fechades" class="control-label text-primary" style="font-size: 12px">Fecha de Pago
                        Desde</label>
                </div>
                <div class="col-sm-4">
                    <label for="fechahas" class="control-label text-primary" style="font-size: 12px">Fecha de Pago
                        Hasta</label>
                </div>
                <div class="col-sm-4">
                    <label for="nroguia" class="control-label text-primary" style="font-size: 12px">N° de Guía</label>
                </div>
            </div>
            <div class="form-group">
                <div class="row">
                    <div class="col-sm-4" id="fechadesFilter" data-column="0">
                        <input type="text" class="form-control input-sm" id="fechades" name="fechades"
                               placeholder="Fecha en que el cliente pago el envío" value="">
                    </div>
                    <div class="col-sm-4" id="fechahasFilter" {{--data-column="0"--}}>
                        <input type="text" class="form-control input-sm" id="fechahas" name="fechahas"
                               placeholder="Fecha en que el cliente pago el envío" value="">
                    </div>
                    <div class="col-sm-4" id="nroguiaFilter" data-column="2">
                        <input type="text" class="form-control input-sm" id="nroguia" name="nroguia"
                               onkeyup="filtrarMov()" placeholder="N° de Guía">
                    </div>
                </div>
            </div>

            <div class="row text-left" style="margin-top: -12px;">
                <div class="col-sm-4">
                    <label for="nrocasillero" class="control-label text-primary" style="font-size: 12px">N° de
                        Casillero</label>
                </div>
                <div class="col-sm-4">
                    <label for="tipocli" class="control-label text-primary" style="font-size: 12px">Tipo de
                        Cliente</label>
                </div>
                <div class="col-sm-4">
                    <label for="ofiShipnet" class="control-label text-primary" style="font-size: 12px">Oficina Shipnet</label>
                </div>
            </div>
            <div class="form-group">
                <div class="row">
                    <div class="col-sm-4" id="nrocasilleroFilter" data-column="3">
                        <input type="text" class="form-control input-sm" id="nrocasillero" name="nrocasillero"
                               placeholder="N° de Casillero">
                    </div>
                    <div class="col-sm-4" id="tipocliFilter" data-column="5">
                        <select name="tipocli" id="tipocli" class="form-control input-sm">
                            <option value="">Seleccione</option>
                            <option value="ZOOM">ZOOM</option>
                            <option value="SHIPNET">SHIPNET</option>
                        </select>
                    </div>
                    <div class="col-sm-4" id="ofiShipnetFilter" data-column="6">
                        <select name="ofiShipnet" id="ofiShipnet" class="form-control input-sm" disabled="disabled">
                            <option value="">Seleccione</option>
                            @foreach($ofiShipnet['entidadRespuesta'] as $item)
                                <option value="{{ $item['nombre'] }}">{{ $item['nombre'] }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>

            <table class="table table-condensed table-bordered small" id="movCasIntTable">
                <thead>
                <tr>
                    <th>Fecha de Pago</th>
                    <th>Fecha Guía</th>
                    <th>N° Envío</th>
                    <th>Nº de Casillero</th>
                    <th>Referencia</th>
                    <th>Tipo de Cliente</th>
                    <th>Oficina</th>
                    <th>Peso (Kgs.)</th>
                    <th>Medio Kilo (Kgs.)</th>
                    <th>N° de Piezas</th>
                    <th>Contenido</th>
                    <th>Total $</th>
                </tr>
                </thead>
                <tbody>
                @foreach($resultados['entidadRespuesta'] as $item)
                    <tr>
                        <td>
                            {{ $item['fechapago'] }}
                        </td>
                        <td>
                            {{ $item['fecha'] }}
                        </td>
                        <td>{{ $item['codguia'] }}</td>
                        <td>{{ $item['destinatario'] }}</td>
                        <td>{{ trim($item['referencia']) }}</td>
                        <td>{{ $item['tipocli'] }}</td>
                        <td>{{ $item['oficina'] }}</td>
                        <td>{{ $item['pesobru'] }}</td>
                        <td>{{ $item['nummediokilo'] }}</td>
                        <td>{{ $item['numeropie'] }}</td>
                        <td>{{ $item['descripcioncon'] }}</td>
                        <td align="right">{{ number_format($item['total'], 2) }}</td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    </div>

    <div class="modal fade" id="pleaseWaitDialog" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
         aria-hidden="true" style="margin-top: 150px;">
        <div class="vertical-alignment-helper">
            <div class="modal-dialog vertical-align-center">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Por favor espere...</h4>
                    </div>
                    <div class="modal-body">
                        <div class="progress">
                            <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="40"
                                 aria-valuemin="0" aria-valuemax="100" style="width: 100%">
                                <span class="sr-only">40% Complete (success)</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


@endsection
@section('script')
    <script type="text/javascript" src="{!! URL::asset('/js/ReporteMovCasInt/movCasInt.js')  !!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/js/pdfmake.min.js')  !!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/js/vfs_fonts.js')  !!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/js/datatables.min.js')  !!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/js/moment.js')  !!}"></script>
    <script type="text/javascript" src="{!! URL::asset('/js/datetime-moment.js')  !!}"></script>
    <script>
        /*$(document).ready(function () {
            $('#movCasIntTable').DataTable({
                "order": [[0, "desc"]],
                buttons: ['excel'],
                "language": {
                    "processing": "Procesando...",
                    "lengthMenu": "Mostrar _MENU_ registros",
                    "zeroRecords": "No se encontraron resultados",
                    "emptyTable": "Ningún dato disponible en esta tabla",
                    "info": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                    "infoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
                    "infoFiltered": "(filtrado de un total de _MAX_ registros)",
                    "infoPostFix": "",
                    "search": "Buscar:",
                    "url": "",
                    "infoThousands": ",",
                    "loadingRecords": "Cargando...",
                    "paginate": {
                        "first": "Primero",
                        "last": "Último",
                        "next": "Siguiente",
                        "previous": "Anterior"
                    },
                    "aria": {
                        "sortAscending": ": Activar para ordenar la columna de manera ascendente",
                        "sortDescending": ": Activar para ordenar la columna de manera descendente"
                    }
                }
            });
        });*/
        jQuery(document).ready(function(){
           // $(".oculto").hide();
            $(".inf").click(function(){
                var nodo = $(this).attr("href");

                if ($(nodo).is(":visible")){
                    $(nodo).hide();
                    return false;
                }else{
                    $(".oculto").hide("slow");
                    $(nodo).fadeToggle("fast");
                    return false;
                }
            });
        });

        $(document).ready(function () {
            $.fn.dataTable.moment('DD/MM/YYYY');
            var table = $('#movCasIntTable').DataTable({
                dom: 'Bfrtip',
                buttons: [
                    'excel'
                ],
                pageLength: 20,
                order: [[0, "desc"]],
                language: {
                    "processing": "Procesando...",
                    "lengthMenu": "Mostrar _MENU_ registros",
                    "zeroRecords": "No se encontraron resultados",
                    "emptyTable": "Ningún dato disponible en esta tabla",
                    "info": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                    "infoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
                    "infoFiltered": "(filtrado de un total de _MAX_ registros)",
                    "infoPostFix": "",
                    "search": "Buscar:",
                    "url": "",
                    "infoThousands": ",",
                    "loadingRecords": "Cargando...",
                    "paginate": {
                        "first": "Primero",
                        "last": "Último",
                        "next": "Siguiente",
                        "previous": "Anterior"
                    },
                    "aria": {
                        "sortAscending": ": Activar para ordenar la columna de manera ascendente",
                        "sortDescending": ": Activar para ordenar la columna de manera descendente"
                    }
                }
            });

            table.columns.adjust().draw();

            var tablet = $('#totales').DataTable({
                dom: 'Bfrtip',
                buttons: [
                    'excel'
                ],
                pageLength: 10,
                order: [[0, "desc"]],
                language: {
                    "processing": "Procesando...",
                    "lengthMenu": "Mostrar _MENU_ registros",
                    "zeroRecords": "No se encontraron resultados",
                    "emptyTable": "Ningún dato disponible en esta tabla",
                    "info": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                    "infoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
                    "infoFiltered": "(filtrado de un total de _MAX_ registros)",
                    "infoPostFix": "",
                    "search": "Buscar:",
                    "url": "",
                    "infoThousands": ",",
                    "loadingRecords": "Cargando...",
                    "paginate": {
                        "first": "Primero",
                        "last": "Último",
                        "next": "Siguiente",
                        "previous": "Anterior"
                    },
                    "aria": {
                        "sortAscending": ": Activar para ordenar la columna de manera ascendente",
                        "sortDescending": ": Activar para ordenar la columna de manera descendente"
                    }
                }
            });
            tablet.columns.adjust().draw();
            //tablet.draw();

        });


        var date = new Date();

        $(function () {
            $('#fechades').datetimepicker({
                maxDate: date,
                format: 'DD/MM/YYYY',
                useCurrent: true,
                dayViewHeaderFormat: 'MMMM YYYY',
                showTodayButton: true,
                widgetPositioning: {
                    vertical: 'bottom'
                }
            }).on('dp.change', function (e) {
                $('#fechahas').data("DateTimePicker").minDate(e.date)
            });
        });

        $(function () {
            $('#fechahas').datetimepicker({
                maxDate: date,
                format: 'DD/MM/YYYY',
                useCurrent: true,
                dayViewHeaderFormat: 'MMMM YYYY',
                showTodayButton: true,
                widgetPositioning: {
                    vertical: 'bottom'
                }
            }).on('dp.change', function (e) {
                filtrarMov();
                filtroTotales();
            });
        });

        console.log(date);
        $('#fechades').val(moment(date).format('DD/MM/YYYY'));
        $('#fechahas').val(moment(date).format('DD/MM/YYYY'));


    </script>
@endsection