{{-- Integración Ternium · Envío del PDF de la declaración de importación (/integracion/pdf_decimpo, ExPOController@integracion;
     también la devuelve WebServiceController@PDFtoBase64 con la respuesta de Ternium en $mensaje).
     Kit ui-ctc (MigracionLayout.MD L3). Filtrar por AJAX a /integracion/data/dec_impo_pdf; la tabla llega dentro del
     formulario POST multipart a /ws/encodeBase64 (mismos campos y orden: ver partials/tabla-pdf-decimpo). El JavaScript es
     el de antes (jQuery, cargado solo en esta pantalla); solo cambia el aviso de "Filtrando…". --}}
<x-app-layout titulo="Envío de PDF de declaración">
    <x-pagina>
        <x-encabezado-pagina ruta="Importaciones · Integración" titulo="Envío de documento de declaración de importación (PDF)"
                             descripcion="Busque el DO, revise el documento y envíelo a la plataforma de Ternium." />

        @if (Session::has('success'))
            <x-alerta tipo="info">{{ Session::get('success') }}</x-alerta>
        @endif

        @if ($mensaje != "")
            {{-- Respuesta de Ternium al envío. Antes se pintaba sin escapar. --}}
            <div id="resumen" class="rounded-xl border border-amber-200 bg-amber-50 px-4 py-3 text-[13px] text-amber-900 dark:border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-200">
                <p class="font-bold">Respuesta de envío por parte del cliente</p>
                <div class="mt-1">{{ $mensaje }}</div>
                <x-secondary-button onclick="cerrarResumen()" class="mt-3 !h-8"><x-icono nombre="x-mark" /> Cerrar resumen</x-secondary-button>
            </div>
        @endif

        <x-tarjeta titulo="Filtros">
            <div class="flex flex-wrap items-end gap-3">
                <x-campo etiqueta="Número DO" para="txtNumdo" class="w-full sm:w-64">
                    <x-input type="text" id="txtNumdo" value="{{ $numedo }}" />
                </x-campo>
                <x-button type="button" id="filtrar"><x-icono nombre="funnel" /> Filtrar</x-button>
            </div>
        </x-tarjeta>

        {{-- Visor del documento (Abrir): reemplaza la tabla mientras está abierto --}}
        <section id="vistaDocumento" style="display:none" class="overflow-hidden rounded-xl border border-[var(--borde)] bg-[var(--superficie)]">
            <div class="flex items-center justify-between gap-3 border-b border-[var(--borde)] px-5 py-3">
                <p class="text-[13px] font-semibold text-[var(--texto)]">Documento</p>
                <x-secondary-button id="cerrarVisor" onclick="cerrarVisor()" class="!h-8"><x-icono nombre="x-mark" /> Cerrar visor</x-secondary-button>
            </div>
            <embed id='rutaDoc' src='' width='100%' height='600px'>
        </section>

        <form action="/ws/encodeBase64" method="post" enctype="multipart/form-data"
              class="min-w-0 overflow-hidden rounded-xl border border-[var(--borde)] bg-[var(--superficie)]">
            @csrf
            <div class="border-b border-[var(--borde)] px-5 py-3">
                <p class="text-[13px] text-[var(--texto-suave)]">Documentos de declaración de importación del DO</p>
            </div>
            <div id="datos" style="display:none">
                Filtre los parametros ...
            </div>
        </form>
    </x-pagina>

    <template id="plantillaCargando">
        <div class="py-12 text-center text-[14px] text-[var(--texto-suave)]">
            <x-icono nombre="arrow-path" class="mx-auto h-7 w-7 animate-spin text-[var(--texto-tenue)]" />
            <p class="mt-2 font-semibold text-[var(--texto)]">Filtrando…</p>
            <p>por favor espere unos segundos…</p>
        </div>
    </template>

    @push('scripts')
        {{-- jQuery solo en esta pantalla: el script es el de antes. --}}
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
        <script>
        var BASE64_MARKER = ';base64,';

        function enviarDocumento(strCaminhoPDF) { 
            var reader = new FileReader(); 
            reader.readAsDataURL(strCaminhoPDF) 
            reader.onload = function () { 
               console.log(reader.result); 
            }; 
            reader.onerror = function (error) { 
                console.log('Error: ', error); 
            }; 
            return reader.result; 
        } 
        
        // var objTeste = funcTransfPDFParaBase64(strCaminhoPDF);

        function verDocumento(ruta) {
            $("#rutaDoc").attr("src", ruta)
            $("#vistaDocumento").css("display","")
            $("#datos").css("display","none")
        }

        function cerrarVisor() {
            $("#vistaDocumento").css("display","none")
            $("#datos").css("display","")
        }

        $(document).ready(function(){
          var jsonData = "data JSON";

            $("#filtrar").click(function(){
                $("#datos").html($("#plantillaCargando").html())
                ruta = "/integracion/data/dec_impo_pdf";
                $.ajax({
                    type:"get",
                    "url": ruta,
                    "data":{
                        numdo     : $("#txtNumdo").val(),
                        busqueda  : $("#txtBusqueda").val()
                    },
                    success : function(data) {
                        $("#datos").css("display","");
                        $("#datos").html(data['tabla']);
                    },
                    error : function() { alert("ERROR\nHa ocurrido un error inesperado"); }
                })
            });

            $("#enviar").click(function(){
                texto = "\nCONFIRMACION REQUERIDA\n\nEsta opcion requiere confirmacion, al hacerlo todas las coladas relacionadas en la vista seran enviadas a la plataforma de Ternium\n\nConfirma el envio?";
                ruta = "/ws/envioDecImpoPDF";
                if(confirm(texto)) {
                  console.log("embarque "+$("#txtEmbarque").val());
                  $.ajax({
                    type:"get",
                    "url": ruta,
                    async: false,
                    "data":{
                        numdo     : $("#txtNumdo").val(),
                        embarque  : $("#txtEmbarque").val(),
                        pedidoImp : $("#txtPedido").val()
                    },
                    success : function(data) {
                      $("#resumen").show()
                      $("#detalleResumen").html(data['respuesta'])
                    },
                    error : function() { alert("ERROR\nHa ocurrido un error inesperado"); }
                  });         
                }
            });
      });

      function cerrarResumen() {
         $("#resumen").hide()
      }
        </script>
    @endpush
</x-app-layout>