2.1 <jmoordbjsf:ccstimeline>
Last updated
Was this helpful?
Last updated
Was this helpful?
Para Desarrollador:
Cuando agrega un nuevo color a csstimeline.css en el proyecto jmoordbjsf
debe agregarlo a la clase CSSTimeLine.java en el proyecto jmoordbutils.
Se usa para los css de los componentes timeline
Ampliado
En este caso usamos un mismo Controller para gestionar varios timeline y para evitar la sobrecarga de operaciones en el init(), se crean metodos que seran invocados desde un menu mediante un commandLink que hace referencia al metodo respectivo.
Se definen de tipo RequestScope para evitar que se pierdan los valores al ejecutar el metodo y hacer el salto a la pagina.
<b:navCommandLink value="#{msg['menu.timelinevehiculo']}" rendered="#{p:ifGranted('SECRETARIO ADMINISTRATIVO')}" action="#{timeLineController.loadTimeLineVehiculo()}" iconAwesome= "fa-list" />
<b:navCommandLink value="#{msg['menu.timelineconductor']}" rendered="#{p:ifGranted('SECRETARIO ADMINISTRATIVO')}" action="#{timeLineController.loadTimeLineConductor()}" iconAwesome= "fa-list" />
En el controller usara el estado para indicar el color de los componentes que estan definidos en el css.
String availability = (vi.getRealizado().equals("si") ? "Realizado" : (vi.getRealizado().equals("no") ? "NoRealizado" : "Cancelado"));
TimelineEvent event = new TimelineEvent(availability, vi.getFechahorainicioreserva(), vi.getFechahorafinreserva(), true, c.getNombre() + " " + c.getCedula(), availability.toLowerCase());
timelineConductorModel.add(event);
Podemos usar los colores directamente para indicar como deseamos que sea el dibujo.
Podemos indicar por nombre de colores mediante la clase CSSTimeLine y el atributo de color respectivo por ejemplo:
String color =CSSTimeLine.verde;
Lista completa de los colores disponibles.
static String[] colorDisponibles = {
"rojo", "verde", "azul", "celeste",
"naranja", "amarillo", "chocolate",
"morado", "unavailable","available",
"verdeamarillo", "maybe", "norealizado",
"realizado", "aprobado",
"cancelado", "anulado", "solicitado", "rechazado"};
También puede identificarlos usando el autocompletado del IDE.
Agregamos
<jmoordbjsf:csstimeline/>
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<ui:composition template="/layout/template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:b="http://bootsfaces.net/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:jmoordbjsf="http://jmoordbjsf.com/taglib"
xmlns:e="http://xmlns.jcp.org/jsf/composite/extensions">
<ui:define name="content">
<style>
.thumbnail { max-width: 100%; }
img.thumbnail:hover, img.thumbnail:focus {
border: 1px solid;
border-color: #428BCA;
}
</style>
<jmoordbjsf:csstimeline/>
<b:form id="form" prependId="false" rendered="#{p:ifGranted('SECRETARIO ADMINISTRATIVO')}" onkeypress="if (event.keyCode == 13) {
return false;
}">
<b:growl id="msgs"/>
<b:panel collapsible="false" title="#{msg['titlelist.timelinevehiculo']}" id="content" look="primary" >
<!--<b:panelGrid colSpans="2,10" size="xs">-->
<p:timeline id="timeline" value="#{timeLineController.timelineModel}"
editable="true" eventMargin="10" eventMarginAxis="0"
start="#{timeLineController.fechaDesde}"
end="#{timeLineController.fechaHasta}"
showNavigation="true" showButtonNew="true"
axisOnTop="true" stackEvents="false"/>
</b:panel>
</b:form>
<jmoordbjsf:denegado renderedcondition="#{!p:ifGranted('SECRETARIO ADMINISTRATIVO')}"/>
</ui:define>
</ui:composition>
/*
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/
package com.avbravo.transporte.controller;
// <editor-fold defaultstate="collapsed" desc="imports">
import com.avbravo.jmoordb.interfaces.IError;
import com.avbravo.jmoordb.mongodb.history.services.ErrorInfoServices;
import com.avbravo.jmoordbutils.DateUtil;
import com.avbravo.jmoordbutils.jmoordbjsf.CSSTimeLine;
import com.avbravo.transporteejb.entity.Conductor;
import com.avbravo.transporteejb.entity.Estatus;
import com.avbravo.transporteejb.entity.Solicitud;
import com.avbravo.transporteejb.entity.Usuario;
import com.avbravo.transporteejb.entity.Vehiculo;
import com.avbravo.transporteejb.entity.Viaje;
import com.avbravo.transporteejb.repository.ConductorRepository;
import com.avbravo.transporteejb.repository.EstatusRepository;
import com.avbravo.transporteejb.repository.SolicitudRepository;
import com.avbravo.transporteejb.repository.UsuarioRepository;
import com.avbravo.transporteejb.repository.VehiculoRepository;
import com.avbravo.transporteejb.repository.ViajeRepository;
import java.io.Serializable;
import java.util.Date;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.enterprise.context.RequestScoped;
import javax.inject.Inject;
import javax.inject.Named;
import lombok.Getter;
import lombok.Setter;
import org.bson.Document;
import org.primefaces.model.timeline.TimelineEvent;
import org.primefaces.model.timeline.TimelineModel;
// </editor-fold>
/**
*
* @authoravbravo
*/
@Named
@RequestScoped
@Getter
@Setter
public class TimeLineController implements Serializable, IError {
// <editor-fold defaultstate="collapsed" desc="fields">
private TimelineModel timelineModel;
private TimelineModel timelineConductorModel;
private TimelineModel timelineSolicitudModel;
private TimelineModel timelineUsuarioModel;
private Date fechaDesde;
private Date fechaHasta;
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="repository">
@Inject
ConductorRepository conductorRepository;
@Inject
EstatusRepository estatusRepository;
@Inject
SolicitudRepository solicitudRepository;
@Inject
UsuarioRepository usuarioRepository;
@Inject
VehiculoRepository vehiculoRepository;
@Inject
ViajeRepository viajeRepository;
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="services">
@Inject
ErrorInfoServices errorServices;
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="init">
@PostConstruct
public void init() {
try {
// loadTimeLineVehiculo();
// timelineModel.toString();
// timelineConductorModel.toString();
} catch (Exception e) {
errorServices.errorMessage(nameOfClass(), nameOfMethod(), e.getLocalizedMessage());
}
}// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="String loadTimeLineVehiculo()">
public String loadTimeLineVehiculo() {
try {
timelineModel = new TimelineModel();
fechaDesde = DateUtil.dateFirtsOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
fechaHasta = DateUtil.dateLastOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
//
// groups
List<Vehiculo> list = vehiculoRepository.findBy(new Document("activo", "si"));
if (list == null || list.isEmpty()) {
} else {
for (Vehiculo v : list) {
Document doc = new Document("activo", "si").append("vehiculo.idvehiculo", v.getIdvehiculo());
List<Viaje> viajeList = viajeRepository.findBy(doc, new Document("idviaje", -1));
if (viajeList == null || viajeList.isEmpty()) {
} else {
String color =CSSTimeLine.verde;
String availability="No Realizado";
for (Viaje vi : viajeList) {
// String availability = (vi.getRealizado().equals("si") ? "Realizado" : (vi.getRealizado().equals("no") ? "NoRealizado" : "Cancelado"));
switch(vi.getRealizado()){
case "si":
availability="Realizado";
color =CSSTimeLine.verde;
break;
case "no":
availability="No Realizado";
color =CSSTimeLine.celeste;
break;
case "ca":
availability="Cancelado";
color =CSSTimeLine.rojo;
break;
}
TimelineEvent event = new TimelineEvent(availability, vi.getFechahorainicioreserva(), vi.getFechahorafinreserva(), true, v.getMarca() + " " + v.getPlaca(), color.toLowerCase());
timelineModel.add(event);
}
}
}
}
} catch (Exception e) {
errorServices.errorMessage(nameOfClass(), nameOfMethod(), e.getLocalizedMessage());
}
return "/pages/timeline/timelinevehiculo.xhtml";
}
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="loadTimeLineConductor()">
public String loadTimeLineConductor() {
try {
timelineConductorModel = new TimelineModel();
fechaDesde = DateUtil.dateFirtsOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
fechaHasta = DateUtil.dateLastOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
// groups
List<Conductor> list = conductorRepository.findBy(new Document("activo", "si"));
if (list == null || list.isEmpty()) {
} else {
for (Conductor c : list) {
Document doc = new Document("activo", "si").append("conductor.idconductor", c.getIdconductor());
List<Viaje> viajeList = viajeRepository.findBy(doc, new Document("idviaje", -1));
if (viajeList == null || viajeList.isEmpty()) {
} else {
String color =CSSTimeLine.verde;
String availability="No Realizado";
for (Viaje vi : viajeList) {
switch(vi.getRealizado()){
case "si":
availability="Realizado";
color =CSSTimeLine.verde;
break;
case "no":
availability="No Realizado";
color =CSSTimeLine.celeste;
break;
case "ca":
availability="Cancelado";
color =CSSTimeLine.rojo;
break;
}
TimelineEvent event = new TimelineEvent(availability, vi.getFechahorainicioreserva(), vi.getFechahorafinreserva(), true, c.getNombre() + " " + c.getCedula(), color.toLowerCase());
timelineConductorModel.add(event);
}
}
}
}
} catch (Exception e) {
errorServices.errorMessage(nameOfClass(), nameOfMethod(), e.getLocalizedMessage());
}
return "/pages/timeline/timelineconductor.xhtml";
}
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="String loadTimeLineSolicitud()">
public String loadTimeLineSolicitud() {
try {
timelineSolicitudModel = new TimelineModel();
fechaDesde = DateUtil.dateFirtsOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
fechaHasta = DateUtil.dateLastOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
//
// groups
List<Estatus> list = estatusRepository.findBy(new Document("activo", "si"));
if (list == null || list.isEmpty()) {
} else {
for (Estatus e : list) {
Document doc = new Document("activo", "si").append("estatus.idestatus", e.getIdestatus());
List<Solicitud> solicitudList = solicitudRepository.findBy(doc, new Document("idsolicitud", -1));
if (solicitudList == null || solicitudList.isEmpty()) {
} else {
String color =CSSTimeLine.verde;
String availability="SOLICITADO";
for (Solicitud s : solicitudList) {
switch(s.getEstatus().getIdestatus()){
case "SOLICITADO":
availability="Solicitado";
color =CSSTimeLine.azul;
System.out.println("id= "+s.getIdsolicitud());
break;
case "APROBADO":
availability="Aprobado";
color =CSSTimeLine.verde;
break;
case "RECHAZADO":
availability="Rechazado";
color =CSSTimeLine.rojo;
break;
case "CANCELADO":
availability="Cancelado";
color =CSSTimeLine.naranja;
break;
}
TimelineEvent event = new TimelineEvent(availability, s.getFechahorapartida(), s.getFechahoraregreso(), true, s.getEstatus().getIdestatus(), color.toLowerCase());
timelineSolicitudModel.add(event);
}
}
}
}
} catch (Exception e) {
errorServices.errorMessage(nameOfClass(), nameOfMethod(), e.getLocalizedMessage());
}
return "/pages/timeline/timelinesolicitud.xhtml";
}
// </editor-fold>
// <editor-fold defaultstate="collapsed" desc="String loadTimeLineUsuarioSolicitud()">
/**
* Muestra el timelien por usuario
* @return
*/
public String loadTimeLineUsuarioSolicitud() {
try {
timelineUsuarioModel = new TimelineModel();
fechaDesde = DateUtil.dateFirtsOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
fechaHasta = DateUtil.dateLastOfMonth(DateUtil.anioActual(), DateUtil.mesActual());
//
// groups
List<Usuario> list = usuarioRepository.findBy(new Document("activo", "si"));
if (list == null || list.isEmpty()) {
} else {
for (Usuario u : list) {
Document doc = new Document("activo", "si").append("usuario.username", u.getUsername());
List<Solicitud> solicitudList = solicitudRepository.findBy(doc, new Document("idsolicitud", -1));
if (solicitudList == null || solicitudList.isEmpty()) {
} else {
String color =CSSTimeLine.verde;
String availability="SOLICITADO";
for (Solicitud s : solicitudList) {
switch(s.getEstatus().getIdestatus()){
case "SOLICITADO":
availability="Solicitado";
color =CSSTimeLine.azul;
System.out.println("id= "+s.getIdsolicitud());
break;
case "APROBADO":
availability="Aprobado";
color =CSSTimeLine.verde;
break;
case "RECHAZADO":
availability="Rechazado";
color =CSSTimeLine.rojo;
break;
case "CANCELADO":
availability="Cancelado";
color =CSSTimeLine.naranja;
break;
}
// TimelineEvent event = new TimelineEvent(availability, s.getFechahorapartida(), s.getFechahoraregreso(), true, s.getEstatus().getIdestatus(), color.toLowerCase());
TimelineEvent event = new TimelineEvent(availability, s.getFechahorapartida(), s.getFechahoraregreso(), true, u.getNombre(), color.toLowerCase());
timelineUsuarioModel.add(event);
}
}
}
}
} catch (Exception e) {
errorServices.errorMessage(nameOfClass(), nameOfMethod(), e.getLocalizedMessage());
}
return "/pages/timeline/timelineusuario.xhtml";
}
// </editor-fold>
}