agregando iconos de acciones

src/main/webapp/js/pages/control_asistencia_policias.js

 let asistencias = [], sedes = [];
 let htmlSedes;
 
-function init() {
-    listarEstadoAsistencia();
-}
-
 function listarAsistencias(objParams = {}) {
     debugger
     axios.get(URI_POLICIAS_ASISTENCIA, objParams).then((response) => {
@@ -13,7 +9,8 @@ function listarAsistencias(objParams = {}) {
         let columns = [
             {
                 title: `N°`,
-                data: `id`
+                data: `id`,
+                className: 'text-center'
             },
             {
                 title: `APELLIDOS Y NOMBRES`,
@@ -21,63 +18,87 @@ function listarAsistencias(objParams = {}) {
             },
             {
                 title: `SEDE`,
-                data: `sede_descripcion`
+                data: `sede_descripcion`,
+                className: 'text-center'
             },
             {
                 title: `HORARIO`,
-                data: `horario`
+                data: `horario`,
+                className: 'text-center'
             },
             {
                 title: `TIPO`,
-                data: `tiporol_descripcion`
+                data: `tiporol_descripcion`,
+                className: 'text-center'
             },
             {
                 title: `FRECUENCIA`,
-                data: `frecuencia_descripcion`
+                data: `frecuencia_descripcion`,
+                className: 'text-center'
             },
             {
                 title: `FECHA ENTRADA`,
-                data: `fecha_entrada`
+                data: `fecha_entrada`,
+                className: 'text-center'
             },
             {
                 title: `MARC. ENTRADA`,
                 data: null,
+                className: 'text-center',
                 render: data => {
-                    let clase = "";
+                    let label = "";
+
+                    if (data.estado == 3 || data.estado == 4 || data.estado == 9) {
+                        return `-`;
+                    }
 
                     if (data.marcacion_entrada === null) {
                         return null;
                     }
 
                     if (data.huella_entrada === 1) {
-                        clase = "text-migration font-weight-bold";
+                        label = "text-migration font-weight-bold";
                     } else if (data.huella_entrada === 0) {
-                        clase = "text-default";
+                        label = "text-default";
                     }
 
-                    return `<span class="${clase}">${data.marcacion_entrada}</span>`;
+                    return `<span class="${label}">${data.marcacion_entrada}</span>`;
                 }
             },
             {
                 title: `MARC. SALIDA`,
-                data: `marcacion_salida`
+                data: null,
+                className: 'text-center',
+                render: (data) => {
+                    let label = "";
+
+                    if (data.estado == 3 || data.estado == 4 || data.estado == 9) {
+                        return `-`;
+                    }
+
+                    if (data.marcacion_salida === null) {
+                        return null;
+                    }
+
+                    if (data.huella_salida === 1) {
+                        label = "text-migration font-weight-bold";
+                    } else if (data.huella_salida === 0) {
+                        label = "text-default";
+                    }
+
+                    return `<span class="${label}">${data.marcacion_salida}</span>`;
+                }
             },
             {
                 title: `FECHA SALIDA`,
-                data: `fecha_salida`
+                data: `fecha_salida`,
+                className: 'text-center'
             },
             {
                 title: `ESTADO`,
                 data: null,
+                className: 'text-center',
                 render: (data) => {
-//                    if (data.marcacion_entrada == null && data.marcacion_salida == null) {
-//                        return `<span class="label bg-purple">PENDIENTE</span>`;
-//                    } 
-//                    else if (data.marcacion_entrada == null) {
-//                        return `<span class="label bg-purple">ENTRADA PENDIENTE</span>`;
-//                    } else if (data.marcacion_salida == null) {
-//                        return `<span class="label bg-purple">SALIDA PENDIENTE</span>`;
-//                    }
                     let label = "";
                     let estado = "";
 
@@ -127,7 +148,20 @@ function listarAsistencias(objParams = {}) {
                 title: `ACCIONES`,
                 data: null,
                 render: (data) => {
-                    return null;
+                    let acciones = "";
+
+                    switch (data.estado) {
+                        case 10:
+                        case 11:
+                        case null:
+                            acciones = `<span data-toggle="tooltip" data-placement="left" title="Editar" style="cursor: pointer"> <i class='registrar icon-plus-circle2 text-success-700'></i>&nbsp;&nbsp; </span>
+                                                        <span data-toggle="tooltip" data-placement="left" title="Editar" style="cursor: pointer"> <i class='editar icon-pencil text-slate-800'></i>&nbsp;&nbsp; </span>
+                                                        <span data-toggle="tooltip" data-placement="left" title="Aprobar" style="cursor: pointer"> <i class='aprobar icon-checkmark-circle text-success-700'></i>&nbsp;&nbsp; </span>
+                                                        <span data-toggle="tooltip" data-placement="left" title="Anular" style="cursor: pointer"> <i class='anular icon-cancel-circle2 text-danger-700'></i>&nbsp;&nbsp; </span>`;
+                            break;
+                    }
+
+                    return acciones;
                 }
             }
         ];
@@ -155,14 +189,20 @@ function listarAsistencias(objParams = {}) {
 
 
 
-        makeDatatable({
-            data: response.data.data,
-            columns: columns,
-            columnDefs: columnDefs,
-            wrapsNameDatatable: wrapsNameDatatable,
-            classNameForDatatable: classNameForDatatable,
-            footer: footer
-        }).then((response) => {
+        makeDatatable(
+                {
+                    data: response.data.data,
+                    columns: columns,
+                    columnDefs: columnDefs,
+                    wrapsNameDatatable: wrapsNameDatatable,
+                    classNameForDatatable: classNameForDatatable,
+                    footer: footer
+                }
+        ).then((datatable) => {
+
+            $(datatable).on("click", ".registrar", function () {
+                let data = $(datatable).DataTable().row($(this).parents("tr")).data();
+            });
 
         });
     });
@@ -298,24 +338,6 @@ function buscar() {
 
 }
 
-
-//$("#dp").datepicker({
-//    minDate: new Date(1900, 1 - 1, 1), maxDate: '-18Y',
-//    dateFormat: 'dd/mm/yy',
-//    defaultDate: new Date(1970, 1 - 1, 1),
-//    changeMonth: true,
-//    changeYear: true,
-//    yearRange: '-110:-18',
-//    onSelect: function () {
-//        $(this).valid();
-//    }
-//});
-
-
-
-//$("#dtpFechaInicio").datepicker('setDate', 'now');
-
-
 function seleccionCriterio() {
     $("#cboCriterio").change(function () {
         let criterio = $(this).val();
@@ -417,9 +439,9 @@ function buscarAsistencias() {
 }
 
 $().ready(function () {
+    listarEstadoAsistencia();
     listarPolicias("#cboPoliciasFiltro");
     listarSedes("#cboSedesFiltro");
-    init();
     defaultConfigDataTable();
     $('.selectpicker').selectpicker({
         style: 'btn-info',