<link rel=icon href='img/logonino.jpeg' sizes="32x32" type="image/jpeg">
<script type="text/jscript">
function Valtext(e) {
    key = e.keyCode || e.which;
    tecla = String.fromCharCode(key).toLowerCase();
    letras = " áéíóúabcdefghijklmnñopqrstuvwxyz";
    especiales = [8, 37, 39, 46];

    tecla_especial = false
    for(var i in especiales) {
        if(key == especiales[i]) {
            tecla_especial = true;
            break;
        }
    }

    if(letras.indexOf(tecla) == -1 && !tecla_especial)
        return false;
}

function ValNumero(e) {
    key = e.keyCode || e.which;
    tecla = String.fromCharCode(key).toLowerCase();
    letras = "0123456789";
    especiales = [8, 37, 39, 46];

    tecla_especial = false
    for(var i in especiales) {
        if(key == especiales[i]) {
            tecla_especial = true;
            break;
        }
    }

    if(letras.indexOf(tecla) == -1 && !tecla_especial)
        return false;
}
</script>
<link rel="stylesheet" type="text/css" href="styles/jquery-ui-1.10.3.custom.css">
<style>
#primero {
    width: 58%;
    float: left;
    height: 700px;
	padding: 2px;
	font-size:10px;
	border:#000;
	border-style:solid;
	overflow-y:auto; 
}

#segundo {
    width: 42%;
    float: right;
    height: 700px;
	padding: 2px;
	overflow-y:auto;
	border:#000;
	border-style:solid;
	z-index:-1;
	size:10px;
}
.Estilo1 {font-size: 12px}
</style>
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
require_once ("config/db.php");
require_once ("config/conexion.php");
session_start();
if (!isset($_SESSION['user_login_status']) AND $_SESSION['user_login_status'] != 1) 
{
	header("location: login.php");
	exit;
}
$active_facturas="";
$active_facturas="active";
$active_productos="";
$active_clientes="";
$active_usuarios="";	
$title="Nueva Factura |" .NOMBRE_EMPRESA;
$almacen=$_SESSION['estado'];
					$query_tienda=mysqli_query($con, "select * from tiendas where id_tienda='$almacen'");
					while ($row_tienda=mysqli_fetch_array($query_tienda))
					{
						$almacen=$row_tienda['nombre'];
						
					}
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <?php include("head.php");?>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  </head>
  <body>
	<?php
	include("navbar.php");
	?>  
    <div class="container" style="width:99%">
		<div class="panel panel-info">
			<div class="panel-heading">
        		<h4><i class='glyphicon glyphicon-edit'></i> Nueva Venta <?php echo $almacen?></h4>
			</div>
			<div class="panel-body">
				<?php 
				include("modal/cargar_codigo.php");
				
				include("modal/registro_clientes.php");
				
				$sql_pro=mysqli_query($con, "select LAST_INSERT_ID(numero_factura) as last from facturas order by id_factura desc limit 0,1 ");
				$res=mysqli_fetch_array($sql_pro);
				$numero_factura=$res['last']+1;
				
				
				$_SESSION['num_fac']=$numero_factura;
				?>
	<div class="table-responsive">
		<form class="form-horizontal" role="form" id="datos_factura">
    		<style>
    /* Estilos para que se vea profesional y limpio */
    .card-venta {
        background: #ffffff;
        border: 1px solid #e3e6f0;
        border-radius: 8px;
        padding: 15px;
        margin-bottom: 15px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }
    .label-titulo {
        font-size: 11px;
        text-transform: uppercase;
        color: #858796;
        font-weight: bold;
        display: block;
        margin-bottom: 2px;
    }
    .dato-valor {
        font-size: 14px;
        color: #4e73df;
        font-weight: 600;
    }
    /* Estilo especial para el crédito (más grande y llamativo) */
    .seccion-credito {
        background: #fff9e6;
        border: 2px dashed #f6c23e;
        border-radius: 8px;
        padding: 10px;
        text-align: center;
    }
    /* Ajuste para móviles: quita el margen a la derecha en pantallas pequeñas */
    @media (max-width: 767px) {
        .dato-compacto { border-right: none !important; margin-bottom: 10px; }
        .text-right-mobile { text-align: left !important; margin-top: 10px; }
    }
</style>

<div class="container-fluid">
    <div class="card-venta">
        <div class="row">
            <div class="col-md-8 col-xs-12">
                <div class="row">
                    <div class="col-md-3 col-xs-4 dato-compacto" style="border-right: 1px solid #eee;">
                        <label class="label-titulo">Nº Venta</label>
                        <span class="dato-valor" style="color:#e74a3b; font-size: 16px;"><?php echo $numero_factura;?></span>
                        <input type='hidden' id="num_fac" name="num_fac" value="<?php echo $numero_factura;?>">
                    </div>
                    
                    <div class="col-md-5 col-xs-8 dato-compacto" style="border-right: 1px solid #eee;">
                        <?php
                            $id_vendedor=$_SESSION['user_id'];
                            $sql_vendedor=mysqli_query($con,"select * from users where user_id=$id_vendedor");
                            while ($rw=mysqli_fetch_array($sql_vendedor)) {
                                $nombre_vendedor=$rw["firstname"]." ".$rw["lastname"];
                            }
                        ?>
                        <label class="label-titulo">Vendedor</label>
                        <span class="dato-valor"><?php echo $nombre_vendedor;?></span>
                        <input type="hidden" id="nombre_vendedor" name="nombre_vendedor" value="<?php echo $nombre_vendedor?>">
                        <input type="hidden" id="id_vendedor" name="id_vendedor" value="<?php echo $id_vendedor?>">
                    </div>

                    <div class="col-md-4 col-xs-12">
                        <label class="label-titulo">Fecha</label>
                        <span class="dato-valor"><?php echo date("d/m/Y");?></span>
                        <input type="hidden" id="fecha" name="fecha" value="<?php echo date("d/m/Y");?>">
                    </div>
                </div>
            </div>

            <div class="col-md-4 col-xs-12 text-right-mobile">
                <?php if($_SESSION['rol']=="gerencia" || $_SESSION['user_name']=="krivera" || $_SESSION['user_name']=="aestrada" || $_SESSION['user_name']=="pguillen" || $_SESSION['user_name']=="imarinbe") { ?>
                    <div class="seccion-credito">
                        <label style="color: #856404; font-size: 12px; font-weight: bold;">
                            <i class="glyphicon glyphicon-usd"></i> CRÉDITO:
                        </label>
                        <input type="checkbox" id="cre" value="SI" name="cre" style="transform: scale(1.8); margin-left: 10px; vertical-align: middle;">
                        <span style="font-weight: bold; margin-left: 5px;">SÍ</span>
                    </div>
                <?php } ?>
            </div>
        </div>
    </div>

    <div class="card-venta">
        <div class="row">
            <div class="col-md-5 col-xs-12" style="margin-bottom: 15px;">
                <label class="label-titulo"><i class="glyphicon glyphicon-search"></i> Cliente</label>
                <div class="input-group">
                    <input type="text" class="form-control" id="nombre_cliente" name="nombre_cliente" placeholder="Nombre cliente..." required>
                    <input id="id_cliente" name="id_cliente" type='hidden'>
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" data-toggle="modal" data-target="#nuevoCliente">
                            <span class="glyphicon glyphicon-plus"></span>
                        </button>
                    </span>
                </div>
            </div>

            <div class="col-md-7 col-xs-12">
                <label class="label-titulo"><i class="glyphicon glyphicon-comment"></i> Observaciones (Comanda)</label>
                <textarea class="form-control" id="obs_venta" name="obs_venta" rows="2" placeholder="Ej: Sin cebolla, extra salsa..." style="resize:none;"></textarea>
            </div>
        </div>
        
        <div class="row" style="margin-top: 15px;">
            <div class="col-xs-12">
                <button type="submit" class="btn btn-success btn-block btn-lg" style="font-weight: bold; text-transform: uppercase; box-shadow: 0 4px 6px rgba(0,0,0,0.1);">
                    <span class="glyphicon glyphicon-print"></span> Procesar Venta
                </button>
            </div>
        </div>
    </div>
</div>
        </form>	
                <style>
    /* Contenedor maestro */
    .seccion-facturacion-total {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important; /* Cambiado de flex a block para máxima compatibilidad */
        overflow: hidden;
    }

    /* Estilo para los bloques */
    .bloque-vta {
        box-sizing: border-box !important;
        background: #fff;
        border: 1px solid #ddd;
        padding: 15px;
        float: left; /* Volvemos al float clásico que es más estable en navegadores viejos */
    }

    /* Pantalla Grande (PC): 60% y 40% */
    @media (min-width: 992px) {
        .w-60 { width: 60% !important; }
        .w-40 { width: 40% !important; border-left: none !important; }
    }

    /* Pantalla Pequeña (Móvil): 100% y 100% */
    @media (max-width: 991px) {
        .w-60, .w-40 {
            width: 100% !important;
            float: none !important;
            display: block !important;
            margin-bottom: 10px;
        }
    }

    /* Limpiador para que el float no rompa el diseño de abajo */
    .clearfix-vta::after {
        content: "";
        clear: both;
        display: table;
    }
</style>

<div class="seccion-facturacion-total clearfix-vta">
    
    <div id="primero" class="bloque-vta w-60">
        <div style="border-bottom: 1px solid #eee; margin-bottom: 15px;">
            <h4 style="font-size:14px; font-weight:bold;">BUSCAR PRODUCTOS</h4>
        </div>

        <form>
            <div class="form-group">
                <label style="font-size:12px;">TIENDA</label>
                <?php if($_SESSION['rol']=="gerencia") { ?>
                    <select class="form-control" id="est" name="tienda" onchange='load(1);'>
                        <option value="">--- Seleccione Tienda ---</option>
                        <?php 
                        //$count_query = mysqli_query($con, "SELECT * FROM tiendas WHERE id_tienda != 1");
                        $count_query = mysqli_query($con, "SELECT * FROM tiendas");
                        while($dato = mysqli_fetch_array($count_query)) {
                            echo "<option value='".$dato['id_tienda']."'>".$dato['nombre']."</option>";
                        } ?>
                    </select>
                <?php } else { ?>
                    <select class="form-control" id="est" name="est" onchange='load(1);'>
                        <?php 
                        $count_query= mysqli_query($con, "SELECT * FROM `tiendas` where id_tienda='".$_SESSION['estado']."'");
                        while($dato= mysqli_fetch_array($count_query)) {
                            echo "<option value='".$dato['id_tienda']."'>".$dato['nombre']."</option>";
                        } ?>
                    </select> 
                <?php } ?>
            </div>

            <div class="row">
                <div class="col-xs-12 col-sm-7">
                    <label style="font-size:12px;">PRODUCTO</label>
                    <input type="text" class="form-control" id="q" name="q" placeholder="Buscar..." onKeyUp="load(1)">
                </div>
                <div class="col-xs-12 col-sm-5">
                    <label style="font-size:12px;">TIPO</label>
                    <select class="form-control" id="rub" name="rub" onchange='load(1);'>
                        <option value="">--- Todos ---</option>
                        <?php 
                        $count_query= mysqli_query($con, "SELECT * FROM `producto_final` GROUP BY `tipo`");
                        while($dato= mysqli_fetch_array($count_query)) {
                            echo "<option value='".$dato['tipo']."'>".$dato['tipo']."</option>";
                        } ?>
                    </select> 
                </div>
            </div>
        </form>
        
        <div class="outer_div" style="margin-top:15px;"></div>
    </div>

    <div id="segundo" class="bloque-vta w-40">
        <div style="background: #337ab7; color: white; padding: 10px; border-radius: 4px;">
            <h4 align="center" style="font-size:12px; font-weight:bold; margin:0;">
                DETALLE DE FACTURA Nº <?php echo $numero_factura;?>
            </h4>
        </div>
        
        <div id="resultados" style="margin-top:15px;">
            </div>
    </div>

</div>
            
				
			</div>
		</div>		
	</div>
	<hr>
	<?php
	include("footer.php");
	?>
    <script type="text/javascript" src="js/VentanaCentrada.js"></script>
	<script type="text/javascript" src="js/nueva_factura.js?v=1.1"></script>
	<script src="js/jquery-ui-1.11.4/jquery-ui.js"></script>
	<script>
	 function uncheck(){
     var checkbox1 = document.getElementById("1");
     var checkbox2 = document.getElementById("2"); 
    checkbox1.onclick = function(){ 
    if(checkbox1.checked != false){ 
    checkbox2.checked =null; }
     } 
    checkbox2.onclick = function(){ 
    if(checkbox2.checked != false){ 
    checkbox1.checked=null;
     }
     } 
    }

	
	
	$(document).ready(function(){
			$("#num_fac").blur(function(){
			var num_pro=document.getElementById('num_fac').value;
				
			$.ajax({
              url: "num_factura.php",
              type: "POST",
              async: true,
              data: {
                num_pro : num_fac} ,
                    success: function(result) {
                       $('#resultado').html(result);

                    },
                    error: function(result) {

                  $('#resultado').html('Se ha producido un error.');
                    }
              });
			
		});
		});
	
		$(function() {
						$("#nombre_cliente").autocomplete({
							source: "./ajax/autocomplete/clientes.php",
							minLength: 2,
							select: function(event, ui) {
								event.preventDefault();
								$('#id_cliente').val(ui.item.id_cliente);
								$('#nombre_cliente').val(ui.item.nombre_cliente);
								$('#tel1').val(ui.item.telefono_cliente);
								$('#mail').val(ui.item.email_cliente);
								$('#organizacion_cliente').val(ui.item.organizacion_cliente);
																
							 }
						});
						 
						
					});
					
	$("#nombre_cliente" ).on( "keydown", function( event ) {
						if (event.keyCode== $.ui.keyCode.LEFT || event.keyCode== $.ui.keyCode.RIGHT || event.keyCode== $.ui.keyCode.UP || event.keyCode== $.ui.keyCode.DOWN || event.keyCode== $.ui.keyCode.DELETE || event.keyCode== $.ui.keyCode.BACKSPACE )
						{
							$("#id_cliente" ).val("");
							$("#tel1" ).val("");
							$("#mail" ).val("");
							$("#organizacion_cliente" ).val("");
											
						}
						if (event.keyCode==$.ui.keyCode.DELETE){
							$("#nombre_cliente" ).val("");
							$("#id_cliente" ).val("");
							$("#tel1" ).val("");
							$("#mail" ).val("");
							$("#organizacion_cliente" ).val("");
						}
			});	
			
			
</script>	
</body>
</html>