usando map en proyeccion de asistencias

src/main/webapp/js/pages/proyectar_asistencia_policias.js

-let data = [];
 let listaSedes = [];
 let handsonTable;
-function initializeData() {
-    data.push({"dni": "12345678", "nombres": "DELGADO CHOZO JUAN FRANCISCO", "sede": "CANTA CALLAO 2", "horario": "07:00 - 17:00", "tipo_horario": "REGULAR",
-        "fecha_entrada": "15/06/2018", "marcacion_entrada": "06:59", "marcacion_salida": "00:00", "fecha_salida": "15/06/2018"});
-    data.push({"dni": "12345678", "nombres": "DELGADO CHOZO JUAN FRANCISCO", "sede": "CANTA CALLAO 2", "horario": "07:00 - 17:00", "tipo_horario": "REGULAR",
-        "fecha_entrada": "16/06/2018", "marcacion_entrada": "06:59", "marcacion_salida": "00:00", "fecha_salida": "16/06/2018"});
-    data.push({"dni": "12345678", "nombres": "DELGADO CHOZO JUAN FRANCISCO", "sede": "CANTA CALLAO 2", "horario": "07:00 - 07:00", "tipo_horario": "AMANECIDA 24h",
-        "fecha_entrada": "17/06/2018", "marcacion_entrada": "06:59", "marcacion_salida": "00:00", "fecha_salida": "18/06/2018"});
-}
-
-
 
 
 function listarSedes(selectorName) {
@@ -57,31 +46,34 @@ function mostrarVistaPrevia() {
             handsonTable.destroy();
             let container = document.getElementById("tblProyectado");
 
-            let filas = [];
-            response.data.forEach(d => {
-                d.detalles_rol.forEach(dr => {
+            let data = [];
+            response.data.forEach(rol => {
+                rol.detalles_rol
+                        .map(dr => {
                             dr.horario = `${dr.fecha_entrada.split(" ")[1]} -  ${dr.fecha_salida.split(" ")[1]}`;
                             dr.fecha_entrada = dr.fecha_entrada.split(" ")[0];
                             dr.fecha_salida = dr.fecha_salida.split(" ")[0];
-                    debugger
-                    let objFila = {
-                        policia_dni: d.policia_dni,
-                        policia_nombres: d.policia_nombres,
+                            return dr;
+                        })
+                        .forEach(dr => {
+                            let obj = {
+                                policia_dni: rol.policia_dni,
+                                policia_nombres: rol.policia_nombres,
                                 fecha_entrada: dr.fecha_entrada,
                                 fecha_salida: dr.fecha_salida,
-                        sede_id: d.sede_id,
-                        sede_descripcion: d.sede_descripcion,
+                                sede_id: rol.sede_id,
+                                sede_descripcion: rol.sede_descripcion,
                                 horario: dr.horario,
-                        tiporol_descripcion: d.tiporol_descripcion
+                                tiporol_descripcion: rol.tiporol_descripcion
                             };
-                    filas.push(objFila);
+                            data.push(obj);
                         });
 
             });
 
 
             handsonTable = new Handsontable(container, {
-                data: filas,
+                data: data,
                 stretchH: 'all',
                 rowHeaders: true,
                 colHeaders: ['DNI', 'Apellidos y Nombres', 'Sede', 'Horario', 'Rol', 'Fecha Entrada', 'Hora entrada', 'Hora Salida', 'Fecha Salida'],
@@ -249,6 +241,5 @@ $().ready(function () {
     $("#dpFechaFin").datepicker('setDate', 'now');
 //    defaultConfigDataTable();
     defaultConfigHandsonTable();
-    initializeData();
     $("#btnVistaPrevia").click(mostrarVistaPrevia);
 });
\ No newline at end of file

src/main/webapp/vistas/proyectarAsistenciaPolicias.jsp

@@ -68,26 +68,7 @@
                         <button type="button" id="btnGuardarCambios" class="btn bg-slate border-slate-600 btn-xs"><i class="glyphicon glyphicon-plus"></i>&nbsp; Guardar cambios</button>
                     </div>
                 </div>
-                <div id="tblProyectado">
-                    <!--                    <table class="table table-responsive dataTable table-striped table-sm table-bordered" id="tblAsistenciaPolicias">                                                 
-                                            <thead>
-                                                <tr>
-                                                    <th class="text-center">N°</th>
-                                                    <th class="text-center">Apellidos y Nombres</th>
-                                                    <th class="text-center">Sede</th>
-                                                    <th class="text-center">Horario</th>
-                                                    <th class="text-center">Tipo de horario</th>
-                                                    <th class="text-center">Fecha de Entrada</th>
-                                                    <th class="text-center">Marcación de entrada</th>
-                                                    <th class="text-center">Marcación de salida</th>
-                                                    <th class="text-center">Fecha de salida</th>
-                                                </tr>
-                                            </thead>
-                                            <tbody>
-                    
-                                            </tbody>
-                                        </table>-->
-                </div>
+                <div id="tblProyectado"></div>
             </div>
         </div>