diff --git a/.vs/2024-DEV-BUT3/v17/.wsuo b/.vs/2024-DEV-BUT3/v17/.wsuo index e79653d..f8426c5 100644 Binary files a/.vs/2024-DEV-BUT3/v17/.wsuo and b/.vs/2024-DEV-BUT3/v17/.wsuo differ diff --git a/.vs/slnx.sqlite b/.vs/slnx.sqlite index 4387610..849295c 100644 Binary files a/.vs/slnx.sqlite and b/.vs/slnx.sqlite differ diff --git a/README.md b/README.md index 1eabde0..101f732 100644 --- a/README.md +++ b/README.md @@ -11,6 +11,27 @@ Victor DESCAMPS the tests sheet 'api/image-request.test.jsx' was commented out to avoid over-sending requests to the google API during development. Remember to uncomment the file if you want to run all the tests once, but remember to recomment the file if you want to run a series of tests. An over-sending of requests could get us blocked for the day by google. +## Project summary (FR): + +Nous n'avons pas réussi à mettre en œuvre toutes les fonctionnalités de l'interface utilisateur à temps. Le développement n'a pas non plus été rigoureusement test-driven. + +résumé des fonctionnalités : + +En se connectant, l'utilisateur peut charger la liste des articleset les filtrer par pièce, date, nom, etc. Il est possible de créer et de mettre à jour des articles. +(Il n'y a pas de confirmation de réussite ou d'échec de création/update. La page doit être actualisée pour voir les résultats.) +Une page permet de consulter les statistiques des pièces et la liste des pièces. Il est possible d'y créer de nouvelles. La mise à jour des piècesn'est pas encore implémentée. + +Les icones AntDesign provoquent systématiquement une exception dans la console. Nous n'avons pas été en mesure de corriger ou éviter cette erreur. Les icones s'affichent bien, donc ça ne posera pas de problème à part la pollution de la console. + +Nous avons voulu personnaliser un peu notre projet pour le différencier des autres, nous avons donc mis en place un système simple de recherche automatique d'images liées aux objets enregistrés, et une requête à l'API Inspirobot à chaque rechargement de la page sur la page d'accueil pour un accueil chaleureux. + +Nous sommes conscients que ce projet ne correspond pas exactement aux attentes d'un développement full test-driven. Mais nous nous satisfaisons tout de même de nous être familiarisés avec js et React, avec les tests en général, et d'avoir pris du plaisir à développer ce petit projet. + +Nous vous souhaitons une bonne correction et vous remercions pour vos cours. + +Traduit avec DeepL.com (version gratuite) + + ## Run Locally diff --git a/src/assets/styles/diagram.css b/src/assets/styles/diagram.css index 094e6f9..3372b34 100644 --- a/src/assets/styles/diagram.css +++ b/src/assets/styles/diagram.css @@ -1,11 +1,11 @@ .diagram-container { - width: 100%; /* Utilise toute la largeur horizontale disponible */ + width: 100%; margin-bottom: 20px; } .row-container { display: flex; - align-items: flex-end; /* Alignement des éléments à la base */ + align-items: flex-end; margin-bottom: 10px; } @@ -20,9 +20,9 @@ .value { position: absolute; - bottom: 50%; /* Alignement par rapport à la base de l'élément parent */ + bottom: 50%; right: 0; - transform: translate(50%, 50%); /* Ajustement de la position */ + transform: translate(50%, 50%); color: white; font-size: 12px; padding: 5px; @@ -35,6 +35,6 @@ text-align: center; font-size: 14px; color: #333; - position: relative; /* Permet l'alignement des labels à la base */ - bottom: 0; /* Alignement à la base */ + position: relative; + bottom: 0; } \ No newline at end of file diff --git a/src/assets/styles/item-page.css b/src/assets/styles/item-page.css index 27f1827..24ea94e 100644 --- a/src/assets/styles/item-page.css +++ b/src/assets/styles/item-page.css @@ -87,12 +87,10 @@ } -/* Style pour les boutons de pagination */ .pagination button { margin: 0 5px; } -/* Style pour les ItemBox */ .item-container .item-list .ant-col { display: flex; justify-content: center; diff --git a/src/assets/styles/itembox.css b/src/assets/styles/itembox.css index 2f0b303..9955900 100644 --- a/src/assets/styles/itembox.css +++ b/src/assets/styles/itembox.css @@ -9,7 +9,7 @@ border-radius: 8px; padding: 15px; margin-bottom: 20px; - width: 250px; /* Largeur ajustable en fonction de votre mise en page */ + width: 250px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } diff --git a/src/assets/styles/modal.css b/src/assets/styles/modal.css index a021ecd..2d82643 100644 --- a/src/assets/styles/modal.css +++ b/src/assets/styles/modal.css @@ -1,4 +1,3 @@ -/* CSS pour la fenêtre modale */ .modal { display: flex; justify-content: center; diff --git a/src/assets/styles/room-list.css b/src/assets/styles/room-list.css index 6a60e51..2087e5c 100644 --- a/src/assets/styles/room-list.css +++ b/src/assets/styles/room-list.css @@ -1,22 +1,22 @@ .list-container { width: 100%; max-height:500px; - overflow-y: auto; /* Activer le défilement vertical si nécessaire */ - padding: 20px; /* Espace intérieur de la liste */ + overflow-y: auto; + padding: 20px; } .room-details { - width: 100%; /* Largeur de chaque boîte */ + width: 100%; background-color: #f9f9f9; border-radius: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); padding: 20px; - margin-bottom: 20px; /* Espace entre chaque boîte */ + margin-bottom: 20px; transition: transform 0.3s ease; } .room-details:hover { - transform: translateY(-5px); /* Effet d'élévation au survol */ + transform: translateY(-5px); } .room-details .title { diff --git a/src/components/diagram.jsx b/src/components/diagram.jsx index cb8d26e..e058d53 100644 --- a/src/components/diagram.jsx +++ b/src/components/diagram.jsx @@ -15,8 +15,8 @@ const Diagram = ({ data }) => {

Prix total par an

{diagramData.map(({ name, value }) => { - // Appliquer l'�chelle logarithmique � la valeur - const scaledValue = Math.log(value + 1); // Ajouter 1 pour �viter le logarithme de z�ro + // Appliquer l'�chelle logarithmique sur la valeur + const scaledValue = Math.log(value + 1); const scaledMaxValue = Math.log(maxValue + 1); return (
diff --git a/src/components/form/formCreateItem.jsx b/src/components/form/formCreateItem.jsx index b82d306..a87c0b2 100644 --- a/src/components/form/formCreateItem.jsx +++ b/src/components/form/formCreateItem.jsx @@ -32,8 +32,7 @@ export const FormCreateItem = ({ onClose }) => { values, ); console.log(response.data); - // Fermer la fenêtre modale après soumission réussie - onClose(); + } catch (error) { console.error(error); } diff --git a/src/components/form/formUpdateItem.jsx b/src/components/form/formUpdateItem.jsx index 529cbb6..84d979e 100644 --- a/src/components/form/formUpdateItem.jsx +++ b/src/components/form/formUpdateItem.jsx @@ -75,8 +75,7 @@ export const FormUpdateItem = ({ itemId, onClose }) => { values, ); console.log(response.data); - // Fermer la fenêtre modale après soumission réussie - onClose(); + } catch (error) { console.error(error); } @@ -87,7 +86,7 @@ export const FormUpdateItem = ({ itemId, onClose }) => {

Update Item

diff --git a/src/components/form/formUpdateRoom.jsx b/src/components/form/formUpdateRoom.jsx new file mode 100644 index 0000000..b8b8120 --- /dev/null +++ b/src/components/form/formUpdateRoom.jsx @@ -0,0 +1,58 @@ +import React, { useState, useEffect } from "react"; +import {getRoom } from '../../api/room' +import { Form, Input, Button } from "antd"; +import axios from "axios"; + +export const FormUpdateRoom = ({_id}) => { + const [form] = Form.useForm(); + const [room, setRoom] = useState(); + + //useEffect(() => { + // const fetchData = async () => { + // const roomsResponse = await getRoom(_id); + // setRoom(roomsResponse); + // console.log(roomsResponse); + // }; + + // fetchData(); + //}, [_id]); + + //useEffect(() => { + // if (room) { + // form.setFieldsValue({ + // ...room + // }); + // } + //}, [room, form]); + + const onFinish = async (values) => { + try { + const response = await axios.post( + `${import.meta.env.VITE_API_URL}/room`, + values, + ); + console.log(response.data); + } catch (error) { + console.error(error); + } + }; + + return ( + + + + + + + + + ); +}; + +export default FormUpdateRoom; diff --git a/src/components/item/ItemBox.jsx b/src/components/item/ItemBox.jsx index 29c0a79..811988d 100644 --- a/src/components/item/ItemBox.jsx +++ b/src/components/item/ItemBox.jsx @@ -6,16 +6,13 @@ import { Image } from "../parts/image"; import { Description } from "../parts/description"; import { Characteristic } from "../parts/characteristic"; -// Composant Détails du Produit export const ItemBox = ({ model, brand, purchaseDate, price, _id }) => { const [isModalOpen, setIsModalOpen] = useState(false); - // Fonction pour ouvrir la fenêtre modale const openModal = () => { setIsModalOpen(true); }; - // Fonction pour fermer la fenêtre modale const closeModal = () => { setIsModalOpen(false); }; diff --git a/src/components/nav/Navbar.jsx b/src/components/nav/Navbar.jsx index 30503f3..18fb182 100644 --- a/src/components/nav/Navbar.jsx +++ b/src/components/nav/Navbar.jsx @@ -25,9 +25,7 @@ function getItem(key, label) { const { SubMenu } = Menu; -// Component const Navbar = () => { - //Hook calls const [rooms, setRooms] = useState([]); useEffect(() => { @@ -56,7 +54,6 @@ const Navbar = () => { , ]; - // Rendu du composant Navbar try { return ( { return (
diff --git a/src/components/parts/description.jsx b/src/components/parts/description.jsx index 028ea69..02fab8a 100644 --- a/src/components/parts/description.jsx +++ b/src/components/parts/description.jsx @@ -1,6 +1,5 @@ import React, { useEffect, useState } from "react"; -// Composant Description export const Description = ({ title, children }) => { return (
diff --git a/src/components/parts/image.jsx b/src/components/parts/image.jsx index ac6c3fc..57acfe4 100644 --- a/src/components/parts/image.jsx +++ b/src/components/parts/image.jsx @@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react'; import { searchAndResizeImage } from '../../api/image-request' -// Composant Image export const Image = ({ src, alt, request, _id }) => { const [cacheUrl, setCacheUrl] = useState(null); @@ -28,7 +27,7 @@ export const Image = ({ src, alt, request, _id }) => { return {alt}; } else if (cacheUrl) { return {alt}; - } else { - return {alt}; + } else {//default image + return {alt}; } } \ No newline at end of file diff --git a/src/components/rooms/room-detail.jsx b/src/components/rooms/room-detail.jsx index 8ef7f83..f77bf9c 100644 --- a/src/components/rooms/room-detail.jsx +++ b/src/components/rooms/room-detail.jsx @@ -1,11 +1,10 @@ import React, { useEffect, useState } from "react"; import { FormCreateRoom } from "../../components/form/formCreateRoom"; -//import { RoomUpdateForm } from './RoomUpdateForm'; +import { FormUpdateRoom } from "../../components/form/formUpdateRoom"; export const RoomDetail = ({ selectedRoom, onCreateFormSubmit, - onUpdateFormSubmit, onBack, }) => { const [isUpdateFormVisible, setIsUpdateFormVisible] = useState(false); @@ -16,12 +15,6 @@ export const RoomDetail = ({ } }, [selectedRoom]); - // Afficher le formulaire de mise � jour lorsqu'une chambre est s�lectionn�e - const handleRoomClick = () => { - setIsUpdateFormVisible(true); - }; - - // Afficher le formulaire de cr�ation lorsqu'on revient en arri�re const handleBackClick = () => { setIsUpdateFormVisible(false); onBack(null); @@ -31,9 +24,9 @@ export const RoomDetail = ({
{isUpdateFormVisible ? (
-

Modifier une chambre

+

Modifier une chambre (non fonctionnel)

- +
) : (
diff --git a/src/components/rooms/room-list.jsx b/src/components/rooms/room-list.jsx index 4405850..7006ae3 100644 --- a/src/components/rooms/room-list.jsx +++ b/src/components/rooms/room-list.jsx @@ -3,16 +3,8 @@ import "../../assets/styles/room-list.css"; import { RoomBox } from "../../components/rooms/roomBox"; import { formatRoomStats } from "../../api/room"; -// Fonction pour diviser le tableau d'items en rang�es -const chunkArray = (arr, size) => { - const chunkedArr = []; - for (let i = 0; i < arr.length; i += size) { - chunkedArr.push(arr.slice(i, i + size)); - } - return chunkedArr; -}; -// Composant d'affichage de la page + export const RoomList = ({ statsParam, onRoomClick }) => { const [rooms, setRooms] = useState([]); const [selectedRoom, setSelectedRoom] = useState("all"); diff --git a/src/components/rooms/room-stats.jsx b/src/components/rooms/room-stats.jsx index 8e6742c..df5c4b2 100644 --- a/src/components/rooms/room-stats.jsx +++ b/src/components/rooms/room-stats.jsx @@ -21,7 +21,7 @@ const RoomStats = ({statsParam}) => { useEffect(() => { if (stats) { let table = Object.entries(stats.years) - .filter(([year, value]) => value !== 0) // Filtrer les entrées où Y n'est pas égal à 0 + .filter(([year, value]) => value !== 0) .map(([year, value]) => ({ name: year, value: value })); setDiagramValues(table); }