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

server-api/api.js

@@ -454,15 +454,15 @@ app.get('/Contact/:iduser', (req, res) => {
     });
 });
 
-app.put('/Contact/Update/:phone', (req, res) => {
+app.put('/Contact/Update/:idcontact', (req, res) => {
 
-    const phone = req.params.phone;
+    const idcontact = req.params.idcontact;
 
     let form = req.body;
     
-    const sql = `UPDATE contacts SET firstname = ?, lastname = ?, mail = ?, phone = ? WHERE (phone = ?)`;
+    const sql = `UPDATE contacts SET firstname = ?, lastname = ?, mail = ?, phone = ? WHERE (idcontact = ?)`;
 
-    db.query(sql, [form.firstname, form.lastname, form.mail, form.phone, phone], (err, result) => {
+    db.query(sql, [form.firstname, form.lastname, form.mail, form.phone, idcontact], (err, result) => {
         if (err) throw err;
         console.log(result);
     });

src/pages/Connexion.js

@@ -24,6 +24,7 @@ function Connexion() {
     const [login, setLogin] = useState("");
     const [password, setPassword] = useState("");
     const [roleUser, setRole] = useState("");
+    const [mdpOublie, setMdpOublie] = useState(false);
     
     function changeLogin(event) {
         setLogin(event.target.value);
@@ -98,6 +99,15 @@ function Connexion() {
         ) : (
             <div className="page_connexion">
                 <img className="logo" srcSet="./LogoApp.svg"></img>
+                { mdpOublie ? 
+                    <div className="formulaire_de_connexion">
+                        <label className="connexion_text">
+                            Mot de passe oublié
+                        </label>
+                        <p>Contactez votre administrateur système afin qu'il vérifie votre identité et vous regénére un mot de passe</p>
+                        <button onClick={() => setMdpOublie(false)}>Retour</button>
+                    </div>
+                : 
                 <form onSubmit={chechAuth} className="formulaire_de_connexion">
                     <label className="connexion_text">
                         Connexion
@@ -118,7 +128,8 @@ function Connexion() {
                     
                     <p>{auth === ""?'':auth === "Failed"?'Authentification Echoué':'Utilisateur inconnu'}</p>
                 </form>
-                <a className="forgot_pw" href="http://localhost">Mot de passe oublié ?</a>
+                }
+                { mdpOublie ? null : <a className="forgot_pw" onClick={() => setMdpOublie(true)}>Mot de passe oublié ?</a> }
             </div>
         );
     }

src/pages/Repertoire.js

@@ -25,14 +25,19 @@ function Repertoire() {
     const [SearchTerm, setSearchTerm] = useState("");
     const [SearchResults, setSearchResults] = useState([]);
     const [customers, setCustomers] = useState([]);
+
+    
     useEffect(() => {
+        console.log("useEffect appel api contact");
         const apiString = '/Contact/' + Session.get("idUser");
         api.get(apiString).then((response) => {
 
             setContacts(response.data);
-            setSearchTerm(response.data[0].idcontact);
+            setSearchResults(response.data);
+            console.log("response.data", response.data);
+            
         });
-    }, [modifContact]);
+    }, [null,contactSelectionne]);
 
     useEffect(() => {
         api.get('/Customer/All').then((response) => {
@@ -40,6 +45,19 @@ function Repertoire() {
         });
     }, []);
 
+    useEffect(() => {
+
+        const results = contacts.filter(contact =>
+            contact.lastname.toLowerCase().includes(SearchTerm.toLowerCase())
+            || contact.firstname.toLowerCase().includes(SearchTerm.toLowerCase())
+            || contact.mail.toLowerCase().includes(SearchTerm.toLowerCase())
+            || contact.phone.toLowerCase().startsWith(SearchTerm.toLowerCase())
+            || contact.name.toLowerCase().includes(SearchTerm.toLowerCase())
+            || SearchTerm.trim().length === 0
+        );
+        setSearchResults(results);
+    }, [null, SearchTerm, modifContact]);
+
     function handleDeleteClick(contact) {
         api.delete('/Contact/Delete/' + contact.idcontact).then((response) => {
             const newContacts = contacts.filter((c) => c.idcontact !== contact.idcontact);
@@ -66,7 +84,7 @@ function Repertoire() {
                 phone: phone,
                 idcontact: props.contact.idcontact,
             };
-            api.put('/Contact/Update/' + props.contact.phone, contact).then((response) => {});
+            api.put('/Contact/Update/' + props.contact.idcontact, contact).then((response) => {});
             setModifContact(false);
             setContactSelectionne(contact);
         };
@@ -118,7 +136,7 @@ function Repertoire() {
             </button>
           </form>
         );
-      }
+    }
     
     return (
         <body className={theme}>
@@ -137,7 +155,7 @@ function Repertoire() {
                         <span className="searchAndAddButton">
                             { contactSelectionne === "" ?
                                 <div className="input_box">
-                                    <input type="search" placeholder="Rechercher..." />
+                                    <input type="text" placeholder="Rechercher" value={SearchTerm} onChange={(event) => setSearchTerm(event.target.value)} />
                                     <span className="search">
                                         <i class="uil uil-search search-icon"></i>
                                     </span>
@@ -145,9 +163,12 @@ function Repertoire() {
                             :
                                 <button className="boutonRetour" onClick={() => {setModifContact(false);setContactSelectionne("");setShowConfirmation(false)}}>Retour</button>
                             }
-                            <NavLink to="/Repertoire/add">
+                            { contactSelectionne === "" ?
-                                <button className="boutonAddContact">Ajouter</button>
+                            
-                            </NavLink>
+                                <NavLink to="/Repertoire/add">
+                                    <button className="boutonAddContact">Ajouter</button>
+                                </NavLink>
+                            :<div hidden></div>}
                         </span>
                         { contactSelectionne === "" ? 
                             <TableContainer component={Paper} className="tabListContact" style={{color: '#fff'}}>
@@ -157,15 +178,17 @@ function Repertoire() {
                                             <TableCell>Photo</TableCell>
                                             <TableCell>Nom</TableCell>
                                             <TableCell>Prénom</TableCell>
+                                            <TableCell>Téléphone</TableCell>
                                             <TableCell>Entreprise</TableCell>   
                                         </TableRow>
                                     </TableHead>
                                     <TableBody>
-                                        {contacts.map((contact) => (
+                                        {SearchResults.map((contact) => (
                                             <TableRow key={contact.idcontact} onClick={() => setContactSelectionne(contact)}>
                                                 <TableCell><img className="photoContact" src={user} /></TableCell>
                                                 <TableCell>{contact.lastname}</TableCell>
                                                 <TableCell>{contact.firstname}</TableCell>
+                                                <TableCell>{contact.phone}</TableCell>
                                                 <TableCell>{contact.name}</TableCell>
                                             </TableRow>
                                         ))}