1. 1
PROYECTO DE PRIMFACES “HOTEL”
Iniciamosnuestroproyectoabriendonetbeans8.0
Ya abiertocrearemosnuestroproyecto damosclicenNew Proyect

2. 2
SeleccionamosJavaWeby despuésWebAplication,le damossiguiente
ProjectName cambiamosel nombre pordefectoEHotel ysiguiente

3. 3
Le damossiguiente yaqaquí no hacemosningúncambio
Antesde terminarseleccionamosJavaServerFacesyesperamosaq se habrá un cuadro por debajo

4. 4
Seleccionamosel primercasillerollamado“primefaces”de componentsyle damosterminar
Así nosquedaya nuestroproyectoyacreado
CONECCION CON LA BASE DE DATOS MYSQL
Ahoracomienzalointeresante lacreaciónde nuestroproyecto“EHotel”conectandoconlabase
de datos mysql.

5. 5
Ahorale damos clicenEHotel – nuevo– entityclasesfromdatabase se abriráun cuadro donde
nos pide el nombre de la base de datos.
Aquí seleccionamosNew DataSource le damosunnombre “EHOTEL” enDatabase Connectionle
das ennewdatabase y le dasen ok.

6. 6
En estaimagenle das siguientedriveryseleccionaMySql yle das ensiguiente
Al llegarhastaaquí sololo que tienesque cambiaresdonde dice Database le ponesel nombre de
tu base de datos que sincambiarle nadami es “hotel”
Y le das terminar

7. 7
Si realizaste el pasoanteriorcomolohice yo ya te deberánaparacertodas tustablasen nuestro
cuadro asi como estáaquí, ahora damosclic en“AddAll>>” y se pasaran las tablasde un ladoal
otro y de aquí le das ensiguiente
Una vez que ya estásenEntityClasses donde dice Package tendrásque darle unnombre
“entidades”yle dasenterminarya que no habrá nada masq hacer aquí.

8. 8
CREACION DE LAS PAGINAS DE PRIMEFACES
Vueltahacemosclicennuestroproyectole damosennuevo yahora seleccionamosprimefaces
pagesfromEntityClasses.
Una vez aquí nosaparecerátodas lastablasde nuestrabase de datosque anteriormente ya
llamamosyguardamoscon entidades,igualmentehacemosclicen“AddAll>>” y le pasamosde
un cuadro al otro lado

9. 9
Nosquedaraalgo así y despuésle damosensiguiente
En estaparte lesdaremosnombresala Sessiónconbeans,Backingconcontrollersya Converter
con converterle hacemosunpoco máspequeñalapantallaparadarle en terminar.

10. 10
Aquí se comenzaraa cargar todoslosdatos enlistade nuestroproyecto
Ahoravamos a serviciosdamosclicenServersymandamosa correr a nuestroservidorGlassfish
Server

11. 11
VISIBILIDAD DE BOTONES
Aquí vamosa irnosla carpetaprincipal WebPagesdonde estánnuestrastablasencarpetas
abrimoslaq deseemos“reservaciónDet”yabrimosList.xhtmldentrode estonosvamosal final y
endonde dice style=”visibility;hidden”estaspalabrasborramosyaque harán q aparezcalos
botones
Al eliminarestalíneade códigonosquedaraalgoasí.

12. 12
EXPORTACIÓN O DESCARGA, EXCEL, XML Y PDF
Lo q realizaremosesagregarlasfuncionesexportaciónodescarga,excel,xml ypdf paraello
dentrode donde borramos style=”visibility;hidden”debajode estoseleccionamoscomomuestra
enla imagenylo cambiamosporel códigoq esta debajo
<h:panelGrid columns="2">
<p:panel header="Export All Data">
<h:commandLink>
<p:graphicImage value="excel_icon.jpg"width="24" />
<p:dataExporter type="xls" target="datalist"fileName="cars"/>
</h:commandLink>
<h:commandLink>
<p:graphicImage value="pdf.jpg" width="24" />
<p:dataExporter type="pdf" target="datalist"fileName="cars" />
</h:commandLink>
<h:commandLink>
<p:graphicImage value="descarga.jpg"width="24" />
<p:dataExporter type="csv" target="datalist"fileName="cars"/>
</h:commandLink>
<h:commandLink>
<p:graphicImage value="Xml.png" width="24" />
<p:dataExporter type="xml" target="datalist" fileName="cars"/>
</h:commandLink>
</p:panel>
<p:panel header="Export Page Data">
<h:commandLink>
<p:graphicImage value="excel_icon.jpg"width="24" />
<p:dataExporter type="xls" target="datalist"fileName="datalist"pageOnly="true" />
</h:commandLink>

13. 13
<h:commandLink>
<p:graphicImage value="pdf.jpg" width="24" />
<p:dataExporter type="pdf" target="datalist"fileName="datalist"pageOnly="true" />
</h:commandLink>
<h:commandLink>
<p:graphicImage value="descarga.jpg"width="24" />
<p:dataExporter type="csv" target="datalist"fileName="datalist"pageOnly="true" />
</h:commandLink>
<h:commandLink>
<p:graphicImage value="Xml.png" width="24" />
<p:dataExporter type="xml" target="datalist" fileName="datalist"pageOnly="true" />
</h:commandLink>
</p:panel>
</h:panelGrid>
</p:panel>
<ui:includesrc="/confirmation.xhtml"/>
</h:form>
</ui:composition>
Al copiar lael códigonos quedaraalgoasí sololoque nosfalta esbuscar lasimágenesparaque se
visualice mejoryagradable a lavista

14. 14
Desde lawebdescargamosimágenesylaagregamosa nuestroproyecto
Al mandar a correr el proyectovisualizandolosbotonesyadjuntandolaexportación luciráconlas
imágenesalgoasí

15. 15
CAMBIO DE TEMA DE NUESTRO TRABAJO
Ahoracambiaremosel temade nuestrotrabajo,nosdescargamosel temade mas nos parezcauna
vezdescargoy guardadoen unacarpeta, nosvamosa libreríasdamosclicderechoenadd
jar/folder
Seleccionamosel temaque descargamosenmi caso“ui-darkness”ydamosclicenabrir

16. 16
Una vez hechoestose nosagregara a las librerías,asícomo estaseleccionado
Ahoranos vamosa WEB-INF– y le damosdoble clicenweby pegamosel siguiente códigodebajo
de </welcome-file-list>
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>ui-darkness</param-value> comentario“/*este nombre variasegunel nombre
del temaque han escojido*/
</context-param>

17. 17
Ahorasolole damos clicderechorun/correr y la aplicaciónse abrirácon nuestronuevotemaasí