registrar nuevo rol en sweet alert

src/main/webapp/css/general.css

@@ -260,8 +260,3 @@ table.display tbody tr:hover td {
 .dataTable thead .sorting_asc:after {
     content: '' !important; 
 }
-
-/*xd*/
-.sweet-alert.sweetalert-lg { width: 1200px; }
-
-.sweet-alert { margin: auto; transform: translateX(-50%); }
\ No newline at end of file

src/main/webapp/js/general.js

@@ -264,17 +264,19 @@ function primeraLetraMayuscula(str) {
 
 
 
-const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [], wrapsNameDatatable: ``, classNameForDatatable: ``, footer: false}) => {
+const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [], wrapsNameDatatable: ``, classNameForDatatable: ``, footer: 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;
+    let wrapsNameDatatable = jsonForDatatable.wrapsNameDatatable
+    let nameDatatable = `${wrapsNameDatatable}-datatable`
+    let classNameForDatatable = jsonForDatatable.classNameForDatatable
+
+    let highlighting = jsonForDatatable.highlighting
 
     let table_head = `
-		<table id="${nameDatatable}" class="${classNameForDatatable}" cellspacing="0" width="100%">`;
+		<table id="${nameDatatable}" class="${classNameForDatatable} table-hover" cellspacing="0" width="100%">`;
 
     let table_head_th = `
 		<thead>
@@ -317,9 +319,24 @@ const makeDatatable = (jsonForDatatable = { data: [], columns: [], columnDefs: [
     let table_foot = `</table>`
 
     $(`#${wrapsNameDatatable}`).empty().append(`${table_head}${table_head_th}${table_foot_th}${table_foot}`);
-    $(`#${nameDatatable}`).DataTable({
+    $(`#${nameDatatable}`)
+            .DataTable({
                 data,
                 columns,
                 columnDefs
             });
+
+    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');
+                });
+    }
+
+    return Promise.resolve($(`#${nameDatatable}`));
 }
\ No newline at end of file

src/main/webapp/js/pages/crearRolPolicia.js

 function init() {
-    listarTipoRoles();
-    listarFrecuenciaRol();
-    listarSedes();
-    listarPolicias();
+//    listarTipoRoles();
+//    listarFrecuenciaRol();
+//    listarSedes();
+//    listarPolicias();
     listarRolesPolicias();
 }
 
@@ -56,7 +56,7 @@ function listarRolesPolicias() {
                 render: (data) => {
                     console.log(data);
                     if (Object.is(data, 1)) {
-                        return `   <span data-placement="left" title="Ver detalle" data-toggle="modal" data-target="#modal_tombo_remote" style="cursor: pointer"> <i class='ver icon-calendar2 text-primary-700'></i>&nbsp;&nbsp; </span>
+                        return `   <span data-placement="left" title="Ver detalle" data-toggle="tooltip" style="cursor: pointer"> <i class='ver-detalle icon-calendar2 text-primary-700'></i>&nbsp;&nbsp; </span>
                                     <span data-toggle="tooltip" data-placement="left" title="Desactivar Rol" style="cursor: pointer"> <i class='anular icon-cancel-circle2 text-danger-700'></i>&nbsp;&nbsp; </span>
                                 `;
                     } else {
@@ -89,6 +89,11 @@ function listarRolesPolicias() {
             wrapsNameDatatable: wrapsNameDatatable,
             classNameForDatatable: classNameForDatatable,
             footer: footer
+        }).then((datatable) => {
+            $(datatable).on("click", ".ver-detalle", function () {
+                let data = $(datatable).DataTable().row($(this).parents("tr")).data();
+                debugger
+            });
         });
 
     });
@@ -260,10 +265,28 @@ function guardarCambios() {
 }
 
 
+function mostrarModalNuevoRol() {
+    axios.get("modals/policias/mantenimientoRol/crearRol.jspf").then((response) => {
+        swal({
+            title: '<strong>Nuevo Rol</strong>',
+//            type: 'info',
+            html: response.data,
+            showCloseButton: true,
+            showCancelButton: true,
+            focusConfirm: false,
+            confirmButtonText: '<i class="fa fa-thumbs-up"></i> Registrar rol',
+            confirmButtonAriaLabel: 'Registrar rol',
+            cancelButtonText: 'Cancelar',
+            cancelButtonAriaLabel: 'Thumbs down',
+            width: '30%',
+            customClass: 'swal2-overflow',
+            onOpen: () => {
+                listarTipoRoles();
+                listarFrecuenciaRol();
+                listarSedes();
+                listarPolicias();
+
 
-$().ready(function () {
-    init();
-    defaultConfigDataTable();
                 $('.selectpicker').selectpicker({
                     style: 'btn-info',
                     size: 4
@@ -287,7 +310,6 @@ $().ready(function () {
                     changeYear: true,
                     yearRange: '-18:+0',
                     onSelect: function () {
-//        $(this).valid();
                     }
                 });
                 $("#dpFechaInicio").datepicker('setDate', 'now');
@@ -300,31 +322,47 @@ $().ready(function () {
                     changeYear: true,
                     yearRange: '-18:+0',
                     onSelect: function () {
-//        $(this).valid();
                     }
                 });
                 $("#dpFechaFin").datepicker('setDate', 'now');
 
                 defaultConfigDatePicker();
                 defaultConfigDateRangePicker();
+            }
+        }).then((result) => {
+            if (result.value) {
+                registrarRolPolicia();
+            }
+        });
+    });
+}
+
+$().ready(function () {
+    init();
+    defaultConfigDataTable();
     $('#servicio13').click(modificarServicio);
     $("#btnCancelar").click(cancelar);
     $("#btnGuardarCambios").click(guardarCambios);
-    $("#btnRegistrar").click(registrarRolPolicia);
-    axios.get("modals/policias/mantenimientoRol/detalleRol.jspf").then((response) => {
-        swal({
-            title: '<strong>Detalle de rol</strong>',
-//            type: 'info',
-            html: response.data,
-            showCloseButton: true,
-            showCancelButton: true,
-            focusConfirm: false,
-            confirmButtonText: '<i class="fa fa-thumbs-up"></i> Great!',
-            confirmButtonAriaLabel: 'Thumbs up, great!',
-            cancelButtonText: 'Cancelar',
-            cancelButtonAriaLabel: 'Thumbs down',
-            width: '30%'
-        })
+    $("#btnNuevoRol").click(mostrarModalNuevoRol);
+
+//    axios.get("modals/policias/mantenimientoRol/detalleRol.jspf").then((response) => {
+//        debugger
+//        swal({
+//            title: '<strong>Detalle de rol</strong>',
+////            type: 'info',
+//            html: response.data,
+//            showCloseButton: true,
+//            showCancelButton: true,
+//            focusConfirm: false,
+//            confirmButtonText: '<i class="fa fa-thumbs-up"></i> Great!',
+//            confirmButtonAriaLabel: 'Thumbs up, great!',
+//            cancelButtonText: 'Cancelar',
+//            cancelButtonAriaLabel: 'Thumbs down',
+//            width: '30%'
+//        })
+//
+//    });
+
+
 
-    });
 });
\ No newline at end of file

src/main/webapp/vistas/crearRolPolicia.jsp

@@ -13,7 +13,7 @@
     <body>
         <%@include file="templates/header-body.jsp" %>
         <!--  content -->
-        <div class="col-md-5 col-md-offset-3">
+<!--        <div class="col-md-5 col-md-offset-3">
             <div class="panel panel-primary">
                 <div class="panel-heading">
                     <h5 class="panel-title">Creación y Asignación de Roles</h5>
@@ -72,7 +72,7 @@
 
             </div>
         </div>
-
+-->
 
         <div class="col-md-10 col-md-offset-1">
             <div class="panel panel-primary card-3" style="margin-top: 30px"> 

src/main/webapp/vistas/modals/newjsp.jspf

-<form>
-	ttulo:<br>
-	<input id="input1" type="text" name="input1"><br>
-	cuerpo:<br>
-	<input id="input2" type="text" name="input2">
-</form>
-<button id="boton" type="button">filtrar</button>

src/main/webapp/vistas/modals/policias/mantenimientoRol/crearRol.jspf

+<form id="frmAsistenciaDocentes" onsubmit="return false;" autocomplete="off">
+    <div class="panel-body">
+        <div class="row">
+            <div class="col-md-12 form-group">
+                <label>Policia</label>
+                <select class="select-search form-control" id="cboPolicias">
+                </select>
+            </div>
+        </div>
+
+        <div class="row">
+            <div class="col-md-6 form-group">
+                <label>Tipo de rol</label>
+                <select class="form-control" id="cboTipoRol">
+                </select>
+            </div>
+
+            <div class="col-md-6 form-group">
+                <label>Rango de fechas: </label>
+                <div class="input-group">
+                    <span class="input-group-addon"><i class="icon-calendar22"></i></span>
+                    <input type="text" class="form-control daterange-basic" value="01/06/2018 - 30/06/2018" id="dpRangoFechas"> 
+                </div>
+            </div>
+
+        </div>
+
+
+        <div class="row">
+            <div class="col-md-6 form-group">
+                <label>Frecuencia</label>
+                <select class="form-control" id="cboFrecuenciaRol">
+                </select>
+            </div>
+
+            <div class="col-md-6 form-group">
+                <label>Sede</label>
+                <select class="select-search form-control" id="cboSedes">
+                </select>
+            </div>
+        </div>
+    </div>
+
+</form>
\ No newline at end of file

src/main/webapp/vistas/newjsp.jsp

-<form>
-	ttulo:<br>
-	<input id="input1" type="text" name="input1"><br>
-	cuerpo:<br>
-	<input id="input2" type="text" name="input2">
-</form>
-<button id="boton" type="button">filtrar</button>