diff --git a/server-api/api.js b/server-api/api.js index 9ad4ba1..283f1e9 100644 --- a/server-api/api.js +++ b/server-api/api.js @@ -318,6 +318,19 @@ app.put('/User/Update/:id', (req, res) => { res.send('Post update...'); }); }); +app.put('/User/UpdateByClient/:id', (req, res) => { + + const id = req.params.id; + let form = req.body; + + const sql = `UPDATE users SET lastname = ?, firstname = ?, phone = ?, mail = ? WHERE (iduser = ?)`; + db.query(sql, [form.lastName, form.firstName, form.phone, form.mail, id], (err, result) => { + if (err) throw err; + console.log(result); + res.send('Post update...'); + }); +}); + app.put('/User/Update/Image/:id', (req, res) => { const id = req.params.id; diff --git a/src/pages/Compte.js b/src/pages/Compte.js index bb4af35..36c2033 100644 --- a/src/pages/Compte.js +++ b/src/pages/Compte.js @@ -15,7 +15,7 @@ function Compte() { const [theme, setTheme] = useState("light"); const nomInputRef = useRef(); const prenomInputRef = useRef(); - const [modification, setModification] = useState(false); + const [modificationInfo, setModificationInfo] = useState(false); const [selectedFile, setSelectedFile] = useState([]); const [fileBase64String, setFileBase64String] = useState(""); const [lastName, setLastName] = useState(""); @@ -25,6 +25,8 @@ function Compte() { const [image, setImage] = useState(""); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); + const [formData, setFormData] = useState(); + function handleFileChange(event) { const file = event.target.files[0]; @@ -54,21 +56,29 @@ function Compte() { fileReader.readAsDataURL(file); } + const handleSubmit = (event) => { + event.preventDefault(); + // envoyer les données modifiées au serveur ici + api.put('/User/UpdateByClient/' + Session.get("idUser"), formData).then(response => { + // Traitez la réponse du serveur + }); + setModificationInfo(false); + setLastName(formData.lastName); + setFirstName(formData.firstName); + setPhone(formData.phone); + setMail(formData.mail); + } + + const handleChange = (event) => { + setFormData({...formData, [event.target.name]: event.target.value }); + } + if (localStorage.getItem('theme') && localStorage.getItem("theme") !== '' && localStorage.getItem("theme") !== theme) { setTheme(localStorage.getItem("theme")) } - /*const [file, setFile] = useState(); - function handleChange(e) { - setFile(URL.createObjectURL(e.target.files[0])); - }*/ - - const modificationHandler = () => { - setModification((modification) => !modification) - console.log(modification) - } useEffect(() => { @@ -82,27 +92,16 @@ function Compte() { }); }, []); - function handleChangeLastName(event) { - //setLastName(event.target.value); - const enteredLastName = nomInputRef.current.value; - - //mettre à jour le state - setLastName({ - ...lastName, - "nom": enteredLastName, + useEffect(() => { + setFormData({ + firstName: firstName, + lastName: lastName, + mail: mail, + phone: phone, }) - }; + }, [null, modificationInfo]); - function handleChangeFirstName(event) { - //setFirstName(event.target.value); - const enteredFirstName = prenomInputRef.current.value; - //mettre à jour le state - setFirstName({ - ...firstName, - "prenom": enteredFirstName, - }) - }; return ( @@ -119,7 +118,7 @@ function Compte() {
-
+
@@ -132,14 +131,38 @@ function Compte() {
+

Nom Complet :

- {!modification &&

{firstName + " " + lastName}

} - {modification && ( { handleChangeLastName(e); handleChangeFirstName(e) }} ref={nomInputRef + prenomInputRef}>)} + {modificationInfo ? +
+ + +
+ : +

{firstName + " " + lastName}

+ }
- + {modificationInfo ? +
+
setModificationInfo(false)}>Annuler
+ +
+ : +
setModificationInfo(true)}>Modifier
+ }
@@ -147,7 +170,16 @@ function Compte() {

Informations personnelles

Mail :

- + {modificationInfo ? + + : + + }

Pays ou Région :

@@ -155,7 +187,17 @@ function Compte() {

Tel :

- + {modificationInfo ? + + : + + } +
@@ -173,7 +215,7 @@ function Compte() {

200

-
+