Mostrar mensajes basados ​​en la gravedad en dos p: growl

Question

Estoy usando PrimeFaces p: growl.

<p:growl id="msgsInfo" 
     rendered="true" 
     showDetail="true" /> 
<p:growl id="msgsError" 
     globalOnly="true" 
     showDetail="true" 
     sticky="true" /> 

necesito mostrar en el primer gruñido sólo Info mensajes, mientras que en la segunda necesito mostrar Error mensajes. Usando globalOnly cuando agrego un mensaje de error esto se muestra 2 veces.

¿Alguna idea?

Answer 1

Se sería teóricamente posible si se apoya infoClass, errorClass, etc atributos similares como h:messages. A continuación, puede especificar una clase CSS que haga un display: none.

Pero el p:growl no admite esos atributos. En el nivel de gravedad, todo lo que puedes hacer es cambiar el ícono por infoIcon, errorIcon, etc. Así que estás bastante perdido aquí.

Puede valer la pena un feature request.

Tenga en cuenta que el globalOnly="true" solo muestra mensajes que tienen un ID de cliente null, independientemente de su gravedad.

Answer 2

favor ver mi respuesta

PrimeFaces growl change color dynamically (Multiple messages)

también se puede encontrar el código fuente del proyecto que produce la siguiente página:

Answer 3

que estaba buscando la misma funcionalidad (para configurar el gruñido a partir de una severidad de mensaje específica). PrimeFaces (6.1) no ofrece esta funcionalidad, pero es bastante fácil hackear el growl JavaScript. Más específicamente, en la función bindEvents se fijan si sticky se configuró y sobre esa base:

//hide the message after given time if not sticky 
if(!sticky) { 
    this.setRemovalTimeout(message); 
} 

Por lo tanto, se podría crear prototipos de la función bindEvents (anular) y ajuste sticky en base a la gravedad del mensaje.

PrimeFaces.widget.Growl.prototype.bindEvents = function(message) { 
    var _self = this, 
    sticky = this.cfg.sticky; 

    // Start hack 
    if (!sticky) { 
     // Your rule 
    } 
    ... 

También puede crear prototipos renderMessage y añadir la gravedad como un parámetro para bindEvents. Elegí usar un truco rápido y leerlo en el className.

He añadido estas funciones de utilidad:

var SEVERITIES = [ "info", "warn", "error", "fatal" ]; 

function getSeverity(domNode) { 
    // HACK Severity can be found in the className after the last - character. 
    var severity = domNode.className; 
    return severity.substring(severity.lastIndexOf("-") + 1); 
} 

function getSeverityIndex(severityString) { 
    return SEVERITIES.indexOf(severityString); 
} 

Ahora se puede utilizar la siguiente comprobación:

if (!sticky) { 
    sticky = getSeverityIndex(getSeverity(message[0])) >= getSeverityIndex("error"); 
} 

que podría crear una solicitud de extracción en GitHub donde se puede establecer la gravedad mínima para pegar masajes usando el atributo stickSeverity en el componente p:growl.

Aquí está el hack completo de JavaScript (PrimeFaces 6.1):

var SEVERITIES = [ "info", "warn", "error", "fatal" ]; 

function getSeverity(domNode) { 
    // HACK Severity can be found in the className after the last - character. 
    var severity = domNode.className; 
    return severity.substring(severity.lastIndexOf("-") + 1); 
} 

function getSeverityIndex(severityString) { 
    return SEVERITIES.indexOf(severityString); 
} 

PrimeFaces.widget.Growl.prototype.bindEvents = function(message) { 
    var _self = this, 
    sticky = this.cfg.sticky; 

    // Start customization 
    if (!sticky) { 
     sticky = getSeverityIndex(getSeverity(message[0])) >= getSeverityIndex("error"); 
    } 
    // End customization 

    message.mouseover(function() { 
     var msg = $(this); 

     //visuals 
     if(!msg.is(':animated')) { 
      msg.find('div.ui-growl-icon-close:first').show(); 
     } 
    }) 
    .mouseout(function() { 
     //visuals 
     $(this).find('div.ui-growl-icon-close:first').hide(); 
    }); 

    //remove message on click of close icon 
    message.find('div.ui-growl-icon-close').click(function() { 
     _self.removeMessage(message); 

     //clear timeout if removed manually 
     if(!sticky) { 
      clearTimeout(message.data('timeout')); 
     } 
    }); 

    //hide the message after given time if not sticky 
    if(!sticky) { 
     this.setRemovalTimeout(message); 
    } 
}