@extends('layouts.app')

@section('content')
<div class="container">

    <form  method="POST" action="{{ route('buscar_actividad') }}">

        @csrf
        <div class="form-row">
          <div class="form-group col-md-10">
            <input type="text" class="form-control" id="buscar" name="buscar" placeholder="Buscar por palabra clave o codigo CIUU">
          </div>

          <div class="form-group col-md-2">
            <button class="btn btn-primary" id="saveBtn" type="submit">Enviar Información</button>
          </div>
        </div>

    </form>

<br><br>

@if(isset($actividades))
    <select class="form-select"  name="dato_actividad" id="dato_actividad" aria-label="Default select example">
      <option selected>Elija una opcion</option>
    
      @foreach($actividades as $actividad)
        <option value="{{$actividad->id}}">{{$actividad->descripcion}} -- {{$actividad->codigo}}</option>
      @endforeach
    
    </select>
  @endif  



  <div class="container">
    <h1>Proveedores</h1>
    <table class="table table-bordered data-table">
        <thead>
            <tr>
                <th>id</th>
                <th>Razon Social</th>
                <th>Nit</th>
                <th>Contacto</th>
                <th>Direccion</th>
                <th>Teléfono</th>
                <th>Email</th>
                <th>Ciudad</th>
                <th>Ciiu 1</th>
                <th>Ciiu 2</th>
                <th>Ciiu 3</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>



</div>
@endsection

@section('js')

<script type="text/javascript">

    $.ajaxSetup({
        headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });


    
    $("#dato_actividad").change(function(){

        var id_actividad = $(this).val();
        var ruta = "{{ url('home/proveedor_actividad') }}"+"/"+id_actividad;

        var table = $('.data-table').DataTable({
        processing: true,
        serverSide: true,
        bDestroy : true,
        ajax: ruta,
        columns: [
            {data: 'id', name: 'id'},
            {data: 'razon_social', name: 'razon_social'},
            {data: 'nit', name: 'nit'},
            {data: 'contacto', name: 'contacto'},
            {data: 'direccion', name: 'direccion'},
            {data: 'telefono', name: 'telefono'},
            {data: 'email', name: 'email'},
            {data: 'ciudad', name: 'ciudad'},
            {data: 'ciiu_1', name: 'ciiu_1'},
            {data: 'ciiu_2', name: 'ciiu_2'},
            {data: 'ciiu_3', name: 'ciiu_3'},

        ]
        });

     

      

    });
    
 
  
</script>


@endsection