Importation des données pour la page Compte

3 years ago · c2160647fe
parent d4f5aa13ae
commit c2160647fe
3 changed files with 20961 additions and 17344 deletions
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -31,6 +31,7 @@
    "react-loading": "^2.0.3",
    "react-router-dom": "^6.4.2",
    "react-scripts": "^5.0.1",
+    "react-session-api": "^1.1.0",
    "sass": "^1.55.0",
    "web-vitals": "^2.1.4"
  },
--- a/src/pages/Compte.js
+++ b/src/pages/Compte.js
@ -8,7 +8,7 @@ import axios from 'axios'

 const api = axios.create({
    baseURL: 'http://localhost:8080'
-  })
+})

 function Compte() {
    const [theme, setTheme] = useState("light");
@ -28,6 +28,20 @@ function Compte() {
        console.log(modification)
    }

+    const [users, setUsers] = useState([]);
+    const [selectedIdUser, setSelectedIdUser] = useState();
+
+    useEffect(() =>{
+        api.get('/User/Id/:id').then((response) => {
+            setUsers(response.data);
+            setSelectedIdUser(response.data[0].iduser);
+        });
+    }, []);
+
+    const handleClick = (event, iduser) => {
+        setSelectedIdUser(iduser);
+    };
+

    return (
        <body className={theme}>
@ -66,11 +80,17 @@ function Compte() {
                                </div>
                            </div>
                            <div className="name">
-                                <div className="presentationNom">
-                                    <p id="texte" className="def">Nom Complet :</p>
-                                    <p>{}</p>
-                                    <p id="texte" className="nom">Mateo Centeno</p>
-                                </div>
+                            {users.map((user) => (
+                                    <div className="presentationNom"
+                                        key={user.iduser}
+                                        hover
+                                        onClick={(event) => handleClick(event, user.iduser)}
+                                        selected={user.iduser === selectedIdUser}
+                                    >
+                                        <p id="texte" className="def">Nom Complet :</p>
+                                        <p id="texte" className="nom">{user.lastname}</p>
+                                    </div>
+                                ))}
                                <div className='bouton_submit'>
                                    <button id="bouton" className="bouton_modifierNom" type="submit" onClick={modificationHandler}>{!modification ? "Modifier" : "Envoyer"}</button>
                                </div>