diff --git a/frontend/src/components/Pages/Dashboard.jsx b/frontend/src/components/Pages/Dashboard.jsx index 45d708e..6535893 100644 --- a/frontend/src/components/Pages/Dashboard.jsx +++ b/frontend/src/components/Pages/Dashboard.jsx @@ -109,6 +109,35 @@ function Dashboard() { + + navigate("/admin/Gestion-Page-Accueil")} + sx={{ + cursor: "pointer", + textAlign: "center", + padding: 2, + transition: "0.3s", + "&:hover": { + backgroundColor: "#0e467f", + color: "#ffffff", + transform: "scale(1.05)", + boxShadow: 8, + }, + "&:hover svg": { + fill: "#ffffff", + }, + }} + > + + + + + + Gestion Page d'Accueil + + + + diff --git a/frontend/src/components/Pages/GestionPageAccueil.jsx b/frontend/src/components/Pages/GestionPageAccueil.jsx new file mode 100644 index 0000000..8f3c832 --- /dev/null +++ b/frontend/src/components/Pages/GestionPageAccueil.jsx @@ -0,0 +1,145 @@ +import React, { useState, useEffect } from "react"; +import { useNavigate } from "react-router-dom"; +import { updateHomePageACF } from "../../wordpress"; +import { getToken } from "../../auth"; +import { + Box, + Typography, + TextField, + Button, + Container, + Paper, +} from "@mui/material"; + +const GestionPageAccueil = () => { + const navigate = useNavigate(); + const [heroTitle, setHeroTitle] = useState(""); + const [heroText, setHeroText] = useState(""); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + + // ✅ Vérification de l'authentification (Redirection si non connecté) + useEffect(() => { + if (!getToken()) { + navigate("/admin/login"); + } + }, [navigate]); + + // ✅ Chargement des données ACF depuis WordPress + useEffect(() => { + const fetchPageData = async () => { + try { + const response = await fetch( + "https://preprod.octopusdesign.fr/api-octopus/server/wp-json/wp/v2/pages/13?_fields=acf", + { + method: "GET", + headers: { + "Content-Type": "application/json", + }, + } + ); + + if (!response.ok) { + throw new Error("Erreur de chargement des données"); + } + + const data = await response.json(); + setHeroTitle(data.acf?.hero_title || ""); + setHeroText(data.acf?.hero_text || ""); + setLoading(false); + } catch (error) { + console.error("❌ Erreur chargement ACF :", error); + setError("Impossible de charger les données."); + setLoading(false); + } + }; + + fetchPageData(); + }, []); + + // ✅ Mise à jour des champs ACF + const handleSave = async () => { + try { + const newData = { + hero_title: heroTitle, + hero_text: heroText, + }; + + console.log("📢 Données envoyées pour mise à jour ACF :", newData); + const updatedData = await updateHomePageACF(13, newData); + + alert("✅ Mise à jour réussie !"); + console.log("🔍 Données mises à jour reçues :", updatedData); + + window.location.reload(); // 🔄 Rafraîchissement pour voir les changements + } catch (error) { + console.error("❌ Erreur mise à jour :", error); + alert("⚠ Impossible de mettre à jour les champs ACF."); + } +}; + + return ( + + + {/* ✅ En-tête */} + + Gestion de la Page d'Accueil + + + {/* ✅ Affichage du statut de chargement */} + {loading ? ( + Chargement des données... + ) : error ? ( + + {error} + + ) : ( + <> + {/* ✅ Formulaire de modification */} + setHeroTitle(e.target.value)} + sx={{ mb: 2 }} + /> + + setHeroText(e.target.value)} + sx={{ mb: 2 }} + /> + + {/* ✅ Bouton d'enregistrement */} + + + {/* ✅ Bouton retour au Dashboard */} + + + )} + + + ); +}; + +export default GestionPageAccueil; \ No newline at end of file diff --git a/frontend/src/components/Pages/Home.jsx b/frontend/src/components/Pages/Home.jsx index 18e81f9..e561f70 100644 --- a/frontend/src/components/Pages/Home.jsx +++ b/frontend/src/components/Pages/Home.jsx @@ -21,14 +21,15 @@ const Home = () => { setIsLoading(true); setError(null); - const response = await api.get("wp/v2/pages/13?_fields=acf,rank_math_title,rank_math_description"); + // 🔥 Ajout d'un timestamp pour éviter la mise en cache + const response = await api.get(`wp/v2/pages/13?_fields=acf,rank_math_title,rank_math_description&_=${new Date().getTime()}`); const pageContent = response.data; setPageData(pageContent); - // Vérification et récupération de l'image Hero depuis l'API media de WordPress + // Récupération de l'image Hero const heroImageId = pageContent.acf?.img_hero; if (heroImageId) { - const mediaResponse = await api.get(`wp/v2/media/${heroImageId}`); + const mediaResponse = await api.get(`wp/v2/media/${heroImageId}?_=${new Date().getTime()}`); setHeroImage(mediaResponse.data.source_url); } else { setHeroImage(null); @@ -42,7 +43,7 @@ const Home = () => { }; fetchPageData(); - }, []); +}, []); if (isLoading) { return ( diff --git a/frontend/src/main.jsx b/frontend/src/main.jsx index c8d1bbb..f02ae50 100644 --- a/frontend/src/main.jsx +++ b/frontend/src/main.jsx @@ -8,6 +8,7 @@ import SimpleReactLightbox from "simple-react-lightbox"; import NotFound from "./components/Pages/NotFound.jsx"; import GestionArticles from "./components/Pages/GestionArticles"; import EditPost from "./components/EditPost"; +import GestionPageAccueil from "./components/Pages/GestionPageAccueil"; // Lazy loading des pages @@ -55,6 +56,7 @@ function YourApp() { } /> } /> } /> + } /> } />