dataTable zebrada

boa tarde... pessoal quero fazer com que meu data table faça uma verificação e adicione cores para as linhas que forem certas
tenho uma propriedada chamada status da ordem de serviço e tenho tres status fechado finalizado e em andamento como faço pra colocar uma cor diferente para cada valor da propriedade
este é meu jsf por enquanto esta zebrado.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui">

<h:head>
	<title>Pesquisar Ordem De Serviço</title>
</h:head>
<h:body>

	<h:form id="form">
	<div align="center">
	<p:panel header="Pesquisar Ordem De Serviço" style="width:1150px">
		<ui:include src="/Menu.xhtml"></ui:include>
		<h:messages layout="table" errorStyle="color: red"
			infoStyle="color: green" warnStyle="color: orange"
			fatalStyle="color: gray" showDetail="true" globalOnly="true" />
		<div align="center">
			<p:dataTable var="ordemDeServico"
				value="#{ordemDeServicoBean.listOrdemDeServico}"
				widgetVar="ordemDeServicoTable"
				emptyMessage="Nenhum Produto Encontrado Nessas Condições"
				rowStyleClass="#{empty rowIx or rowIx
 mod 2 ne 0 ? 'even-row' : 'odd-row'}"
				rowIndexVar="rowIx">

				<f:facet name="header">
					<p:outputPanel>
						<h:outputText value="Procurar em todos os campos:" />
						<p:inputText id="globalFilter"
							onkeyup="ordemDeServicoTable.filter()" style="width:150px" />
					</p:outputPanel>
				</f:facet>

				<p:column filterBy="#{ordemDeServico.idOrdemDeServico}"
					headerText="Id" footerText="Id" filterMatchMode="contains">
					<h:outputText value="#{ordemDeServico.idOrdemDeServico}" />
				</p:column>

				<p:column filterBy="#{ordemDeServico.dataAbertura}"
					headerText="Data De Abertura" footerText="Data De Abertura"
					filterMatchMode="contains">
					<h:outputText value="#{ordemDeServico.dataAbertura}" />
				</p:column>

				<p:column filterBy="#{ordemDeServico.pessoa.nome}" headerText="Nome"
					footerText="Nome" filterMatchMode="contains">
					<h:outputText value="#{ordemDeServico.pessoa.nome}" />
				</p:column>

				<p:column filterBy="#{ordemDeServico.status}" headerText="Status"
					footerText="Status" filterMatchMode="contains">
					<h:outputText value="#{ordemDeServico.status}" />
				</p:column>


				<p:column filterBy="#{ordemDeServico.dataFechamento}"
					headerText="Data De Fechamento" footerText="Data De Fechamento"
					filterMatchMode="contains">
					<h:outputText value="#{ordemDeServico.dataFechamento}" />
				</p:column>

				<p:column filterBy="#{ordemDeServico.valorTotal}"
					headerText="Valor Total" footerText="Valor Total"
					filterMatchMode="contains">
					<h:outputText value="#{ordemDeServico.valorTotal}" />
				</p:column>

				<p:column style="width:100px">
					<h:panelGrid columns="2" styleClass="actions" cellpadding="2">

						<h:commandButton image="imagens/icones/editar.gif" title="Editar" action="#{ordemDeServicoBean.antesUpdate}">
							<f:setPropertyActionListener
								value="#{ordemDeServico.idOrdemDeServico}"
								target="#{ordemDeServicoBean.ordemDeServico.idOrdemDeServico}" />
						</h:commandButton>
						
						<h:commandButton image="imagens/icones/ok.gif" title="Finalizar" action="#{ordemDeServicoBean.finalizarOrdemDeServico}">
							<f:setPropertyActionListener
								value="#{ordemDeServico.idOrdemDeServico}"
								target="#{ordemDeServicoBean.ordemDeServico.idOrdemDeServico}" />
						</h:commandButton>
					</h:panelGrid>
				</p:column>
			</p:dataTable>
		</div>

		<style>
.ui-datatable .ui-datatable-data .even-row td {
	background-color: #fcefa1;
	border-right: solid 0px #4e6769;
}

.ui-datatable .ui-datatable-data .odd-row td {
	background-color: #f7f7f7;
	border-right: solid 0px #4e6769;
}
</style>

</p:panel>
</div>
	</h:form>
</h:body>
</html>
2 Respostas

Topicos relacionados
