ABDI YOUSSOUF HAMZE

1
 Liste des abréviations
Abréviation Désignation
JS JavaScript
HTML HyperText Markup Language
SARL Société à Responsabilité Limitée
GSM Système global pour les communications
mobiles
CSS Cascading Style Sheet
SSD Solid-State Drive
IDE Integrated Development Environment

Tableau 1:liste des abréviations

2
 Dédicaces

Nous dédions ce travail avec amour, sincérité et fierté.

À nos parents pour leur affection, leurs prières et pour lesquelles aucune dédicace ne saurait
exprimer nos sentiments de reconnaissance de gratitude et de dévouement.
À nos professeurs pour leurs conseils et leurs efforts afin de nous assurer une formation solide.

À toutes les personnes qui ont contribué à la réussite de notre stage et qui nous ont aidés lors de la
rédaction de ce rapport.

SALTANI AMINE.

ABDI YOUSSOUF HAMZE

3
 Remerciements

Avant d’entamer toute démarche relative à ce rapport, nous souhaitons exprimer notre gratitude envers
Dieu le tout puissant qui par sa bienveillance et son amour a été avec nous depuis le début jusqu’à la
concrétisation de ce projet.

Présenter ce travail au travers de ce rapport est avant tout une occasion pour nous d’exprimer notre
reconnaissance envers toutes les personnes qui ont été là pour nous soutenir de manière inconditionnelle.

Nous tenons avec une très grande rigueur, exprimer avec sincérité et bienveillance notre gratitude envers
notre encadrant, Mr A.ELOUARDI, pour son soutien indéfectible, ses conseils avisés, et son influence
positive sur chacun des membres de notre groupe, dont le progrès est clairement perceptible.

Nous remercions vivement l’ESTD, son corps administratif, ses enseignants et surtout son directeur Mr
MAHANI ZOUHIR pour l’opportunité qu’ils nous ont donnée de mettre en pratique tout ce que nous
avons appris dans ce stage.
Ainsi, nous adressons nos extrêmes gratitudes aux jurys de notre soutenance de projet de stage PROF M.
HOUMER et PROF F.HASSINE qui ont accepté d'évaluer notre travaille

Nous voulons remercier nos camarades de deuxième année pour tout le soutien moral et physique qu’ils
nous ont apporté dans ce stage. Enfin, nous disons merci à chaque membre de ce groupe pour le travail
accompli. Certes ce n’était pas facile mais chacun de nous a donnés son maximum pour l’aboutissement de
ce projet durant le stage.

4
SOMMAIRES

Introduction ......................................................................................................................................6

chapitre 1 Présentation de l’organisme.................................................................................................8

chapitre 2 Environnement de développement et présentation de l’application ...............................16

Conclusion ..........................................................................................................................................27

Webographie ......................................................................................................................................32

5
 Introduction
Nous avons eu le privilège d'effectuer notre stage de fin d'études au sein de l'entreprise B2B2C ABDO, une
SARL spécialisée dans le transport par conduite, basée à Dakhla, au Maroc. Fondée en 2021, cette
entreprise se distingue par son engagement envers la qualité et la satisfaction de sa clientèle.
Au cours de notre stage, nous avons contribué au développement d’un web application de gestion de stock
pour B2B2C ABDO.

Notre web application propose un Dashboard statique spécialement conçu pour les administrateurs. Il offre
une vue détaillée et visuellement attrayante des données clés, telles que le nombre de clients, le total des
colis, le graphique des bénéfices par client et le pourcentage des états des colis.

Les administrateurs peuvent également accéder à des fonctionnalités telles que la liste des clients, l'ajout de
clients et la facturation. Cela leur permet de suivre facilement les performances de l'entreprise et de prendre
des décisions éclairées.

Premièrement, nous avons présenté le premier chapitre intitulé "Présentation de l'organisme et de la

conception". Ensuite, nous avons le deuxième chapitre qui aborde l'environnement de développement et la
présentation de l'application. Enfin, nous concluons.

6
Chapitre 1

Présentation de l’organisme et
la conception

7
 Présentation de l’organisme

Notre stage de fin d'études s'est déroulé au sein de l'entreprise B2B2C ABDO. Cette société,
créée en 2021, opère en tant que SARL dans le secteur du transport par conduite. Elle est
enregistrée sous le numéro de registre de commerce 19791 et est située dans la ville de Dakhla.
B2B2C ABDO se distingue par son engagement envers la qualité et la satisfaction de sa
clientèle. La société est entièrement détenue par la partie marocaine, avec un capital de
100.000,00DHS. Son siège social, situé à l'adresse suivante : Imm Rouge, Rue Elatf, Nr 546,
Dakhla, est le centre névralgique de ses opérations.
Sous la direction de M. Abdelghafour Elouardi, B2B2C ABDO s'est forgé une réputation
solide dans l'industrie du transport par conduite. L'entreprise vise à fournir des services de qualité et
à répondre aux besoins spécifiques de ses clients.
Pour toute demande d'information ou de contact, B2B2C ABDO met à disposition les
coordonnées suivantes : GSM : 0761816135, Email : contact@alloabdo.com. Vous pouvez
également consulter leur site web www.alloabdo.com pour en savoir plus sur leurs services et leur
philosophie d'entreprise.
Ce rapport de stage a pour objectif de présenter nos observations et nos expériences au sein de
cette entreprise dynamique et de mettre en lumière les activités, les processus et les défis auxquels
nous avons été confrontés pendant cette période passionnante de notre parcours d'études.

1. Description de l'organisme

ALLOABDO
NOM DE LA SOCIETE ALLOABDO
ACTIVITE PRINCIPALE TRANSPORT PAR
CONDUITE

ANNEE DE CREATION 2021

Abdelghafour ELOUARDI
NOM DU DIRIGEANT

Téléphone GSM : 0761816135

Mail Contact@alloabdo.com
Tableau 2:Description de l'organisation

8
 a) Organigramme

Figure 1:organigramme

b) Cas étudié

Figure 2:cas étudié

Cet organigramme représente les différents rôles au sein de l'entreprise. Le gérant occupe un rôle de
supervision et de direction générale. Ensuite, il y a un social seller qui se charge de la vente sur les réseaux
sociaux. Un responsable commercial est divisé en deux branches, l'une spécifiquement pour la vente dans
le secteur alimentaire, et l'autre pour la vente express. Il y a également un service de confirmation qui traite
les demandes et les confirmations des clients. Un social media manager est en charge de la gestion des
médias sociaux de l'entreprise. Enfin, il y a un poste de réception et suivi pour gérer les communications
entrantes et le suivi des clients.
9
 2. Le cadre général

Dans le cadre de ma formation en génie informatique, il est primordial d'effectuer un stage dans
un cadre professionnel. Ce projet sera le fruit de ma formation.
Dans le cadre de notre stage chez B2B2C ABDO, nous avons développé un site web visant à améliorer la gestion
du stock de l'entreprise. Notre objectif était d'optimiser les opérations logistiques en permettant le suivi en temps
réel des niveaux de stock, des mouvements de produits et des commandes.

a) Critique de l'existant

Dans le cadre de notre stage chez B2B2C ABDO, notre projet principal était de développer un
système de gestion du stock pour l'entreprise Allo Abdo. L'objectif était de mettre en place une
plateforme en ligne permettant de suivre et de gérer efficacement les niveaux de stock, les
mouvements de produits, ainsi que les commandes et les livraisons.
Ce projet visait à améliorer la traçabilité des produits, à optimiser les opérations logistiques et à
faciliter la prise de décision au sein de l'entreprise

b) Présentation du sujet

Notre travail consistait à concevoir et développer une plateforme en ligne qui permettrait à Allo
Abdo de gérer en temps réel les niveaux de stock, les mouvements de produits, ainsi que les
commandes et les livraisons.
Nous avons intégré des fonctionnalités telles que la génération de rapports, la gestion des
fournisseurs et la traçabilité des produits.

c) Les tâches principales

Le tableau suivant représente la planification des tâches nécessaires pour la réalisation du
projet. Il permet de visualiser l’état d’avancement des différentes tâches nécessaires, d’une manière
simple et concise.

Tableau 3:les tache

10
 3 .Exigences fonctionnelles

Le projet de gestion des stocks pour l'entreprise Allo Abdo doit offrir les fonctionnalités suivantes :

 Gestion des commandes :

 Ajout, modification et suppression de produits.
 Affichage des détails d'un produit.
 Recherche de produits par référence, nom et catégorie.

 Gestion des entreprises:

 Ajout, modification et suppression d'entreprises.
 Affichage des détails d'une entreprise.
 Recherche d'entreprises par nom, adresse et numéro de téléphone.

 Gestion des stocks.

 Suivi des entrées et des sorties de stock.
 Affichage des niveaux de stock actuels.
 Recherche d'entreprises par nom, adresse et numéro de téléphone.

4. Exigences non fonctionnelles

Exigences de qualité :
Un site web simple à utiliser :

- Interface utilisateur conviviale

 Mise en page ergonomique facilitant la navigation et l'utilisation de
l'application.
 Choix de couleurs et de polices esthétiques.

- . Performance optimale :

 Temps de réponse rapide lors de l'accès aux fonctionnalités.

 Capacité à gérer un grand volume de données de stock.

- Sécurité des données :

 Authentification sécurisée pour l'accès à l'application.
 Confidentialité des informations stockées dans la base de données

11
5. Analyse et conception
La phase de la conception est la phase initiale de la création de la mise en œuvre de notre projet. En effet,
il représente une étape importante de réflexion dans le cycle du développement du logiciel. Dans ce
chapitre nous allons présenter en détails la conception à travers des diagrammes de Cas d’utilisation,
diagramme de séquence
a) Le diagramme de cas d’utilisation :

Les diagrammes de cas d’utilisation sont des outils visuels utilisés dans l’analyse et la conception des
systèmes logiciels. Ils permettent de représenter les interactions entre les acteurs externes et le système en
identifiant les fonctionnalités et les actions spécifiques que le système doit fournir. Les acteurs représentent
les entités externes, tandis que les cas d’utilisation décrivent les différentes actions et fonctionnalités du
système. Ces diagrammes sont utiles pour comprendre et communiquer les exigences du système de
manière claire et concise.

Figure 3:diagramme de cas d'utilisation

Dans ce diagramme, nous avons les éléments suivants :

Acteurs : Administrateur : Utilisateur qui a des droits étendus pour gérer le système.
L’administrateur doit s’authentifier avant de pouvoir effectuer les actions suivantes.
Acteurs : Administrateur : Utilisateur qui a des droits étendus pour gérer le système.
Créer une facture : L’administrateur peut créer une nouvelle facture dans le système.
Gestion des colis : L’administrateur peut gérer les colis, y compris leur création, leur suivi, leur
modification ou leur suppression.
Gestion des partenaires : L’administrateur peut gérer les partenaires, tels que les fournisseurs ou les
transporteurs, en ajoutant, modifiant ou supprimant leurs informations.
Modification des informations administratives : l’administrateur peut modifier les informations de son
propre compte administratif, telles que le nom, le mot de passe ou les coordonnées.

12
 b) Diagramme de séquence :
Le diagramme de séquence est un outil de modélisation utilisé pour représenter la séquence des
interactions entre les objets ou acteurs d’un système. Il montre comment ces entités interagissent au fil du
temps pour accomplir une fonctionnalité spécifique. Les objets ou acteurs sont représentés par des boîtes
ou des lifelines, et les messages échangés entre eux sont représentés par des flèches. Le diagramme de
séquence permet de visualiser clairement l’ordre chronologique des actions et des communications entre
les entités, ce qui facilite la compréhension et la conception du système.

Figure 4:diagramme de séquence 1/2

Dans le diagramme de séquence, l’administrateur commence par choisir une entreprise en sélectionnant
une période spécifique. Ensuite, l’application web reçoit cette sélection et affiche les résultats
correspondants, tels que les données liées à cette entreprise et à la période spécifiée.
Ensuite, l’administrateur peut choisir un modèle de facture parmi ceux disponibles dans L’application web.
Une fois le modèle sélectionné, l’application web génère la facture en utilisant les données de l’entreprise
et de la période sélectionnée, puis affiche la facture à l’administrateur.
Enfin, l’administrateur a la possibilité de télécharger la facture générée sur son appareil, lui permettant
ainsi de l’enregistrer ou de la partager selon ses besoins.

13
Figure 5:diagramme de séquence 2/2

Dans le diagramme de séquence, l'administrateur saisit des informations dans l'interface connexion.
Ensuite, les données sont transmises au contrôleur d’authentification pour vérification. Après vérification
de la conformité des informations, la base de données est alors interrogée au niveau du système et une
réponse est retournée sous forme de structure de données que nous avons appelée message.
Si les champs sont ne sont pas conformes ou si la réponse retourner par le système est vide alors le
message d’erreur correspondant est transmis à l‘interface d’authentification via la création d’un objet
appelé erreur d’authentification. Ce message d’erreur est affiché au niveau de l’interface de connexion

Si les informations fournies sont correctes c’est-à-dire si elles existent dans la base de données, des
variables de session sont alors créées à travers la fonction compte Utilisateur () qui retourne le résultat de
l’interrogation de la base de données. Ceci déclenche la création d’un objet appelé tableau de bord
(Dashboard). Dans la pratique l’administrateur est redirigé vers la page Dashboard

14
 c) Diagramme de Gantt
Le diagramme de Gantt est un outil de gestion de projet utilisé pour planifier, organiser et suivre les
différentes tâches d'un projet sur une période donnée. Il permet de visualiser les dépendances entre les
tâches, les échéances et la durée de chaque activité.

Figure 6:diagramme de Gantt

Le diagramme de Gantt est un outil de gestion de projet utilisé pour planifier, organiser et suivre les
différentes tâches d'un projet sur une période donnée. Il permet de visualiser les dépendances entre les
tâches, les échéances et la durée de chaque activité.

Le diagramme de Gantt est un outil utile pour planifier et suivre l'avancement d'un projet. Il permet de
visualiser les jalons, les délais et les dépendances entre les tâches, ce qui facilite la coordination et la
gestion des ressources. De nombreux logiciels de gestion de projet proposent des fonctionnalités pour créer
et mettre à jour des diagrammes de Gantt de manière dynamique.

15
Chapitre 2

Environnement de développement et
présentation de l’application

16
Environnement de développement et présentation de l’application

1. Environnement matériel

Pour développer le site web, j’ai utilisé comme environnement matériel, un ordinateur HP qui
possède comme caractéristiques :
 Mémoire Vive : 8 Go.
 Disque Dur : 250 Go SSD.
 Processeur : Core i5 7th génération.
 Type de système : Windows 10

2. Environnement logiciel :

 Windows 10 : comme système d’exploitation

 Visual Studio Code : est un environnement de développement intégré (IDE).

3. Les outils de développement :

Parmi les outils utilisés, on trouve :
- les langages de programmation qui permettent de construire les éléments des pages web, et qui
garantissent leur présentation visuelle.
- les systèmes de gestion de bases de données qui répondent aux différentes opérations de stockage et de
traitement des données.
L’objectif de ce chapitre est de présenter les différents outils que nous avons utilisés lors de la réalisation de
notre application, à savoir les langages de programmation PHP, JAVASCRIPT, AJAX, HTML/CSS et
MySQL.

StarUML : Est un outil d'ingénierie logicielle pour la modélisation de systèmes

à l'aide du langage de modélisation unifié (UML). Il est conçu pour prendre en
charge la modélisation agile et concise et s'adresse aux petites équipes de
développement agiles. StarUML est open source et fonctionne sous Windows. Il
prend en charge une large gamme de diagrammes UML, notamment les
diagrammes de classes, d'objets, de cas d'utilisation, de séquence, de
communication, d'état, d'activité, de composants, de déploiement et de timing.
StarUML vous permet également de générer du code à partir de vos modèles
dans plusieurs langages de programmation, notamment Java, C++ et C#.

Figure 7:staruml

17
 XAMPP : Est un logiciel qui fournit un environnement de
développement web complet, regroupant Apache, MySQL, PHP et
Perl. Il est souvent utilisé pour créer et tester des applications web
localement avant de les déployer sur un serveur en ligne. XAMPP est
disponible en téléchargement gratuit et est compatible avec les
Figure 8:xampp systèmes d'exploitation Windows, MacOs et Linux

PhpMyAdmin : Est une application web utilisée pour gérer les bases de
données MySQL. Elle offre une interface graphique conviviale permettant aux
utilisateurs de créer, modifier et gérer leurs bases de données, tables et
données. PhpMyAdmin simplifie les tâches d'administration en fournissant
une vue d'ensemble de la structure de la base de données et des fonctionnalités
Pour effectuer des opérations courantes sans nécessiter de connaissances
approfondies en SQL.
Figure 9:phpMyAdmin

L'HTML : Est un langage informatique utilisé sur l'internet. Ce langage est utilisé
pour créer des pages web. L'acronyme signifie HyperText Markup Language, ce qui
signifie en français "langage de balisage d'hypertexte". Cette signification porte bien
son nom puisqu'effectivement ce langage permet de réaliser de l'hypertexte à base
Figure 10:html d'une structure de balisage, sa dernière version est HTML5

CSS : Est un langage de feuille de style utilisé pour décrire la

présentation d'un document écrit dans un langage de balisage comme
HTML. CSS est une technologie fondamentale du World Wide Web,
avec HTML et JavaScript.

Figure 11:ccs

Visual Studio Code : Est un éditeur de code extensible développé par

Microsoft pour Windows, Linux et macOS. Les fonctionnalités incluent
la prise en charge du débogage, la mise en évidence de la syntaxe, la
complétion intelligente du code, les snippets, la refactorisation du code
et Git intégré.
Figure 12:visual studio

PHP: Est un langage de programmation web couramment utilisé pour

créer des sites dynamiques et interactifs. Son intégration directe dans le
code HTML facilite la génération de contenu dynamique. PHP offre des
fonctionnalités telles que la gestion de formulaires, de fichiers, de bases
Figure 13:php
de données et des sessions utilisateur.
18
 JavaScript (quelques fois abrégé JS): Est un langage de programmation de
scripts principalement utilisé dans les pages web interactives mais aussi côté
serveur. C'est un langage orienté objet à prototype, c'est-à-dire que les bases du
langage et ses principales interfaces sont fournies par des positionnements des
différents éléments, etc. Le terme de "Cascading" Style Sheets sous- entend
qu'il est possible de définir un style pour une page HTML puis, à l'intérieur de

Figure 14;JavaScript cette même page, de fournir des informations plus précises ou différentes pour
présenter certains éléments plus distinctement personnalisés.

Bootstrap: est un Framework de développement web qui simplifie la

création de sites modernes et réactifs grâce à sa grille de mise en page
flexible, ses composants prédéfinis et ses styles CSS prêts à l’emploi. Il
offre une interface conviviale et optimisée pour les appareils mobiles.
Figure 15:boostrop

Ajax : Est une technique de développement web qui permet de mettre à jour
dynamiquement une partie d'une page web sans recharger la page entière. Elle
utilise JavaScript et des requêtes HTTP asynchrones pour échanger des données
avec le serveur. Cela améliore l'expérience utilisateur en permettant des mises à
jour instantanées sans perturber le reste du contenu de la page.
Figure 16:Ajax

4. L’implantation du logiciel
a) Connexion
Ce chapitre présente les captures d’écran illustrant le résultat final de l’application accompagnées des
commentaires explicatifs démontrant en détails l’utilité de chacune des interfaces. L'interface de connexion
de l'administration présente un formulaire où les administrateurs peuvent entré leurs informations
d'identification. Elle se compose généralement des éléments suivants :
Un champ "Nom d'utilisateur" : C'est un champ de texte où les administrateurs peuvent saisir leur nom
d'utilisateur ou leur identifiant unique associé à leur compte d'administration.
Un champ "Mot de passe" : C'est un champ de texte masqué où les administrateurs peuvent entrer leur mot
de passe confidentiel. Le contenu du champ est généralement masqué par des astérisques ou des points
pour des raisons de sécurité.
Un bouton "Se connecter" : C'est un bouton permettant aux administrateurs de soumettre leurs
informations d'identification pour accéder à leur compte d'administration. Lorsque les administrateurs
cliquent sur ce bouton, les informations sont envoyées au serveur pour vérification.

19
Figure 17:formulaire d’authentification

b) Le Dashboard statique
Le Dashboard statique de notre application est spécifiquement conçu pour les administrateurs afin de leur
fournir une vue détaillée et visuellement attrayante des données clés. Il offre une interface conviviale et
intuitive qui permet aux administrateurs de surveiller les performances et les tendances de leur activité.
Vous trouverez différentes informations et graphiques pour les administrateurs. Voici les éléments que
vous avez mentionnés :

Figure 18:Dashboard. 1/2

20
Figure 19:Dashboard. 2/2

1-Nombre de clients : Le Dashboard affiche le nombre total de clients enregistrés dans l'application. Cela
donne aux administrateurs une indication de l'ampleur de la base de clients.
2-Bénéfices en dirhams : Le Dashboard présente les bénéfices totaux générés jusqu'à présent, exprimés en
dirhams.
3-Colis total : Le Dashboard indique le nombre total de colis enregistrés dans le système. Cela permet de
suivre le volume de travail et d'avoir une vue d'ensemble du nombre total de colis traités.
4-Total colis livrés : Le Dashboard fournit le nombre total de colis qui ont été livrés avec succès. Cette
information est essentielle pour suivre les performances de livraison et mesurer l'efficacité du processus.
5-Graphique des bénéfices par mois de l'année en cours : Le Dashboard présente un graphique qui
représente les bénéfices mensuels de l'année en cours. Cela permet aux administrateurs de visualiser les
tendances de revenus mensuelles et d'identifier les mois les plus performants.
6-Graphique du pourcentage des états des colis : Le Dashboard comprend un graphique qui illustre le
pourcentage des différents états des colis. Par exemple, il peut y avoir des couleurs différentes pour chaque
état, où le vert représente le nombre total de colis annulés, le jaune pour les colis refusés, le bleu pour les
colis livrés, etc. Cela permet aux administrateurs de comprendre rapidement la répartition des états des
colis.
7-Graphique des Bénéfices par Client : Ce graphique présente les bénéfices générés par chaque client. Il
permet aux administrateurs d'identifier les clients les plus rentables et de surveiller l'évolution des
bénéfices au fil du temps.
8-Evolution des colis du jour : Ce graphique affiche l'évolution du nombre de colis traités au cours de la
journée. Il offre une vue dynamique de l'activité des colis et permet aux administrateurs de détecter des
tendances ou des variations importantes.
9-Statistique des colis par mois de l'année en cours : Ce graphique présente les statistiques des colis par
mois de l'année en cours. Cela permet aux administrateurs de suivre les performances mensuelles et de
repérer les variations saisonnières.

c) Liste des Clients

Dans notre interface de liste des partenaires de l'entreprise, nous avons créé une section dédiée où les
administrateurs peuvent gérer les partenaires en effectuant différentes actions. Voici les détails et
fonctionnalités de cette interface :

21
Figure 20 : liste des clients.

Recherche par nom : Nous avons inclus un champ de recherche où l'administrateur peut saisir le nom d'un
partenaire spécifique. Cela permet de filtrer rapidement la liste des partenaires en fonction de leur nom.
Suppression de partenaires : Chaque partenaire est représenté par une entrée dans la liste, qui affiche des
informations essentielles telles que le nom, l'e-mail, le téléphone, l'adresse et une image. À côté de chaque
entrée, nous avons ajouté un bouton ou une option permettant à l'administrateur de supprimer le partenaire
correspondant de la liste, nous avons également inclus une autre option ou un autre bouton pour permettre
à l'administrateur de modifier les informations du partenaire.

Informations sur les partenaires : Chaque partenaire affiche les détails pertinents tels que le nom, l'e-mail,
le téléphone et l'adresse. Ces informations permettent à l'administrateur d'identifier facilement les
partenaires et de prendre contact avec eux si nécessaire.
Image du partenaire : Nous avons inclus la possibilité d'ajouter une image représentative pour chaque
partenaire. Cela ajoute une dimension visuelle à l'interface et permet aux administrateurs de mieux
reconnaître les partenaires.
Grâce à cette interface de liste des partenaires, les administrateurs peuvent gérer efficacement les
partenaires de l'entreprise. Ils peuvent effectuer des recherches rapides, supprimer des partenaires
indésirables et accéder facilement aux informations clés de chaque partenaire. Cela facilite la gestion et la
communication avec les partenaires de l'entreprise.

22
 d) Ajouter un Client

Figure 21:Ajouter un Client.

L'administrateur utilise un formulaire ou une interface de saisie pour fournir ces informations et ajouter le
partenaire à la liste des partenaires de l'entreprise. Une fois les informations saisies et validées, le
partenaire est enregistré dans la base de données de l'application et peut être affiché dans la liste des
partenaires.

e) Les Commandes

Figure 22:commande 1/2

23
Figure 23:Commande 2/2

Dans cette interface, l'administrateur dispose de deux options pour afficher les colis :
Afficher la liste des colis reçus : Cette fonctionnalité permet à l'administrateur de consulter uniquement les
colis qui ont été reçus jusqu'à présent. Avec des détails tels que le numéro de colis, nom de l'entreprise, la
date de livraison, nom de destinateur etc. L'administrateur peut utiliser des filtres ou des options de tri pour
faciliter la recherche et l'affichage des colis reçus spécifiques.
Afficher tous les colis : Cette fonctionnalité permet à l'administrateur d'afficher tous les colis enregistrés
dans le système, qu'ils aient été reçus, livrés, refusés ou annulés. Cela fournit une vue complète de tous les
colis traités par l'entreprise. L'administrateur peut également appliquer des filtres ou des options de tri pour
personnaliser l'affichage en fonction des besoins spécifiques.
Ces deux options offrent à l'administrateur la flexibilité de consulter les colis selon différents critères, que
ce soit pour se concentrer uniquement sur les colis reçus ou pour avoir une vue d'ensemble de tous les colis
enregistrés.

f) Les Information sur le Colis

Figure 24:Ajouter un colis.1/2

24
Figure 25:Ajouter un colis. 2/2

Pour enregistrer un colis, vous devez sélectionner l'entreprise, saisir la référence du colis et indiquer sa
valeur. De plus, vous aurez besoin des informations du client, notamment son nom, prénom, adresse et
numéro de téléphone. Ces détails permettent d'associer le colis au client spécifique et de faciliter la gestion
de la livraison.

g) Facturation

Figure 26:Facturation

Dans l'interface de facturation, l'administrateur doit saisir le nom de l'entreprise pour laquelle la facture est
générée. La facture est ensuite composée des éléments suivants :
Référence : Un identifiant unique attribué au colis ou à la transaction liée à la facture.
Valeur du Colis : Le montant en termes monétaires correspondant à la valeur du colis ou de la transaction.
25
Nom du Récepteur : Le nom de la personne ou de l'entreprise qui a réceptionné le colis ou bénéficié de la
transaction.
Date de réception : La date à laquelle le colis a été reçu ou la transaction a été effectuée.
En utilisant ces informations, l'interface permet à l'administrateur de générer la facture en remplissant les
champs appropriés avec les détails spécifiques.
De plus, l'administrateur a la possibilité de rechercher des colis par période.

h) paramètre

Figure 27: paramètre

Dans l'interface de paramètres, l'administrateur a la possibilité de modifier ses informations personnelles,

telles que son nom, nom d'utilisateur et mot de passe. Cela permet à l'administrateur de maintenir des
informations à jour et de sécuriser son compte. Les fonctionnalités typiques de cette interface incluent :
- Modification du nom : L'administrateur peut mettre à jour son nom affiché dans le système.
- Modification du nom d'utilisateur : L'administrateur peut changer son nom d'utilisateur utilisé pour se
connecter à l'interface d'administration.
- Modification du mot de passe : L'administrateur peut modifier son mot de passe actuel en en choisissant
un nouveau, renforçant ainsi la sécurité de son compte.
- Paramètres de sécurité supplémentaires : L'interface peut également permettre à l'administrateur de
configurer des fonctionnalités de sécurité supplémentaires, telles que l'authentification à deux facteurs,
pour renforcer la protection de son compte.
Ces fonctionnalités offrent à l'administrateur un contrôle sur ses informations personnelles et la possibilité
de maintenir un environnement sécurisé pour l'accès à l'interface d'administration.

26
 Conclusion
Pour conclure, ce stage en tant que développeur au sein de l'entreprise AlloAbdo a été une
expérience extrêmement enrichissante pour notre équipe. Nous avons eu l'opportunité de contribuer
activement au développement de l'application de gestion de stock, ce qui nous a permis de nous
impliquer pleinement dans les activités de l'entreprise et de comprendre les enjeux du secteur de la
logistique et de la gestion des stocks. Nous avons également pu développer nos compétences
techniques et acquérir une expérience précieuse dans le domaine de l'informatique.

Ce stage nous a également permis de découvrir l'équipe dynamique et passionnée d'AlloAbdo,

renforçant ainsi notre intérêt pour une carrière dans ce domaine. Nous sommes reconnaissants
envers l'entreprise pour cette opportunité et nous sommes convaincus que cette expérience sera un
atout précieux pour notre avenir professionnel.

27
Table des matières

Introduction ......................................................................................................................................6

Chapitre 1...............................................................................................................................................7

Présentation de l’organisme..................................................................................................................8

1. Description de l'organisme.....................................................................................................8

a) Organigramme .......................................................................................................................9

b) Cas étudié...............................................................................................................................9

2. Le cadre général ...................................................................................................................10

a) Critique de l'existant ............................................................................................................10

b) Présentation du sujet ............................................................................................................10

c) Les tâches principales ..........................................................................................................10

3 .Exigences fonctionnelles ....................................................................................................11

4. Exigences non fonctionnelles .....................................................................................................11

5. Analyse et conception .................................................................................................................12

a) Le diagramme de cas d’utilisation : .....................................................................................12

b) Diagramme de séquence : ....................................................................................................13

c) Diagramme de Gantt ............................................................................................................15

Chapitre 2 ............................................................................................................................................16

Environnement de développement et présentation de l’application ......................................16

1. Environnement matériel .......................................................................................................17

2. Environnement logiciel : ......................................................................................................17

3. Les outils de développement : ..............................................................................................17

4. L’implantation du logiciel ...................................................................................................19

a) Connexion ............................................................................................................................19

28
 b) Le Dashboard statique .........................................................................................................20

c) Liste des Clients ...................................................................................................................21

d) Ajouter un Client .................................................................................................................23

e) Les Commandes...................................................................................................................23

f) Les Information sur le Colis ................................................................................................24

g) Facturation ...........................................................................................................................25

h) paramètre .............................................................................................................................26

Conclusion ..........................................................................................................................................27

Webographie ......................................................................................................................................32

29
 Liste des figures

Figure 1:organigramme ....................................................................................................................................9

Figure 2:cas étudié ...........................................................................................................................................9
Figure 3:diagramme de cas d'utilisation ........................................................................................................12
Figure 4:diagramme de séquence 1/2 ............................................................................................................13
Figure 5:diagramme de séquence 2/2 ............................................................................................................14
Figure 6:diagramme de Gantt ........................................................................................................................15
Figure 7:staruml .............................................................................................................................................17
Figure 8:xampp ..............................................................................................................................................18
Figure 9:phpMyAdmin ..................................................................................................................................18
Figure 10:html ................................................................................................................................................18
Figure 11:ccs ..................................................................................................................................................18
Figure 12:visual studio ...................................................................................................................................18
Figure 13:php .................................................................................................................................................18
Figure 14;JavaScript ......................................................................................................................................19
Figure 15:boostrop .........................................................................................................................................19
Figure 16:Ajax ...............................................................................................................................................19
Figure 17:formulaire d’authentification .........................................................................................................20
Figure 18:Dashboard. 1/2...............................................................................................................................20
Figure 19:Dashboard. 2/2...............................................................................................................................21
Figure 20 : liste des clients.............................................................................................................................22
Figure 21:Ajouter un Client. ..........................................................................................................................23
Figure 22:commande 1/2 ...............................................................................................................................23
Figure 23:Commande 2/2 ..............................................................................................................................24
Figure 24:Ajouter un colis.1/2 .......................................................................................................................24
Figure 25:Ajouter un colis. 2/2 ......................................................................................................................25
Figure 26:Facturation .....................................................................................................................................25
Figure 27: paramètre ......................................................................................................................................26

30
 Liste des Tableaux
Tableau 1:liste des abréviations .......................................................................................................................2
Tableau 2:Description de l'organisation ..........................................................................................................8
Tableau 3:les tache .........................................................................................................................................10

31
Webographie
- https://www.fontawesome.com
- https://www.uigradients.com
- https://www.videvo.net
- https://getcssscan.com/css-box-shadow-examples
- https://www.unsplash.com
- https://css-tricks.com
- https://www.youtube.com/c/SabCode
- https://www.w3schools.com
https://www.pinterest.com

32
33
34
35