<!--@Header-->
<?php

session_start();

$usuario = $_SESSION['nomUsuario'];
$rol_usuario=$_SESSION['rolUsuario'];
$id=$_SESSION['cveUsuario'];

if($rol_usuario=="GERENTE"){
  include("../usuario_administrador/path/header.php");
}else {
  include("path/header.php");
}
$datos_notas = get_notas($rol_usuario,$id);
$datos_productos = get_productos();
$dato_usuarios=get_usuarios();

?>

<div class="row">
  <div class="col-lg-12">
    <div class="row">
      <div class="col-md-12 mb-lg-0">
        <div class="card-header pb-0 p-2">
          <div class="row">
            <!--<div class="col-2">
              <i class="material-icons ms-auto text-dark cursor-pointer redondo-b" data-bs-toggle="tooltip" data-bs-placement="top" title="Cerrar"><img style="padding: 20%;" width="50" src="../assets/img/icons/cerrar.png"></i>
            </div>-->
            <div class="col-2">
              <i class="material-icons ms-auto text-dark cursor-pointer redondo-b" data-bs-toggle="tooltip" data-bs-placement="top" title="Refrescar"><img style="padding: 20%;" width="50" src="../assets/img/icons/refresh.png"></i>
            </div>
            <div class="col-2">
              <i class="material-icons ms-auto text-dark cursor-pointer redondo-b" type="button" data-bs-toggle="modal" data-bs-placement="top" title="Ver usuarios ON" data-bs-target="#modalUser"><img style="padding: 20%;" width="50" src="../assets/img/icons/user.png"></i>
            </div>
            <div class="col-2">
              <a href="/aqua-restaurant/functions/salir.php"><i class="material-icons ms-auto text-dark cursor-pointer redondo-b" data-bs-toggle="tooltip" data-bs-placement="top" title="Cerrar Sesion"><img style="padding: 20%;" width="50" src="../assets/img/icons/sesion.png"></i></a>
            </div>
            <div class="col-4 d-flex mb-4 justify-content-center">
              <img width="130" src="../assets/img/logos/logo.png">
            </div>
          </div>
        </div>
        <div class="card mt-1">
          <div class="card-body p-1">
            <div class="row">
              <div class="col-md-4 mb-md-0 mb-4">
                <div class="card card-body card-plain border-radius-lg d-flex align-items-center flex-row">
                  <a href="nota_venta.php">
                    <i class="material-icons text-dark cursor-pointer redondo-g" data-bs-toggle="tooltip" data-bs-placement="top" title="Nueva nota de venta"><img style="padding: 20%;" width="50" src="../assets/img/icons/nota.png"></i>
                  </a>
                  <i class="material-icons ms-auto text-dark cursor-pointer redondo-g" type="button" data-bs-toggle="modal" data-bs-placement="top" title="Ver menu" data-bs-target="#Modal-2"><img style="padding: 20%;" width="50" src="../assets/img/icons/menu.png"></i>
                  <!--<i class="material-icons ms-auto text-dark cursor-pointer redondo-g" data-bs-toggle="tooltip" data-bs-placement="top" title="Edit Card"><img style="padding: 20%;" width="50" src="../assets/img/icons/salir_nota.png"></i>-->
                </div>
              </div>
              <div class="col-md-8 pt-1">
                <div class="card card-body card-plain d-flex justify-content-center flex-row text-center banner-titulo" style="  background: #052659; border-top-left-radius: 50px; border-bottom-left-radius: 50px; border-top-right-radius: 0; border-bottom-right-radius: 0; box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);">
                  <h6 class="font-weight-bold mb-0 text-white" style="font-size: 25px; line-height: 1;">Listado de nota de ventas</h6>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      
      <div class="col-12">
        <div class="card my-1">
          <div class="card-body px-0">
            <div class="table-responsive">
              <table class="table" id="tabla_notas">
                <thead style="background: #D5D8DC;">
                  <tr >
                    <th class="align-middle text-center" scope="col">#</th>
                    <th class="align-middle text-center" scope="col">Nota</th>
                    <th class="align-middle text-center" scope="col">Fecha</th>
                    <th class="align-middle text-center" scope="col">Último cambio</th>
                    <th class="align-middle text-center" scope="col">Estatus</th>
                    <th class="align-middle text-center" scope="col">M</th>
                    <th class="align-middle text-center" scope="col">P</th>
                    <th class="align-middle text-center" scope="col">Mesero</th>
                    <th class="align-middle text-center" scope="col">Edt</th>
                    <?php if($rol_usuario=="GERENTE"){?>
                    <th class="align-middle text-center" scope="col">Elmnr</th>
                    
                    <th class="align-middle text-center" scope="col">Fin</th>
                    <?php } ?>
                    <th class="align-middle text-center" scope="col">Imprimir</th>
                  </tr>
                </thead>
                <tbody class="tabla_notas_body" id="tbody_tabla_notas">
                <?php
                  
                  for($rr=0;$rr<count($datos_notas);$rr++){
                ?>
                
                  <tr id="tr_notas">
                    <th class="align-middle text-center"> <?php echo $datos_notas[$rr]["ID"]?></th>
                    <td class="align-middle text-center"> <?php echo $datos_notas[$rr]["CLAVE"]?></td>
                    <td class="align-middle text-center "><?php echo $datos_notas[$rr]["FECHA"]?></td>
                    <td class="align-middle text-center "><?php echo $datos_notas[$rr]["ULTIMO_CAMBIO"]?></td>
                    <td class="align-middle text-center "><?php echo $datos_notas[$rr]["ESTATUS"]?></td>
                    <td class="align-middle text-center "><?php echo $datos_notas[$rr]["NO_MESA"]?></td>
                    <td class="align-middle text-center "><?php echo $datos_notas[$rr]["NO_PERSONAS"]?></td>
                    <td class="align-middle text-center "><?php echo $datos_notas[$rr]["NOMBRE"]?></td>
                    <td class="align-middle text-center ">
                      <form action="editar_nota.php" method="post"><button type="submit" class="badge badge-sm btn bg-gradient-info" value="<?php echo $datos_notas[$rr]['ID']?>" name="boton_editar">Edi</button></form>
                      
                    </td>
                    <?php if($rol_usuario=="GERENTE"){?>
                    <td class="align-middle text-center ">
                      <form action="../functions/eliminar_nota.php" method="post">
                          <button type="submit" class="badge badge-sm btn bg-gradient-danger" value="<?php echo $datos_notas[$rr]['ID']?>" name="boton_eliminar">Eli</button>
                      </form>
                    </td>
                   
                    <td class="align-middle text-center ">
                      
                      <form action="../functions/finalizar_nota.php" method="post">
                          <button type="submit" class="badge badge-sm btn bg-gradient-primary" value="<?php echo $datos_notas[$rr]['ID']?>" name="boton_finalizar">Fin</button>
                     </form>
                    </td>
                    <?php } ?>
                    <td class="align-middle text-center ">
                    <form action="../ticket/ticket_nota_venta.php" method="post">
                        <span class="badge badge-sm btn bg-gradient-success" style="margin-bottom: 0;" value="<?php echo $datos_notas[$rr]['ID']?>" name="boton_imprimir"><img width="20" src="../assets/img/icons/impresion.png" ></span>
                    </form>

                    </td>
                  </tr>
                  <?php
                    }
                  ?>
                  
                </tbody>
              </table>
            </div>
          </div>

        </div>
      </div>

    </div>
  </div>
  <!--<div class="col-lg-4">
          <div class="card h-100">
            <div class="card-header pb-0 p-3">
              <div class="row">
                <div class="col-6 d-flex align-items-center">
                  <h6 class="mb-0">Invoices</h6>
                </div>
                <div class="col-6 text-end">
                  <button class="btn btn-outline-primary btn-sm mb-0">View All</button>
                </div>
              </div>
            </div>
            <div class="card-body p-3 pb-0">
              <ul class="list-group">
                <li class="list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg">
                  <div class="d-flex flex-column">
                    <h6 class="mb-1 text-dark font-weight-bold text-sm">March, 01, 2020</h6>
                    <span class="text-xs">#MS-415646</span>
                  </div>
                  <div class="d-flex align-items-center text-sm">
                    $180
                    <button class="btn btn-link text-dark text-sm mb-0 px-0 ms-4"><i class="material-icons text-lg position-relative me-1">picture_as_pdf</i> PDF</button>
                  </div>
                </li>
                <li class="list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg">
                  <div class="d-flex flex-column">
                    <h6 class="text-dark mb-1 font-weight-bold text-sm">February, 10, 2021</h6>
                    <span class="text-xs">#RV-126749</span>
                  </div>
                  <div class="d-flex align-items-center text-sm">
                    $250
                    <button class="btn btn-link text-dark text-sm mb-0 px-0 ms-4"><i class="material-icons text-lg position-relative me-1">picture_as_pdf</i> PDF</button>
                  </div>
                </li>
                <li class="list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg">
                  <div class="d-flex flex-column">
                    <h6 class="text-dark mb-1 font-weight-bold text-sm">April, 05, 2020</h6>
                    <span class="text-xs">#FB-212562</span>
                  </div>
                  <div class="d-flex align-items-center text-sm">
                    $560
                    <button class="btn btn-link text-dark text-sm mb-0 px-0 ms-4"><i class="material-icons text-lg position-relative me-1">picture_as_pdf</i> PDF</button>
                  </div>
                </li>
                <li class="list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg">
                  <div class="d-flex flex-column">
                    <h6 class="text-dark mb-1 font-weight-bold text-sm">June, 25, 2019</h6>
                    <span class="text-xs">#QW-103578</span>
                  </div>
                  <div class="d-flex align-items-center text-sm">
                    $120
                    <button class="btn btn-link text-dark text-sm mb-0 px-0 ms-4"><i class="material-icons text-lg position-relative me-1">picture_as_pdf</i> PDF</button>
                  </div>
                </li>
                <li class="list-group-item border-0 d-flex justify-content-between ps-0 border-radius-lg">
                  <div class="d-flex flex-column">
                    <h6 class="text-dark mb-1 font-weight-bold text-sm">March, 01, 2019</h6>
                    <span class="text-xs">#AR-803481</span>
                  </div>
                  <div class="d-flex align-items-center text-sm">
                    $300
                    <button class="btn btn-link text-dark text-sm mb-0 px-0 ms-4"><i class="material-icons text-lg position-relative me-1">picture_as_pdf</i> PDF</button>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div>-->
</div>

<!-- Modal Usuarios -->
<div class="modal fade" id="modalUser" tabindex="-1" aria-labelledby="modalUserLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="modalUserLabel">Usuarios Activos</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div class="card h-100">
          <div class="card-header pb-0 p-3">
            <div class="row">
              <div class="col-6 d-flex align-items-center">
                <h6 class="mb-0">Usuario:</h6>
              </div>
            </div>
          </div>
          <div class="card-body p-3 pb-0">
            <ul class="list-group">
              <?php
                for($rr=0;$rr<count($dato_usuarios);$rr++){
              ?>
              <li class="list-group-item border-0 d-flex justify-content-between ps-0 mb-2 border-radius-lg">
                <div class="d-flex flex-column">
                  <h6 class="mb-1 text-dark font-weight-bold text-sm"><?php echo $dato_usuarios[$rr]['NOMBRE']?></h6>
                </div>
              </li>
              <?php
                }
              ?>
              
            </ul>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>

<!-- Modal 2-->
<div class="modal fade" id="Modal-2" tabindex="-1" aria-labelledby="Modal-2Label" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="Modal-2Label">Ver carta</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-sm-10">
            <div class="ms-md-auto pe-md-3 d-flex align-items-center">
              <div class="input-group input-group-outline ">
                <label class="form-label">Buscador...</label>
                <input type="text" class="form-control" id="caja_buscar_producto1">
              </div>
            </div>
          </div>
          <div class="col-sm-2">
            <button type="button" class="btn btn-primary" style="padding-top: 5px; padding-bottom: 6px;"><img width="15" src="../assets/img/icons/buscar.png"></button>
          </div>
        </div>
        <div class="table-responsive pt-2">
          <div id="modal_2"></div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>

<!-- Modal 3-->
<div class="modal fade" id="ModalPago" tabindex="-1" aria-labelledby="ModalPagoLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="ModalPagoLabel">Tipo de Pago</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <div class="card h-100">
          <div class="card-header pb-0 p-3">
            <div class="row">
              <div class="col-12 d-flex align-items-center">
                <h6 class="mb-0">Selecciona el tipo de pago:</h6>
              </div>
            </div>
          </div>
          <div class="card-body p-3 pb-0">
            <div class="form-check pt-1">
              <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault3" checked>
              <label class="form-check-label" for="flexRadioDefault3">
                Efectivo
              </label>
            </div>
            <div class="form-check pt-1">
              <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault2">
              <label class="form-check-label" for="flexRadioDefault2">
                Tarjeta de Credito
              </label>
            </div>
            <div class="form-check pt-1">
              <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1" onChange="comprobar(this);">
              <label class="form-check-label" for="flexRadioDefault1">
                Ambas
              </label>
              <br>
              <label class="form-check-label" for="efectivo">
                Efectivo:
              </label>
              <input class="form-control" type="text" name="efectivo" id="efectivo" style="display:none; border-color: #8d7662;" />
              <br>
              <label class="form-check-label" for="tarjeta">
                Tarjeta:
              </label>
              <input class="form-control" type="text" name="tarjeta" id="tarjeta" style="display:none; border-color: #8d7662;" />

            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
        <button type="button" class="btn btn-primary">Ok</button>
      </div>
    </div>
  </div>
</div>
<script src="../assets/js/jquery-3.5.1.min.js"></script>

<script>
  function comprobar(obj) {
    if (obj.checked) {

      document.getElementById('efectivo').style.display = "";
      document.getElementById('tarjeta').style.display = "";

    } else {

      document.getElementById('efectivo').style.display = "none";
      document.getElementById('tarjeta').style.display = "none";
    }

  }
</script>

<script>
  
$(ver_menu());
  $(document).on('keyup','#caja_buscar_producto1', function(){
    var valor = $(this).val();
    if(valor != ""){
        ver_menu(valor);
    }else{
        ver_menu();
    }
});
function ver_menu(consulta){
    $.ajax({
        data: {consulta: consulta},
        url: '../functions/modal_2.php',
        type: 'post',
        dataType:'html',
        success:  function (response) {
            $('#modal_2').html(response);
        },
        error: function (error) {
            console.log(error); 
        }
    });
}

</script>
<!--
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/dataTables.bootstrap5.min.js"></script>
<script>
  $(document).ready(function () {
      $('#tabla_notas').DataTable();
  });
</script>-->

<!--@Footer-->
<?php
include("path/footer.php");
?>