Configurando la logica del catalogo (JS)

ci4/app/Controllers/Catalogo/CatalogoLibros.php

@@ -196,7 +196,11 @@ class CatalogoLibros extends BaseResourceController
 
     public function datatable()
     {
-        $q = $this->model->getDatatableQuery();
+        $reqData = $this->request->getGet();
+        $start = $reqData['start'] ?? 0;
+        $length = $reqData['length'] ?? 5;
+
+        $q = $this->model->getDatatableQuery()->limit($length, $start);
 
         $result = DataTable::of($q)
             ->edit(

ci4/app/Language/es/Presupuestos.php

@@ -89,7 +89,9 @@ return [
     'colorPageInstructions' => 'Introduzca la posición de las páginas a color dentro del libro. Ej: 3,5,7 ó 4-10,20,155',
     'numeroPaginas' => 'Nº Páginas',
     'papel' => 'Papel',
+    'papelPod' => 'Papel (POD)',
     'gramaje' => 'Gramaje',
+    'gramajePod' => 'Gramaje (POD)',
     'opcionesPresupuesto' => 'Opciones presupuesto',
     'retractilado' => 'Retractilado individual',
     'retractilado5' => 'Retractilado de 5',

ci4/app/Models/Catalogo/CatalogoLibroModel.php

@@ -94,7 +94,7 @@ class CatalogoLibroModel extends Model
             ->select(
                 "t1.id AS id, 
                     t1.titulo AS titulo, 
-                    t1.cliente_id AS cliente, 
+                    t2.nombre AS cliente, 
                     t1.titulo AS titulo, 
                     t1.num_edic AS edicion, 
                     t1.autor AS autor, 
@@ -103,7 +103,8 @@ class CatalogoLibroModel extends Model
                     t1.paginas AS paginas,
                     t1.cubierta_archivo AS cubierta_archivo,
                     t1.cubierta_url AS portada"
-            );
+            )
+            ->join('clientes t2', 't1.cliente_id = t2.id');
 
         return $builder;
     }

ci4/app/Views/themes/vuexy/form/catalogo/_configuracionLibroFormItems.php

@@ -1,14 +1,14 @@
 <div class="accordion accordion-bordered mt-3" id="accordionConfiguracionLibro">
-    <div class="card accordion-item">
+    <div class="card accordion-item active">
         <h2 class="accordion-header" id="headingConfiguracionLibro">
             <button type="button" class="accordion-button collapsed" data-bs-toggle="collapse"
-                data-bs-target="#collapseConfiguracionLibro" aria-expanded="false"
+                data-bs-target="#collapseConfiguracionLibro" aria-expanded="true"
                 aria-controls="collapseConfiguracionLibro">
                 <h5 class="mb-0"><?= lang("Catalogo.configuracionLibro") ?? 'Configuración del libro' ?></h5>
             </button>
         </h2>
 
-        <div id="collapseConfiguracionLibro" class="accordion-collapse collapse"
+        <div id="collapseConfiguracionLibro" class="accordion-collapse collapse show"
             data-bs-parent="#accordionConfiguracionLibro">
             <div class="accordion-body">
 
@@ -46,18 +46,8 @@
                     </div><!--//.col -->
 
                     <div class="col-md-12 col-lg-3">
-                        <select id="encuardenacion" name="encuardenacion" class="form-select">
+                        <select id="encuadernacion" name="encuadernacion" class="form-control select2bs2 warning-change"
-                            <option value="">-- Encuadernacion --</option>
+                            style="width: 100%;">
-                            <option value="Rústica Fresada Con Solapas" <?= old('encuardenacion', $catalogoLibrosEntity->encuardenacion) === 'Rústica Fresada Con Solapas' ? 'selected' : '' ?>>Rústica Fresada Con Solapas</option>
-                            <option value="Rústica Fresada Sin Solapas" <?= old('encuardenacion', $catalogoLibrosEntity->encuardenacion) === 'Rústica Fresada Sin Solapas' ? 'selected' : '' ?>>Rústica Fresada Sin Solapas</option>
-                            <option value="Rústica Cosida" <?= old('encuardenacion', $catalogoLibrosEntity->encuardenacion) === 'Rústica Cosida' ? 'selected' : '' ?>>
-                                Rústica
-                                Cosida</option>
-                            <option value="Cartoné" <?= old('encuardenacion', $catalogoLibrosEntity->encuardenacion) === 'Cartoné' ? 'selected' : '' ?>>Cartoné
-                            </option>
-                            <option value="Wire-o" <?= old('encuardenacion', $catalogoLibrosEntity->encuardenacion) === 'Wire-o' ? 'selected' : '' ?>>Wire-o
-                            </option>
-                            <!-- Agrega aquí más opciones según tu catálogo -->
                         </select>
                     </div><!--//.col -->
                 </div><!--//.row -->
@@ -248,12 +238,12 @@
 class="form-control select2bs2 comp_cubierta_items" style="width: 100%;">
 <option value="0">
 <p>
- <?= lang('Presupuestos.no') ?>
+<?= lang('Presupuestos.no') ?>
 </p>
 </option>
 <option value="1">
 <p>
- <?= lang('Presupuestos.si') ?>
+<?= lang('Presupuestos.si') ?>
 </p>
 </option>
 </select>

ci4/app/Views/themes/vuexy/form/catalogo/viewCatalogoLibrosList.php

@@ -28,6 +28,18 @@
                             <th><?= lang('Catalogo.paginas') ?></th>
                             <th class="text-nowrap" style="min-width: 85px;"><?= lang('Basic.global.Action') ?></th>
                         </tr>
+                        <tr>
+                            <th></th>
+                            <th></th>
+                            <th><input type="text" class="form-control filtro_catalogo" name="titulo"></th>
+                            <th><input type="text" class="form-control filtro_catalogo" name="cliente"></th>
+                            <th></th>
+                            <th></th>
+                            <th></th>
+                            <th></th>
+                            <th></th>
+                            <th></th>
+                        </tr>
                     </thead>
                     <tbody>
 

httpdocs/assets/js/safekat/pages/catalogo/catalogo.js

@@ -5,36 +5,53 @@ class Catalogo {
 
     constructor() {
 
+        this.tirada_no_pod = 100;
+        this.tirada_pod = 1;
+
         this.cliente = new ClassSelect($("#clienteId"), '/catalogo/libros/clientlist', "Seleccione un cliente");
+        this.tipo_impresion = $("#tipoImpresion");
 
         this.encuadernacion = new ClassSelect($("#encuadernacion"), '/importador/getencuadernacion', "Seleccione una encuadernación");
 
-        this.compPapelNegroSelected = new ClassSelect($("#compPapelNegroSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+        this.compPapelNegro = new ClassSelect($("#compPapelNegro"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
             {
 
                 tipo_impresion: () => this.encuadernacion.getVal(),
-                tirada: () => $('#tirada').val(),
+                tirada: () => this.tirada_no_pod,
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
                 sopalas: 0,
                 lomo: 0,
                 tipo: () => $('#isHq').val() ? 'negrohq' : 'negro',
             });
+
+        this.compPapelNegroPod = new ClassSelect($("#compPapelNegroPod"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+            {
+                tipo_impresion: () => this.encuadernacion.getVal(),
+                tirada: () => this.tirada_pod,
+                ancho: () => this.getDimensionLibro().ancho,
+                alto: () => this.getDimensionLibro().alto,
+                sopalas: 0,
+                lomo: 0,
+                tipo: () => $('#isHq').val() ? 'negrohq' : 'negro',
+            });
+
+
         this.compGramajeNegro = new ClassSelect($('#compGramajeNegro'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
             {
                 tipo_impresion: () => this.encuadernacion.getVal(),
-                papel_generico: () => this.compPapelNegroSelected.getVal(),
+                papel_generico: () => this.compPapelNegro.getVal(),
-                tirada: () => $('#tirada').val(),
+                tirada: () => this.tirada_no_pod,
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
                 sopalas: 0,
                 lomo: 0,
                 tipo: () => $('#isHq').val() ? 'negrohq' : 'negro',
             });
-        this.compPapelColorSelected = new ClassSelect($("#compPapelColorSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+        this.compPapelColor = new ClassSelect($("#compPapelColor"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
             {
                 tipo_impresion: () => this.encuadernacion.getVal(),
-                tirada: () => $('#tirada').val(),
+                tirada: () => this.tirada_no_pod,
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
                 sopalas: 0,
@@ -44,18 +61,18 @@ class Catalogo {
         this.compGramajeColor = new ClassSelect($('#compGramajeColor'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
             {
                 tipo_impresion: () => this.encuadernacion.getVal(),
-                papel_generico: () => this.compPapelColorSelected.getVal(),
+                papel_generico: () => this.compPapelColor.getVal(),
-                tirada: () => $('#tirada').val(),
+                tirada: () => this.tirada_no_pod,
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
                 sopalas: 0,
                 lomo: 0,
                 tipo: () => $('#isHq').val() ? 'colorhq' : 'color',
             });
-        this.compPapelCubiertaSelected = new ClassSelect($("#compPapelCubiertaSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+        this.compPapelCubierta = new ClassSelect($("#compPapelCubierta"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
             {
                 tipo_impresion: this.encuadernacion.getVal(),
-                tirada: () => $('#tirada').val(),
+                tirada: () => this.tirada_no_pod,
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
                 sopalas: () => $('#compSolapasCubierta').val(),
@@ -66,15 +83,15 @@ class Catalogo {
         this.compGramajeCubierta = new ClassSelect($('#compGramajeCubierta'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
             {
                 tipo_impresion: () => this.encuadernacion.getVal(),
-                papel_generico: () => this.compPapelCubiertaSelected.getVal(),
+                papel_generico: () => this.compPapelCubierta.getVal(),
-                tirada: () => $('#tirada').val(),
+                tirada: () => this.tirada_no_pod,
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
                 sopalas: () => $('#compSolapasCubierta').val(),
                 lomo: 0,
                 tipo: 'colorhq',
             });
-        this.compSobrecubiertaSelected = new ClassSelect($("#compPapelSobrecubiertaSelected"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
+        this.compSobrecubierta = new ClassSelect($("#compPapelSobrecubierta"), '/presupuestoadmin/papelgenerico', "Seleccione un papel", false,
             {
                 tipo_impresion: this.encuadernacion.getVal(),
                 tirada: () => $('#tirada').val(),
@@ -88,7 +105,7 @@ class Catalogo {
         this.compGramajeSobrecubierta = new ClassSelect($('#compGramajeSobrecubierta'), '/presupuestoadmin/papelgramaje', 'Seleccione un gramaje', false,
             {
                 tipo_impresion: () => this.encuadernacion.getVal(),
-                papel_generico: () => this.compPapelCubiertaSelected.getVal(),
+                papel_generico: () => this.compPapelCubierta.getVal(),
                 tirada: () => $('#tirada').val(),
                 ancho: () => this.getDimensionLibro().ancho,
                 alto: () => this.getDimensionLibro().alto,
@@ -120,6 +137,8 @@ class Catalogo {
 
     init() {
 
+        const self = this;
+
         // Fuerza el foco en el campo de búsqueda de select2
         $(document).on('select2:open', () => {
             document.querySelector('.select2-search__field').focus();
@@ -132,26 +151,32 @@ class Catalogo {
 
         this.encuadernacion.init();
 
-        this.compPapelNegroSelected.init();
+        this.compPapelNegro.init();
         this.compGramajeNegro.init();
-        this.compPapelColorSelected.init();
+        this.compPapelColor.init();
         this.compGramajeColor.init();
-        this.compPapelCubiertaSelected.init();
+        this.compPapelCubierta.init();
         this.compGramajeCubierta.init();
-        this.compSobrecubiertaSelected.init();
+        this.compSobrecubierta.init();
         this.compGramajeSobrecubierta.init();
 
         this.acabadoCubierta.init();
         this.acabadosSobrecubierta.init();
 
+
+        this.compPapelNegro.item.on('select2:select', function () {
+            self.compGramajeNegro.empty();
+        });
+
         this.cliente.item.on('change', () => {
 
 
         });
 
+        // Inicializacino de eventos
+        this.tipo_impresion.on("change", this.updateOpcionesComparador.bind(this));
 
-        
+        this.updateOpcionesComparador();
-
 
         $(document).on('change', '.warning-change', function () {
             $(this).addClass('bg-warning');
@@ -161,54 +186,61 @@ class Catalogo {
     }
     
 
+    updateOpcionesComparador() {
 
+        $('.comp_negro_items').off('change');
+        $('.comp_negrohq_items').off('change');
+        $('.comp_color_items').off('change');
+        $('.comp_colorhq_items').off('change');
 
+        const selValue = this.tipo_impresion.val();
+        const elements_negro = $('.comp-negro-selected');
+        const elements_negrohq = $('.comp-negrohq-selected');
+        const elements_color = $('.comp-color-selected');
+        const elements_colorhq = $('.comp-colorhq-selected');
+        if (selValue.includes("hq")) {
+            Array.from(elements_negro).forEach(element => {
+                $(element).addClass('d-none');
+            });
+            Array.from(elements_color).forEach(element => {
+                $(element).addClass('d-none');
+            });
+            if (selValue.includes('color')) {
+                Array.from(elements_colorhq).forEach(element => {
+                    $(element).removeClass('d-none');
+                });
+            }
+            else {
+                Array.from(elements_colorhq).forEach(element => {
+                    $(element).addClass('d-none');
+                });
+            }
+            Array.from(elements_negrohq).forEach(element => {
+                $(element).removeClass('d-none');
+            });
+        }
+        else {
+            Array.from(elements_negrohq).forEach(element => {
+                $(element).addClass('d-none');
+            });
+            Array.from(elements_colorhq).forEach(element => {
+                $(element).addClass('d-none');
+            });
+            if (selValue.includes('color')) {
+                Array.from(elements_color).forEach(element => {
+                    $(element).removeClass('d-none');
+                });
+            }
+            else {
+                Array.from(elements_color).forEach(element => {
+                    $(element).addClass('d-none');
+                });
+            }
+            Array.from(elements_negro).forEach(element => {
+                $(element).removeClass('d-none');
+            });
+        }
 
-    collectData() {
-
-        let data = {};
-
-        data.id;
-        data.cliente_id = $("#clienteId").val();
-
-        data.paginas = $('#paginas').val();
-        data.tirada = $('#tirada').val();
-        data.papel_formato_id = $('#tamanio').val();
-        data.papel_formato_personalizado = $('#papelFormatoPersonalizado').prop('checked') ? 1 : 0;
-        data.papel_formato_ancho = $('#papelFormatoAncho').val();
-        data.papel_formato_alto = $('#papelFormatoAlto').val();
-
-        data.encuadernacion = this.encuadernacion.getVal();
-        data.isHq = $('#isHq').val();
-
-        data.paginas_bn = $('#compPaginasNegro').val();
-        data.papel_bn = this.compPapelNegroSelected.getVal();
-        data.gramaje_bn = this.compGramajeNegro.getVal();
-
-        data.paginas_color = $('#compPaginasColor').val();
-        data.papel_color = this.compPapelColorSelected.getVal();
-        data.gramaje_color = this.compGramajeColor.getVal();
-
-        data.paginas_cubierta = $('#compCarasCubierta').val();
-        data.papel_cubierta = this.compPapelCubiertaSelected.getVal();
-        data.gramaje_cubierta = this.compGramajeCubierta.getVal();
-        data.solapas_cubierta = $('#compSolapasCubierta').val();
-        data.acabado_cubierta = this.acabadoCubierta.getVal();
-
-        data.sobrecubierta = $('#compSobrecubierta').val();
-        data.papel_sobrecubierta = this.compSobrecubiertaSelected.getVal();
-        data.gramaje_sobrecubierta = this.compGramajeSobrecubierta.getVal();
-        data.solapas_sobrecubierta = $('#compSolapasSobrecubierta').val();
-        data.acabado_sobrecubierta = this.acabadosSobrecubierta.getVal();
-
-        data.servicios = {
-            marcapaginas: $('#marcapaginas').prop('checked') ? 1 : 0,
-            serviciosExtra: []
-        };
-
- 
-
-        return data;
     }
 
 
@@ -216,17 +248,8 @@ class Catalogo {
 
 
     getDimensionLibro() {
-        let ancho = 0;
+        let ancho = $('#ancho').val();
-        let alto = 0;
+        let alto = $('#alto').val();;
-        if ($('#papelFormatoPersonalizado').prop('checked')) {
-            ancho = $('#papelFormatoAncho').val();
-            alto = $('#papelFormatoAlto').val();
-        }
-        else {
-            const text = $('#tamanio').text();
-            ancho = text.split('x')[0];
-            alto = text.split('x')[1];
-        }
         return { ancho, alto };
     }
 
@@ -270,15 +293,15 @@ class Catalogo {
                 $('#compPaginasNegro').val(data.lineas.bn.paginas);
                 $('#compPapelNegroOrigen').val(data.lineas.bn.papel_nombre);
                 this.compGramajeNegro.setOption(parseFloat(data.lineas.bn.gramaje).toFixed(0), parseFloat(data.lineas.bn.gramaje).toFixed(0));
-                this.compPapelNegroSelected.item.prop('disabled', false);
+                this.compPapelNegro.item.prop('disabled', false);
-                this.compPapelNegroSelected.setOption(data.lineas.bn.new_papel_id, data.lineas.bn.new_papel_nombre);
+                this.compPapelNegro.setOption(data.lineas.bn.new_papel_id, data.lineas.bn.new_papel_nombre);
             }
             else {
                 $('#compPaginasNegro').val(0);
                 $('#compPapelNegroOrigen').val("");
                 this.compGramajeNegro.empty();
-                this.compPapelNegroSelected.empty();
+                this.compPapelNegro.empty();
-                this.compPapelNegroSelected.item.prop('disabled', true);
+                this.compPapelNegro.item.prop('disabled', true);
                 this.compGramajeNegro.item.prop('disabled', true);
             }
 
@@ -286,15 +309,15 @@ class Catalogo {
                 $('#compPaginasColor').val(data.lineas.color.paginas);
                 $('#compPapelColorOrigen').val(data.lineas.color.papel_nombre);
                 this.compGramajeColor.setOption(parseFloat(data.lineas.color.gramaje).toFixed(0), parseFloat(data.lineas.color.gramaje).toFixed(0));
-                this.compPapelColorSelected.item.prop('disabled', false);
+                this.compPapelColor.item.prop('disabled', false);
-                this.compPapelColorSelected.setOption(data.lineas.color.new_papel_id, data.lineas.color.new_papel_nombre);
+                this.compPapelColor.setOption(data.lineas.color.new_papel_id, data.lineas.color.new_papel_nombre);
             }
             else {
                 $('#compPaginasColor').val(0);
                 $('#compPapelColorOrigen').val("");
                 this.compGramajeColor.empty();
-                this.compPapelColorSelected.empty();
+                this.compPapelColor.empty();
-                this.compPapelColorSelected.item.prop('disabled', true);
+                this.compPapelColor.item.prop('disabled', true);
             }
 
             if (data.lineas.cubierta && data.lineas.cubierta.paginas) {
@@ -302,16 +325,16 @@ class Catalogo {
                 $('#compPapelCubiertaOrigen').val(data.lineas.cubierta.papel_nombre);
                 this.compGramajeCubierta.setOption(parseFloat(data.lineas.cubierta.gramaje).toFixed(0), parseFloat(data.lineas.cubierta.gramaje).toFixed(0));
                 $('#compSolapasCubierta').val(parseFloat(data.lineas.cubierta.solapas).toFixed(0));
-                this.compPapelCubiertaSelected.item.prop('disabled', false);
+                this.compPapelCubierta.item.prop('disabled', false);
-                this.compPapelCubiertaSelected.setOption(data.lineas.cubierta.new_papel_id, data.lineas.cubierta.new_papel_nombre);
+                this.compPapelCubierta.setOption(data.lineas.cubierta.new_papel_id, data.lineas.cubierta.new_papel_nombre);
             }
             else {
                 $('#compPaginasCubierta').val(0);
                 $('#compPapelCubiertaOrigen').val("");
                 this.compGramajeCubierta.empty();
                 $('#compSolapasCubierta').val("");
-                this.compPapelCubiertaSelected.empty();
+                this.compPapelCubierta.empty();
-                this.compPapelCubiertaSelected.item.prop('disabled', true);
+                this.compPapelCubierta.item.prop('disabled', true);
             }
 
             if (data.lineas.sobrecubierta && data.lineas.sobrecubierta.paginas) {
@@ -319,16 +342,16 @@ class Catalogo {
                 $('#compPapelSobrecubiertaOrigen').val(data.lineas.sobrecubierta.papel_nombre);
                 this.compGramajeSobrecubierta.setOption(parseFloat(data.lineas.sobrecubierta.gramaje).toFixed(0), parseFloat(data.lineas.sobrecubierta.gramaje).toFixed(0));
                 $('#compSolapasSobrecubierta').val(parseFloat(data.lineas.sobrecubierta.solapas).toFixed(0));
-                this.compSobrecubiertaSelected.item.prop('disabled', false);
+                this.compSobrecubierta.item.prop('disabled', false);
-                this.compSobrecubiertaSelected.setOption(data.lineas.sobrecubierta.new_papel_id, data.lineas.sobrecubierta.new_papel_nombre);
+                this.compSobrecubierta.setOption(data.lineas.sobrecubierta.new_papel_id, data.lineas.sobrecubierta.new_papel_nombre);
             }
             else {
                 $('#compSobrecubierta').val(0);
                 $('#compPapelSobrecubiertaOrigen').val("");
                 this.compGramajeSobrecubierta.empty();
                 $('#compSolapasSobrecubierta').val("");
-                this.compSobrecubiertaSelected.empty();
+                this.compSobrecubierta.empty();
-                this.compSobrecubiertaSelected.item.prop('disabled', true);
+                this.compSobrecubierta.item.prop('disabled', true);
             }
 
             if (data.acabados) {
@@ -355,30 +378,7 @@ class Catalogo {
                 }
             }
 
-            if (data.servicios.ferro == 1) {
+
-                $('#ferro').prop('checked', true);
-            }
-            else {
-                $('#ferro').prop('checked', false);
-            }
-            if (data.servicios.ferroDigital == 1) {
-                $('#ferroDigital').prop('checked', true);
-            }
-            else {
-                $('#ferroDigital').prop('checked', false);
-            }
-            if (data.servicios.marcapaginas == 1) {
-                $('#marcapaginas').prop('checked', true);
-            }
-            else {
-                $('#marcapaginas').prop('checked', false);
-            }
-            if (data.servicios.prototipo == 1) {
-                $('#prototipo').prop('checked', true);
-            }
-            else {
-                $('#prototipo').prop('checked', false);
-            }
         }
         this.makeImport.prop('disabled', false);
     }

httpdocs/assets/js/safekat/pages/catalogo/list.js

@@ -8,6 +8,7 @@ document.addEventListener('DOMContentLoaded', function () {
         processing: true,
         serverSide: true,
         autoWidth: true,
+        orderCellsTop: true,
         responsive: true,
         scrollX: true,
         lengthMenu: [5, 10, 25, 50, 75, 100, 250, 500, 1000, 2500],
@@ -21,7 +22,6 @@ document.addEventListener('DOMContentLoaded', function () {
                 pageSize: 'A4'
             }
         ],
-        stateSave: true,
         order: [[1, 'asc']],
         language: {
             url: "/themes/vuexy/vendor/libs/datatables-sk/plugins/i18n/es-ES.json"
@@ -42,11 +42,17 @@ document.addEventListener('DOMContentLoaded', function () {
             { data: 'id' },
             { data: 'titulo' },
             { data: 'cliente' },
-            { data: 'edicion' },
+            {
+                data: 'edicion',
+                className: "text-center"
+            },
             { data: 'autor' },
             { data: 'isbn' },
             { data: 'ean' },
-            { data: 'paginas' },
+            {
+                data: 'paginas',
+                className: "text-center"
+            },
             { data: 'actionBtns' }
         ]
     });
@@ -95,4 +101,14 @@ document.addEventListener('DOMContentLoaded', function () {
 
     });
 
+
+    $(document).on("keyup", ".filtro_catalogo", (event) => {
+        let columnName = $(event.currentTarget).attr("name");
+        let columnIndex = $('#tableOfCatalogoLibros').DataTable().columns().eq(0).filter(function (index) {
+            return $('#tableOfCatalogoLibros').DataTable().column(index).dataSrc() === columnName;
+        })[0];
+        $('#tableOfCatalogoLibros').DataTable().column(columnIndex).search($(event.currentTarget).val()).draw()
+    })
+
+
 });