<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
        <meta name="description" content="" />
        <meta name="author" content="" />
        <title>BIO - ALMACÉN</title>
        <link href="./view/css/styles.css" rel="stylesheet" />
        <link rel="icon" type="image/x-icon" href="./view/assets/img/trinity_bio/icono_trinity.png" />
        <script data-search-pseudo-elements defer src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/js/all.min.js" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/feather-icons/4.28.0/feather.min.js" crossorigin="anonymous"></script>
    </head>
    <body class="nav-fixed">

        <?php require_once("./view/menu.phtml") ?>

        <div id="layoutSidenav">

            <?php require_once("./view/menuv.phtml") ?>
            
            <div id="layoutSidenav_content">
                <main>
                    <header class="page-header page-header-compact page-header-light border-bottom bg-white mb-4">
                        <div class="container-xl px-4">
                            <div class="page-header-content">
                                <div class="row align-items-center justify-content-between pt-3">
                                    <div class="col-auto mb-3">
                                        <h1 class="page-header-title">
                                            <div class="page-header-icon"><a href="index.php"><i data-feather="corner-up-left"></i></a></div>
                                            ATRÁS
                                        </h1>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </header>
                    
                    <div class="row">
                        <div class="container-xl px-4 mt-4">
                            
                            <nav class="nav nav-borders">
                                <a class="nav-link active ms-0">RECOJO CLIENTE</a>
                            </nav>
                            <hr class="mt-0 mb-4" />
                            <div class="row">
                                
                                <div class="col-xl-12">
                                    
                                    <div class="card mb-4">
                                        <div class="card-header">RECOJO CLIENTE</div>
                                        <div class="card-body">
                                            <form method="post" action="recojo_cliente.php" enctype="multipart/form-data">
                                                
                                                <div class="row gx-3 mb-3">
                                                    
                                                    <div class="col-md-12">
                                                        <label class="small mb-1" for="almacen">ALMACÉN - CENTRO DE COSTOS</label>
                                                        <select required  class="form-control" id="almacen" name="almacen" type="text" placeholder="">
                                                            <option value="" disabled="" selected="selected">SELECCIONAR</option>
                                                            
                                                            <?php
                                                            foreach($almacen_ccosto as $ac){
                                                                if($_SESSION['id_asignacion'] == $ac['id_asignacion_almacen_ccosto']){
                                                            ?>
                                                            <option value="<?=$ac['id_asignacion_almacen_ccosto']?>"><?=$ac['almacen']?> - <?=$ac['ccosto']?></option>
                                                            <?php
                                                                }
                                                            }
                                                            ?>
                                                            
                                                        </select>
                                                    </div>

                                                </div>

                                                <div class="row gx-3 mb-3">
                                                    
                                                    <div class="col-md-12">
                                                        <label class="small mb-1" for="tecnico">TÉCNICO</label>
                                                        <select required  class="form-control" id="tecnico" name="tecnico" type="text" placeholder="">
                                                            <option value="" disabled="" selected="selected">SELECCIONAR</option>
                                                            
                                                            <?php
                                                            foreach($tecnicos as $tecnico){
                                                            ?>
                                                            <?php
                                                            $found_key="";
                                                            $found_key = array_search($tecnico['codigo_usuario'], array_column($trabajadores, 'DOCIDEN'));
                                                            ?>
                                                            <option value="<?=$tecnico['id_usuario']?>"><?=$trabajadores[$found_key]['NOMBRES']?> - <?=$tecnico['codigo_usuario']?></option>
                                                            <?php
                                                            }
                                                            ?>
                                                                        
                                                        </select>
                                                    </div>

                                                </div>

                                                <div class="row gx-3 mb-3">
                                                    
                                                    <div class="col-md-5">
                                                            <label class="small mb-1" for="producto_servicio">SKU - DESCRIPCIÓN</label>
                                                            <!-- <select  class="form-control" id="producto_servicio" name="producto_servicio" type="text" placeholder=""> -->
                                                                        <!-- <option value="" disabled selected="selected">SELECCIONAR</option> -->
                                                            <datalist id="producto_servicio_list">
                                                            <?php
                                                            foreach($productos as $producto){
                                                            ?>
                                                            <option value="<?=$producto['sku']?> - <?=$producto['nombre_producto']?>"><?=$producto['sku']?> - <?=$producto['nombre_producto']?></option>
                                                            <?php
                                                            }
                                                            ?>
                                                            </datalist>
                                                            <input list="producto_servicio_list" class="form-control" id="producto_servicio" name="producto_servicio" type="text" value="" placeholder="PRODUCTO / SERVICIO"/>
                                                            
                                                            <!-- </select> -->
                                                    </div>

                                                    <div class="col-md-2" id="cantidads" name="cantidads">
                                                        <label class="small mb-1" for="cantidad">CANTIDAD</label>
                                                        <input class="form-control" id="cantidad" name="cantidad" type="number" value="0" />
                                                    </div>
                                                    <div class="col-md-4" id="series" name="series">
                                                        <label class="small mb-1" for="cantidad">SERIE</label>
                                                        <input class="form-control" id="serie" name="serie" type="text"/>
                                                    </div>

                                                    <div class="col-md-2" id="boton" name="boton">
                                                        <label class="small mb-1" for="agregar">AGREGAR</label>
                                                        <input onclick="agregarFila()" class="form-control btn btn-green" type="button" name="AGREGAR" id="AGREGAR" value="AGREGAR">
                                                    </div>

                                                </div>

                                                <div class="row gx-3 mb-3">
                                                    <label class="small mb-1" for="datatablesSimple1"><b>PRODUCTOS</b></label>
                                                    <table id="datatablesSimple1" name="datatablesSimple1">
                                                        <thead>
                                                            <tr>
                                                                <th>SKU</th>
                                                                <th>DESCRIPCIÓN</th>
                                                                <th>CANTIDAD</th>
                                                                <th>SERIE</th>
                                                                <th>ELIMINAR</th>
                                                            </tr>
                                                        </thead>
                                                        
                                                        <tbody>
                                                            <tr>
                                                            </tr>
                                                            
                                                        </tbody>
                                                    </table>

                                                </div>


                                                
                                                <div ><input class="form-control btn btn-primary" type="submit" name="REGISTRAR" id="REGISTRAR" value="REGISTRAR"></div>

                                                
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </main>
                <footer class="footer-admin mt-auto footer-light">
                    <div class="container-xl px-4">
                        <div class="row">
                            <div class="col-md-6 small">Copyright &copy; TRINITY ERP - BIO SAC 2022</div>
                            <div class="col-md-6 text-md-end small">
                                <a href="#!">POLÍTICAS DE PRIVACIDAD</a>
                                &middot;
                                <a href="#!">TERMINOS &amp; CONDICIONES</a>
                            </div>
                        </div>
                    </div>
                </footer>
            </div>
        </div>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
        <script src="./view/js/scripts.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.min.js" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/simple-datatables@4.0.8" crossorigin="anonymous"></script>
        <script src="./view/js/datatables/datatables-simple-demo.js"></script>
        <script src="./view/js/datatables/datatables-simple-demo1.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/litepicker/dist/bundle.js" crossorigin="anonymous"></script>
        <script src="./view/js/litepicker.js"></script>

        <script src="https://code.jquery.com/jquery-3.5.1.min.js" crossorigin="anonymous"></script>
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" crossorigin="anonymous"></script>
        <script>


            $("#boton").hide();


            $("#cantidad").change(function(){
                if($(this).val() > "1"){

                    $("#cantidads").show();
                    $("#series").hide();
                    $("#boton").show();
                    
                    
                }else{
                    $("#series").show();
                    $("#boton").show();
                }
            });

            $("#serie").change(function(){
                if($(this).val() != ""){

                    $("#cantidads").hide();
                    $("#boton").show();
                    
                }else{
                    $("#cantidads").show();
                    $("#boton").hide();
                }
            });
            

            function agregarFila(){

                var valor = document.getElementById("producto_servicio").value;
                var nv = valor.split(" - ")[0];
                var nv1 = valor.split(" - ")[1];
                var nv2 = document.getElementById("cantidad").value;
                var nv3 = document.getElementById("serie").value;

                var table = document.getElementById("datatablesSimple1");
                var rows = table.getElementsByTagName("tr");
                for (var i = 0; i < rows.length; i++) {
                    var row = rows[i];
                    var cells = row.getElementsByTagName("td");
                    if (cells.length > 0 && cells[0].innerText.toLowerCase() === nv.toLowerCase()) {
                        alert("El SKU ya existe en la tabla.");
                        return; // No agregar si ya existe
                    }
                }

                if(nv1 == undefined){
                    document.getElementById("cantidad").value = '0';
                    document.getElementById("producto_servicio").value = '';
                    document.getElementById("serie").value = '';
                    alert("El producto no existe.");
                }else{

                    if(nv3 == '' ){

                        document.getElementById("datatablesSimple1").insertRow(-1).innerHTML = '<td>'+nv+'<input class="form-control" id="sku_ps" name="sku_ps[]" type="hidden" value="'+nv+'"/></td><td>'+nv1+'</td><td><input style="border: 0;" class="form-control" id="cantidad_ps" name="cantidad_ps[]" type="number" value="'+nv2+'"/></td><td>'+nv3+'<input class="form-control" id="serie" name="serie[]" type="hidden" value="'+nv3+'"/></td><td><button type="button" class ="btn btn-sm btn-danger" value="Delete" onclick="deleteRow(this)"><i class="me-1" data-feather="trash">ELIMINAR</i></button></td>';

                    }else{

                        var nv2 = 1;

                        document.getElementById("datatablesSimple1").insertRow(-1).innerHTML = '<td>'+nv+'<input class="form-control" id="sku_ps" name="sku_ps[]" type="hidden" value="'+nv+'"/></td><td>'+nv1+'</td><td><input style="border: 0;" class="form-control" id="cantidad_ps" name="cantidad_ps[]" type="number" value="'+nv2+'"/></td><td>'+nv3+'<input class="form-control" id="serie" name="serie[]" type="hidden" value="'+nv3+'"/></td><td><button type="button" class ="btn btn-sm btn-danger" value="Delete" onclick="deleteRow(this)"><i class="me-1" data-feather="trash">ELIMINAR</i></button></td>';

                        
                    }
                    document.getElementById("cantidad").value = '0';
                    document.getElementById("producto_servicio").value = '';
                    document.getElementById("serie").value = '';

                    $("#cantidads").show();
                    $("#series").show();
                    $("#boton").hide();
                }

            }


            function deleteRow(btn) {
                var row = btn.parentNode.parentNode;
                row.parentNode.removeChild(row);
            }

            

        </script>
        <script>
            $('#datatablesSimple1').on('keydown', 'input, select', function(e) {
                if (e.key === "Enter") {
                    var self = $(this), form = self.parents('form:eq(0)'), focusable, next;
                    focusable = form.find('input,a,select,button,textarea').filter(':visible');
                    next = focusable.eq(focusable.index(this)+1);
                    if (next.length) {
                        next.focus();
                    } else {
                        form.submit();
                    }
                    return false;
                }
            });
        </script>
    </body>
</html>
