cm862sz/zkt26
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ajout des messages de retour ajout objet

Browse Source
This commit is contained in:
Mathis 2025-04-01 18:21:11 +02:00
parent 6d561a5f1e
commit 07af6af1d4
3 changed files with 60 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Front-end/src/components/MeteoInfos.jsx
View File

@ -31,7 +31,7 @@ function MeteoInfos({
console.log(rawData.length);
return (
<div key={object.id} className="bg-white p-6 rounded-xl min-w-5xl">
{(AffAlert) && (
{(AffAlert&&(object.status==="active")) && (
<AlertInactive affAlert={AffAlert} setAffAlert={setAffAlert} />
)}
<div className="flex align-items gap-6">

76
Front-end/src/pages/Gestion/AddObject.jsx
View File

@ -12,40 +12,49 @@ function AddObject() {
const [Response, setResponse] = useState(null);
const [isActive, setActive] = useState(true);
const [verif, setVerif] = useState(false);
const [enregistre, setEnregistre] = useState(false);
const [messRequete, setMessRequete] = useState("");
function handleSubmit(event) {
event.preventDefault();
if (verif) {
console.log("Envoi requete");
axios
.post(`${API_BASE_URL}/addObject`, {
nom,
description,
type,
location,
status,
})
.then((response) => {
console.log("Modification réussie :", response.data);
})
.catch((error) => {
console.error("Erreur lors de la modification :", error);
});
}else{
setVerif(true);
console.log("Envoi requete");
axios
.post(`${API_BASE_URL}/addObject`, {
nom,
description,
type,
location,
status,
})
.then((response) => {
setMessRequete("Votre objet à bien été enregistré !");
setEnregistre(true);
console.log("Ajout de l'objet réussit :", response.data);
})
.catch((error) => {
setMessRequete("Il y a eu une erreur dans l'ajout de votre objet !");
console.error("Erreur lors de l'ajout de l'objet :", error);
});
setVerif(false);
resetForm();
} else {
setVerif(true);
}
}
function resetForm() {
setNom("");
setStatus("");
setDescription("");
setType("");
setLocalisation("");
setActive(true);
}
function handleCancel() {
if(verif){
setVerif(false);
}else{
setNom("");
setStatus("");
setDescription("");
setType("");
setLocalisation("");
setActive(true);
if (verif) {
setVerif(false);
} else {
resetForm();
}
}
@ -74,7 +83,9 @@ function AddObject() {
<BadgePlus className="text-indigo-600" size={24} />
</div>
<h1 className="text-black text-2xl font-bold mb-1">
{(!verif)?("Entrez les données de votre nouvel objet"):("Êtes-vous sûr de ces données ?")}
{!verif
? "Entrez les données de votre nouvel objet"
: "Êtes-vous sûr de ces données ?"}
</h1>
</div>
<div className="mb-5">
@ -187,16 +198,19 @@ function AddObject() {
type={"submit"}
className="text-blue-500 hover:cursor-pointer hover:underline mb-2"
>
{(!verif)?("Confirmer les informations"):("Oui je suis sûr !")}
{!verif ? "Confirmer les informations" : "Oui je suis sûr !"}
</button>
<button
type="button"
className="text-red-500 hover:cursor-pointer hover:underline"
onClick={handleCancel}
>
{(!verif)?("Supprimer les informations"):("Non je veux changer !")}
</button>
{!verif ? "Supprimer les informations" : "Non je veux changer !"}
</button>
</div>
<p className={(enregistre)?("text-green-700"):("text-red-700")}>
{messRequete}
</p>
</form>
</div>
</div>

41
Front-end/src/pages/Gestion/ObjectManagement.jsx
View File

@ -1,17 +1,5 @@
import React from "react";
import {
Search,
MapPin,
Calendar,
Bus,
ArrowRight,
LogIn,
UserPlus,
RadioTower,
Binoculars,
Settings,
ChartArea,
} from "lucide-react";
import { Search, ArrowRight, RadioTower,Plus } from "lucide-react";
import { useEffect, useState } from "react";
import axios from "axios";
@ -19,7 +7,7 @@ function ObjectManagement() {
const [searchQuery, setSearchQuery] = useState("");
const [activeFilter, setActiveFilter] = useState("");
const [objects, setObjects] = useState([]);
const [nbAffObject,setnbAffObject] = useState(6);
const filteredDATA = objects.filter((node) => {
const matchesSearchQuery =
searchQuery === "" ||
@ -29,19 +17,12 @@ function ObjectManagement() {
const matchesTag =
activeFilter === "" ||
node.name.toLowerCase().includes(activeFilter.toLowerCase()) ||
node.description.includes(activeFilter.toLowerCase())||
(activeFilter=== "Active" && node.status.toLowerCase()==="active")||
(activeFilter=== "Inactive" && node.status.toLowerCase()==="inactive");
node.description.includes(activeFilter.toLowerCase()) ||
(activeFilter === "Active" && node.status.toLowerCase() === "active") ||
(activeFilter === "Inactive" && node.status.toLowerCase() === "inactive");
return matchesSearchQuery && matchesTag;
});
const handleSearchChange = (event) => {
setSearchQuery(event.target.value);
};
const handleTagFilterChange = (selectedTags) => {
setFilterTags(selectedTags);
};
useEffect(() => {
axios.get("http://localhost:8888/objets").then((response) => {
setObjects(response.data);
@ -126,19 +107,19 @@ function ObjectManagement() {
{filteredDATA.length === 0 ? (
<p>Aucun objet trouvé</p>
) : (
filteredDATA.map((object) => (
filteredDATA.slice(0,nbAffObject).map((object) => (
<div
key={object.id}
className="bg-white p-6 rounded-xl shadow-sm hover:shadow-md transition-shadow "
>
{(object.status==="active")?(
{object.status === "active" ? (
<div className="relative w-full">
<span className="absolute right-0 flex size-3">
<span className="absolute inline-flex h-full w-full rounded-full animate-ping bg-green-400 opacity-75"></span>
<span className="relative inline-flex size-3 rounded-full bg-green-500"></span>
</span>
</div>
):(
) : (
<div className="relative w-full">
<span className="absolute right-0 flex size-3">
<span className="relative inline-flex size-3 rounded-full bg-red-600"></span>
@ -161,6 +142,12 @@ function ObjectManagement() {
))
)}
</div>
{(nbAffObject<filteredDATA.length)&&(
<div className="flex items-center flex-col mt-6">
<button onClick={()=>{setnbAffObject((prev)=>prev+6 )}}><Plus size={40}/></button>
<label>Voir plus</label>
</div>
)}
</div>
</div>
);