# Cahier des charges pour l'application de gestion d'un restaurant
## 1. **Présentation générale**
L'application de gestion de restaurant doit offrir une interface conviviale et
intuitive, permettant de captiver l'attention des clients sur les plats
africains à travers des images attrayantes et des descriptions
engageantes. L'objectif est de faciliter la navigation des utilisateurs, de
simplifier les processus de commande, de livraison, et de paiement, tout
en permettant une gestion efficace par les administrateurs, comptables et
livreurs.
## 2. **Fonctionnalités principales**
### 2.1 **Accueil**
- Affichage d'images de plats africains et de descriptions engageantes
pour capter l’attention des clients.
- Bouton d'entrée pour accéder au menu principal.
### 2.2 **Menu**
- Menu subdivisé en quatre catégories :
- **Plats ouest-africains**
- **Plats du Maghreb**
- **Plats d’Afrique australe**
- **Plats d’Afrique du Sud**
- Chaque catégorie contient une liste de plats avec images, descriptions et
prix.
- Possibilité pour l'utilisateur de sélectionner des plats et de les ajouter à
un panier.
### 2.3 **Panier**
- Affichage des plats sélectionnés par l'utilisateur avec leurs quantités et
prix.
- Bouton pour passer à la section Prestation.
### 2.4 **Prestation**
- Options de prestation :
- **Livraison** : Demande de la localisation actuelle du client pour la
livraison.
- **Réservation** : Option de réservation pour dîner au restaurant.
### 2.5 **Paiement**
- Option de paiement des plats sélectionnés.
- Intégration de différentes méthodes de paiement sécurisées.
## 3. **Gestion administrative**
### 3.1 **Administrateurs**
- Deux administrateurs ont la possibilité :
- **D'ajouter** de nouveaux plats.
- **De retirer** des plats existants.
- **De modifier** les prix des plats.
### 3.2 **Comptable**
- Accès aux données des ventes et des commandes.
- Possibilité d'extraire des rapports financiers.
### 3.3 **Livreurs**
- Accès aux informations de localisation pour les plats à livrer.
## 4. **Interface utilisateur**
- Design attractif, convivial et professionnel.
- Navigation intuitive et fluide.
- Adaptation aux différents appareils
Html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>La Pyramide des Délices</title>
<link rel="stylesheet" href="[Link]">
</head>
<body>
<header>
<h1>La Pyramide des Délices</h1>
</header>
<main>
<section id="accueil">
<h2>Bienvenue!</h2>
<p>Découvrez nos délicieux plats africains!</p>
</section>
<section id="menu">
<h2>Menu</h2>
<div id="categories">
<button onclick="showCategory('ouest-africain')">Plats ouest-
africains</button>
<button onclick="showCategory('maghreb')">Plats du
Maghreb</button>
<button onclick="showCategory('austral')">Plats d’Afrique
australe</button>
<button onclick="showCategory('sud-africain')">Plats d’Afrique
du Sud</button>
</div>
<div id="plats"></div>
</section>
<section id="panier">
<h2>Panier</h2>
<div id="contenu-panier"></div>
<button onclick="showPrestation()">Passer à la
prestation</button>
</section>
<section id="prestation">
<h2>Prestation</h2>
<div>
<button
onclick="choisirPrestation('livraison')">Livraison</button>
<button
onclick="choisirPrestation('reservation')">Réservation</button>
</div>
<div id="livraison-info" style="display:none;">
<label for="localisation">Votre localisation actuelle :</label>
<input type="text" id="localisation">
</div>
<button onclick="payer()">Payer</button>
</section>
</main>
<script src="[Link]"></script>
</body>
</html>
Css
Body {
Font-family : Arial, sans-serif ;
Margin : 0 ;
Padding : 0 ;
Header {
Background-color : #333 ;
Color : #fff ;
Text-align : center ;
Padding : 1em 0 ;
Main {
Padding : 1em ;
H1, h2 {
Margin-top : 0 ;
Section {
Margin-bottom : 1em ;
Button {
Background-color : #4CAF50 ;
Color : white ;
Border : none ;
Padding : 1em ;
Margin : 0.5em ;
Cursor : pointer ;
Button :hover {
Background-color : #45a049 ;
#livraison-info {
Margin-top : 1em ;
Java
Let panier = [] ;
Let plats = {
« ouest-africain » : [
{ nom : « Jollof Rice », prix : 15 },
{ nom : « Poulet Yassa », prix : 12 }
],
« maghreb » : [
{ nom : « Couscous », prix : 10 },
{ nom : « Tajine », prix : 13 }
],
« austral » : [
{ nom : « Bobotie », prix : 14 },
{ nom : « Bunny Chow », prix : 9 }
],
« sud-africain » : [
{ nom : « Braai », prix : 16 },
{ nom : « Biltong », prix : 7 }
};
Function showCategory(category) {
Let platsDiv = [Link](« plats ») ;
[Link] = ‘’ ;
plats[category].forEach(plat => {
let platDiv = [Link](« div ») ;
[Link] = `${[Link]} - $${[Link]} <button
onclick= »ajouterAuPanier(‘${[Link]}’, ${[Link]}) »>Ajouter au
panier</button>` ;
[Link](platDiv) ;
}) ;
Function ajouterAuPanier(nom, prix) {
[Link]({ nom, prix }) ;
afficherPanier() ;
Function afficherPanier() {
Let panierDiv = [Link](« contenu-panier ») ;
[Link] = ‘’ ;
[Link]((item, index) => {
let itemDiv = [Link](« div ») ;
[Link] = `${[Link]} - $${[Link]} <button
onclick= »retirerDuPanier(${index}) »>Retirer</button>` ;
[Link](itemDiv) ;
}) ;
Function retirerDuPanier(index) {
[Link](index, 1) ;
afficherPanier() ;
Function showPrestation() {
[Link](« prestation »).[Link] = ‘block’ ;
Function choisirPrestation(option) {
If (option === ‘livraison’) {
[Link](« livraison-info »).[Link] = ‘block’ ;
} else {
[Link](« livraison-info »).[Link] = ‘none’ ;
Function payer() {
Alert(« Paiement effectué ! ») ;
Panier = [] ;
afficherPanier() ;
[Link](« prestation »).[Link] = ‘none’ ;