<!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">SOLICITUD DE DEVOLUCIÓN DE PRODUCTOS A EMPRESA</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">SOLICITUD DE DEVOLUCIÓN DE PRODUCTOS A EMPRESA</div>
                                        <div class="card-body">
                                            <form method="post" action="solicitud_productos_traspaso_almacen.php" enctype="multipart/form-data">
                                                
                                                <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){
                                                                    if($producto['bio'] == 1){
                                                                ?>
                                                                <option value="<?=$producto['sku']?> - <?=$producto['nombre_producto']?> - <?=$producto['bio']?>"><?=$producto['sku']?> - <?=$producto['nombre_producto']?> - <?=$producto['bio']?></option>
                                                                <?php
                                                                }else{
                                                                ?>
                                                                <option value="<?=$producto['sku_cliente']?> - <?=$producto['nombre_producto']?> - <?=$producto['bio']?>"><?=$producto['sku_cliente']?> - <?=$producto['nombre_producto']?> - <?=$producto['bio']?></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">
                                                        <label class="small mb-1" for="cantidad">CANTIDAD</label>
                                                        <input class="form-control" id="cantidad" name="cantidad" type="number" value="1" />
                                                    </div>
                                                    <div class="col-md-2">
                                                        <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>ELIMINAR</th>
                                                            </tr>
                                                        </thead>
                                                        
                                                        <tbody>

                                                                <tr>


                                                                </tr>
                                                            
                                                        </tbody>
                                                    </table>

                                                </div>


                                                
                                                <div ><input class="form-control btn btn-primary" type="submit" name="SIGUIENTE" id="SIGUIENTE" value="SIGUIENTE"></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>

            function limitarDecimales(elem) {
                let valor = parseFloat(elem.value);
                if (isNaN(valor) || valor < 0) {
                    elem.value = 0;
                } else {
                    elem.value = valor.toFixed(2);
                }
            }

            function limitarDecimales(elem) {
                let valor = parseFloat(elem.value);
                if (isNaN(valor) || valor < 0) {
                    elem.value = 0;
                    alert("El monto debe de ser positivo");
                } else {
                    elem.value = valor.toFixed(2);
                }
            }

        </script>  
        <script>
            lista_validacion = [];

            function agregarFila(){
                

                var resultado_validacion = 0;

                var primera_vez = 0;

                var valor_v = document.getElementById("producto_servicio").value;
                var nv_v = valor_v.split(" - ")[0];
                var nv1_v = valor_v.split(" - ")[1];

                var nv2 = parseFloat(document.getElementById("cantidad").value);

                if (nv2 <= 0 || isNaN(nv2)) {
                    alert('ERROR: La cantidad debe ser mayor o igual que 1');
                    return; 
                }

                if(nv_v == '' || nv1_v == '' || nv1_v == null || nv_v == null){

                    alert('ERROR: SELECCIÓN DE PRODUCTO');
                    document.getElementById("cantidad").value = '1';
                    document.getElementById("producto_servicio").value = '';

                    
                    
                }else{

                        if(lista_validacion.length == 0){

                            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 = valor.split(" - ")[2];

                            

                            primera_vez = 1;

                            lista_validacion.push(nv);

                            document.getElementById("datatablesSimple1").insertRow(-1).innerHTML = '<td>'+nv+'<input class="form-control" id="sku_ps" name="sku_ps[]" type="hidden" value="'+nv+'"/><input class="form-control" id="bio_ps" name="bio_ps[]" type="hidden" value="'+nv3+'"/></td><td>'+nv1+'</td><td><input style="border: 0;" class="form-control" id="cantidad_ps" name="cantidad_ps[]" min="1" type="number" value="'+nv2+'"/></td><td><input type="button" class ="btn btn-sm btn-danger" value="ELIMINAR" name="quitar" id="quitar" onclick="deleteRow(this,\''+nv+'\')"></td>';
                            document.getElementById("cantidad").value = '1';
                            document.getElementById("producto_servicio").value = '';

                        }


                        let contador_validacion = lista_validacion.length;


                        for(let contador_i = 0; contador_i < contador_validacion; contador_i++){


                            if(lista_validacion[contador_i] == nv_v){


                                resultado_validacion = 0;
                                contador_i = contador_validacion + 1;

                            }else{

                                resultado_validacion = resultado_validacion + 1;

                            }


                        }


                        if(resultado_validacion == lista_validacion.length){

                            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 = valor.split(" - ")[2];

                            lista_validacion.push(nv);

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

                            document.getElementById("cantidad").value = '1';
                            document.getElementById("producto_servicio").value = '';

                        }else{

                            if(resultado_validacion == 0 &&  primera_vez != 1){

                            alert('ERROR: ESE PRODUCTO YA SE ENCUENTRA AGREGADO EN LA SOLICITUD');
                            document.getElementById("cantidad").value = '1';
                            document.getElementById("producto_servicio").value = '';

                            }

                        }

                    

                }
                


            }


            function deleteRow(btn,valor) {

                jj = lista_validacion.length;

                for (ii=0;ii<=jj;ii++) {

                    if(lista_validacion[ii] == valor){

                        lista_validacion.splice(ii, 1);

                    }

                }

                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>
        <script>
            document.getElementById("cantidad").addEventListener("change", function() {
            let v = parseInt(this.value);
            if (v < 1) this.value = 1;
            if(v < 1){
                document.getElementById("cantidad").value = '1';
            }

            });
        </script>
    </body>
</html>
