@extends('layouts.inspinia.app')
@section('title', 'Reportes')
@section('titulopagina', 'Reporte')

@section('content')
    <div class="row wrapper border-bottom white-bg page-heading">
        <div class="col-sm-4">
            <h2>@yield('title')</h2>
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="#">Reporte rutas</a>
                </li>
                <li class="breadcrumb-item active">
                    <strong>Listado</strong>
                </li>
            </ol>
        </div>
    </div>
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title"> Buscar </h4>
                    </div>
                    <div class="card-body">
                        @if (isset($errors) && $errors->any())
                            <div class="alert alert-danger" role="alert">
                                @foreach ($errors->all() as $error)
                                    {{ $error }}
                                @endforeach
                            </div>
                        @endif

                        @if (session('success'))
                            <div class="alert alert-success" role="alert">
                                {{ session('success') }}
                            </div>
                        @endif

                        <form action="{{ route('despachos.store') }}" method="POST"  >
                            @csrf

                            <div class="row">
                                <div class="col-6">
                                    <div class="form-group">
                                    <label>Agencias</label>
                                    <select class="form-control  form-control-sm" name="cod_agencia" id="cod_agencia" required>
                                        @if (Auth::user()->hasRole('Agente') != 1)
                                            <option value="">Seleccione Agencia</option>
                                            <option value="0">Todos</option>
                                        @endif
                
                                        @if (Auth::user()->hasRole('Agente') != 1)
                                            @foreach ($agencias as $r)
                                                <option value="{{ $r->cod_agencia }}"
                                                    @if ($codigoagencia == $r->cod_agencia) {{ 'selected' }} @endif>
                                                    {{ $r->nom_agencia }}
                                                </option>
                                            @endforeach
                                        @else
                                            @foreach ($agencias as $r)
                                                <option value="{{ $r->cod_agencia }}"
                                                    @if (Auth::user()->cod_agencia == $r->cod_agencia) {{ 'selected' }} @endif>
                                                    {{ $r->nom_agencia }}
                                                </option>
                                            @endforeach
                                        @endif
                
                
                                    </select>
                
                
                
                                    @error('cod_agencia')
                                        <small class="text-danger">
                                            *{{ $message }}
                                        </small>
                                    @enderror
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group">
                                    <label>Fecha</label>
                                    <input type="text" name="fecha" id="fecha" class="form-control form-control-sm" required
                                    value="{{ $fecha }}">
                                    </div>
                                </div>

                            </div>
                            <div class="row">
                                <div class="col-md-6 pr-1">
                                    <button type="button" id="buscar"
                                        class="btn btn-primary ">Buscar</button>
                                </div>
                            </div>
                        </form>

                    </div>
                </div>
            </div>

        </div>

        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title"> Rutas </h4>
                    </div>
                    <div class="card-body">

                        <table id="tabla" class="table table-striped table-bordered">
                            <thead class=" text-primary" id="headertable">
                                
                            </thead>
                            <tbody id="txtdata">
                               

                            </tbody>
                            <tfoot>

                            </tfoot>
                        </table>
                    </div>
                </div>

            </div>

        </div>



        <div class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog"  aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title">Detalle Ruta</h4>
                        <small class="font-bold"><div id="ruta"></div></small>
                    </div>
                    <div class="modal-body">
                        <table id="tabla" class="table table-striped table-bordered">
                            <thead class=" text-primary" id="headertable2">
                                <tr><th>OS</th><th>EMBARCADOR</th><th>DESTINATARIO</th><th>DIRECCION</th><th>COMUNA</th><th>BULTOS</th><th>REFERENCIAS</th><th>PRIORIDAD</th><th>OBSERVACION</th><th>TIPO</th></tr>
                            </thead>
                            <tbody id="txtdata2">
                               

                            </tbody>
                            <tfoot>

                            </tfoot>
                        </table>
                        


                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                        <div id="buttonExcel"></div>
                        <div id="buttonPDF"></div>
                       
                    </div>
                </div>
            </div>
        </div>

        <form action="" method="GET" name="frm" >
            @csrf
            

        
        </form>

    @endsection

    @section('javascript')
    <style>
        .modal-lg { max-width: 80% !important; }
    </style>
    <script>

        function exportarexcel(id,fecha,ruta,chofer){
          frm.action="exportexcelrutasasignadaschofer/"+id+"/"+fecha+"/"+ruta+"/"+chofer
          frm.submit();

        }

        function exportarexcelpdf(id,fecha,ruta,chofer){
          frm.action="exportpdfrutasasignadaschofer/"+id+"/"+fecha+"/"+ruta+"/"+chofer
          frm.submit();

        }

        

function buscarrutachofer(id,fecha,ruta,chofer){

                event.preventDefault();
                $('#myModal5').modal();

                var dataFuncion=id+","+"'"+fecha+"','"+ruta+"','"+chofer+"'";
                
                $('#buttonExcel').empty();
                $('#buttonExcel').append('<button type="button" onclick="exportarexcel('+dataFuncion+');" class="btn btn-primary">Export Excel</button>');

                $('#buttonPDF').empty();
                $('#buttonPDF').append('<button type="button" onclick="exportarexcelpdf('+dataFuncion+');" class="btn btn-danger">Export PDF</button>');
               
                $('#txtdata2').empty();
                
                $('#ruta').empty();
                $('#ruta').append('<span>Ruta: '+chofer+' Codigo Ruta:'+ruta+'</span>');


                $.ajax({
                    type: 'GET',
                    url: '../../buscarrutasasignadaschofer/' + id + '/'+fecha+'/'+ruta+'/'+chofer,
                    success: function(response) {
                        var response = JSON.parse(response);
                        var dataFuncion='';
                       
                       
                      //  $('#headertable2').append( '<tr><th>OS</th><th>EMBARCADOR</th><th>DESTINATARIO</th><th>DIRECCION</th><th>COMUNA</th><th>BULTOS</th><th>REFENCIAS</th><th>PRIORIDAD</th><th>OBSERVACION</th><th>TIPO</th></tr>');
                        response.forEach(element => {
                            $('#txtdata2').append('<tr><td>' + element['OS']+'</td><td>' + element['EMBARCADOR']+'</td><td>' + element['DESTINATARIO']+'</td><td>' + element['DIRECCION']+'</td><td>' + element['COMUNA']+'</td><td>' + element['BULTOS']+'</td><td>' + element['REFERENCIA']+'</td><td>' + element['PRIORIDAD']+'</td><td>' + element['OBSERVACION']+'</td><td>' + element['TIPO']+'</td></tr>');
                            
                        });

                    }
                })


            }


        $(document).ready(function() {


            $('#buscar').on('click', function() {

                event.preventDefault();

                let id = $('#cod_agencia').val();
                let fecha = $('#fecha').val();
                fecha = fecha.replaceAll("/", "-");
                
                $('#txtdata').empty();
                $('#headertable').empty();

                $.ajax({
                    type: 'GET',
                    url: '../../buscarrutasasignadas/' + id + '/'+fecha,
                    success: function(response) {
                        var response = JSON.parse(response);
                        var dataFuncion='';
                        $('#headertable').empty();
                        $('#headertable').append( '<tr><th>Agencia</th><th>Chofer</th><th>Rut</th><th>Telefono</th><th>Ruta</th><th class="text-right">Accion</th></tr>');
                        response.forEach(element => {
                            var dataFuncion=id+","+"'"+fecha+"','"+element['RUTA']+"','"+element['CHOFER']+"'";
                            $('#txtdata').append('<tr><td>' + element['AGENCIA']+'</td><td>' + element['CHOFER']+'</td><td>' + element['RUT']+'</td><td>' + element['TELEFONO']+'</td><td>' + element['RUTA']+'</td><td class="text-right"><a class="btn btn-primary" onclick="buscarrutachofer('+dataFuncion+');" >Ver</a></td></tr>');
                            
                        });

                    }
                })

            })


            

            $('#exportar').on('click', function() {

                frm.action = "{{ route('dashboards.export') }}";
                frm.submit();
                frm.action = "{{ route('dashboards.resumen') }}";

            });

            $('#fecha').datepicker({
                minDate: 0,
                endDate: new Date(),
                //startDate: '1d',
                keyboardNavigation: false,
                forceParse: false,
                autoclose: true,
                language: 'es'
            });

           


           



        });
    </script>


@endsection