@extends('layouts.inspinia.app')
@section('title', 'Crear Ruta')
@section('titulopagina', 'Gestión')

@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="#">@yield('titulopagina')</a>
                </li>
                <li class="breadcrumb-item active">
                    <strong>Crear Ruta</strong>
                </li>
            </ol>
        </div>
        <div class="col-sm-8">
            <div class="title-action">

            </div>
        </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">Agregar Ruta</h4>
                    </div>
                    <div class="card-body">
                        <form id="codigobarras" method="POST" enctype="multipart/form-data">
                            @csrf
                            <div class="row">
                                <div class="col-md-6 pr-1">
                                    <div class="form-group">
                                        <label>Agencias</label>
                                        <select class="form-control" id="cod_agencia" name="cod_agencia" required>

                                            @if (Auth::user()->hasRole('Agente') != 1)
                                            <option value="">Seleccione Agencia</option>
                                            
                                            @else
                                            <option value="">Seleccione Agencia</option>
                                            @endif
                
                                        @if (Auth::user()->hasRole('Agente') != 1)
                                            @foreach ($agencias as $r)
                                                <option value="{{ $r->cod_agencia }}" >
                                                    {{ $r->nom_agencia }}
                                                </option>
                                            @endforeach
                                        @else
                                            @foreach ($agencias as $r)
                                                <option value="{{ $r->cod_agencia }}">
                                                    {{ $r->nom_agencia }}
                                                </option>
                                            @endforeach
                                        @endif
                


                                          
                                        </select>
                                        @error('cod_agencia')
                                            <small class="text-danger">
                                                *{{ $message }}
                                            </small>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6 pr-1">
                                    <div class="form-group">
                                        <label>Usuario Movil</label>
                                        <select class="form-control" id="cod_chofer" name="cod_chofer" required>

                                        </select>
                                        @error('cod_chofer')
                                            <small class="text-danger">
                                                *{{ $message }}
                                            </small>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6 pr-1">
                                    <div class="form-group">
                                        <label>Fecha</label>
                                        <input type="text" name="fecha" id="fecha" class="form-control" required
                                            value="{{ date('d/m/Y') }}">

                                        @error('fecha')
                                            <small class="text-danger">
                                                *{{ $message }}
                                            </small>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6 pr-1">
                                    <div class="form-group">
                                        <label>Orden</label>
                                        <input type="text" name="orden" id="orden" class="form-control">

                                        @error('orden')
                                            <small class="text-danger">
                                                *{{ $message }}
                                            </small>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6 pr-1">
                                    <div class="form-group">

                                        <div class="input-group-btn">
                                            <button id="agregar" class="btn btn-lg btn-primary" type="submit">
                                                Agregar Ruta
                                            </button>
                                        </div>

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


                        <table id="tabla" class="table">
                            <thead>
                                <tr>
                                    <th>Orden</th>
                                    <th>Nombre</th>
                                    <th>Dirección</th>
                                    <th>Comuna</th>
                                    <th>Guia</th>
                                    <th>Bultos</th>
                                </tr>
                            </thead>
                            <tbody id="registros">

                            </tbody>
                            <tbody id="registrosasociados">

                            </tbody>
                        </table>




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

@endsection

@section('javascript')

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            let codigobarras = document.getElementById('codigobarras');


            codigobarras.addEventListener("submit", function(e) {
                e.preventDefault();




                $.ajax({
                    type: 'POST',
                    url: 'rebajarasignacion',
                    data: new FormData(this),
                    dataType: 'JSON',
                    contentType: false,
                    cache: false,
                    processData: false,
                    success: function(response) {
                        //var response = JSON.parse(response);
                        console.log(response);

                        if (response.status == 0) {
                            swal({
                                title: "Atencion",
                                text: response.data[0].respuesta
                            });

                            $('#orden').focus();


                        } else {
                            var contenedor = $('#registros').html();


                            $('#registros').prepend($('<tr>')
                                .append($('<td>').append(response.data[0].n_orden))
                                .append($('<td>').append(response.data[0].nombre))
                                .append($('<td>').append(response.data[0].direccion))
                                .append($('<td>').append(response.data[0].comuna))
                                .append($('<td>').append(response.data[0].guia))
                                .append($('<td>').append(response.data[0].bultos))
                            )

                            $('#orden').val('');
                            $('#orden').focus();


                        }

                    },
                    error: function(response) {

                        swal({
                            title: "Atencion",
                            text: response.responseJSON.message
                        });

                    }
                })
            });
        }, false);


        $(document).ready(function() {



            $('#cod_agencia').on('change', function() {
                let id = $('#cod_agencia').val();
                $('#cod_chofer').empty();
                $('#cod_chofer').append('<option value="" disabled selected>Cargando...</option>');

                $.ajax({
                    type: 'GET',
                    url: 'choferagencia/' + id,
                    success: function(response) {
                        var response = JSON.parse(response);
                        $('#cod_chofer').empty();
                        $('#cod_chofer').append(
                            '<option value="" disabled selected >Selecccione Usuario Movil</option>'
                        );
                        response.forEach(element => {
                            $('#cod_chofer').append('<option value="' + element[
                                'cod_chofer'] + '" >' + element[
                                'nombre'] + '</option>');

                        });

                    }
                })

            });


            $('#cod_chofer').on('change', function() {
                let id = $('#cod_chofer').val();
                let fecha = $('#fecha').val();
                fecha = fecha.replaceAll("/", "-");

                $('#registrosasociados').empty();
                
                $.ajax({
                    type: 'GET',
                    url: 'listarasignacioneschofer/' + id + '/'+fecha,
                    data: {
                        "cod_chofer": id,
                        "fecha": fecha
                    },
                    dataType: 'JSON',
                    contentType: false,
                    cache: false,
                    processData: false,
                    success: function(data) {
                        //var response = JSON.parse(response);
                        console.log(data.data);
                       
                         
                        html ='';
                        if (data.status == 0) {
                            /*swal({
                                    title: "Atencion",
                                    text: "Usuario movil sin asignaciones"
                                });  */


                        } else {

                            for (i = 0; i < data.data.length; i++) {
                                html += '<tr>' +
                                    '<td>' + data.data[i].NUMERO_ORDEN + '</td>' +
                                    '<td>' + data.data[i].NOMBRE + '</td>' +
                                    '<td>' + data.data[i].DIRECCION + '</td>' +
                                    '<td>' + data.data[i].COMUNA + '</td>' +
                                    '<td>' + data.data[i].GUIA + '</td>' +
                                    '<td>' + data.data[i].BULTOS + '</td>' +
                                    '</tr>';
                            }
                            $('#registrosasociados').html(html);

                        }

                    },
                    error: function(data) {

                        swal({
                            title: "Atencion",
                            text: data.responseJSON.message
                        });

                    }
                })
            });





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



@endsection