Maquette de la liste des produits

[The0o]

La maquette de la liste des produits reprend la maquette de l'issue #4, en plus de venir rajouter quelques éléments.

DoD

Général

Quand l'utilisateur navigue sur la page, il accède à la liste des produits vendus sur la catégorie qu'il a sélectionné. Les produits sont triés par défaut par les plus vendus. L'utilisateur pourra trier et filtrer les habits selon plusieurs critères. Il pourra trier les produits par "Nombre de produit vendu", "Prix ascendant", "Prix descendant" et "Nouveauté". Il est possible de filtrer les produits par la taille, la couleur, le prix du produit, le type de produit et la réduction sur le produit.

Barre de navigation

En haut de la page, une barre de navigation permet de rediriger vers l'accueil du site via le logo Wirefit. L'utilisateur peut accéder depuis la barre de navigation à la page "Homme", "Femme", "Enfant". Il suffit de cliquer sur un de ces trois textes pour être redirigé vers la page correspondante. De plus, lorsque la souris de l'utilisateur est sur une de ces catégories, des sous-catégories s'affichent (comme pantalon, shirt, t-shirt...). Il existe deux autres boutons, un pour aller voir les produits qui sont dans le panier, et un autre pour aller sur le profil de l'utilisateur si connecté, où sur la page de connexion si non-connecté.

Liste des tâches

• [x] La liste des produits est comforme à la liste des produits présents en base de données.
• [x] Il est possible de trier les produits par "Nombre de produit vendu", "Prix ascendant", "Prix descendant" et "Nouveauté"
• [x] Il est aussi possible de filtrer les produits par la taille, la couleur, le prix du produit, le type de produit et la réduction sur le produit
• [x] Chaque produit possède obligatoirement un prix, une catégorie et un nom. Ces valeurs correspondent à ceux en base de données
• [x] Cliquer sur un produit le redirige vers le produit en question
• [x] La barre de navigation est composé du logo Wirefit, d'un label "Homme", "Femme" et "Enfant".
• [x] Lors d'un clique sur le logo Wirefit, l'utilisateur est redirigé à l'accueil du site
• [x] Cliquer sur une de ces catégories dirige vers la page correspondante
• [x] Un bouton avec un panier dirige vers le panier de l'utilisateur si il est connecté. Le cas échéant, il est redirigé sur une page pour se connecter.
• [x] Un bouton avec un bonhome redirige vers le compte de l'utilisateur si il est connecté. Le cas échéant, il est redirigé sur une page pour se connecter.

[The0o]

La maquette de l'affichage de la liste des produits est fonctionelle et correspond à l'issue.