arreglando datatable

src/main/webapp/js/general.js

@@ -15,7 +15,7 @@ const ajaxModal = axios.create({
 	baseURL: `http://localhost:7070/Asistencia/vistas/modals/`
 });
 
-
+//<editor-fold>
 //<editor-fold> MODULO DE POLICIAS
 const URI_TIPOROL_POLICIA = "tipoRolPolicias";
 const URI_FRECUENCIA_ROL_POLICIA = "frecuenciaRolPolicias";
@@ -35,7 +35,6 @@ const URI_POLICIA_PROYECTADO_COMPARATIVO = "proyectadoComparativo";
 //</editor-fold>
 
 
-
 $.extend($.fn.dataTable.defaults, {
 	bSort: false,
 	bFilter: false,
@@ -296,31 +295,48 @@ function primeraLetraMayuscula(str) {
 
 
 
-const makeDatatable = (jsonForDatatable = {
-data: [],
-  columns: [],
-  columnDefs: [],
-  wrapsNameDatatable: ``,
-  classNameForDatatable: ``,
-  footerFilter: false,
-  highlighting: true
-}) => {
-	let data = jsonForDatatable.data;
-	let columns = jsonForDatatable.columns;
-	let columnDefs = jsonForDatatable.columns;
-	let wrapsNameDatatable = jsonForDatatable.wrapsNameDatatable
-	let nameDatatable = `${wrapsNameDatatable}-datatable`
-	let classNameForDatatable = jsonForDatatable.classNameForDatatable
+const makeDatatable = (
+  wrapName = ``,
+  forDatatable = {
+  data: [],
+	columns: [],
+	footerFilter: false,
+	footer: false
+  },
+  className = ``,
+  ) => {
+	if (!wrapName) {
+		return {
+			message: `{wrapName} is empty`,
+			status: false
+		}
+	}
+	debugger;
+	if (forDatatable.data.length <= 0) {
+		return {
+			message: `{data} is empty`,
+			status: false
+		}
+	}
+
+	if (forDatatable.columns.length <= 0) {
+		return {
+			message: `{columns} is empty`,
+			status: false
+		}
+	}
 
-	let highlighting = jsonForDatatable.highlighting
-	let footerFilter = jsonForDatatable.footerFilter
+	let nameDatatable = `${wrapName}-datatable`;
 
+	// table
 	let table_head = `
-		<table id="${nameDatatable}" class="${classNameForDatatable} table-hover" cellspacing="0" width="100%">`;
+		<table id="${nameDatatable}" class="table table-hover ${className}" cellspacing="0" width="100%">`;
+
+	// headers
 	let table_head_th = `
 		<thead>
 			<tr>`;
-	columns.forEach((obj) => {
+	forDatatable.columns.forEach((obj) => {
 		let title = `undefined`;
 		if (obj.title) {
 			title = obj.title;
@@ -334,12 +350,13 @@ data: [],
 			</tr>
 		</thead>`
 
+	// footers
 	let table_foot_th = ``;
-	if (footerFilter) {
+	if (forDatatable.footer) {
 		table_foot_th = `
 			<tfoot>
 				<tr>`;
-		columns.forEach((obj) => {
+		forDatatable.columns.forEach((obj) => {
 			let title = `undefined`;
 			if (obj.title) {
 				title = obj.title;
@@ -355,11 +372,13 @@ data: [],
 		`
 	}
 
+	// table
 	let table_foot = `</table>`
 
-	$(`#${wrapsNameDatatable}`).empty().append(`${table_head}${table_head_th}${table_foot_th}${table_foot}`);
-	if (footerFilter) {
-// Setup - add a text input to each footer cell
+	$(`#${wrapName}`).empty().append(`${table_head}${table_head_th}${table_foot_th}${table_foot}`);
+
+	if (forDatatable.footerFilter) {
+		// Setup - add a text input to each footer cell
 		$(`#${nameDatatable} tfoot th`).each(function () {
 			var title = $(this).text();
 			$(this).html(`<input type="text" class="form-control" placeholder="${title}" />`);
@@ -367,18 +386,12 @@ data: [],
 	}
 
 	$(`#${nameDatatable}`)
-	  .DataTable({
-		  data,
-		  columns,
-		  columnDefs,
-		  fixedColumns: {
-			  leftColumns: 1,
-			  rightColumns: 1
-		  }
-	  });
-	if (footerFilter) {
-// DataTable
+	  .DataTable(forDatatable);
+
+	if (forDatatable.footerFilter) {
+		// DataTable
 		let table = $(`#${nameDatatable}`).DataTable();
+
 		// Apply the search
 		table.columns().every(function () {
 			var that = this;
@@ -390,22 +403,13 @@ data: [],
 				}
 			});
 		});
-		$(`#${wrapsNameDatatable} .dataTables_scrollBody`).appendTo(`#${wrapsNameDatatable} .dataTables_scroll`);
-	}
 
-	if (highlighting) {
-		let table = $(`#${nameDatatable}`).DataTable();
-		$(`#${nameDatatable} tbody`)
-		  .on('mouseenter', 'td', function () {
-			  let colIdx = table.cell(this).index().column;
-			  $(table.cells().nodes()).removeClass('highlight');
-			  $(table.column(colIdx).nodes()).addClass('highlight');
-		  });
+		$(`#${wrapName} .dataTables_scrollBody`).appendTo(`#${wrapName} .dataTables_scroll`);
 	}
 
 	return Promise.resolve({
 		datatable: $(`#${nameDatatable}`),
-		container: $(`#${wrapsNameDatatable}`)
+		container: $(`#${wrapName}`)
 	});
 }
 

src/main/webapp/js/pages/comparativo_proyeccion_policias.js

@@ -132,18 +132,16 @@ function verReporte(objParams = {}) {
 
 		let wrapsNameDatatable = `divDatatable`;
 		let classNameForDatatable = `display table table-bordered`;
-		let footer = false;
 
-		makeDatatable(
+		makeDatatable(wrapsNameDatatable,
 		  {
 			  data: response.data,
 			  columns,
 			  columnDefs,
-			  wrapsNameDatatable,
-			  classNameForDatatable,
-			  footer
-		  }
-		)
+
+		  },
+		  classNameForDatatable
+		  )
 	}
 	);
 }

src/main/webapp/vistas/comparativoProyeccionPolicias.jsp

@@ -65,7 +65,6 @@
 
         <%@include file="templates/footer-body.jsp"%>
         <!--js de la pagina-->
-        <script src="../plantilla/assets/js/plugins/tables/datatables/datatables.min.js" type="text/javascript"></script>
         <script src="../plantilla/assets/js/plugins/ui/moment/moment.min.js" type="text/javascript"></script>
         <script src="../plantilla/assets/js/plugins/pickers/daterangepicker.js"></script>
         <script src="../plantilla/assets/js/core/libraries/jquery_ui/widgets.min.js"></script>