Conhecendo o Richfaces

O Framework Ajax para JSF

Richfaces um biblioteca de aplicaes ricas para web desen!ol!ida em Ja!a"
!oltada para atender a #rande demanda e necessidade existente dentro do mercado
Ja!aSer!er Faces$
ALVES JNIOR, PAULO
Em meados de 2005 a web passava por um grade !mpu"so, #ada ve$ ma!s serv!%os eram
d!spo!b!"!$ados pe"a !&ere&' O desevo"v!me&o para web es&ava bas&a&e evo"u(do, por)m a!da
e*!s&!a uma grade #ar+#!a em re"a%,o a des!g e usab!"!dade dos s!&es-s!s&emas' Nesse per(odo
.ouve e&,o o surg!me&o da /E02'0, 1ue &ra$!a a !d)!a de serv!%os e ap"!#a%2es sobre uma mesma
p"a&a3orma, a /E0'
A par&!r da e#ess!dade 1ue e*!s&!a de&ro do mer#ado web de se &er 4UI5s ma!s d!6m!#as e
!&era&!vas, .ouve e&,o um grade 7mero de pessoas e empresas desevo"vedo 3ramewor8s para
3a#!"!&ar e au&oma&!$ar o &raba".o #om esse ovo #o#e!&o' A"e*ader Sm!rov deu !(#!o a um
pro9e&o #.amado A9a*:JS; e "ogo depo!s ou&ro pro9e&o !&egrado #om o A:J deom!ado R!#.3a#es'
No mesmo per(odo em 1ue surg!a a /E0 2'0, ode a #omb!a%,o de Re1u!s!%2es Ass(#roas #om
JavaS#r!p&, a "eve$a e o des!g dado pe"o <SS e as mar#a%2es =>?L se e*pad!am e perm!&!am a
#r!a%,o de !&er3a#es r!#as e d!6m!#as a web, A"e*ader Sm!rov "a%ava e&,o o R!#.3a#es' Logo
depo!s, 3e$ par#er!a #om a E*ade", e 9u&os #o&!uaram o !ves&!me&o e desevo"v!me&o do
mesmo' <om esse pro9e&o, desevo"v!do espe#!a"me&e para JS;, as ap"!#a%2es JS; poder!am e&,o
usu3ru!r de ovos re#ursos &e#o"@g!#os, #omo A9a* de 3orma 3A#!" e rAp!da e !&er3a#es r!#as e
d!6m!#as'
O funcionamento do framework
O R!#.3a#es ) um dos pou#os 3ramewor8s 1ue desde seu !(#!o o mer#ado 9A &raba".ava
#omp"e&ame&e #om &odo o 3"u*o de re1u!s!%2es do JS;' Por ser 3e!&o para respe!&ar o #!#"o de v!da
do JS; e"e #osegu!u uma !&egra%,o #omp"e&a e 1ue passava por &odas as 3ases do JS;'
A&rav)s de uma &ag"!b de #ompoe&es, r!#.3a#es dA a #apa#!dade de re1u!s!%2es AJAB a pAg!as
9A e*!s&e&es, sem a e#ess!dade de se es#rever uma "!.a em 9avas#r!p&' Ass!m, vo#+ poderA de3!!r
o eve&o da pAg!a 1ue !vo#arA a re1u!s!%,o A9a* e 1ue Areas da pAg!a dever,o ser s!#ro!$adas
#om a Arvore de #ompoe&es JS; depo!s 1ue a re1u!s!%,o A9a* re&orar os dados do serv!dor' A
Figura 1 !"us&ra esse 3"u*o'
Tags de referncia
Ce&ro da &ag"!b do R!#.3a#es, podemos des&a#ar a"gumas &ags 1ue s,o esse#!a!s para se &er uma
pAg!a rea"me&e d!6m!#a e a&rae&e' Essas &ags ser,o usadas em D5E de ossas pAg!as A9a*'
Dica: A grande maioria das tags Richfaces possuem os mesmo atributos e eventos para serem utilizado, os mais
comuns so (reRender, oncomplete, eventsQueue, status, dentre outros..). us!ue conhecer o funcionamento desses
atributos comuns para facilitar us"#los no futuro.
Ve9amos aba!*o a &abe"a #om as pr!#!pa!s &agsF
Principais TAGS Richfaces
<a4j:form /> <r!a um 3orm =>?L para ev!ar e re#eber as re1u!s!%2es de 3orma
ass(#roa' Aba!*o os pr!#!pa!s a&r!bu&os da &ag'
G-G2
!d <String> H uma boa prA&!#a sempre a&r!bu!r um !d
para os #ompoe&es JS;-R!#.3a#es
a9a*Subm!& <true/false> =ab!"!&a ou ,o a subm!ss,o do 3orm
em A9a*' O orma" para uma pAg!a d!6m!#a )
ma&er esse a&r!bu&o .ab!"!&ado true'
reReder <String> Esse a&r!bu&o es&A prese&e em D0E dos
#ompoe&es R!#.3a#es' E"e ) usado para 1ue ap@s
o re&oro de uma re1u!s!%,o A9a*, o #ompoe&e
de id !3ormado esse #ampo se9a reIreder!$ado e
seus va"ores a&ua"!$ados'
o#omp"e&e JStringK Uma 3u%,o JS 1ue serA #.amada 1uado
o re1u!s!%,o A9a* 3or 3!a"!$ada' Nesse m)&odo
vo#+ re#ebe #omo par6me&ro uma var!Ave" 1ue
#o&em a respos&a da re1u!s!%,o, de ode )
poss(ve" ob&er o #@d!go de re&oro da re1u!s!%,o,
!3ormado se a re1u!s!%,o 3o! 3e!&a #om su#esso
ou ouve 3a".ar o pro#esso'
<a4j:commandBuon /> Essa &ag gera um bo&,o .&m" 1ue pode d!sparar eve&os AJAB e
rea"!$ar &are3as d!re&o o serv!dor'
a#&!o <String> I3orma 1ua" o m)&odo do 0a#8!g0ea
serA #.amado para e*e#u&ar a a%,o, ou a!da pode
ser !3ormado uma s&r!g mapeada o 3a#esI
#o3!g'*m"'
eve&sLueue <String> <r!a uma 3!"a de re1u!s!%2es ass(#roas'
Ev!&a 1ue se9am rea"!$adas vAr!as re1u!s!%2es ao
mesmo &empo e #ose1ue&eme&e sobre#arregue
o serv!dor' Esse a&r!bu&o e*!ge um ome de um
#ompoe&e do &!po Ja:9F1ueue -K
s&a&us <String> A&ua"!$a o s&a&us da re1u!s!%,o A9a*
sempre 1ue .ouver muda%a de 3orma d!6m!#a'
E*emp"oF M<arregado, ;!a"!$adoN' <om esse
#ompoe&e podemos #o"o#ar uma !magem
a!mada para !3ormar ao usuAr!o 1ue uma
re1u!s!%,o es&A em adame&o a pAg!a'
!mage <String> O #am!.o da !magem' ?esmo es&!"o de
uma !magem .&m" orma"'
<a4j:saus /> Esse #ompoe&e ) mu!&o s!mp"es por)m dA um OarP d!3ere&e a
pAg!a' I3ormado ao usuAr!o 1ue es&A sedo rea"!$ada re1u!s!%2es
A9a*, o usuAr!o &em a sesa%,o de #arregame&o rAp!do e sabe 1uado
suas re1u!s!%2es 3oram 3!a"!$adas'
s&ar&>e*& <String> >e*&o 1ue serA e*!b!do ao se !!#!ar uma
re1u!s!%,o' E*emp"oF Carregando...
s&op>e*& <String> >e*&o 1ue serA e*!b!do a 3!a"!$a%,o da
re1u!s!%,o' E*emp"oF Sucesso...
<a4j:jsfFuncion /> S!mu"a a #r!a%,o de uma 3u%,o JavaS#r!p&' Umas das &ags ma!s "ega!s
do R!#.3a#es, po!s ) uma 3u%,o JS 1ue e*e#u&a A9a*, e pode ser
!vo#ada por ou&ras 3u%2es JavaS#r!p& de&ro da pAg!a'
2-G2
ame <String> O a&r!bu&o name dessa &ag ) usado #omo
o ome da 3u%,o 9s a ser #.amada' Se o name 3or
Q#a"#u"aJuros5 a 3u%,o serA #.amada
calculaJuros();
a#&!o <String> A mesma !d)!a de a#&!o do
commandButton' Pode rea"!$ar a #.amada a um
m)&odo do bea'
a9a*S!g"e <true/false> Essa &ag poss!b!"!&a a "!m!&a%,o do
pro#essame&o da Arvore de #ompoe&es JS;
Mde#od!g, #oversas!o-va"!da&!o, va"ue
app"R!gN apeas ao #ompoe&e 1ue es&A
ev!ado a re1u!s!%,o'
Fi#ura %. Fluxo de requisio do Richfaces para eventos disparados pelo cliente
S-G2
Principais Recursos do Richfaces
Os re#ursos do R!#.3a#es v+m evo"u!do desde a sua pr!me!ra vers,o, e agora es&A em um a"&o
(ve" de so"u%,o &)#!#a, 3a#!"!dade de u&!"!$a%,o e !&er3a#e /E02'0' Isso dA a ossas ap"!#a%2es
uma #ara#&er(s&!#a e*&remame&e pro3!ss!oa" por ma!s s!mp"es 1ue e"a se9a' Vamos apreder #omo
u&!"!$ar os pr!#!pa!s #ompoe&es, 1ue &oram ossa ap"!#a%,o bo!&a e "eve G00E A9a*'
Vamos #r!ar um dropIdow meu e #o.e#er a u&!"!$a%,o dos meus R!#.3a#es' Ve9a a !isagem
1, o #@d!go 1ue gera um meu .or!$o&a" 1ue des"!$a para ba!*o #om o passar do mouse' Per#eba
&amb)m 1ue e*!s&e a !isagem 1 um <a4j:form />, po!s e"e ) e#essAr!o para 1ue o meu 3u#!oe
#orre&ame&e'
Ao #"!#ar o meu, vo#+ serA d!re#!oado para a pAg!a 1ue es&A sedo mapeada pe"o a&r!bu&o
action da &ag <rich:menutem />' Vo#+ pre#!sa mapear &odas as S&r!gs Mactions) o ar1u!vo 3a#esI
#o3!g'*m" para !r a uma pAg!a vA"!da' Ve9a a !isagem " um e*emp"o de mapeame&o para o
meu ode a &ag from!"ie#!id d!$ 1ue a re1u!s!%,o pode ser de 1ua"1uer par&e da ap"!#a%,o e
depededo da s&r!g 1ue re#eba, d!re#!oarA a ap"!#a%,o para a pAg!a re3ere&e'
H poss(ve" persoa"!$ar as !mages do meu, a&rav)s do a&r!bu&o !#o, 1ua"1uer (#oe pode ser
!ser!do o meu' Ve9a um e*emp"o do meu #r!ado a Figura "'
O meu R!#.3a#es &amb)m a#e!&a re#eber dados d!re&o do bea, sedo mo&ado de 3orma
d!6m!#a, para !sso, bas&a 3a$er um b!d!g #om o #ompoe&e <rich:toolBar /> #om &oda a
es&ru&ura e o mesmo serA mo&ado a sua pAg!a JS;'
Dica: A grande maioria dos componentes Richfaces e$igem um form (h:form ou a%&:form) para a correta e$ecu'o.
Listagem 1. Criao de um menu Drop-Down com Richfaces
<a4j:form ajaxSubmit="true" id="menuForm">
<rich:toolBar>
<rich:dropDownMenu>
<f:facet name="label">
<h:panelGroup>
<h:graphicmage !alue="../imagens/copy.gif" ">
<h:output#ext !alue="Cadastro"">
<"h:panelGroup>
<"f:facet>
<rich:menutem $ubmitMode="ajax" !alue="Produtos"
action="cadastroProduto" icon="../imagens/open.gif" ">
<rich:menutem $ubmitMode="ajax" !alue="Fornecedores"
action="cadastroFornecedor" icon="../imagens/open.gif" ">
<"rich:dropDownMenu>
<"rich:toolBar>
<"a4j:form>
Listagem 2. Exemplo de mapeamento do faces-config.xml para o menu
<na!igation%rule>
<from%!iew%id>"&<"from%!iew%id>
<na!igation%ca$e>
<from%outcome>cada$tro'roduto<"from%outcome>
<to%!iew%id>"page$"produto$(xhtml<"to%!iew%id>
<redirect ">
<"na!igation%ca$e>
<na!igation%ca$e>
<from%outcome>regi$trar)enda<"from%outcome>
<to%!iew%id>"page$"!enda$(xhtml<"to%!iew%id>
<redirect ">
:-G2
<"na!igation%ca$e>
<"na!igation%rule>
Fi#ura &. Menu Drop-Down do Richfaces
Ou&ro #ompoe&e 1ue u&!"!$aremos as ossas ap"!#a%2es JS; ) o <rich:data$a%le />' Uma &abe"a
A9a* #omp"e&a de re#ursos para e*e#u&ar !7meras 3u%2es, #omo por e*emp"o, ordea%,o de
#o"uas, 3!"&ragem de dados ao d!g!&ar, #arregame&o d!6m!#o #om s#ro"", pag!a%,o e vAr!os ou&ros
re#ursos, &udo !sso sem e.um re3res. de pAg!a' A !isagem # mos&ra um e*emp"o de #@d!go da
<rich:data$a%le /> #om pag!a%,o e ordea%,o de dados em a"gumas #o"uas' Podemos ver a
&abe"a a Figura #'
Listagem 3. Criao de uma tabela dinmica com paginao e ordenao dinmica
<rich:data#able id="listagemProdutos" !alue="#{produtosBean.produtos}" !ar="ro"
$t*le+la$$="tabela!ados" row$=""#"
on,owMou$e-ut="t$is.class%ame&'tabela!ados(in$a"'"
on,owMou$e-!er="t$is.class%ame&'tabela!ados(in$a)o*er'+
t$is.style.cursor&'pointer'">
<rich:column $ortB*="#{ro.nome}">
<f:facet name="$eader">.ome<"f:facet>
<h:output#ext !alue="#{ro.nome}" ">
<"rich:column>
<rich:column $ortB*="#{ro.descricao}">
<f:facet name="$eader">De$cricao<"f:facet>
<h:output#ext !alue="#{ro.descricao}" ">
<"rich:column>
<rich:column $ortB*="#{ro.,uantidade}">
<f:facet name="$eader">/uantidade<"f:facet>
<h:output#ext !alue="#{ro.,uantidade}" ">
<"rich:column>
<rich:column>
<f:facet name="$eader">)alor de +ompra<"f:facet>
<h:output#ext !alue="#{ro.*alorCompra}"><f:con!ert.umber
pattern="###-###-###.##" "> <"h:output#ext>
<"rich:column>
<rich:column>
<f:facet name="$eader">Data da +ompra<"f:facet>
<h:output#ext !alue="#{ro.dataCompra}"><f:con!ertDate#ime
pattern="dd/../yyyy" "> <"h:output#ext>
<"rich:column>
<f:facet name="footer">
<rich:data$croller id="ds"><"rich:data$croller>
<"f:facet>
<"rich:data#able>
5-G2
Fi#ura '. Tabela do Richfaces com ordenao de campos e painao
Um &er#e!ro e*emp"o 1ue gos&ar!a de demos&rar ) o uso das abas' Abas s,o mu!&o u&!"!$adas as
ap"!#a%2es .o9e e ) #omum &er abas para separar 3ormu"Ar!os e e&#' Ve9a a !isagem 4 o #@d!go 1ue
gerar as abas' H poss(ve" a!da &er o #arregame&o das abas #omp"e&ame&e o #"!e&e, mod!3!#ado
para !sso apeas o a&r!bu&o s#itch$&'e()client)' Ve9a um e*emp"o das abas a Figura 4$
Listagem 4. Criao das abas que so carregadas por !ax
<rich:tab'anel $witch#*pe="ajax">
<rich:tab label="Parte "">
'rimeira aba com carregamento 0jax
<"rich:tab>
<rich:tab label="Parte /">
Segunda aba com carregamento 0jax
<"rich:tab>
<rich:tab label="Parte 0">
#erceira aba com carregamento 0jax
<"rich:tab>
<"rich:tab'anel>
Fi#ura (. !bas que so carreadas de forma din"mica com !#ax
O #ompoe&e 1ue #.ama bas&a&e a&e%,o 1uado ) u&!"!$ado em ossas ap"!#a%2es ) o
?oda"Pae"' >er a poss!b!"!dade de s!mu"ar uma &e"a moda" M#o#e!&o des8&opN em uma ap"!#a%,o
web &ra$ um OmarP de poss!b!"!dades aos s!s&emas' A d!3!#u"dade de #r!ar &a" es&ru&ura ) a mesma
1ue &!vemos os #ompoe&es a&er!ores, #omo mos&ra a !isagem %'
Dica: (oc) pode aninhar in*meros +odal,anel.-ssa funcionalidade . interessante !uando temos telas de confirma'o
de dados dentre outros. +as cuidado para sua aplica'o no abusar do uso de modals, chega um momento em !ue o
usu"rio no suporta mais telas /saltando0 o monitor.
Vo#+ pode ver um e*emp"o do ?oda"Pae" em 3u#!oame&o a Figura %'
Listagem 5. "ontagem de um "odal#anel com seus controles
<rich:modal'anel id="modalForm" $hadow-pacit*="true" re$i1eable="true"
width="1##" height="1##" $how2hen,endered="#{produtosBean.s$o.odal}">
<f:facet name="$eader">
<h:output#ext !alue="#{msgs2'produtoForm.titulo'3}" ">
T-G2
<"f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicmage !alue="4{basePat$}imagens/fec$ar.jpg"
$t*le="cursor5pointer" id="$idelin6/" onclic3=4cancelModal5674 ">
<rich:component+ontrol for="modalForm" attach#o="$idelin6/"
operation="$ide" e!ent="onclic6" ">
<"h:panelGroup>
<"f:facet>
<h:form id="produtosForm">
<a4j:j$8unction name="cancel.odal"
action="#{produtosBean.cancelar.odal}" immediate="true" ajaxSingle="true"
re,ender="modalForm" ">
<rich:me$$age$ $howSummar*="true" $t*le+la$$="*alidation7rror"
><"rich:me$$age$>
<table><tr>
<td cla$$="label">9:m$g$;<produto(nome<=>:<"td>
<td><h:input#ext !alue="#{produtosBean.produto.nome}"
id="nomeProduto" re?uired="true" label="#{msgs2'produto.nome'3}" "><"td>
<"tr>
<tr>
<td cla$$="label">9:m$g$;<produto(de$cricao<=>:<"td>
<td>
<h:input#extarea
!alue="#{produtosBean.produto.descricao}" id="descricao" re?uired="true"
label="#{msgs2'produto.descricao'3}" "><"td>
<"tr>
<@%% 'odem $em incluido$ mai$ campo$ %%>
<"table>
<"h:form>
<"rich:modal'anel>
Fi#ura ). $m Modal%anel constru&do em !#ax
U-G2
E 3!a"!$ado a demos&ra%,o de #ompoe&es, 1uero mos&rar um #ompoe&e 1ue a 3orma de
u&!"!$a%,o ) um pou#o d!s&!&a dos dema!s por ser ma!s #omp"e*o, mas os resu"&ados ob&!dos #om
e"e s,o 3a&As&!#os, o A9a*Up"oad'
Um po&o re"eva&e a d!$er, ) a e#ess!dade de !ser!r o a&r!bu&o enct*pe="multipart/form8
data" o 3orm do A9a*Up"oad, !3ormado dessa 3orma 1ue esse 3orm ev!a dados b!Ar!os e ,o
apeas s&r!g a re1u!s!%,o' Ve9a a "!s&agem !isagem & #omo se de#"ara o A9a*Up"oad a JSP e a
!isagem ' o ba#8!g bea re"a#!oado a JSP' A !isagem (, mos&ra a #o3!gura%,o 1ue se 3a$
e#essAr!o o web'*m" para 1ue o A9a*Up"oad 3u#!oe #orre&ame&e, per#eba 1ue s,o va"ores de
!!#!a"!$a%,o para o 3!"&ro do A9a*:Js3' E a Figura & a &e"a 1uado o up"oad es&A o#orredo e "ogo
depo!s a "!s&agem do ar1u!vo'
Listagem 6. Criao do componente !ax$pload na %&#
<h:form enct*pe="multipart/form8data">
<rich:fileApload fileAploadBi$tener="#{file9ploadBean.upload(istener}"
max8ile$/uantit*="1" id="upload" immediateApload="false"
allow8la$h="false"><"rich:fileApload>
<"h:form>
Listagem . Criao das abas que so carregadas por !ax
public class 8ileAploadBean :
public void li$tener5AploadC!ent e!ent6 throws Cxception:
Aploadtem item = e!ent(getAploadtem567
B*te0rra*-utputStream b = new B*te0rra*-utputStream567
b(write5item(getData5667
8ile file = new 8ile54D:""4 D item(get8ile.ame5667
b(write#o5new 8ile-utputStream5file667
>
>
Listagem !. Configurao adicional para funcionamento do !ax$pload
<filter>
<di$pla*%name>0jax4j$f 8ilter<"di$pla*%name>
<filter%name>ajax4j$f<"filter%name>
<filter%cla$$>org(ajax4j$f(8ilter<"filter%cla$$>
<init%param>
<param%name>create#emp8ile$<"param%name>
<param%!alue>fal$e<"param%!alue>
<"init%param>
<init%param>
<param%name>max,e?ue$tSi1e<"param%name>
<param%!alue>EFFFFFFF<"param%!alue>
<@%% - !alor acima em GbH define o tamanho mIximo do upload %%>
<"init%param>
<init%param>
<param%name>forcepar$er<"param%name>
<param%!alue>fal$e<"param%!alue>
<"init%param>
<"filter>
V-G2
Fi#ura *. $m Modal%anel constru&do em !#ax
Richfaces na pr"tica
Vamos e&,o demos&rar a prA&!#a os re#ursos do R!#.3a#es em um pe1ueo pro9e&o #om do!s
#asos de uso s!mp"es' O s!s&ema serA um #o&ro"e de vedas para um "o9a' Os #asos de uso es&,o
de3!!dos #omo, Cadastrar *roduto, ser!a a s!mu"a%,o de um <RUC A9a*, e +egistrar ,enda, 1ue )
um #aso de uso de #o&ro"e do s!s&ema' Segue aba!*o uma espe#!3!#a%,o s!mp"es de #ada #aso de
uso'
Detalhamento do Caso de Uso Manter Produto
O #aso de uso &erA os segu!&es #ampos de &e"aF
Nome M50N Nome do produ&o a ser #adas&rado' <ampo &e*&o'
Ces#r!%,o MG000N Ces#r!%,o do produ&o, #omo espe#!3!#a%2es &)#!#as, o 1ue o produ&o
possu!, 1ua!s as va&ages e "!m!&a%2es 1ue o mesmo o3ere#e, e&#'
<ampo &e*&o'
;ore#edor MG0N A1ue"e 1ue 3ore#e o produ&o' E*!s&e uma &abe"a #om vAr!os
3ore#edores 9A #adas&rados' Esse #ampo ) um #omboIbo* de
;ore#edores'
Lua&!dade MTN A 1ua&!dade ped!da ao 3ore#edor' <ampo um)r!#o 1ue a#e!&a
apeas #ara#&eres um)r!#os'
Va"or de <ompra MG2,2N Va"or de #us&o pago pe"o produ&o' <ampo de#!ma" 1ue a#e!&a apeas
#ara#&eres um)r!#os'
Ca&a da <ompra MG0N Ca&a em 1ue a #ompra 3o! rea"!$ada' Se o 3ore#edor 3or ev!ar pe"os
#orre!os, a da&a da #ompra poderA ser d!3ere&e da da&a de
re#eb!me&o' <ampo do &!po Ca&e ou >!mes&amp'
Va"or de Veda MG2,2N Va"or de veda do !&em' <ampos de#!ma" 1ue a#e!&a apeas #ara#&eres
um)r!#os'
Ca&a de Re#eb!me&o MG0N A da&a de re#eb!me&o d!m!u(do da da&a de #ompra, #a"#u"a o &empo
1ue o !&em demorou a #.egar' <ampo do &!po Ca&e ou >!mes&amp'
A !d)!a do #aso de uso ) ma&er a e&!dade Produ&o' Iser!do, a"&erado, e*#"u!do e #osu"&ado
produ&os para serem usados e #o&ro"ados pe"o s!s&ema' Luado o usuAr!o e&ra a &e"a e"e &em uma
"!s&a de produ&os 9A #adas&rados ode poderA e3e&uar bus#as para a "!s&agem dos !&es' Ao se"e#!oar
um !&em, serA aber&o em uma moda" pae" os dados do produ&o se"e#!oado para serem a"&erados se
3or o #aso' Ap@s !ser!r, a"&erar ou e*#"u!r, o s!s&ema e*e#u&a a opera%,o e mos&ra o resu"&ado a &e"a
e reI"!s&a os produ&os 1ue apare#em "!s&ados'
D-G2
Ve9a o pro9e&o para dow"oad o #@d!go #omp"e&o da pAg!a produto$(xhtml 1ue rea"!$a &oda a
opera%,o de <RUC' H !mpor&a&e o&ar 1ue a1u! ) mos&rada a !&egra%,o e&re os d!versos
#ompoe&es 9A des#r!&os a#!ma e ou&ros ovos' >emos o R!#.?oda"Pae" sedo u&!"!$ado para
rea"!$ar as opera%2es #om os dados do produ&o e podemos #o&ro"ar o moda" pae" a par&!r do 0ea'
Detalhamento do Caso de Uso Registrar Venda
O #aso de uso &erA os segu!&es #ampos de &e"a #omo some&e "e!&ura, #arregados do #aso de uso de
produ&osF
Nome Some&e "e!&ura
Ces#r!%,o Some&e "e!&ura
Va"or de Veda Some&e "e!&ura
<ampos ovos ed!&Ave!s para o usuAr!oF
Nome do <omprador M50N Nome do #"!e&e 1ue #omprou o produ&o a&ua"'
<ampo &e*&o'
Ca&a-=ora da Veda M20N <ampo #arregado au&oma&!#ame&e pe"o s!s&ema
#om a da&a e .ora a&ua" do s!s&ema, por)m #aso
o usuAr!o dese9e, pode a"&erar esses dados'
<ampo >!mes&amp'
Va"or Rea" de Veda MG2,2N <aso o usuAr!o veda por um va"or ma!or ou
meor 1ue o reg!s&rado o s!s&ema !!#!a"me&e'
<ampo de#!ma"'
Para e&regaW MGN Reg!s&ra se a veda ) para e&rega ou ,o' <aso
se9a para e&rega, #arregar as !3orma%2es do
3ormu"Ar!o de e&rega 1ue se e#o&ra aba!*o'
<ampo boo"eao'
;ormu"Ar!o de e&regaF
Logradouro MG00N Rua, ave!da, e&#, ode serA rea"!$ada a e&rega'
<ampo &e*&o'
N7mero MTN O 7mero da res!d+#!a o de&erm!ado
"ogradouro' <ampo !&e!ro'
<omp"eme&o M50N <omp"eme&o do edere%o <ampo &e*&o'
0a!rro M25N 0a!rro para e&rega' <ampo &e*&o'
<!dade M25N <!dade para e&rega' <ampo &e*&o'
Es&ado M2N Es&ado para e&rega' Ceve ser uma "!s&a de
es&ados para o usuAr!o se"e#!oar o 1ue dese9ar'
<ampo &e*&o de 2 #ara#&eres apeas'
A !d)!a do reg!s&ro de vedas ) 1ue e*!s&a uma "!s&agem de produ&os prev!ame&e #adas&rados e 1ue
,o 3oram ved!dos a!da' Luado o usuAr!o se"e#!oa um desses produ&os, e&,o ) e*!b!da a e"e a
&e"a de reg!s&rar veda #om os #ampos a#!ma' Ap@s reg!s&rar uma veda, #aso o produ&o a!da
possua !&es d!spo(ve!s, ) poss(ve" reg!s&rar ma!s vedas para e"e, a&) 1ue o 7mero de vedas se9a
!gua" a 1ua&!dade de produ&os 1ue a "o9a possu!'
Ve9a o pro9e&o para dow"oad o #@d!go da pAg!a de vedas !enda$(xhtml' Per#eba a u&!"!$a%,o
do #ompoe&e a4j:out'ut*anel 1ue serve #omo um pa!e" de sa(da 1ue pode 3!#ar es#u&ado
G0-G2
1uado re1u!s!%2es A9a* a#o&e#erem e e&,o se au&o a&ua"!$ar, !sso se dA pe"o a&r!bu&o
aja-+endered()true), por padr,o o #ompoe&e u&!"!$a false' No osso pro9e&o, e"e 3o! u&!"!$ado
para 1ue 1uado usuAr!o #"!#ar o bo&,o entrega., o s!s&ema au&oma&!#ame&e abr!r as op%2es para
d!g!&ar os dados de e&rega'
Sugestes de implementao
Ap@s a !mp"eme&a%,o do s!s&ema, vo#+ pode &e&ar !mp"eme&ar a"gus ou&ros #asos de uso para
&re!ar suas .ab!"!dades o 3ramewor8'
/anter esto0ueF Uma &abe"a de es&o1ue 1ue 3osse a"!me&ada pe"o reg!s&ro de produ&os e remov!do
pe"a veda de produ&os'
+elat1rio de ,endas: Luado 3a"amos em re"a&@r!o, ,o es&amos os re3er!do a um ar1u!vo pd3,
e&,o um re"a&@r!o pode ser uma pAg!a #om a"gus 3!"&ros para #osu"&a e mos&rado os dados
resu"&a&es da #osu"&a em uma &abe"a de dados'
Cadastro de Clientes: Reg!s&rar os #"!e&es 1ue #ompram a "o9a, e ass!m reaprove!&ar dados sem
pre#!sar pegar &udo ovame&e #om o #"!e&e #ada ve$ 1ue e"e e3e&uar uma #ompra a "o9a'
Essas s,o m!.as d!#as, mas ,o se "!m!&e a e"as, pro#ure ovos re#ursos para !#orporar o s!s&ema,
e #aso vo#+ ,o 1ue!ra !mp"eme&ar &odas as op%2es, 3a%a uma, #ome#e pe"a 1ue #os!derar ma!s
s!mp"es ou ma!s !&eressa&e, ass!m vo#+ poderA !r evo"u!do gradua"me&e o 3ramewor8'
#onc$us%es
Podemos ver dura&e o desevo"ver do ar&!go as 3a#!"!dades do R!#.3a#es e 1ua&!dade de re#ursos
1ue &emos a d!spos!%,o 1uado u&!"!$amos uma b!b"!o&e#a de &ags &,o poderosa' <omo 3!$emos em
a"gumas par&es do s!s&ema de e*emp"o, ossa "o9!.a, ) poss(ve" ver &amb)m 1ue a #omb!a%,o das
&ags R!#.3a#es &rAs resu"&ados e*#e"e&es e os d,o !mesa 3"e*!b!"!dade para &raba".ar os s!s&emas'
Sempre 1ue poss(ve" u&!"!$e esses re#ursos e*aus&!vame&e, #om o ob9e&!vo de ma&er uma !&er3a#e
"!mpa e avegAve" para o usuAr!o'
Um po&o e*&remame&e !mpor&a&e a observar ) saber 1ua!s dados vo#+ es&A ev!ado ao
0a#8!g0ea' Em a"gus pro9e&os, 3o! poss(ve" observar 1ue o desevo"vedor es&ava ev!ado a
pAg!a !&e!ra para re1u!s!%,o A9a*, 1uado some&e e#ess!&ava de um ou do!s #ampos' Isso ma&a o
desempe.o 1ue ser!a poss(ve" ob&er #om re1u!s!%2es A9a*, !depede&e de 3ramewor8 u&!"!$ado' A
!d)!a ) rea"me&e ev!ar pe1ueos peda%os de pAg!a 1ue se9am e#essAr!os ao serv!dor e re#eber de
vo"&a apeas o 1ue &e.a s!do mod!3!#ado' Cessa 3orma o desempe.o A9a* poderA ob&er seu Ap!#e'
;o! poss(ve" e&,o desevo"vermos um pe1ueo pro9e&o #om vAr!as re#ursos 1ue 3a#!"!&am a v!da
do usuAr!o sem a e#ess!dade de uma 7!#a "!.a em JavaS#r!p& em &odo osso #@d!go'
Espero 1ue vo#+ u&!"!$e Osem modera%,oP o 1ue 3o! passado a1u! e 1ue esse ar&!go ".e &raga boas
e*per!+#!as e um es#"are#!me&o ma!or sobre o assu&o'
&gradecimento
Agrade%o ao meu am!go Ra3ae" A"ves MdobauN 1ue d!spXs do seu &empo e 3!m de semaa para 9u&os !mp"eme&armos o
pro9e&o p!"o do ar&!go'
Links
http://livedemo.exadel.com/richfaces-demo/index.jsp
Cemos&ra%,o oI"!e de &odos os #ompoe&es R!#.3a#es sedo u&!"!$ados'
http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/index.html
4u!a do desevo"vedor 1ue reve"a re#ursos espe#!a!s e #us&om!$a%,o' Sug!ro 1ue se9a dada uma o".ada para se &er !d)!a
do 3u#!oame&o gera" das &ags' H s!mp"es e es&A bem es&ru&urado'
http://pt.wikipedia.org/wiki/Web_.!
GG-G2
=!s&@r!#o da /E02'0, 1uado surg!u e o seu #o#e!&o'
Pau$o &$'es ()nior 'paulo&ribp1gmail.com( ) desen*ol*edor web a mais de + anos e trabalha com %a*aEE a , deles. -rabalha
atualmente no .nstituto tlntico 'www.atlantico.com.br( como nalista de &istemas e ) concludente do curso de &istemas de
.nformao na /aculdade 0 de &etembro onde !1 ministrou treinamento de %&/. #ossui certificao de #rogramador %a*a - &C%#.
G2-G2