section constructions
This commit is contained in:
+2
-2
@@ -2,10 +2,10 @@
|
|||||||
<html lang="fr">
|
<html lang="fr">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" href="/favicon.ico" />
|
<title>bureau d’études Maîtrise d’oeuvre</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<link rel="icon" href="/favicon.ico" />
|
||||||
<link rel="preload" href="/src/assets/vendor-BFTbvl5C.js" as="script">
|
<link rel="preload" href="/src/assets/vendor-BFTbvl5C.js" as="script">
|
||||||
<title>Création web</title>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="root"></div>
|
<div id="root"></div>
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
@@ -0,0 +1,165 @@
|
|||||||
|
import React from "react";
|
||||||
|
import {
|
||||||
|
Box,
|
||||||
|
Typography,
|
||||||
|
Button,
|
||||||
|
Grid,
|
||||||
|
Card,
|
||||||
|
CardContent,
|
||||||
|
} from "@mui/material";
|
||||||
|
|
||||||
|
const ConstructSection = ({
|
||||||
|
constructTitle,
|
||||||
|
constructSubtitle,
|
||||||
|
constructText,
|
||||||
|
constructSector,
|
||||||
|
constructNoteText,
|
||||||
|
missionTitle,
|
||||||
|
missionItems,
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<Box
|
||||||
|
sx={{
|
||||||
|
py: 6,
|
||||||
|
px: 4,
|
||||||
|
backgroundColor: "#f9f9f9",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Grid container spacing={4}>
|
||||||
|
{/* Left Column */}
|
||||||
|
<Grid item xs={12} md={6}>
|
||||||
|
<Box>
|
||||||
|
{/* Titre et sous-titre */}
|
||||||
|
<Typography
|
||||||
|
variant="h2"
|
||||||
|
sx={{
|
||||||
|
fontWeight: "bold",
|
||||||
|
fontSize: { xs: "2rem", md: "2.4rem", lg: "3rem" },
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "column",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{constructTitle}{" "}
|
||||||
|
<Typography
|
||||||
|
component="span"
|
||||||
|
sx={{
|
||||||
|
fontSize: { xs: "2rem", md: "2rem", lg: "2rem" },
|
||||||
|
|
||||||
|
color: "#0e467f",
|
||||||
|
fontWeight: "bold",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{constructSubtitle}
|
||||||
|
</Typography>
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
{/* Secteurs */}
|
||||||
|
<Typography
|
||||||
|
variant="body1"
|
||||||
|
sx={{
|
||||||
|
mt: 2,
|
||||||
|
fontWeight: "bold",
|
||||||
|
color: "#0e467f",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Secteurs : {constructSector}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Typography
|
||||||
|
variant="body1"
|
||||||
|
sx={{
|
||||||
|
mt: 2,
|
||||||
|
fontSize: { xs: "1rem", md: "1.2rem" },
|
||||||
|
lineHeight: 1.6,
|
||||||
|
color: "#666",
|
||||||
|
}}
|
||||||
|
dangerouslySetInnerHTML={{ __html: constructText }}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* Cadre résumé */}
|
||||||
|
<Card
|
||||||
|
sx={{
|
||||||
|
mt: 4,
|
||||||
|
backgroundColor: "#0e467f",
|
||||||
|
color: "#fff",
|
||||||
|
borderRadius: "12px",
|
||||||
|
boxShadow: "0 8px 20px rgba(0, 0, 0, 0.1)",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<CardContent>
|
||||||
|
<Typography
|
||||||
|
variant="body1"
|
||||||
|
sx={{
|
||||||
|
fontSize: "1.1rem",
|
||||||
|
lineHeight: 1.6,
|
||||||
|
textAlign: "center",
|
||||||
|
}}
|
||||||
|
dangerouslySetInnerHTML={{ __html: constructNoteText }}
|
||||||
|
/>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</Box>
|
||||||
|
</Grid>
|
||||||
|
|
||||||
|
{/* Right Column */}
|
||||||
|
<Grid item xs={12} md={6}>
|
||||||
|
<Box
|
||||||
|
sx={{
|
||||||
|
backgroundColor: "#fff",
|
||||||
|
borderRadius: "12px",
|
||||||
|
boxShadow: "0 8px 20px rgba(0, 0, 0, 0.1)",
|
||||||
|
overflow: "hidden",
|
||||||
|
position: "relative",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Typography
|
||||||
|
variant="h3"
|
||||||
|
sx={{
|
||||||
|
fontWeight: "bold",
|
||||||
|
textAlign: "center",
|
||||||
|
mt: 3,
|
||||||
|
mb: 2,
|
||||||
|
color: "#0e467f",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{missionTitle}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Box
|
||||||
|
sx={{
|
||||||
|
position: "relative",
|
||||||
|
height: "400px",
|
||||||
|
backgroundImage: `url('https://via.placeholder.com/600x400')`, // Replace with the image URL or dynamic data
|
||||||
|
backgroundSize: "cover",
|
||||||
|
backgroundPosition: "center",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{missionItems.map((item, index) => (
|
||||||
|
<Box
|
||||||
|
key={index}
|
||||||
|
sx={{
|
||||||
|
position: "absolute",
|
||||||
|
top: item.top,
|
||||||
|
left: item.left,
|
||||||
|
transform: "translate(-50%, -50%)",
|
||||||
|
backgroundColor: "#0e467f",
|
||||||
|
color: "#fff",
|
||||||
|
padding: "6px 12px",
|
||||||
|
borderRadius: "20px",
|
||||||
|
fontSize: "0.9rem",
|
||||||
|
fontWeight: "bold",
|
||||||
|
textAlign: "center",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{item.label}
|
||||||
|
</Box>
|
||||||
|
))}
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
</Grid>
|
||||||
|
</Grid>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ConstructSection;
|
||||||
@@ -4,6 +4,7 @@ import SEO from "../SEO";
|
|||||||
import api from "../../api";
|
import api from "../../api";
|
||||||
import ModernSpinner from "../SpinnerModerne";
|
import ModernSpinner from "../SpinnerModerne";
|
||||||
import Expertises from "../Expertises";
|
import Expertises from "../Expertises";
|
||||||
|
import ConstructSection from "../ConstructSection";
|
||||||
import {
|
import {
|
||||||
Box,
|
Box,
|
||||||
Grid,
|
Grid,
|
||||||
@@ -31,8 +32,23 @@ const Home = () => {
|
|||||||
const [isLoading, setIsLoading] = useState(true);
|
const [isLoading, setIsLoading] = useState(true);
|
||||||
const [error, setError] = useState(null);
|
const [error, setError] = useState(null);
|
||||||
|
|
||||||
|
//Construction
|
||||||
|
const [constructTitle, setConstructTitle] = useState("Construisons vos projets");
|
||||||
|
const [constructSubtitle, setConstructSubtitle] = useState("ensemble");
|
||||||
|
const [constructSector, setConstructSector] = useState("Industriel | Tertiaire | Privée");
|
||||||
|
const [constructText, setConstructText] = useState("IN3, bureau d'études Ingénierie et Maîtrise d’œuvre, est implanté depuis 20 ans sur Le Mans. Nous étudions vos projets en structure, gros œuvre, électricité courants forts et faibles, et fluides, tout corps d'état.");
|
||||||
|
const [constructNoteText, setConstructNoteText] = useState("À votre écoute, nous travaillons avec et pour vous dans le but de satisfaire vos besoins tant sur le plan architectural que technique, méthodologique et/ou économique.");
|
||||||
|
const [missionTitle, setMissionTitle] = useState("Nos missions principales");
|
||||||
|
const [missionItems, setMissionItems] = useState([
|
||||||
|
{ label: "Diagnostics | Sécurité", top: "20%", left: "50%" },
|
||||||
|
{ label: "Études techniques", top: "50%", left: "30%" },
|
||||||
|
{ label: "Bureau d'études | Maîtrise d’œuvre", top: "70%", left: "60%" },
|
||||||
|
]);
|
||||||
|
|
||||||
// ACF Expertise
|
// ACF Expertise
|
||||||
const [expertiseTitle, setExpertiseTitle] = useState("Titre Pourquoi Nous Choisir ?");
|
const [expertiseTitle, setExpertiseTitle] = useState(
|
||||||
|
"Titre Pourquoi Nous Choisir ?"
|
||||||
|
);
|
||||||
const [expertise1Title, setExpertise1Title] = useState("Titre Expertise 1");
|
const [expertise1Title, setExpertise1Title] = useState("Titre Expertise 1");
|
||||||
const [expertise1Text, setExpertise1Text] = useState("Text Expertise 1");
|
const [expertise1Text, setExpertise1Text] = useState("Text Expertise 1");
|
||||||
const [expertise2Title, setExpertise2Title] = useState("Titre Expertise 2");
|
const [expertise2Title, setExpertise2Title] = useState("Titre Expertise 2");
|
||||||
@@ -40,7 +56,6 @@ const Home = () => {
|
|||||||
const [expertise3Title, setExpertise3Title] = useState("Titre Expertise 3");
|
const [expertise3Title, setExpertise3Title] = useState("Titre Expertise 3");
|
||||||
const [expertise3Text, setExpertise3Text] = useState("Text Expertise 3");
|
const [expertise3Text, setExpertise3Text] = useState("Text Expertise 3");
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const fetchPageData = async () => {
|
const fetchPageData = async () => {
|
||||||
try {
|
try {
|
||||||
@@ -74,21 +89,23 @@ const Home = () => {
|
|||||||
setBackgroundImage(null);
|
setBackgroundImage(null);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Section Construction
|
||||||
|
setConstructTitle(acf?.gdc_construct.construct_title || "Construisons vos projets");
|
||||||
|
setConstructSubtitle(acf?.gdc_construct.construct_subtitle || "ensemble");
|
||||||
|
setConstructText(acf?.gdc_construct.construct_text || "Texte par défaut");
|
||||||
|
setConstructSector(acf?.gdc_construct.construct_sector || "Secteurs");
|
||||||
|
setConstructNoteText(acf?.gdc_construct.construct_note || "Note société");
|
||||||
|
setMissionTitle(acf?.mission_title || "Nos missions principales");
|
||||||
|
setMissionItems(acf?.mission_items || []);
|
||||||
|
|
||||||
// Récupération du titre de la deuxième section Expertise
|
// Récupération du titre de la deuxième section Expertise
|
||||||
setExpertiseTitle(acf?.titre_expertise || "Pourquoi Nous Choisir ?");
|
setExpertiseTitle(acf?.titre_expertise || "Pourquoi Nous Choisir ?");
|
||||||
setExpertise1Title(acf?.gdc_expert.titre_expertise_1 || "Expertise 1");
|
setExpertise1Title(acf?.gdc_expert.titre_expertise_1 || "Expertise 1");
|
||||||
setExpertise1Text(
|
setExpertise1Text(acf?.gdc_expert.text_expertise_1 || "Text Expertise 1");
|
||||||
acf?.gdc_expert.text_expertise_1 || "Text Expertise 1"
|
|
||||||
);
|
|
||||||
setExpertise2Title(acf?.gdc_expert.titre_expertise_2 || "Expertise 2");
|
setExpertise2Title(acf?.gdc_expert.titre_expertise_2 || "Expertise 2");
|
||||||
setExpertise2Text(
|
setExpertise2Text(acf?.gdc_expert.text_expertise_2 || "Text Expertise 2");
|
||||||
acf?.gdc_expert.text_expertise_2 || "Text Expertise 2"
|
|
||||||
);
|
|
||||||
setExpertise3Title(acf?.gdc_expert.titre_expertise_3 || "Expertise 3");
|
setExpertise3Title(acf?.gdc_expert.titre_expertise_3 || "Expertise 3");
|
||||||
setExpertise3Text(
|
setExpertise3Text(acf?.gdc_expert.text_expertise_3 || "Text Expertise 3");
|
||||||
acf?.gdc_expert.text_expertise_3 || "Text Expertise 3"
|
|
||||||
);
|
|
||||||
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("Erreur lors de la récupération des données :", error);
|
console.error("Erreur lors de la récupération des données :", error);
|
||||||
setError("Impossible de charger les données. Veuillez réessayer.");
|
setError("Impossible de charger les données. Veuillez réessayer.");
|
||||||
@@ -103,7 +120,7 @@ const Home = () => {
|
|||||||
if (isLoading) {
|
if (isLoading) {
|
||||||
return (
|
return (
|
||||||
<div style={{ textAlign: "center", padding: "50px" }}>
|
<div style={{ textAlign: "center", padding: "50px" }}>
|
||||||
<ModernSpinner /> // Utilisation du spinner moderne
|
<ModernSpinner />
|
||||||
<p>Chargement des données...</p>
|
<p>Chargement des données...</p>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
@@ -128,11 +145,7 @@ const Home = () => {
|
|||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
{/* SEO */}
|
{/* SEO */}
|
||||||
<SEO
|
<SEO title={metaTitle} description={metaDescription} canonicalUrl={canonicalUrl}/>
|
||||||
title={metaTitle}
|
|
||||||
description={metaDescription}
|
|
||||||
canonicalUrl={canonicalUrl}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{/* Section Héros */}
|
{/* Section Héros */}
|
||||||
<Hero
|
<Hero
|
||||||
@@ -144,6 +157,17 @@ const Home = () => {
|
|||||||
textColor={heroTextColor}
|
textColor={heroTextColor}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
{/* Section Construisons */}
|
||||||
|
<ConstructSection
|
||||||
|
constructTitle={constructTitle}
|
||||||
|
constructSubtitle={constructSubtitle}
|
||||||
|
constructNoteText={constructNoteText}
|
||||||
|
constructText={constructText}
|
||||||
|
constructSector={constructSector}
|
||||||
|
missionTitle={missionTitle}
|
||||||
|
missionItems={missionItems}
|
||||||
|
/>
|
||||||
|
|
||||||
<Expertises
|
<Expertises
|
||||||
expertiseTitle={expertiseTitle}
|
expertiseTitle={expertiseTitle}
|
||||||
expertise1Title={expertise1Title}
|
expertise1Title={expertise1Title}
|
||||||
|
|||||||
@@ -95,7 +95,7 @@ function register_multiple_acf_dashboard_menus() {
|
|||||||
// Menu principal
|
// Menu principal
|
||||||
add_menu_page(
|
add_menu_page(
|
||||||
'Gestion des Champs ACF', // Titre de la page principale
|
'Gestion des Champs ACF', // Titre de la page principale
|
||||||
'ACF Manager', // Texte du menu
|
'Page d\'accueil', // Texte du menu
|
||||||
'manage_options', // Capacité requise
|
'manage_options', // Capacité requise
|
||||||
'acf-manager', // Slug du menu principal
|
'acf-manager', // Slug du menu principal
|
||||||
'acf_manager_main_page', // Fonction de rappel pour la page principale
|
'acf_manager_main_page', // Fonction de rappel pour la page principale
|
||||||
@@ -107,17 +107,27 @@ function register_multiple_acf_dashboard_menus() {
|
|||||||
add_submenu_page(
|
add_submenu_page(
|
||||||
'acf-manager', // Slug du menu parent
|
'acf-manager', // Slug du menu parent
|
||||||
'Groupe 1 ACF', // Titre de la page
|
'Groupe 1 ACF', // Titre de la page
|
||||||
'Page d\'accueil', // Texte du sous-menu
|
'Section Hero', // Texte du sous-menu
|
||||||
'manage_options', // Capacité requise
|
'manage_options', // Capacité requise
|
||||||
'acf-manager-group-1', // Slug du sous-menu
|
'acf-manager-group-1', // Slug du sous-menu
|
||||||
'acf_manager_group_1' // Fonction de rappel pour afficher le contenu
|
'acf_manager_group_1' // Fonction de rappel pour afficher le contenu
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Sous-menu pour le Groupe 2
|
||||||
|
add_submenu_page(
|
||||||
|
'acf-manager',
|
||||||
|
'Groupe 3 ACF',
|
||||||
|
'Section Construction',
|
||||||
|
'manage_options',
|
||||||
|
'acf-manager-group-3',
|
||||||
|
'acf_manager_group_3'
|
||||||
|
);
|
||||||
|
|
||||||
// Sous-menu pour le Groupe 2
|
// Sous-menu pour le Groupe 2
|
||||||
add_submenu_page(
|
add_submenu_page(
|
||||||
'acf-manager',
|
'acf-manager',
|
||||||
'Groupe 2 ACF',
|
'Groupe 2 ACF',
|
||||||
'section expertise',
|
'Section Expertise',
|
||||||
'manage_options',
|
'manage_options',
|
||||||
'acf-manager-group-2',
|
'acf-manager-group-2',
|
||||||
'acf_manager_group_2'
|
'acf_manager_group_2'
|
||||||
@@ -153,6 +163,28 @@ function acf_manager_group_1() {
|
|||||||
<?php
|
<?php
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Groupe 3 - Champs ACF
|
||||||
|
function acf_manager_group_3() {
|
||||||
|
?>
|
||||||
|
<div class="wrap">
|
||||||
|
<h1>Groupe 3 - Champs ACF</h1>
|
||||||
|
<?php
|
||||||
|
if (function_exists('acf_form')) {
|
||||||
|
acf_form_head();
|
||||||
|
acf_form(array(
|
||||||
|
'post_id' => '13', // Remplacez par un ID de page si nécessaire
|
||||||
|
'field_groups' => array('group_677d3294c3dfa'),
|
||||||
|
'form' => true,
|
||||||
|
'return' => add_query_arg('updated', 'true', wp_get_referer()),
|
||||||
|
'submit_value' => __('Enregistrer les modifications', 'acf'),
|
||||||
|
));
|
||||||
|
} else {
|
||||||
|
echo '<p>Le plugin ACF n\'est pas activé ou disponible.</p>';
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
<?php
|
||||||
|
}
|
||||||
// Groupe 2 - Champs ACF
|
// Groupe 2 - Champs ACF
|
||||||
function acf_manager_group_2() {
|
function acf_manager_group_2() {
|
||||||
?>
|
?>
|
||||||
|
|||||||
Reference in New Issue
Block a user