TP 5 PHP: Cration d'un site web dynamique avec PHP 4
(Site web d'une agence de location des vhicules)
A. CAHIER DES CHARGES I ntroduction La finalit de ce projet est de raliser un site web dynamique pour une agence de location des vhicules nomme EAT (Europan Airport Transfert) ayant pour objectif de permettre aux clients deffectuer des rservations directes en ligne des vhicules pour les amener leurs destinations partir de laroport. 1-Les besoins fonctionnels 1- Besoins du point de vue client : Lapplication doit permettre au client de : Accder facilement au site en ligne. Dcouvrir la socit, ses activits et ses expriences dans le domaine. Rserver (le client remplit un formulaire de rservation des vhicules) un vhicule. Envoyer ses commentaires et ses critiques la socit dans la page de contact 2- Besoins du point de vue administrateurs : On a deux types dadministrateurs : administrateur interne et administrateur externe et chacun a ses propres tches. Plusieurs oprations sont possibles pour ladministrateur interne aprs une phase dauthentification : Consulter les rservations. Valider ou supprimer les rservations. Grer la liste des clients. Grer la liste des types des vhicules. Grer la liste des localits. Grer la liste des vhicules. ...etc -Ladministrateur externe peut aprs lauthentification :
-2 - Consulter la liste des rservations faites par les clients. 2 Les besoins non fonctionnels : Le systme doit rpondre certains besoins qui ne sont pas indispensables pour son fonctionnement mais qui sont importants pour amliorer la qualit de ses services tels que : La fiabilit de site. La scurit des accs aux donnes (Les sites web de rservation en ligne doivent tre srs et bien protgs contre les intrusions) et la scurit des donnes sur la clientle (les donnes personnelles) pour accrotre la confiance chez le client. Lergonomie de linterface (Site web net et lgant pour gagner la confiance du client, les interfaces et les liens doivent tre simples, clairs et bien structurs avec le bon choix des couleurs et du style dcriture). Laccs simple et rapide aux diffrentes fonctionnalits du site. B. Les diagrammes des cas d'utilisation 1- Description des acteurs :
Ladministrateur interne : Cette personne qui est autorise mettre en ligne linformation et qui est donc responsable du contenu du site (super administrateur), gre lapplication dans sa totalit (grer la liste des clients, grer la liste vhicules, grer la liste des types des vhicules,.) Ladministrateur externe : Ce sont les personnes qui consultent la liste des rservations faites par les clients. Les clients (les voyageurs):Tous les voyageurs qui veulent des vhicules leur arrive laroport pour assurer un transport scuris 2-Description des cas dutilisation
2- 1 Cas dutilisation associ au client :
-3 -
Figure1 : Diagramme de cas dutilisation client 2- 2 Cas dutilisation associ ladministrateur interne et ladministrateur externe:
-4 - <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<extend>> <<i ncl ude>> <<i ncl ude>> <<i ncl ude>> <<i ncl ude>> <<i ncl ude>> <<i ncl ude>> <<i ncl ude>> <<i ncl ude>> admi ni strateur i nterne grer l a l i ste des l ocal i ts confi rmer l es rservati ons grer l a l i ste des vhi cul es grer l a l i ste des rservati ons grer l a l i ste des cl i ents grer l a l i ste des types de vhi cul es grer l a l i ste des adi ni strateurs externes suppri mer l ocal i t modi fi er l ocal i t aj outer l ocal i t aj outer un type de vhi cul e modi fi er un type de vhi cul e suppri mer un type de vhi cul e aj outer vhi cul e modi fi er vhi cul e suppri mer vhi cul e aj outer cl i ent modi fi er cl i ent suppri mer cl i ent aj outer rservati on modi fi er rservati on suppri mer rservati ons s'authenti fi er admi ni strateur externe consul ter l a l i ste des rservati ons
Figure2 : Diagramme de cas dutilisation dadministration
-5 - C. Conception de la base de donnes 1. Rgles de gestion : Pour laborer la conception de notre base de donnes, il faut tout dabord dfinir les rgles de gestion qui seront comme suit : - Un administrateur possde un compte d'identification et peut grer les rservations. -Ladministrateur peut confirmer une ou plusieurs rservations. - Ladministrateur peut ajouter des vhicules - Ladministrateur possde un compte didentification et peut consulter la liste des rservations faites par les clients. -Un client peut rserver un ou plusieurs vhicules et un vhicule doit tre rserv par un ou plusieurs clients. - Un vhicule appartient une seule localit. -Chaque compte est dfini par un login et un mot de passe. -Un vhicule appartient un seul type vhicule.
2. Diagramme de classes :
-6 - 1..* 1..* 1..* 0..1 1..* 1..1 1..1 0..1 1..1 1..* reserver avoi r appati ent confi rmer apparti ent 1 cl i ent - - - - - code_cl i ent nom_cl i ent adresse_cl i ent tel _cl i ent mai l _cl i ent : i nt : Stri ng : Stri ng : Stri ng : Stri ng + + + modi fi er () aj outer () suppri mer () ... : voi d : voi d : voi d vehi cul e - - - - matri cul e_veh marque_veh pui ssace_veh nombre_pl ace : Stri ng : Stri ng : Stri ng : i nt + + + modi fi er () aj outer () suppri mer () ... : voi d : voi d : voi d l ocal i t - - code_l ocal nom_l ocal : i nt : Stri ng + + + modi fi er () aj outer () suppri mer () ... : voi d : voi d : voi d reservati on - - - - - - - code_res date_arri ve etat_res desti nati on heure dearri vee commentai re nbr_voyageur : i nt : Date : Stri ng : Stri ng : Date : Stri ng : i nt + + + modi fi er () aj outer () suppri mer () : voi d : voi d : voi d type_veh - - - code_type nom_tyoe tari f : i nt : Stri ng : fl oat + + + modi fi er () aj outer () suppri mer () ... : voi d : voi d : voi d compte - - - code_compte l ogi n mot-de-passe_compte : i nt : Stri ng : Stri ng + + + modi fi er () aj outer () suppri mer () ... : voi d : voi d : voi d admi ni strateur - - - - - code_admi n nom_admi n adresse_admi n mai l _admi n type_admi n : i nt : Stri ng : Stri ng : Stri ng : Stri ng + + + modi fi er () aj outer () suppri mer () : voi d : voi d : voi d
Figure3 : Diagramme de classes
-7 - 3- Le modle physique des donnes: FK_cl i ent_matri cul e FK_cl i ent_matri cul e FK_vehi cul e_l ocal i te FK_vehi cul e_tari f FK_admi ni strateur_compte FK_admi ni strateur_reservati on cl i ent code_cl i ent nom_cl i ent adresse_cl i ent tel _cl i ent mai l _cl i ent ... i nt varchar(254) varchar(254) varchar(254) varchar(254) <pk,ak> vehi cul e matri cul ee_veh code_l ocal code_type matri cul e_veh marque_veh pui ssace_veh nombre_pl ace ... i nt i nt i nt varchar(254) varchar(254) varchar(254) i nt <pk,ak> <fk1> <fk2> l ocal i t code_l ocal nom_l ocal i nt varchar(254) <pk> reservati on code_cl i ent matri cul e_veh code_res code_admi n date_arri ve etat_res desti nati on heure dearri vee commentai re nbr_voyageur i nt i nt i nt i nt dateti me varchar(254) varchar(254) dateti me varchar(254) i nt <pk,fk1> <pk,fk2> <pk> <fk3> type_veh code_type nom_tyoe tari f ... i nt varchar(254) fl oat <pk> compte code_compte l ogi n mot-de-passe_compte ... i nt varchar(254) varchar(254) <pk> admi ni strateur code_admi n code_compte nom_admi n adresse_admi n mai l _admi n type_admi n i nt i nt varchar(254) varchar(254) varchar(254) varchar(254) <pk> <fk>
Figure 4: Modle physique de donnes
-8 - D-CONCEPTION DU SITE 1- Public cible : L'objectif du site est de toucher le plus grand nombre de personnes de diffrents secteurs et domaines d'activits. Il faudra pour cela viter un thme spcifique et opter pour la simplicit et la gnralisation. 2- Architecture du site : Le but est de fournir l'usager l'information qu'il souhaite en un minimum d'tapes et donc en un minimum de temps. Il existe quatre types de structures :
Structure squentielle
Structure hirarchise
Structure en rseau
Structure en volution
III-3 Structure adopte : Pour notre site, nous avons adopt une structure hybride. C'est une jonction entre la structure en volution et la structure en rseau permettant ainsi aux visiteurs de se rendre un autre sous arbre de site sans tre obligs de faire le mme parcours en amont.
-9 -
Figure 5 : Architecture de site
4 La charte graphique : Pour une bonne ergonomie, nous avons tabli la charte graphique des pages du site tout en faisant un choix des couleurs qui respecte celles du logo.
Espace admin interne Consulter liste des rservations Grer liste des clients Grer liste des vhicules Grer liste des localits Grer listes des rservations Grer liste des admin externes Grer liste des types des vhicules
-10 -
Figure 6: Structure des pages du site
1- Animation flash. 2- Barre de menu horizontale (dans les pages statiques et dynamiques). 3- Barre de menu verticale (dans les pages dynamiques). 4- Corps de la page.
1 3 4 2
-11 - E-CREATION DE LA BASE DE DONNEES Crer la base de donnes associe ce site avec le nom de europairport en suivant l'une des mthodes suivantes: 1. En utilisant directement le SGBD mySQL du package Easy PHP
Table administrateur:
Table client:
-12 - Table compte
Table localite
Table type_veh
Table vehicule
Table reservation:
-13 -
2. En utilisant le logiciel de modlisation Power AMC qui est un outil de conception et de modlisation qui permet ainsi de concevoir et de gnrer une structure de base de donnes. En effet, ce logiciel permet de gnrer le modle physique de donnes partir du diagramme de classes ensuite il permet de gnrer le script (fichier sql) de cration de la base de donnes sous mySQL. Ce script sera excut sous le SGBD indiqu pour donner automatiquement toutes les tables de la base de donnes.
-14 -
Comme rsultat de cette tape, on aura un fichier nomm crea.sql qui contient les scripts de cration de la base de donnes correspondante. Ce fichier va tre excut sous mysql comme le montre la figure suivante:
Cliquer sur le bouton Parcourir pour slectionner le fichier crea.sql puis l'excuter avec le bouton excuter On commence par la cration d'une base de donnes vide ensuite on cre les tables l'aide de l'excution du fichier crea.sql
-15 - F-CREATION DU SITE WEB DYNAMIQUE AVEC DREAMWEAVER 1. En utilisant le logiciel Dreamweaver, Crer un site web dynamique qui se base sur la technologie PHP ; 2. Importer les pages statiques et le dossier images dans le rpertoire de ce site. G-REALISATION DU MODULE ADMINISTRATION Au niveau de cette partie on doit crer toutes les pages dynamiques qui vont tre utilises par l'administrateur interne et l'administrateur externe.
-16 - 1. La gestion des localits a. La page ajouter_localite.php
CODE
<h2>Ajouter localite</h2> <form name = "form1" method = "post" action="ajouter_localite.php" > <table width = "300" border = "2" align = "center"> <tr> <td>Nom localite</td> <td><input type = "text" name = "nom_localite" value = "" ></td></tr> <tr><td align = "right"><br><br><input type = "submit" name = "ajouter" value = "Ajouter"></td> <td ><br><br><input type = "reset" name = "reset" value = "Annuler"></td></tr> </table> </form> <?php $cnx=mysql_connect("localhost","root",""); $db=mysql_select_db("europairport"); if (isset ($_POST["ajouter"]))
-17 - { if(empty( $_POST["nom_localite"])) {echo'<script>alert("Un ou plusieurs champs ne sont pas remplis"); window.history.go(-1); </script>';} else {$nl=$_POST["nom_localite"]; $sql="INSERT INTO localite (nom_local) VALUES('$nl')"; $requete=mysql_query($sql,$cnx) or die(mysql_error()); if($requete) {echo'<script>alert("la localite a ete ajoutee avec succes");window.history.go(-1);</script>';} else {echo("L'insertion a echoue"); }}} ?>
b. La page liste_localite.php
-18 - CODE <h2><br>liste des localites</h2> <?php //on fait la cration d'un fichier connexion.php contenant les instructions //de connexion au serveur et de slection de la base include("connexion.php"); $req1="select * from localite"; $res1=mysql_query($req1); if(mysql_num_rows($res1)!=0) { echo "<table border=\"1\" align=\"center\" >"; echo "<tr><th>code localite</th><th>Nom localite</th><th colspan='2'>Actions</th></tr>"; while ($enr1=mysql_fetch_row($res1)) { echo "<tr><td> $enr1[0]</td><td> $enr1[1]</td> <td><a href=modifier_localite.php?code_local=$enr1[0]>Modifier</a></td> <td><a href=supprimer_localite.php?code_local=$enr1[0]>Supprimer</a></td></tr>"; } echo "</table>"; } else echo "Aucun enregistrement"; ?> c. La page modifier_localite.php CODE
-19 - <body> <? include("connexion.php"); $code_local=$_GET["code_local"]; $sql2="SELECT * FROM localite WHERE code_local=$code_local"; $requete=mysql_query($sql2); $result=mysql_fetch_row($requete); ?> <h2>Modifier localite</h2> <form name="form1" method="post"> <table width = "300" border = "0" align = "center"> <tr> <td>Code localite </td> <td><input name = "code_local" type = "text" value =<?php echo ("$code_local"); ?>></td> </tr> <tr> <td>Nom localite</td> <td><input name = "nom_local" type = "text" value = <?php echo $result[1]; ?> ></td> </tr> <tr> <td><input type="submit" name="Modifier" value="Modifier"></td> <td><input type="reset" name="Submit2" value="annuler"></td> </tr> </table> </form>
-20 - <?php if (isset($_POST['Modifier'])) {$code_loc=$_POST["code_local"]; $nom_loc=$_POST["nom_local"]; $sqlm="update localite set localite.nom_local='$nom_loc' where localite.code_local='$code_loc'"; $requete=mysql_query($sqlm) or die(mysql_error()); if($requete) { echo('<script> alert("La modification est correcte")</script>'); echo("<script> document.location.href=\"liste_localite.php\" </script>"); } else { echo("mofication a chou"); }} ?> </body> d. La page supprimer_localite.php CODE <?php include("connexion.php"); $code_local=$_GET["code_local"]; $sql="delete from localite where code_local=$code_local"; $requete=mysql_query($sql,$cnx); if($requete) {echo('<script> alert("la suppression est correcte")</script>'); echo("<script>document.location.href=\"liste_localite.php\"</script>");}
-21 - else { echo('<script> alert("supp a echoue")</script>');} ?> 2. La gestion des types vhicules a. La page ajouter_type.php (mme code)
b. La page liste_type.php (mme code)
c. La page modifier_type.php (mme code)
d. La page supprimer_type.php (mme code)
-22 - 3. La gestion des vhicules a. La page ajouter_vehicule.php Au niveau de cette page, il faut crer un formulaire de saisie des vhicules tout en affichant les localits et les types des vhicules partir des tables localite et type_veh dans des listes de choix.
CODE DE L'AFFICHAGE DES NOMS DES LOCALITES DANS UNE LISTE DE CHOIX: <select name="nom_local" > <?php include('connexion.php'); $req1=mysql_query("SELECT * FROM localite"); while($enr1=mysql_fetch_row($req1)) { echo "<option value=$enr1[0]>$enr1[1]</option>"; } ?> </select> b. La page liste_vehicule.php
-23 -
Travail faire: Donner le code de cette page. c. La page modifier_vehicule.php: (mme code que la page modifier_localite.php) d. La page supprimer_vehicule.php: (mme code que la page supprimer_localite.php) TRAVAIL A FAIRE a. En suivant la mme dmarche, crire le code php des autres pages de l'administrateur interne (gestion des administrateurs externes et des comptes, gestion des clients et gestion des rservations). REMARQUE: l'ajout des clients et des rservations ne se fait pas par l'administrateur, il se fait par le module rservation. b. Etablir les liens la fin entre la page menu_admin_interne.php et toutes les autres pages cres.
-24 - 1. la page consulter_reservation.php Dans cette page, on doit afficher la liste des rservations faites par les clients partir de la table rservation dans un tableau HTML avec la possibilit de confirmer ou de supprimer chaque rservation.
Travail faire: Donner le code de cette page
b. La page confirmer_reservation.php : Donner le code de cette page sachant que la confirmation consiste changer la valeur du champ etat reservation de not OK OK;
c. La page supprimer_reservation.php : Donner le code de cette page;
-25 - H-REALISATION DU MODULE RESERVATION a) La page reservation.php: Cette page contient au dpart la liste des destinations des clients qui s'affichent dans une liste de choix avec un bouton de validation. Cette liste est donne par l'affichage des diffrentes valeurs de la table localite. Le client commence par choisir sa destination et il valide son choix en cliquant sur le bouton OK.
Il aura par la suite la liste des vhicules qui appartiennent la destination (localit) choisie comme le montre la figure suivante:
Le client va choisir un vhicule parmi la liste des vhicules proposs et il clique par la suite sur le lien (ou bouton) rserver pour passer au formulaire de rservation:
-26 - b) la page reservation2.php
Le client va remplir ce formulaire en prcisant les donnes qui concernent sa rservation, ces donnes vont tre sauvegardes dans la table client et la table rservation.
Travail faire Ecrire le code de ces deux pages.
I. LES SESSIONS ET LA REDIRECTION Ce site possde une premire section pour l'administrateur interne et une deuxime section pour l'administrateur externe. Chaque administrateur devra se loguer avant de pouvoir entrer sa section. On aura alors un formulaire dans la page d'accueil permettant chaque type d'administrateur d'accder sa section.
Le formulaire d'authentification dans la page d'accueil du site EAT
-27 - Observation:
D'aprs ce formulaire d'authentification, vous pouvez remarquer que lorsqu'on le remplira et on cliquera sur le bouton de validation, on se retrouvera au niveau de la page login.php avec une variable $login qui contiendra le login de l' administrateur ainsi qu'une variable $pwd contenant son mot de passe ; variables qu'il faudra naturellement tester avant de dmarrer la session (car seuls les administrateurs pourront accder leurs espaces o l'on utilisera notre session).
1. La page login.php : Donner le code de cette page
2. La page logout.php:
Cette page sert pour la dconnexion des administrateurs. C'est la page cible des liens nomms dconnexion au niveau de la page menu_admin_interne.php et la page menu_admin_externe.php
3. La gestion des sessions Au dbut de chaque page dynamique du module ADMINISTRATION du site, ajouter le code suivant (avant la balise html): <?php session_start(); if(! isset($_SESSION["code_admin"])) { echo ' <script>alert("Session expiree")</script>'; } else { ?> <html> . . </html> <?php } ?>
-28 -
Pour les autres pages du site, on n'a pas besoin des sessions car le client n'effectue pas une opration d'authentification pour accder ses pages.
J. LE CONTROLE SUR LES FORMULAIRES Ajoutez le code JavaScript qui permet d'effectuer les contrles ncessaires sur les champs des formulaires html de ce site: Tous les champs doivent tre non vides. L'adresse Email doit tre non vide et comportant le caractre @ Certaines valeurs doivent tre des nombres > 0