<link rel=icon href='img/logonino.jpeg' sizes="32x32" type="image/jpeg">
<script src="css/bootstrap/js/jquerymin.js"></script>
<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;
}

$(document).ready(function(){
    $("#num_fac").blur(function(){
        $.post("miarchivo2.php", {"num_fac":$("#num_fac").val(), "nombre_proveedor":$("#nombre_proveedor").val() }, function(data){
            if(data.num_fac){
                $("#num_fac").val("");
                $("#num_fac").focus();
                alert("Factura ya fue porcesada");  
            }
        },"json");
    });
});
</script>
<link rel="stylesheet" type="text/css" href="styles/jquery-ui-1.10.3.custom.css">
<style>
    /* Estilos profesionales y estructura 60/40 */
    #primero {
        width: 58%;
        float: left;
        height: 700px;
        padding: 10px;
        font-size:10px;
        border: 1px solid #ddd;
        overflow-y:auto; 
        background: #fff;
    }

    #segundo {
        width: 42%;
        float: right;
        height: 700px;
        padding: 10px;
        overflow-y:auto;
        border: 1px solid #ddd;
        border-left: none;
        z-index:-1;
        background: #fff;
    }
    .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;
    }
    @media (max-width: 991px) {
        #primero, #segundo { width: 100% !important; float: none !important; border-left: 1px solid #ddd; height: auto; }
        .dato-compacto { border-right: none !important; margin-bottom: 10px; }
    }
    .clearfix-vta::after { content: ""; clear: both; display: table; }
</style>

<?php
    error_reporting(E_ALL ^ E_NOTICE);
    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_adquisiciones="active";
    $title="Nueva Compra |".NOMBRE_EMPRESA;
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <?php include("head.php");?>
  </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 Compra</h4>
            </div>
            <div class="panel-body">
                <?php 
                    include("modal/registro_proveedores.php");
                    include("modal/registro_productos.php");
                ?>
                
                <form class="form-horizontal" role="form" action="ajax/procesar_compra.php" method="get">
                    <div class="card-venta">
                        <div class="row">
                            <div class="col-md-9 col-xs-12">
                                <div class="row">
                                    <div class="col-md-3 col-xs-6 dato-compacto" style="border-right: 1px solid #eee;">
                                        <label class="label-titulo">Nº Factura</label>
                                        <input type="text" class="form-control input-sm" id="num_fac" name="num_fac" required onKeyPress="return ValNumero(event)" placeholder="Número">
                                    </div>
                                    <div class="col-md-5 col-xs-6 dato-compacto" style="border-right: 1px solid #eee;">
                                        <?php
                                            $id_comprador=$_SESSION['user_id'];
                                            $sql_comprador=mysqli_query($con,"select * from users where user_id=$id_comprador");
                                            $rw=mysqli_fetch_array($sql_comprador);
                                            $nombre_comprador=$rw["firstname"]." ".$rw["lastname"];
                                        ?>
                                        <label class="label-titulo">Encargado</label>
                                        <span class="dato-valor"><?php echo $nombre_comprador;?></span>
                                        <input type="hidden" name="nombre_comprador" value="<?php echo $nombre_comprador?>">
                                        <input type="hidden" id="id_encargado" name="id_encargado" value="<?php echo $id_comprador?>">
                                    </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" name="fecha" value="<?php echo date("d/m/Y");?>">
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 col-xs-12 text-right">
                                <button type="submit" class="btn btn-success btn-block btn-lg" style="font-weight: bold;">
                                    <span class="glyphicon glyphicon-print"></span> PROCESAR COMPRA
                                </button>
                            </div>
                        </div>
                    </div>

                   <div class="card-venta">
    <div class="row">
        <div class="col-md-12 col-xs-12">
            <label class="label-titulo">Proveedor y Acciones</label>
            <div class="form-inline">
                <div class="input-group" style="width: 50%;">
                    <input type="text" class="form-control" id="nombre_proveedor" name="nombre_proveedor" placeholder="Buscar proveedor..." required>
                    <input id="id_pro" name="id_pro" type='hidden'> 
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" data-toggle="modal" data-target="#nuevoProveedor" title="Nuevo Proveedor">
                            <i class="glyphicon glyphicon-user"></i>
                        </button>
                    </span>
                </div>

                <button type="button" class="btn btn-info" data-toggle="modal" data-target="#nuevoProducto" style="margin-left: 15px; font-weight: bold;">
                    <i class="glyphicon glyphicon-plus"></i> AGREGAR PRODUCTO
                </button>
            </div>
        </div>
    </div>
</div>
                </form> 

                <div class="clearfix-vta">
                    <div id="primero">
                        <h4 style="font-size:14px; font-weight:bold; border-bottom: 1px solid #eee; padding-bottom: 10px;">BUSCAR PRODUCTOS</h4>
                        <div class="row">
                            <div class="col-sm-7"><input type="text" class="form-control" id="q" placeholder="Buscar..." onKeyUp="load(1)"></div>
                            <div class="col-sm-5">
                                <select class="form-control" id="rub" name="rub" onchange='load(1);'>
                                    <option value="">---Rubros---</option>
                                    <?php 
                                    $res_rub= mysqli_query($con, "SELECT tipo_producto FROM products GROUP BY tipo_producto");
                                    while($d= mysqli_fetch_array($res_rub)) { echo "<option value='".$d['tipo_producto']."'>".$d['tipo_producto']."</option>"; }
                                    ?>
                                </select> 
                            </div>
                        </div>
                        <div class="outer_div" style="margin-top:15px;"></div>
                    </div>

                    <div id="segundo">
                        <div style="background: #5bc0de; color: white; padding: 10px; border-radius: 4px; text-align: center; font-weight: bold;">
                            DETALLE DE COMPRA
                        </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 src="js/jquery-ui-1.11.4/jquery-ui.js"></script>
    <script type="text/javascript" src="js/nueva_compra.js"></script>
    <script>
       $(function() {
        $("#nombre_proveedor").autocomplete({
            source: "./ajax/autocomplete/proveedores.php",
            minLength: 2,
            select: function(event, ui) {
                event.preventDefault();
                $('#id_pro').val(ui.item.id_pro); // Usamos id_pro como en tu tabla
                $('#nombre_proveedor').val(ui.item.nombre_proveedor);
            }
        });
    });
    </script>
  </body>
</html>