<style>.border {
      border: 1px solid;
    }</style>

<!-- Page Content -->
<div class="row">
  <div class="col-12">
    <div class="card card-outline card-primary shadow">
      <div class="card-header">
        <h3 class="card-title">
          <i class="fas fa-utensils text-primary mr-2"></i> Lista de <?= $this->controlador ?>
        </h3>
        <div class="card-tools">
          <button type="button" onclick="recargar()" class="btn btn-primary btn-sm rounded-pill" data-toggle="tooltip" title="RECARGAR">
            <i class="fas fa-sync-alt"></i>
          </button>
        </div>
      </div>
      <div class="card-body p-0">
        <div class="row m-2" id="listapedido">
          <!-- Las comandas se cargan aquí vía AJAX -->
        </div>
      </div>
    </div>
  </div>
</div>
<!-- /.container -->

<script type="text/javascript">
$(document).ready(function() {
  recargar();
  setInterval("recargar()", 10000);
});

function recargar() {
  $.ajax({
    url : "<?= $this->url ?>/load_pedido",
    type: "GET",
    dataType: "JSON",
    success: function(data) {
      $("#listapedido").html(data);
    },
    error: function (jqXHR, textStatus, errorThrown) {
      Lobibox.notify('error', {
        size: 'mini',
        position: 'top right',
        msg: 'Error al obtener datos de ajax.'
      });
    }
  });
}
function preparado(detalle) {
  $.ajax({
    type: "POST",
    url: "<?= $this->url ?>/preparado/" + detalle,
    success: function(data) {
      recargar();
    }
  });
};
function preparados(venta) {
  $.ajax({
    type: "POST",
    url: "<?= $this->url ?>/preparados/" + venta,
    dataType: "JSON",
    success: function(data) {
      if(data.status){
        recargar();
        
      }
      
    }
  });
};
</script>
