@extends('menu/menu')

<div class="container table-responsive mb-5 p-sm-0" style="margin-top: 100px" >

  <div class="container mt-5"><div class="title-vista mt-4">SLA</div></div>


    <table class="table table-striped table-hover" id="mitable">
      <thead class="color-head">
        <tr>
          <th colspan="1" class="">PROVEEDOR</th>
          <th colspan="1" class="">SLA GENERAL (Hrs)</th>
          <th colspan="1" class="">SLA SANTIAGO (Hrs)</th>
          <th colspan="1" class="">EDITAR</th>
        </tr>
      </thead>
    <tbody>
        
        @if (!empty($proveeedores))
        @foreach ($proveeedores as $los_datos)
        <tr>
        <td class="">{{$los_datos->nombre_proveedor}}</td>
        <td class="">{{$los_datos->sla}}</td>
        <td class="">{{$los_datos->sla_santiago}}</td>
        {{-- <td class="">{{$los_datos->id}}</td> --}}
       <td>  <button type="button" class="btn btn-ter d-block  " onclick="editar({{$los_datos->id}},{{$los_datos->sla}},{{$los_datos->sla_santiago}})">Editar</button></td>


    </tr>
        @endforeach
        @endif
        
    </tbody>
    </table>
  </div>


  <!--MODAL POR REVISAR-->
<div class="modal fade" id="editarModalSla" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <div class="seccion-modal">EDITAR SLA</div>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <hr class="separador mx-4">
            <div class=" container">
              <div class="alert alert-success" role="alert" id="alertSla" style="display: none;">
                  SLA ACTUALIZADO
              </div>
              <div class="row">
                <div class="col-12 form-group mx-auto">
                  <label for="">SLA (Hrs)</label>
                  <input class="form-control mayuscula" type="number" placeholder="" id="sla">
                  <input class="form-control mayuscula" type="text" style="display: none;" placeholder="" id="slaid">

              </div>
              <div class="col-12 form-group mx-auto">
                <label for="">SLA SANTIAGO (Hrs)</label>
                <input class="form-control mayuscula" type="number" placeholder="" id="sla_santiago">
            </div>
            <div class="col-sm-12 my-4 text-center">
                        <button class="btn btn-prim px-sm-5 hacer_seguimiento" onclick="guardar();">Guardar</button>
                    
                    </div>
              </div>
              
           </div>
        </div>
    </div>
</div>
  <script>

  function editar(x,sla,sla_santiago){

   // alert(x+"-"+sla+"-"+sla_santiago);
    $("#sla").val(sla);
    $("#sla_santiago").val(sla_santiago);
    $("#slaid").val(x);

    
                    $("#editarModalSla").modal('show');

  }
  function guardar(){

// alert(x+"-"+sla+"-"+sla_santiago);
 slaV=$("#sla").val();
 slaSV= $("#sla_santiago").val();
 id=$("#slaid").val();
 $.ajax({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url: "{{ route('go.guardarsla') }}",
                method: "GET",
                data: {
                   
                    'sla_v': slaV,'slas_v':slaSV,'slaid':id
                },
                success: function(data) {
                  $("#alertSla").css("display","")
                  setTimeout(()=>{
                    $("#alertSla").css("display","")

                    location.reload();

                    }, 2000);
                }
            });
                

}
  </script>