trabajando en el datatable

httpdocs/assets/js/safekat/pages/cliente/cliente.js

@@ -1,14 +1,12 @@
 import ClassSelect from '../../components/select2.js';
 import tarifasClienteView from './tarifasCliente.js';
+import Ajax from '../../components/ajax.js';
 
 class Cliente {
 
     constructor() {
 
-        this.csrf_token = this.getToken();
-        this.csrf_hash = $('#clienteForm').find('input[name="' + this.csrf_token + '"]').val();
-
-        this.tarifas = new tarifasClienteView();
+        this.tarifas = new tarifasClienteView($('#tarifascliente'));
 
         this.pais =  new ClassSelect($("#paisId"), '/paises/menuitems2', "Seleccione un país", {[this.csrf_token]: this.csrf_hash});
         this.soporte = new ClassSelect($("#soporteId"), '/users/getMenuComerciales', "Seleccione un usuario", {[this.csrf_token]: this.csrf_hash}); 
@@ -17,7 +15,6 @@ class Cliente {
         this.provincia = new ClassSelect($("#provinciaId"), '/provincias/menuitems2', "Seleccione una provincia", {[this.csrf_token]: this.csrf_hash});
         this.comunidadAutonoma = new ClassSelect($("#comunidadAutonomaId"), '/comunidades-autonomas/menuitems2', "Seleccione una comunidad autónoma", {[this.csrf_token]: this.csrf_hash});
 
-        this.init();
     }
 
     init() {
@@ -54,18 +51,21 @@ class Cliente {
         });
 
     }
-
-    getToken(){
-        
-        const scriptUrl = new URL(import.meta.url);
-        const params = new URLSearchParams(scriptUrl.search);
-
-        const paramsObject = Object.fromEntries(params.entries());
-        return paramsObject.token;
-    }
 }
 
 
 document.addEventListener('DOMContentLoaded', function () {
-    new Cliente().init();
-}); 
+    
+    const locale = document.querySelector('meta[name="locale"]').getAttribute('content');
+    
+    new Ajax('/translate/getTranslation', { locale: locale, translationFile: ['ClienteContactos', 'ClientePrecios'] }, {},
+        function(translations) {
+            window.language = JSON.parse(translations);
+            new Cliente().init();
+        },
+        function (error) {
+            console.log("Error getting translations:", error);
+        }
+    ).post();   
+}); 
+

httpdocs/assets/js/safekat/pages/cliente/tarifasCliente.js

@@ -1,14 +1,91 @@
-import { getToken } from "../../utils/common";
+import Table from '../../components/table.js';
+import { getToken } from '../../common/common.js';
 
-class tarifasClienteView{
+class tarifasClienteView {
 
     constructor(domItem) {
-        this.csrf_token = document.querySelector('meta[name="csrf-token"]').content;
-        this.csrf_hash = document.querySelector('meta[name="csrf-hash"]').content;
-        this.token = getToken();
+
+        this.domItem = domItem;
+
+        this.csrf_token = getToken();
+        this.csrf_hash = $('#mainContainer').find('input[name="' + this.csrf_token + '"]').val();
+
+        this.clienteId = window.location.href.split("/").pop();
+        this.actions = ['edit', 'delete'];
     }
 
     init() {
-        
+
+        const self = this;
+
+        const columns = [
+            {
+                'data': 'tipo',
+                'render': function (data, type, row, meta) {
+                    if (data == 'interior')
+                        return window.language.ClientePrecios.interior;
+                    else if (data == 'cubierta')
+                        return window.language.ClientePrecios.cubierta;
+                    else if (data == 'sobrecubierta')
+                        return window.language.ClientePrecios.sobrecubierta;
+                }
+            },
+            {
+                'data': 'tipo_maquina',
+                'render': function (data, type, row, meta) {
+                    if (data == 'toner')
+                        return window.language.ClientePrecios.toner;
+                    else if (data == 'inkjet')
+                        return window.language.ClientePrecios.inkjet;
+                }
+            },
+            {
+                'data': 'tipo_impresion',
+                'render': function (data, type, row, meta) {
+                    if (data == 'negro')
+                        return window.language.ClientePrecios.negro;
+                    else if (data == 'negrohq')
+                        return window.language.ClientePrecios.negrohq;
+                    else if (data == 'color')
+                        return window.language.ClientePrecios.color;
+                    else if (data == 'colorhq')
+                        return window.language.ClientePrecios.colorhq;
+                }
+            },
+            { 'data': 'tiempo_min' },
+            { 'data': 'tiempo_max' },
+            { 'data': 'precio_hora' },
+            { 'data': 'margen' },
+            { 'data': 'user_updated' },
+            { 'data': 'updated_at' },
+            { 'data': 'plantilla_id' },
+
+        ];
+        this.tableTarifas = new Table(
+            $('#tableOfPrecios'),
+            'tarifasCliente',
+            '/clienteprecios/datatable',
+            columns,
+            [
+                { name: 'cliente_id', value: window.location.href.split("/").pop() },
+                { name: this.csrf_token, value: this.csrf_hash },
+            ]
+        );
+
+        this.tableTarifas.init({
+            actions: ['edit', 'delete'],
+            buttonsNewEditor: true,
+
+        });
+
+        $('button[data-bs-target="#tarifascliente"]').on('shown.bs.tab', function(event) {
+            setTimeout(() => {
+                self.tableTarifas.table.columns.adjust().draw();
+            }, 100); // Usamos setTimeout para asegurar que se dibuje después del renderizado
+        });
     }
-}
+
+
+}
+
+export default tarifasClienteView;