@extends('adminlte::page')

@section('plugins.Sweetalert2', true)
@section('plugins.Datatables', true)
@section('plugins.MomentJs', true)
@section('plugins.Select1', true)

@section('title', 'Intranet | Borrado Masivo De Documentos')

@section('content_header')
    <div class="container-fluid">

    </div>
@stop

@section('content')
    <div class="container-fluid">
        <div class="row justify-content-center">

            <div class="col-lg-12">
                <div class="card card-aspen">
                    <div class="card-header">
                        <h3 class="card-title">Borrado Masivo De Documentos</h3>
                    </div>

                    <div class="card-body">

                        <div class="form-group">
                            <label>Tipo De Documento</label>
                            <select class="form-control listaDespegableConBuscador " id="tipoDeDocumento" data-live-search="true">
                                <option value="">--Seleccionar Tipo De Documento --</option>
                                @foreach ($tiposDocumentos as $tipo)
                                    <option value="{{ $tipo }}">{{ $tipo }}</option>
                                @endforeach
                            </select>
                            <div class="invalid-feedback" id="validarCampoTipoDeDocumento">

                            </div>
                        </div>

                        <div class="dt-responsive table-responsive">
                            <table id="tablaConExportacionConFiltrado" class="table table-striped table-bordered" role="grid" aria-describedby="base-style_info">
                                <thead>
                                    <tr role="row">
                                        <th>#</th>
                                        <th>Nombre Servicio</th>
                                        <th>Cantidad Servicio Oc</th>
                                        <th>CC</th>
                                        <th>RQ</th>
                                        <th>OC</th>
                                        <th>Cantidad De Cierre</th>
                                        <th>Fecha Guia Despacho</th>
                                        <th>Numero Guia Despacho</th>
                                        <th>Fecha Factura</th>
                                        <th>Numero Factura</th>
                                        <th>Acción</th>
                                    </tr>
                                </thead>
                                <tbody id="tablaBodyConExportacionConFiltrado">

                                </tbody>
                            </table>
                        </div>
                        <button type="button" class="btn btn-aspen mt-1" onclick="abrirModalSeleccionarOc()"><i class="fas fa-plus-circle" style="margin-right: 2px;"></i> Añadir Cierre De Servicio Por Oc</button>
                        <button type="button" class="btn btn-aspen mt-1" onclick="abrirModalSeleccionarRq()"><i class="fas fa-plus-circle" style="margin-right: 2px;"></i> Añadir Cierre De Servicio Por Rq</button>
                    </div>

                    <div class=" card-footer">
                        <button type="button" class="btn btn-aspen" id="botonDeCreacion" onclick="borradoMasivoDocumentos()"><i class="fas fa-save" style="margin-right: 2px;"></i> Guardar</button>
                        <a href="{{ route('cierre-servicio.index') }}" role="button" class="btn btn-secondary"><i class="fas fa-arrow-alt-circle-left" style="margin-right: 2px;"></i> Volver</a>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <div class="modal fade" id="modalOrdenDeCompra" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <form>
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #B08C1C; color:white;">
                        <h5 class="modal-title" id="tituloOrdenDeCompra">Listado De Ordenes De Compra </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">


                        <div class="table-responsive">
                            <table class="table" id="datatable-orden-compra" style="width: 100%;">
                                <thead>
                                    <tr>
                                        <th>Id Orden Compra</th>
                                        <th>Número OC</th>
                                        <th>Fecha OC</th>
                                        <th>Razon Social Proveedor</th>
                                        <th>Nombre Del Generador De La OC</th>
                                        <th>Monto Total De La OC</th>
                                        <th>Sucursal</th>
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                        <button type="button" class="btn btn-aspen" id="botonSeleccionarOc" onclick="abrirModalCierreServicioOc()">Seleccionar </button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="modalRequisicion" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <form>
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #B08C1C; color:white;">
                        <h5 class="modal-title" id="tituloRequisicion">Listado De Requisiciones </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">


                        <div class="table-responsive">
                            <table class="table" id="datatable-requisicion" style="width: 100%;">
                                <thead>
                                    <tr>
                                        <th>Id Requisicion</th>
                                        <th>Número RQ</th>
                                        <th>Fecha RQ</th>
                                        <th>Solicitante</th>
                                        <th>Centro Costo</th>
                                        <th>Proyecto</th>
                                        <th>Sucursal</th>
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                        <button type="button" class="btn btn-aspen" id="botonRequisicion" onclick="abrirModalCierreServicioRq()">Seleccionar </button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade" id="modalCierreServicio" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <form>
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #B08C1C; color:white;">
                        <h5 class="modal-title" id="tituloCierreServicio">Listado De Cierre De Servicios </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="color:white;" onclick='document.getElementById("seleccionarTodasLosItem").checked = false;'>
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">

                        <div class="table-responsive">
                            <table class="table" id="datatable-cierre-servicio" style="width: 100%;">
                                <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>
                                            <div class="form-group">
                                                <div class="custom-control custom-checkbox">
                                                    <input class="custom-control-input" type="checkbox" id="seleccionarTodasLosItem" onclick="selecionarTodasLosItems(this)">
                                                    <label for="seleccionarTodasLosItem" class="custom-control-label">Acciones</label>
                                                </div>
                                            </div>
                                        </th>
                                        <th>Nombre Servicio</th>
                                        <th>Cantidad Servicio Oc</th>
                                        <th>CC</th>
                                        <th>RQ</th>
                                        <th>OC</th>
                                        <th>Cantidad De Cierre</th>
                                        <th>Fecha Guía De Despacho</th>
                                        <th>Numero Guía De Despacho</th>
                                        <th>Fecha Factura</th>
                                        <th>Numero Factura</th>
                                    </tr>
                                </thead>
                                <tbody id="tabla-cierre-servicio">

                                </tbody>
                            </table>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal" onclick='document.getElementById("seleccionarTodasLosItem").checked = false;'>Cerrar</button>
                        <button type="button" class="btn btn-aspen" id="botonSeleccionarCierreServicio" onclick="agregarCierreServicio()">Añadir Cierre De Servicio</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

@stop

@section('footer')
    <div class="float-right d-none d-sm-inline">
        Intranet
    </div>
    <strong>Copyright © 2023 <a href="https://aspenspa.cl/">aspenspa.cl</a></strong>
@stop

@section('css')
    <link rel="stylesheet" href="{{ asset('css/estilo-generico.css') }}">
    <style>
        .hide_column {
            display: none;
        }

        .kv-file-upload {
            display: none;
        }

        .contenedorParaVisualizarImagenDelArchivo {
            background-color: rgba(0, 0, 0, .8);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 10000;
            display: grid;
            grid-template-rows: 10vh 90vh;
            color: white;

        }

        .contenedorVolver {
            padding-left: 10px;
            padding-right: 10px;
            display: grid;
            grid-template-columns: 90% 10%;
        }

        .contenedorDeImagenes {
            display: grid;
            grid-template-columns: 100%;
        }

        .tamanoImagen {
            max-width: 80%;
        }

        .tamanoIframe {
            width: 80%;
            height: 700px;
        }

        .tamanoIframeTxt {
            width: 80%;
            height: 700px;
            background-color: white;
            "

        }
    </style>
@stop

@section('js')
    <script src="{{ asset('js/funcionalidades-genericas.js') }}"></script>
    <script>
        $('#tipoDeDocumento').selectpicker({
            dropupAuto: false
        });
    </script>

    <script>
        var datatableOrdenesDeCompra = $("#datatable-orden-compra").DataTable({
            columnDefs: [{
                "targets": [0],
                "className": "hide_column"
            }, ],
            processing: true,
            serverSide: true,
            ajax: {
                url: '{{ route('orden-de-compra.obtener-registros-datatable-pora-entrada-bodega-documentos') }}',
                dataType: "json",
                type: "POST",
                data: {
                    _token: "{{ csrf_token() }}"
                },
            },
            columns: [{
                    "data": "id",
                    "name": "id"
                },
                {
                    "data": "numero_oc",
                    "name": "numero_oc"
                },
                {
                    "data": "fecha_oc",
                    "name": "fecha_oc"
                },
                {
                    "data": "razon_social",
                    "name": "razon_social"
                },
                {
                    "data": "generador_de_la_oc",
                    "name": "generador_de_la_oc"
                },
                {
                    "data": "monto_total",
                    "name": "monto_total"
                }, {
                    "data": "sucursal",
                    "name": "sucursal"
                }
            ],
            select: {
                style: 'single'
            },
            orderCellsTop: true,
            //fixedHeader: true,
            lengthMenu: [
                [5, 10, 25, 50, 100, -1],
                [5, 10, 25, 50, 100, "Todos"],
            ],
            language: {
                processing: "Cargando Registros...",
                search: "Buscar",
                lengthMenu: "Mostrar_MENU_ Registros",
                info: "Mostrar desde _START_ hasta _END_ de _TOTAL_ registros",
                infoEmpty: "Opcion no disponible",
                infoFiltered: "",
                infoPostFix: "",
                loadingRecords: "Cargandos registros.",
                zeroRecords: "No hay datos disponibles en la tabla",
                emptyTable: "No hay datos disponibles en la tabla",
                paginate: {
                    first: "Primero",
                    previous: "Anterior",
                    next: "Siguiente",
                    last: "Ultimo",
                },
            },
            dom: "<'row'<'col-sm-4'l><'col-sm-4 d-flex justify-content-center' ><'col-sm-4'f>>" + "<'row'<'col-sm-12'tr>>" + "<'row'<'col-sm-6'i><'col-sm-6'p>>"
        });

        $("#datatable-orden-compra thead tr").clone(true).appendTo("#datatable-orden-compra thead");

        $("#datatable-orden-compra thead tr:eq(1) th").each(function(i) {
            var title = $(this).text(); //es el nombre de la columna
            if (title != "Acción" && title != "Selección") {
                $(this).html(
                    '<input class="form-control" type="text" placeholder="Buscar ' + title + '" />'
                );
                $(this).removeClass("sorting");
                $(this).removeClass("sorting_asc");
                $(this).unbind();
                $(this).parent().attr('id', 'searchColumns');

                $("input", this).on("keyup change", function() {
                    if (datatableOrdenesDeCompra.column(i).search() !== this.value) {
                        datatableOrdenesDeCompra.column(i).search(this.value).draw();
                    }
                });
            } else {
                $(this).html("<div></div>");
                $(this).removeClass("sorting");
                $(this).removeClass("sorting_asc");
            }
        });
    </script>

    <script>
        var datatableRequisiciones = $("#datatable-requisicion").DataTable({
            columnDefs: [{
                "targets": [0],
                "className": "hide_column"
            }, ],
            processing: true,
            serverSide: true,
            ajax: {
                url: '{{ route('requisicion.obtener-registros-datatable-movimiento-entrada') }}',
                dataType: "json",
                type: "POST",
                data: {
                    _token: "{{ csrf_token() }}"
                },
            },
            columns: [{
                    "data": "accion",
                    "name": "accion"
                },
                {
                    "data": "numero_rq",
                    "name": "numero_rq"
                },
                {
                    "data": "fecha_solicitud",
                    "name": "fecha_solicitud"
                },
                {
                    "data": "usuario_solicitante",
                    "name": "usuario_solicitante"
                },
                {
                    "data": "centro_costo",
                    "name": "centro_costo"
                },
                {
                    "data": "proyecto",
                    "name": "proyecto"
                }, {
                    "data": "sucursal",
                    "name": "sucursal"
                }
            ],
            select: {
                style: 'single'
            },
            orderCellsTop: true,
            //fixedHeader: true,
            lengthMenu: [
                [5, 10, 25, 50, 100, -1],
                [5, 10, 25, 50, 100, "Todos"],
            ],
            language: {
                processing: "Cargando Registros...",
                search: "Buscar",
                lengthMenu: "Mostrar_MENU_ Registros",
                info: "Mostrar desde _START_ hasta _END_ de _TOTAL_ registros",
                infoEmpty: "Opcion no disponible",
                infoFiltered: "",
                infoPostFix: "",
                loadingRecords: "Cargandos registros.",
                zeroRecords: "No hay datos disponibles en la tabla",
                emptyTable: "No hay datos disponibles en la tabla",
                paginate: {
                    first: "Primero",
                    previous: "Anterior",
                    next: "Siguiente",
                    last: "Ultimo",
                },
            },
            dom: "<'row'<'col-sm-4'l><'col-sm-4 d-flex justify-content-center' ><'col-sm-4'f>>" + "<'row'<'col-sm-12'tr>>" + "<'row'<'col-sm-6'i><'col-sm-6'p>>"
        });

        $("#datatable-requisicion thead tr").clone(true).appendTo("#datatable-requisicion thead");

        $("#datatable-requisicion thead tr:eq(1) th").each(function(i) {
            var title = $(this).text(); //es el nombre de la columna
            if (title != "Acción" && title != "Selección") {
                $(this).html(
                    '<input class="form-control" type="text" placeholder="Buscar ' + title + '" />'
                );
                $(this).removeClass("sorting");
                $(this).removeClass("sorting_asc");
                $(this).unbind();
                $(this).parent().attr('id', 'searchColumns');

                $("input", this).on("keyup change", function() {
                    if (datatableRequisiciones.column(i).search() !== this.value) {
                        datatableRequisiciones.column(i).search(this.value).draw();
                    }
                });
            } else {
                $(this).html("<div></div>");
                $(this).removeClass("sorting");
                $(this).removeClass("sorting_asc");
            }
        });
    </script>

    <script>
        var columnaActiva = false;
        var tipoColumnaActiva = ""
        var contadorTabla = 0;
        var filaActual;

        function deshabilitarBotonesConfirmarEliminacionArticulo() {
            var botones = document.querySelectorAll(".boton-confirmar-articulo");
            botones.forEach(elemento => {
                elemento.style.display = 'none';
            });
        }

        function habilitarBotonConfirmarEliminacionArticulo(boton) {

            if (boton.nextElementSibling.style.display == 'none') {
                deshabilitarBotonesConfirmarEliminacionArticulo();
                boton.nextElementSibling.style.display = 'inline-block';
            } else {
                if (boton.nextElementSibling.style.display == 'inline-block') {
                    deshabilitarBotonesConfirmarEliminacionArticulo();
                }
            }

        }

        function eliminarFila(boton) {
            var elementoFila = boton.parentElement.parentElement;
            elementoFila.remove();
            contadorTabla = 0;
            var filas = document.getElementById('tablaConExportacionConFiltrado').tBodies[0].querySelectorAll("tr");
            filas.forEach(elemento => {
                contadorTabla++;
                elemento.querySelector(".tabla-contador-articulo-entrada").innerHTML = contadorTabla;
            });
        }
    </script>

    <script>
        function uuidv4() {
            return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
                (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
            );
        }

        function abrirModalSeleccionarOc() {
            datatableOrdenesDeCompra.rows().deselect();
            $("#modalOrdenDeCompra").modal("show");
        }

        function abrirModalSeleccionarRq() {
            datatableRequisiciones.rows().deselect();
            $("#modalRequisicion").modal("show");
        }

        function abrirModalCierreServicioOc() {
            if (datatableOrdenesDeCompra.$('tr.selected').hasClass('selected')) {
                var data = datatableOrdenesDeCompra.rows({
                    selected: true
                }).data();

                var url = '{{ route('cierre-servicio.obtener-registro-por-oc', [':oc']) }}';
                url = url.replace(':oc', data[0].id);
                var csrf = '{{ csrf_token() }}';

                $.ajax({
                    type: 'POST',
                    datatype: 'json',
                    url: url,
                    headers: {
                        'X-CSRF-TOKEN': csrf
                    },
                    success: function(data) {
                        eliminarLoading()
                        var cantidad = 0;
                        document.getElementById("tabla-cierre-servicio").innerHTML = "";
                        data.forEach(data => {
                            var filas = document.getElementById('tablaConExportacionConFiltrado').tBodies[0].querySelectorAll("tr");
                            var existeCierreServicio = false;
                            filas.forEach(elementoPadre => {
                                var idCierreServicio = elementoPadre.querySelector(".tabla-id-cierre-servicio-entrada").innerHTML;
                                if (idCierreServicio == data.cierre.id) {
                                    existeCierreServicio = true;
                                }
                            });

                            if (existeCierreServicio == false) {
                                cantidad++;
                                var fechaGuiaDespacho = "";
                                var numeroGuiaDespacho = "";
                                var fechaFactura = "";
                                var numeroFactura = "";

                                if (data.cierre.fecha_guia_despacho != "" && data.cierre.fecha_guia_despacho != null) {
                                    fechaGuiaDespacho = data.cierre.fecha_guia_despacho;
                                }

                                if (data.cierre.numero_guia_despacho != "" && data.cierre.numero_guia_despacho != null) {
                                    numeroGuiaDespacho = data.cierre.numero_guia_despacho;
                                }

                                if (data.cierre.fecha_factura != "" && data.cierre.fecha_factura != null) {
                                    fechaFactura = data.cierre.fecha_factura;
                                }

                                if (data.cierre.numero_factura != "" && data.cierre.numero_factura != null) {
                                    numeroFactura = data.cierre.numero_factura;
                                }
                                document.getElementById("tabla-cierre-servicio").innerHTML +=
                                    '<tr role="row" class="odd">' +
                                    '<td style="display:none;" class="tabla-id-cierre-servicio">' + data.cierre.id + '</td>' +
                                    '<td class="tabla-contador-articulo">' + cantidad + '</td>' +
                                    '<td class="tabla-check-entrada">' +
                                    '<div class="form-group">' +
                                    '<div class="custom-control custom-checkbox">' +
                                    '<input class="custom-control-input checkbox-seleccion-item" type="checkbox" id="customCheckbox' + cantidad + '" value="' + data.cierre.id + '">' +
                                    '<label for="customCheckbox' + cantidad + '" class="custom-control-label"></label>' +
                                    '</div>' +
                                    '</div>' +
                                    '</td>' +
                                    '<td class="tabla-nombre-servicio">' + data.articulo.descripcion + '</td>' +
                                    '<td class="tabla-cantidad-servicio">' + data.articuloOrdenCompra.cantidad + '</td>' +
                                    '<td class="tabla-centro-costo">' + data.centroCosto.centro_costo + '</td>' +
                                    '<td class="tabla-numero-requisicion">' + data.numeroRq + '</td>' +
                                    '<td class="tabla-numero-orden-compra">' + data.numeroOC + '</td>' +
                                    '<td class="tabla-cantidad-cierre">' + data.cierre.cantidad + '</td>' +
                                    '<td class="tabla-fecha-guia-despacho">' + fechaGuiaDespacho + '</td>' +
                                    '<td class="tabla-numero-guia-despacho">' + numeroGuiaDespacho + '</td>' +
                                    '<td class="tabla-fecha-factura">' + fechaFactura + '</td>' +
                                    '<td class="tabla-numero-factura">' + numeroFactura + '</td>' +
                                    '</tr>';
                            }
                        });
                        $("#modalCierreServicio").modal("show");
                    },
                    error: function(data) {
                        console.log(data)
                        eliminarLoading()
                    }
                })
            }
        }

        function abrirModalCierreServicioRq() {
            if (datatableRequisiciones.$('tr.selected').hasClass('selected')) {
                var data = datatableRequisiciones.rows({
                    selected: true
                }).data();

                var url = '{{ route('cierre-servicio.obtener-registro-por-rq', [':rq']) }}';
                url = url.replace(':rq', data[0].accion);
                var csrf = '{{ csrf_token() }}';

                $.ajax({
                    type: 'POST',
                    datatype: 'json',
                    url: url,
                    headers: {
                        'X-CSRF-TOKEN': csrf
                    },
                    success: function(data) {
                        eliminarLoading()
                        var cantidad = 0;
                        document.getElementById("tabla-cierre-servicio").innerHTML = "";
                        data.forEach(data => {
                            var filas = document.getElementById('tablaConExportacionConFiltrado').tBodies[0].querySelectorAll("tr");
                            var existeCierreServicio = false;
                            filas.forEach(elementoPadre => {
                                var idCierreServicio = elementoPadre.querySelector(".tabla-id-cierre-servicio-entrada").innerHTML;
                                if (idCierreServicio == data.cierre.id) {
                                    existeCierreServicio = true;
                                }
                            });

                            if (existeCierreServicio == false) {
                                cantidad++;
                                var fechaGuiaDespacho = "";
                                var numeroGuiaDespacho = "";
                                var fechaFactura = "";
                                var numeroFactura = "";

                                if (data.cierre.fecha_guia_despacho != "" && data.cierre.fecha_guia_despacho != null) {
                                    fechaGuiaDespacho = data.cierre.fecha_guia_despacho;
                                }

                                if (data.cierre.numero_guia_despacho != "" && data.cierre.numero_guia_despacho != null) {
                                    numeroGuiaDespacho = data.cierre.numero_guia_despacho;
                                }

                                if (data.cierre.fecha_factura != "" && data.cierre.fecha_factura != null) {
                                    fechaFactura = data.cierre.fecha_factura;
                                }

                                if (data.cierre.numero_factura != "" && data.cierre.numero_factura != null) {
                                    numeroFactura = data.cierre.numero_factura;
                                }
                                document.getElementById("tabla-cierre-servicio").innerHTML +=
                                    '<tr role="row" class="odd">' +
                                    '<td style="display:none;" class="tabla-id-cierre-servicio">' + data.cierre.id + '</td>' +
                                    '<td class="tabla-contador-articulo">' + cantidad + '</td>' +
                                    '<td class="tabla-check-entrada">' +
                                    '<div class="form-group">' +
                                    '<div class="custom-control custom-checkbox">' +
                                    '<input class="custom-control-input checkbox-seleccion-item" type="checkbox" id="customCheckbox' + cantidad + '" value="' + data.cierre.id + '">' +
                                    '<label for="customCheckbox' + cantidad + '" class="custom-control-label"></label>' +
                                    '</div>' +
                                    '</div>' +
                                    '</td>' +
                                    '<td class="tabla-nombre-servicio">' + data.articulo.descripcion + '</td>' +
                                    '<td class="tabla-cantidad-servicio">' + data.articuloOrdenCompra.cantidad + '</td>' +
                                    '<td class="tabla-centro-costo">' + data.centroCosto.centro_costo + '</td>' +
                                    '<td class="tabla-numero-requisicion">' + data.numeroRq + '</td>' +
                                    '<td class="tabla-numero-orden-compra">' + data.numeroOC + '</td>' +
                                    '<td class="tabla-cantidad-cierre">' + data.cierre.cantidad + '</td>' +
                                    '<td class="tabla-fecha-guia-despacho">' + fechaGuiaDespacho + '</td>' +
                                    '<td class="tabla-numero-guia-despacho">' + numeroGuiaDespacho + '</td>' +
                                    '<td class="tabla-fecha-factura">' + fechaFactura + '</td>' +
                                    '<td class="tabla-numero-factura">' + numeroFactura + '</td>' +
                                    '</tr>';
                            }
                        });
                        $("#modalCierreServicio").modal("show");
                    },
                    error: function(data) {
                        console.log(data)
                        eliminarLoading()
                    }
                })
            }
        }

        function agregarCierreServicio() {
            document.getElementById("botonSeleccionarCierreServicio").setAttribute("disabled", true);
            var filas = document.getElementById('datatable-cierre-servicio').tBodies[0].querySelectorAll("tr");
            var listadoCierreServicio = [];
            filas.forEach(elementoPadre => {
                var inputCheck = elementoPadre.querySelector(".tabla-check-entrada").querySelector(".custom-control-input");
                var idCierreServicio = elementoPadre.querySelector(".tabla-id-cierre-servicio").innerHTML;
                var nombreArticulo = elementoPadre.querySelector(".tabla-nombre-servicio").innerHTML;
                var cantidadArticulo = elementoPadre.querySelector(".tabla-cantidad-servicio").innerHTML;
                var centroCosto = elementoPadre.querySelector(".tabla-centro-costo").innerHTML;
                var numeroRq = elementoPadre.querySelector(".tabla-numero-requisicion").innerHTML;
                var NumeroOc = elementoPadre.querySelector(".tabla-numero-orden-compra").innerHTML;
                var cantidadCierre = elementoPadre.querySelector(".tabla-cantidad-cierre").innerHTML;
                var fechaGuiaDespacho = elementoPadre.querySelector(".tabla-fecha-guia-despacho").innerHTML;
                var numneroGuiaDespacho = elementoPadre.querySelector(".tabla-numero-guia-despacho").innerHTML;
                var fechaFacura = elementoPadre.querySelector(".tabla-fecha-factura").innerHTML;
                var numeroFactura = elementoPadre.querySelector(".tabla-numero-factura").innerHTML;

                if (inputCheck != undefined && inputCheck != null) {
                    if (inputCheck.checked) {
                        var entrada = {
                            idCierreServicio: idCierreServicio,
                            nombreArticulo: nombreArticulo,
                            cantidadArticulo: cantidadArticulo,
                            centroCosto: centroCosto,
                            numeroRq: numeroRq,
                            NumeroOc: NumeroOc,
                            cantidadCierre: cantidadCierre,
                            fechaGuiaDespacho: fechaGuiaDespacho,
                            numneroGuiaDespacho: numneroGuiaDespacho,
                            fechaFacura: fechaFacura,
                            numeroFactura: numeroFactura
                        }
                        listadoCierreServicio.push(entrada);
                    }
                }
            });

            if (listadoCierreServicio.length > 0) {
                document.getElementById("botonSeleccionarCierreServicio").removeAttribute("disabled");

                listadoCierreServicio.forEach(elemento => {
                    contadorTabla++;
                    var codigoUnico = uuidv4();
                    document.getElementById("tablaBodyConExportacionConFiltrado").innerHTML +=
                        '<tr role="row" class="odd">' +
                        '<td style="display: none;" class="tabla-id-unico-entrada">' + codigoUnico + '</td>' +
                        '<td style="display: none;" class="tabla-id-cierre-servicio-entrada">' + elemento.idCierreServicio + '</td>' +
                        '<td class="tabla-contador-articulo-entrada">' + contadorTabla + '</td>' +
                        '<td class="tabla-nombre-articulo-entrada">' + elemento.nombreArticulo + '</td>' +
                        '<td class="tabla-cantidad-articulo-entrada">' + elemento.cantidadArticulo + '</td>' +
                        '<td class="tabla-centro-costo-entrada">' + elemento.centroCosto + '</td>' +
                        '<td class="tabla-numero-rq-entrada">' + elemento.numeroRq + '</td>' +
                        '<td class="tabla-numero-oc-entrada">' + elemento.NumeroOc + '</td>' +
                        '<td class="tabla-cantidad-cierre">' + elemento.cantidadCierre + '</td>' +
                        '<td class="tabla-fecha-guia-despacho-entrada">' + elemento.fechaGuiaDespacho + '</td>' +
                        '<td class="tabla-numero-guia-despacho-entrada">' + elemento.numneroGuiaDespacho + '</td>' +
                        '<td class="tabla-fecha-factura-entrada">' + elemento.fechaFacura + '</td>' +
                        '<td class="tabla-numero-factura-entrada">' + elemento.numeroFactura + '</td>' +
                        '<td class="tabla-accion-articulo-entrada">' +
                        '<button onclick="habilitarBotonConfirmarEliminacionArticulo(this)" type="button" class="btn btn-danger mr-1"><i class="fas fa-trash-alt"></i></button>' +
                        '<button onclick="eliminarFila(this)" style="display: none;" type="button" class="btn btn-danger boton-confirmar-articulo mr-1">Confirmar</button>' +
                        '</td>' +
                        '</tr>';
                });
                $('#modalCierreServicio').modal('hide');
                $('#modalOrdenDeCompra').modal('hide');
                $('#modalRequisicion').modal('hide');
                document.getElementById("seleccionarTodasLosItem").checked = false;
            } else {
                eliminarLoading()
                document.getElementById("botonSeleccionarCierreServicio").removeAttribute("disabled");
                Swal.fire({
                    icon: 'error',
                    title: '¡Selección!',
                    text: 'Debe seleccionar cierre de servicio',
                    confirmButtonColor: "#448aff",
                    confirmButtonText: "Confirmar"
                })
            }
        }

        function selecionarTodasLosItems(checkbox){
            if(checkbox.checked == true){
                var todosCheckBocSeleccionArticuloOc=document.querySelectorAll(".checkbox-seleccion-item");
                todosCheckBocSeleccionArticuloOc.forEach(articuloOc=>{
                    articuloOc.checked = true;
                });
            }else if(checkbox.checked == false){
                var todosCheckBocSeleccionArticuloOc=document.querySelectorAll(".checkbox-seleccion-item");
                todosCheckBocSeleccionArticuloOc.forEach(articuloOc=>{
                    articuloOc.checked = false;
                });
            }
        }
    </script>

    <script>
        function borradoMasivoDocumentos() {
            Swal.fire({
                title: '¿Esta seguro?',
                text: "En estos cierres de servicios se borrara todos los documentos que corresponda al tipo que selecciono",
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                cancelButtonColor: '#d33',
                confirmButtonText: '¡Si, borrar!',
                cancelButtonText: 'Cancelar'
            }).then((result) => {
                if (result.isConfirmed) {
                    generarLoading('{{ asset('img/logo.png') }}')
                    document.getElementById("botonDeCreacion").setAttribute("disabled", true);
                    var tipoDocumento = document.getElementById("tipoDeDocumento").value;

                    if (tipoDocumento.trim() != "") {
                        var filas = document.getElementById('tablaConExportacionConFiltrado').tBodies[0].querySelectorAll("tr");
                        var listadoDeCierreServicio = [];
                        filas.forEach(elementoPadre => {
                            var idCierreServicio = elementoPadre.querySelector(".tabla-id-cierre-servicio-entrada").innerHTML;
                            var fechaGuiaDespachoEditable = elementoPadre.querySelector(".tabla-fecha-guia-despacho-entrada").innerHTML;
                            var numeroGuiaDespachoEditable = elementoPadre.querySelector(".tabla-numero-guia-despacho-entrada").innerHTML;
                            var fechaFacturaEditable = elementoPadre.querySelector(".tabla-fecha-factura-entrada").innerHTML;
                            var numeroFacturaEditable = elementoPadre.querySelector(".tabla-numero-factura-entrada").innerHTML

                            var servicio = {
                                idCierreServicio: idCierreServicio,
                                fechaGuiaDespacho: fechaGuiaDespachoEditable,
                                numeroGuiaDespacho: numeroGuiaDespachoEditable,
                                fechaFactura: fechaFacturaEditable,
                                numeroFactura: numeroFacturaEditable
                            }
                            listadoDeCierreServicio.push(servicio);
                        });
                        listadoDeCierreServicio = JSON.stringify(listadoDeCierreServicio);

                        var formData = new FormData();
                        formData.append('listadoDeCierreServicio', listadoDeCierreServicio);
                        formData.append('tipo_documento', tipoDocumento.trim());
                        var csrf = '{{ csrf_token() }}';

                        $.ajax({
                            url: '{{ route('cierre-servicio.store-borrado-documentos') }}',
                            method: 'POST',
                            data: formData,
                            contentType: false,
                            processData: false,
                            dataType: 'json',
                            headers: {
                                'X-CSRF-TOKEN': csrf
                            },
                            success: function(data) {
                                eliminarLoading()
                                Swal.fire({
                                        icon: 'success',
                                        title: '¡Guardado!',
                                        text: 'Los documentos se borraron con éxito',
                                        confirmButtonColor: "#448aff",
                                        confirmButtonText: "Confirmar"
                                    }).then((result) => {
                                        location.reload();
                                    })
                                    .catch((error) => {
                                        location.reload();
                                    });
                            },
                            error: function(data) {
                                console.log(data)
                                document.getElementById("botonDeCreacion").removeAttribute("disabled");
                                eliminarLoading()
                            }
                        })
                    } else {
                        if (tipoDocumento.trim() == "") {
                            document.getElementById("tipoDeDocumento").classList.remove('input-success-icon');
                            document.getElementById("tipoDeDocumento").classList.add('input-error-icon');
                            document.getElementById("validarCampoTipoDeDocumento").innerHTML = "El campo tipo documento es obligatorio";
                            document.getElementById("validarCampoTipoDeDocumento").style.display = "block";
                        } else {
                            document.getElementById("tipoDeDocumento").classList.remove('input-error-icon');
                            document.getElementById("tipoDeDocumento").classList.add('input-success-icon');
                            document.getElementById("validarCampoTipoDeDocumento").innerHTML = "";
                            document.getElementById("validarCampoTipoDeDocumento").style.display = "none";
                        }
                        document.getElementById("botonDeCreacion").removeAttribute("disabled");
                        eliminarLoading()
                    }
                }
            })
        }
    </script>
@stop