filtrando por cargo en tolerancia masiva

src/main/webapp/js/general.js

@@ -36,7 +36,7 @@ const URI_TRABAJADORES = "trabajadores";
 const URI_ADMINISTRATIVOS_TOLERANCIA_INDIVIDUAL = "toleranciasIndividuales";
 const URI_ADMINISTRATIVOS_ESTADO_TOLERANCIA_INDIVIDUAL = "estadoTolerancias";
 const URI_ADMINISTRATIVOS_VACACIONES_INDIVIDUAL = "vacacionesAdministrativasIndividuales";
-const URI_CARGOS = "cargos";
+const URI_CARGOS = "cargoLaboral";
 //</editor-fold>
 
 

src/main/webapp/js/pages/tolerancia_masiva.js

@@ -2,11 +2,89 @@ const listarPersonal = (selectorName) => {
 	initSelect2(selectorName, baseURLRest + URI_TRABAJADORES, {title: "nombresapellidos", subtitle: "documentoidentidad"});
 };
 
-const listarCargos = (selectorName) => {
-	initSelect2(selectorName, baseURLRest + URI_CARGOS, {title: "descripcion", subtitle: "descripcion"});
+const listarCargos = () => {
+	$(`#cboCargoFiltro`).select2({
+		containerCssClass: 'select-xs',
+		ajax: {
+			url: baseURLRest + URI_CARGOS,
+			dataType: `json`,
+			delay: 1000,
+			data: function (params) {
+				return {
+					q: params.term, // search term
+					page: params.page
+				};
+			},
+			processResults: function (data, params) {
+				// parse the results into the format expected by Select2
+				// since we are using custom formatting functions we do not need to
+				// alter the remote JSON data, except to indicate that infinite
+				// scrolling can be used
+				params.page = params.page || 1;
+
+				return {
+					results: data,
+					pagination: {
+						more: (params.page * 30) < data.length
+					}
+				};
+			},
+			cache: true
+		},
+		placeholder: `Buscar`,
+		allowClear: true,
+		escapeMarkup: function (markup) {
+			return markup;
+		}, // let our custom formatter work
+		minimumInputLength: 1,
+		templateResult: formatRepo,
+		templateSelection: formatRepoSelection
+	});
+
+	function formatRepo(repo) {
+		if (repo.loading) {
+			return repo.text;
+		}
+
+		var markup = `
+			<div class='select2-result-repository clearfix'>
+				<div class='select2-result-repository__title'>${repo.nombre}</div>
+			</div>`;
+
+		return markup;
+	}
+
+	function formatRepoSelection(repo) {
+		if (repo.id) {
+			return repo.nombre;
+		} else {
+			return repo.text;
+		}
+	}
 };
 
-$(() => {
+const filtrarPersonalPorCargo = () => {
+	let cargo = $("#cboCargoFiltro").select2('data')[0];
+	let puestolaboral_id = cargo.id;
+
+	let params = {
+		puestolaboral_id
+	};
+
+
+	ajaxWebService.get(URI_TRABAJADORES, {params}).then((response) => {
+		debugger
+		let html = "";
+		let trabajadores = response.data;
+		html = trabajadores.map((trabajador) => `<option value="${trabajador.id}">${trabajador.apellidos} ${trabajador.nombres}</option>`);
+		$("#lista").append(html);
+		$("#lista").trigger('bootstrapDualListbox.refresh', true);
+		
+	});
+};
+
+
+const initDualListbox = (nodeIdentifier) => {
 	let options = {
 		moveOnSelect: false,
 		infoText: 'Mostrando todos {0}',
@@ -17,7 +95,12 @@ $(() => {
 		preserveSelectionOnMove: 'moved',
 		moveOnSelect: false
 	}
-	$('.listbox-no-selection').bootstrapDualListbox(options);
+	$(nodeIdentifier).bootstrapDualListbox(options);
+};
+
+$(() => {
+	initDualListbox("#lista");
 	listarPersonal("#cboPersonalFiltro");
 	listarCargos("#cboCargoFiltro");
+	$("#btnAplicarFiltro").click(filtrarPersonalPorCargo);
 });
\ No newline at end of file

src/main/webapp/vistas/toleranciaMasiva.jsp

@@ -52,8 +52,8 @@
 				<div class="panel-body">
 					<div class="row">
 						<div class="col-md-12 form-group">
-							<select multiple="multiple" class="form-control listbox-no-selection">
-								<option value="option1" selected="selected">Classical mechanics</option>
+							<select multiple="multiple" class="form-control" id="lista">
+<!--								<option value="option1" selected="selected">Classical mechanics</option>
 								<option value="option2">Electromagnetism</option>
 								<option value="option4">Relativity</option>
 								<option value="option5" selected="selected">Quantum mechanics</option>
@@ -70,7 +70,7 @@
 								<option value="option17">Scattering theory</option>
 								<option value="option18" selected="selected">Chaos theory</option>
 								<option value="option19" selected="selected">Newton's laws of motion</option>
-								<option value="option20">Thermodynamics</option>
+								<option value="option20">Thermodynamics</option>-->
 							</select>
 						</div>
 					</div>