@extends('complementos.Dashboard')


@section('navbar')
@endsection
@section('titulo')
    Camiones Disponibles
@endsection
<link rel="stylesheet" href="{{ asset('icoons/Formatos_1/style.css') }}">
<link rel="stylesheet" href="{{ asset('fonts/icons/style.css') }}">
@section('contenido')

    <section class="tabla-camiones mt-4">
    <div class="container">
        <div class="table table-responsive">
            <table class="table table-striped table-hover table-md">
                <thead>
                    <tr>
                        <th>Fecha</th>
                        <th>Carta Porte</th>
                        <th>Económico</th>
                        <th>Operador</th>
                        <th>Razon Social</th>
                        <th>Destino</th>
                        <th>Estatus</th>
                    </tr>
                </thead>

                <tbody id="lista">

                </tbody>
            </table>
        </div>
    </div>
</section>


<script src="{{ asset('js/time.js') }}"></script>

    <script>
          function ListSop(){
        $.ajaxSetup({
            headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $('#lista').html('<style>.loading.loading{position: fixed;left: 35%;z-index: 999999999;}@media(max-width:700px){.loading.loading{left:13%;width:80%;}}</style><div class"loading><img class="loading" src="img/loading.gif"></div>');
        $.ajax({
            type: 'GET',
            url: 'tabcamiones',
            success:function(result){
                $(document).ready(function(){
                    $('#lista').html(result);
                });
            },error:function (xhr, ajaxOptions, thrownError){
                if(xhr.status==404) {
                    alert(thrownError);
                }
            }
        });
        console.log('actualizada');
    }

    ListSop();
    setInterval('ListSop()',100000);
        </script>
@endsection