Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
1
PROYECTO DE PRIMFACES “HOTEL”
Iniciamosnuestroproyectoabriendonetbeans8.0
Ya abiertocrearemosnuestroproyecto damosclicen...
2
ProjectName cambiamosel nombre pordefectoEHotel ysiguiente
Le damossiguiente yaqaquí no hacemosningúncambio
3
Antesde terminarseleccionamosJavaServerFacesyesperamosaq se habrá un cuadro por debajo
Seleccionamosel primercasilleroll...
4
Así nosquedaya nuestroproyectoyacreado
CONECCION CON LA BASE DE DATOS MYSQL
Ahoracomienzalointeresante lacreaciónde nues...
5
Aquí seleccionamosNew DataSource le damosunnombre “EHOTEL” enData base Connectionle
das ennew data base y le das enok.
E...
6
Al llegarhastaaquí sololo que tienesque cambiaresdonde dice Database le ponesel nombre de
tu base de datos que sincambia...
7
Una vez que ya estásen EntityClasses donde dice Package tendrásque darle unnombre
“entidades”yle dasenterminarya que no ...
8
Una vez aquí nosaparecerátodas lastablasde nuestrabase de datosque anteriormente ya
llamamosyguardamoscon entidades,igua...
9
En estaparte lesdaremosnombresala Sesiónconbeans,Backingconcontrollersya Converter
con converterle hacemosunpoco máspequ...
10
Ahoravamos a serviciosdamosclicenServersymandamosa correr a nuestroservidorGlassfish
Server
11
VISIBILIDAD DE BOTONES
Aquí vamosa irnosla carpetaprincipal WebPagesdonde estánnuestrastablasencarpetas
abrimoslaq dese...
12
EXPORTACIÓN O DESCARGA, EXCEL, XML Y PDF
Lo q realizaremosesagregarlasfuncionesexportaciónodescarga,excel,xml ypdf para...
13
</h:commandLink>
<h:commandLink>
<p:graphicImage value="descarga.jpg"width="24" />
<p:dataExporter type="csv" target="d...
14
Desde lawebdescargamosimágenesylaagregamosa nuestroproyecto
Al mandar a correr el proyectovisualizandolosbotonesyadjunt...
15
CAMBIO DE TEMA DE NUESTRO TRABAJO
Ahoracambiaremosel temade nuestrotrabajo,nosdescargamosel temade mas nos parezcauna
v...
16
Una vez hechoestose nosagregara a las librerías,asícomo estaseleccionado
Ahoranos vamosa WEB-INF– y le damosdoble clice...
17
Ahorasolole damos clicderechorun/correr y la aplicaciónse abrirácon nuestronuevotemaasí
18
LOGIN
En la parte que esta primefacescambiamosde nombre porloginyasemosel
llamadoal logine ingresamosel códigoque estád...
19
INSERTANDO IMAGEN DE FONDO DE PANTALLA
Para insertar imagen de fondo a la pantalla principal es algo muy sencillo solo ...
20
El resultado de colocar este código es
Prochain SlideShare
Chargement dans…5
×

Primefaces hotel.. TERMINADO

2 182 vues

Publié le

terminado el proyecto anterior

Publié dans : Formation
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Primefaces hotel.. TERMINADO

  1. 1. 1 PROYECTO DE PRIMFACES “HOTEL” Iniciamosnuestroproyectoabriendonetbeans8.0 Ya abiertocrearemosnuestroproyecto damosclicenNew Proyect SeleccionamosJavaWeby despuésWebAplication,le damossiguiente
  2. 2. 2 ProjectName cambiamosel nombre pordefectoEHotel ysiguiente Le damossiguiente yaqaquí no hacemosningúncambio
  3. 3. 3 Antesde terminarseleccionamosJavaServerFacesyesperamosaq se habrá un cuadro por debajo Seleccionamosel primercasillerollamado“primefaces”de componentsyle damosterminar
  4. 4. 4 Así nosquedaya nuestroproyectoyacreado CONECCION CON LA BASE DE DATOS MYSQL Ahoracomienzalointeresante lacreaciónde nuestroproyecto“EHotel”conectandoconlabase de datos mysql. Ahorale damos clicenEHotel – nuevo– entityclasesfromdatabase se abriráun cuadro donde nos pide el nombre de la base de datos.
  5. 5. 5 Aquí seleccionamosNew DataSource le damosunnombre “EHOTEL” enData base Connectionle das ennew data base y le das enok. En estaimagenle das siguientedrivery seleccionaMysql yle dasensiguiente
  6. 6. 6 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 Si realizaste el pasoanteriorcomolohice yo ya te deberán aparecertodastus tablasennuestro cuadro asi como estáaquí, ahora damosclic en“AddAll>>” y se pasaran las tablasde un ladoal otro y de aquí le das ensiguiente
  7. 7. 7 Una vez que ya estásen EntityClasses donde dice Package tendrásque darle unnombre “entidades”yle dasenterminarya que no habrá nada masq hacer aquí. CREACION DE LAS PAGINAS DE PRIMEFACES Vueltahacemosclicennuestroproyectole damosennuevoyahora seleccionamos primefaces pagesfromEntity Classes.
  8. 8. 8 Una vez aquí nosaparecerátodas lastablasde nuestrabase de datosque anteriormente ya llamamosyguardamoscon entidades,igualmentehacemosclicen“AddAll>>” y le pasamosde un cuadro al otro lado Nosquedaraalgo así y despuésle damosensiguiente
  9. 9. 9 En estaparte lesdaremosnombresala Sesiónconbeans,Backingconcontrollersya Converter con converterle hacemosunpoco máspequeñalapantallaparadarle en terminar. Aquí se comenzaraa cargar todoslosdatos enlistade nuestroproyecto
  10. 10. 10 Ahoravamos a serviciosdamosclicenServersymandamosa correr a nuestroservidorGlassfish Server
  11. 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. 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> <h:commandLink> <p:graphicImage value="pdf.jpg" width="24" /> <p:dataExporter type="pdf" target="datalist"fileName="datalist"pageOnly="true" />
  13. 13. 13 </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. 14 Desde lawebdescargamosimágenesylaagregamosa nuestroproyecto Al mandar a correr el proyectovisualizandolosbotonesyadjuntandolaexportación luciráconlas imágenesalgoasí
  15. 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. 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. 17 Ahorasolole damos clicderechorun/correr y la aplicaciónse abrirácon nuestronuevotemaasí
  18. 18. 18 LOGIN En la parte que esta primefacescambiamosde nombre porloginyasemosel llamadoal logine ingresamosel códigoque estádebajoenlaimagen En donde dice index.xhtml –cambiamosdonde dice primefacesporloginparaque haga el correcto llamado Al darle doble clickole mandamosa ejecutarnuestroproyectose abriráasi
  19. 19. 19 INSERTANDO IMAGEN DE FONDO DE PANTALLA Para insertar imagen de fondo a la pantalla principal es algo muy sencillo solo tenemos que insertar este código. <p:graphicImage value="imagen/HOTEL.jpg" /> Este codigo va dentro de template.xhtml
  20. 20. 20 El resultado de colocar este código es

×