Merge remote-tracking branch 'refs/remotes/origin/master'

master
Maxence LANONE 2 years ago
commit 4bc40d32a3

@ -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;

@ -15,7 +15,9 @@ 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("");
const [firstName, setFirstName] = useState("");
const [phone, setPhone] = useState("");
@ -23,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];
@ -51,21 +55,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(() => {
@ -79,27 +91,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 (
<body className={theme}>
@ -116,7 +117,7 @@ function Compte() {
</div>
<div className="bas_de_page">
<NavigationDashboard />
<div className="Compte">
<form className="Compte" onSubmit={handleSubmit}>
<div className="name_picture">
<div className="picture">
<div id="display_image">
@ -129,14 +130,38 @@ function Compte() {
</div>
<div className="name">
<div className="presentationNom">
<p id="texte" className="def">Nom Complet :</p>
{!modification && <p>{firstName + " " + lastName}</p>}
{modification && (<input type="text" value={firstName + " " + lastName} onChange={e => { handleChangeLastName(e); handleChangeFirstName(e) }} ref={nomInputRef + prenomInputRef}></input>)}
{modificationInfo ?
<div>
<input
name="firstName"
placeholder="firstName"
value={formData.firstName}
onChange={handleChange}
/>
<input
name="lastName"
placeholder="lastName"
value={formData.lastName}
onChange={handleChange}
/>
</div>
:
<p>{firstName + " " + lastName}</p>
}
</div>
<div className='bouton_submit'>
<button id="bouton" className="bouton_modifierNom" type="submit" onClick={modificationHandler}>{!modification ? "Modifier" : "Envoyer"}</button>
{modificationInfo ?
<div>
<div id="bouton" className="bouton_modifierNom" onClick={() => setModificationInfo(false)}>Annuler</div>
<button id="bouton" className="bouton_modifierNom" type='submit' >Valider</button>
</div>
:
<div id="bouton" className="bouton_modifierNom" onClick={() => setModificationInfo(true)}>Modifier</div>
}
</div>
</div>
</div>
@ -144,7 +169,16 @@ function Compte() {
<p className="description">Informations personnelles</p>
<div className="parti_mail">
<p className="def">Mail :</p>
<input id="mail" value={mail} name="mail" className="mail" type="text" disabled />
{modificationInfo ?
<input
name="mail"
placeholder={mail}
value={formData.mail}
onChange={handleChange}
/>
:
<input id="mail" value={mail} name="mail" className="mail" type="text" disabled />
}
</div>
<div className="parti_pays">
<p className="def">Pays ou Région :</p>
@ -152,7 +186,17 @@ function Compte() {
</div>
<div className="parti_tel">
<p className="def">Tel :</p>
<input id="tel" value={phone} name="tel" className="tel" type="text" disabled />
{modificationInfo ?
<input
name="phone"
placeholder={phone}
value={formData.phone}
onChange={handleChange}
/>
:
<input id="phone" value={phone} name="tel" className="tel" type="text" disabled />
}
</div>
</div>
<div className="infoEntreprise">
@ -170,7 +214,7 @@ function Compte() {
<p className="nbClient">200</p>
</div>
</div>
</div>
</form>
</div>
</div>
</body >

@ -143,7 +143,7 @@ function Repertoire() {
</span>
</div>
:
<button className="boutonRetour" onClick={() => {setModifContact(false);setContactSelectionne("");}}>Retour</button>
<button className="boutonRetour" onClick={() => {setModifContact(false);setContactSelectionne("");setShowConfirmation(false)}}>Retour</button>
}
<NavLink to="/Repertoire/add">
<button className="boutonAddContact">Ajouter</button>
@ -187,6 +187,7 @@ function Repertoire() {
:
<div>
<p>Êtes-vous sûr de vouloir supprimer ce contact ?</p>
<button className="Annuler" onClick={() => setShowConfirmation(false)}>Annuler</button>
<button className="boutonSupprimer" onClick={() => handleDeleteClick(contactSelectionne)}>Supprimer</button>
</div>
}

Loading…
Cancel
Save