modificado el listado de maquinas

httpdocs/assets/js/safekat/pages/maquinas/maquinasList.js

@@ -0,0 +1,185 @@
+import Table from '../../components/table.js';
+import ConfirmDeleteModal from '../../components/ConfirmDeleteModal.js';
+import Ajax from '../../components/ajax.js';
+import { getToken } from '../../common/common.js';
+
+
+class MaquinasList {
+
+    constructor() {
+
+        this.domItem = $('.card-body');
+
+        this.csrf_token = getToken();
+        this.csrf_hash = $('#mainContainer').find('input[name="' + this.csrf_token + '"]').val();
+
+        this.tableMaquinas = null;
+        this.deleteModal = null;
+    }
+
+    init() {
+
+        const self = this;
+
+        this.headerSearcher();
+
+        this.deleteModal = new ConfirmDeleteModal('maquinas');
+        this.deleteModal.init();
+
+        this.#initTable();
+
+        // Editar en linea la fila
+        this.tableMaquinas.table.on('click', '.btn-edit-' + this.tableMaquinas.getAlias(), function (e) {
+
+            const dataId = $(this).attr('data-id');
+
+            if (!Number.isNaN(Number(dataId))) {
+                window.location.href = '/maquinas/edit/' + dataId;
+            }
+        });
+
+        // Eliminar la fila
+        this.tableMaquinas.table.on('click', '.btn-delete-' + this.tableMaquinas.getAlias(), function (e) {
+            const row = $(this).closest('tr')[0]._DT_RowIndex;
+            const dataId = $(this).attr('data-id');
+            self.deleteModal.setData($(this).attr('data-id'));
+            self.deleteModal.show(() => {
+
+                if (!Number.isNaN(Number(self.deleteModal.getData()))) {
+
+                    new Ajax(
+                        '/maquinas/delete/' + dataId,
+                        {
+
+                        },
+                        {},
+                        (data, textStatus, jqXHR) => {
+
+                            self.tableMaquinas.table.clearPipeline();
+                            self.tableMaquinas.table.row($(row)).invalidate().draw();
+
+                            popSuccessAlert(data.msg ?? jqXHR.statusText);
+                        },
+                        (error) => {
+                            console.log(error);
+                        }
+
+                    ).get();
+                    self.deleteModal.hide();
+                }
+            });
+        });
+    }
+
+    #initTable() {
+
+        const self = this;
+
+        const columns = [
+            { 'data': 'id' },
+            { 'data': 'nombre' },
+            { 'data': 'tipo' },
+            { 'data': 'ancho_impresion' },
+            { 'data': 'alto_impresion' },
+            { 'data': 'min' },
+            { 'data': 'max' }
+        ];
+
+        const actions = ['edit', 'delete'];
+
+        this.tableMaquinas = new Table(
+            $('#tableOfMaquinas'),
+            'maquinasList',
+            '/maquinas/datatable',
+            columns,
+            []
+        );
+
+
+        this.tableMaquinas.init({
+            actions: actions,
+            colVisibility: false,
+            buttonsExport: true,
+        });
+
+
+        this.tableMaquinas.table.on('init.dt', function () {
+            self.tableMaquinas.table.page.len(50).draw();
+        });
+
+    }
+
+    headerSearcher() {
+
+        const self = this;
+
+        $('#tableOfMaquinas thead tr').clone(false).appendTo('#tableOfMaquinas thead');
+        $('#tableOfMaquinas thead tr:eq(1) th').each(function (i) {
+
+            if (!$(this).hasClass("noFilter")) {
+
+                let min_width = 100;
+                if (i == 0) {
+                    min_width = 50;
+                }
+
+                if (i == 2) {
+
+                    // Agregar un selector en la segunda columna
+                    $(this).html('<select class="form-control" style="min-width:100px;max-width:120px;font-size:0.8rem !important;"></select>');
+
+                    // Agregar opciones al selector
+                    var selector = $('select', this);
+                    selector.append('<option value="">Todos</option>'); // Opción vacía
+                    selector.append('<option value="acabado">Acabado</option>');
+                    selector.append('<option value="manipulado">Manupulado</option>');
+                    selector.append('<option value="impresion">Impresión</option>');
+
+                    selector.on('change', function () {
+                        var val = $.fn.dataTable.util.escapeRegex(
+                            $(this).val()
+                        );
+                        self.tableMaquinas.table.column(i).search(val).draw();
+                    });
+
+                }
+                else {
+                    $(this).html(`<input type="text" class="form-control " style="min-width:${min_width}px;max-width:500px;font-size:0.8rem !important;"  />`);
+
+                    $('input', this).on('change clear', function () {
+                        if (self.tableMaquinas.table.column(i).search() !== this.value) {
+                            self.tableMaquinas.table
+                                .column(i)
+                                .search(this.value)
+                                .draw();
+                        }
+                    });
+                }
+
+
+            }
+            else {
+                $(this).html('<span></span>');
+            }
+        });
+
+
+    }
+
+}
+
+document.addEventListener('DOMContentLoaded', function () {
+
+    const locale = document.querySelector('meta[name="locale"]').getAttribute('content');
+
+    new Ajax('/translate/getTranslation', { locale: locale, translationFile: ['Maquinas'] }, {},
+        function (translations) {
+            window.language = JSON.parse(translations);
+            new MaquinasList().init();
+        },
+        function (error) {
+            console.log("Error getting translations:", error);
+        }
+    ).post();
+});
+