@extends('../padre.padre')



@section('contenido')
@include('../modales.subirArchPikin')
    <style>
        .zoom-effect {
            transition: transform 0.5s ease;
        }

        .zoom-effect:hover {
            transform: scale(1.2); /* Aumento del 50% */
        }

        /* Responsive Name Column */
        .name-cell {
            min-width: 250px; 
            max-width: 300px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        @media (min-width: 768px) {
            .name-cell {
                min-width: 450px; 
                max-width: 600px; 
            }
        }

        /* Sticky header */
        .sticky-top-custom {
            position: sticky;
            top: 0;
            background: white;
            z-index: 100;
        }
    </style>
<div id="" class="col-md-12">

<div class="col-md-12  d-flex justify-content-center">
    <h1 class="m-2"> VERIFICACION DE MERCANCIA</h1>
     @include('menu.botonRegresar')

    <label for=""> <a  type="button"  href="revisionEscaneo"  class="btn btn-success">Nuevo</a></label>
</div>

<div class="row ">
    <div class="col-12">
   <form action="verproductosEscaneo" method="GET" >
   
    @include('../menu.bodegas')
       
    <label for="">  </label>

    <label for="" class="col-md-3" >
         <select name="tipoVerica" id="tipoVerica" class="form-control" {{$blobueo}}  >
         <option value="{{$tipoVerica}}">{{$tipoVerica}}</option> 
         <option value="Guia_Traslado">Guia_Traslado</option>
         <option value="Factura_de_Venta">Factura_de_Venta</option> 
         <option value="Factura_Compra">Factura_Compra</option> 
         <option value="Entrada_Traslado">Entrada_Traslado</option>
         
         </select>

    </label>  
    <label for="" class="col-md-2"> 

    <input type="text" class="form-control" id="numeroF" name="numeroF" {{$blobueo}} value="{{$numeroF}}" placeholder ="Numero Movimiento">
    </label>


    <label for="" class="col-md-1" >
         <select name="tipotrasp" id="tipotrasp" class="form-control"   >
         <option value="{{$tipotrasp}}">{{$tipotrasp}}</option> 
         <option value="General">General</option> 
         <option value="Deprisa">Deprisa</option> 
         <option value="Coordinadora">Coordinadora</option> 
        
         
         </select>

    </label> 
    <button  type="submit" id=""  class="btn btn-warning">Consultar</button>

    <button  type="button" id="modalPikin"  class="btn btn-info" data-bs-toggle="modal" data-bs-target="#ModalSubirPikin">picking y packing</button>

    @if($tipoVerica == "Factura_de_Venta" && isset($numeroF) && $numeroF != "")
    <label for="" class="col-md-2"> 
        <select name="domicilioSelect" id="domicilioSelect" class="form-control">
            <option value="">Seleccionar Domicilio</option>
        </select>
    </label>
    <button type="button" id="asignarDomicilio" class="btn btn-primary">Asignar Domicilio</button>
    @endif

    <input type="button" id="imprimirVarcodeFac"  class="btn btn-success" value="Imprimir Varcode">
    <button type="button" id="btnRotulo" class="btn btn-secondary" style="background-color: #6c757d; color: white;">Rótulo</button>
    <label for="" class="col-md-3"></label> 
   
    </form>
    <div>   

 <div> 





<div class="row" >

<hr>
<label><input type="checkbox" id="cbox1"  checked value="">Agregado Automativo</label>
<label for="" class="col-md-2"> 
Barras
    <input type="text" id="escanearP" class="form-control" placeholder ="Escanear">
</label>

<label for="" class="col-md-3">Nombre Producto
    <input type="text" disabled class="form-control" id="nombrePP">
</label>

<label for="" class="col-md-1">CAJA
    <input type="number" class="form-control" value="0" id="cajaES">
</label>
<label for="" class="col-md-1">FRCC
    <input type="number" class="form-control" value="0" id="frccES">
</label>
<input type="number" class="form-control" hidden value="0" id="factore">
<label for="" class="col-md-1 ">
    <input type="button" class="btn btn-primary" id="AgregarEs" value="Agregar">
</label>
</div>

<div class="row ">
    <table class="table table-striped  table-bordered scroll-table-container " style="margin-top: 3%" id="tablaEscane">
    <thead>
    <tr>
     
        <th scope="col" >Codigo</th>
        <th scope="col">Nombre_Prod</th>
        <th scope="col">Caja</th>
        <th scope="col">Frcc</th>
        
        <th scope="col">Escaneado</th>
        <th scope="col">Diferencia</th>
        <th scope="col">Component</th>        
        <th scope="col">Opc</th>
        <th scope="col">Img</th>
        

        
    
    
    </tr>
    </thead>


    <tbody id="tablaprodu" >
    @isset($productos)
         
         @foreach ($productos as $item)

         
            @php
                $colore=" background-color: #9FF4B9;";
                $m="";

            if($item->EscaneadoV==0 && $item->DiferenciaV==0){
                $colore=" background-color: #F4AB9F;";
                $m="";
            }else{

                if( $item->DiferenciaV >0){
                    $colore=" background-color: #F4AB9F;";
                    $m="-";
            }

            }
            @endphp
          
 
               <tr style="{{$colore}}">
              

                   <td style="mso-number-format:'@'; white-space: nowrap;">{{$item->codigo}}</td>
                   <td class="name-cell" title="{{$item->nombre}}" style="mso-number-format:'@';">{{$item->nombre}}</td>
                
                   <td>{{$item->caja}}</td>
                   <td >{{$item->frcc}}</td>
                   <td>{{$item->EscaneadoV}}</td>
                   <td>{{$m.$item->DiferenciaV}}</td>
                   <td>{{$m.$item->cantidadComponentes}}</td>
                  @if( session()->get("perfil")==1 && $tipoVerica=="Guia_Traslado" && $item->EscaneadoV <> 0)
                   <td><button type="button" class="btn btn-danger" id="quitarproducGuiasExc" data-cantidad="{{$item->EscaneadoV}}" value="{{$item->codigo}}">Devolver</button> </td>
                   @else
                   
                   <td></td>
                   @endif
                  
                   


                        @if(  $tipoVerica=="Guia_Traslado")
                        @php
                      //  $rutaImagen = 'https://comercial.posnube.xyz/public/img/1/'.$item->codigo .'.jpg' ;
                        $rutaImagen ='';
                    
                        @endphp
                        <td>
                        <a href="{{ $rutaImagen }}" target="_blank" data-toggle="popover" data-trigger="hover">
                            <img id="rutaImagen" class="img-thumbnail zoom-effect" src="{{ $rutaImagen }}" alt="Imagen Externa">
                        </a>
                    
                    
                         </td>
                      

                    @else
                     <td> </td>
                   @endif 
                   
                 </tr>
        
         
         
       @endforeach 
      
    @endisset
        
       
     </tbody>



</table> 
</div>


</div>


        


@endsection

@section('pie')
<script src="{{ asset('js/excel.js') }}"></script>  
<script src="{{ asset('js/escaneo.js?id=12') }}"></script>  

<script>

window.addEventListener('load', function() {

    let  idPrinci = document.getElementById("numeroF");
let idEscaneo=document.getElementById("escanearP");
if(idPrinci.value.trim()==""){
    idPrinci.focus();
}else{
    idEscaneo.focus();
}

// Cargar domiciliarios si existe el select
let domicilioSelect = document.getElementById("domicilioSelect");
if(domicilioSelect) {
    cargarDomiciliarios();
}

// Manejar asignación de domicilio
let asignarBtn = document.getElementById("asignarDomicilio");
if(asignarBtn) {
    asignarBtn.addEventListener('click', function() {
        asignarDomicilioAFactura();
    });
}

          
        });

// Función para cargar domiciliarios
function cargarDomiciliarios() {
    fetch('listarDomiciliarios')
        .then(response => response.json())
        .then(data => {
            const select = document.getElementById("domicilioSelect");
            select.innerHTML = '<option value="">Seleccionar Domicilio</option>';
            
            if(data && data.length > 0) {
                data.forEach(domiciliario => {
                    const option = document.createElement('option');
                    option.value = domiciliario.iddm;
                    option.textContent = `${domiciliario.nombreDomi} ${domiciliario.apellidoDOm} - ${domiciliario.ccDomi}`;
                    select.appendChild(option);
                });
            }
        })
        .catch(error => {
            console.error('Error al cargar domiciliarios:', error);
            alert('Error al cargar la lista de domiciliarios');
        });
}

// Función para asignar domicilio a factura
function asignarDomicilioAFactura() {
    const select = document.getElementById("domicilioSelect");
    const numeroFactura = document.getElementById("numeroF").value;
    
    if(!select.value) {
        alert('Por favor seleccione un domiciliario');
        return;
    }
    
    if(!numeroFactura) {
        alert('No se encontró el número de factura');
        return;
    }
    
    if(confirm(`¿Está seguro de asignar este domiciliario a la factura ${numeroFactura}?`)) {
        const formData = new FormData();
        formData.append('numeroFactura', numeroFactura);
        formData.append('idDomicilio', select.value);
        formData.append('_token', document.querySelector('meta[name="csrf-token"]').getAttribute('content'));
        
        fetch('asignarDomicilioFactura', {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if(data.estado === 'ok') {
                alert('Domicilio asignado exitosamente');
                select.value = '';
            } else {
                alert('Error: ' + data.mensaje);
            }
        })
        .catch(error => {
            console.error('Error:', error);
            alert('Error al asignar el domicilio');
        });
    }
}
       
// Manejar impresión de rótulo
let btnRotulo = document.getElementById("btnRotulo");
if(btnRotulo) {
    btnRotulo.addEventListener('click', function() {
        imprimirRotuloFunc();
    });
}

function imprimirRotuloFunc() {
    const numeroF = document.getElementById("numeroF").value;
    const tipoVerica = document.getElementById("tipoVerica").value;

    if (!numeroF) {
        alert('Por favor, ingrese un número de factura/movimiento.');
        return;
    }

    if (tipoVerica !== "Factura_de_Venta") {
        alert('El rótulo solo está disponible para Facturas de Venta.');
        return;
    }

    const cajas = prompt("¿Cuántas cajas desea imprimir?", "1");
    
    if (cajas !== null && cajas !== "" && !isNaN(cajas)) {
        const url = `imprimirRotulo?numeroF=${numeroF}&cajas=${cajas}`;
        window.open(url, '_blank', 'width=800,height=600');
    } else if (cajas !== null) {
        alert('Por favor, ingrese un número válido de cajas.');
    }
}

</script> 
@endsection