Merge branch 'master' of https://codefirst.iut.uca.fr/git/CRM_Production/JTT_CrM

2 years ago · 7043288f3e
parent afbf9f0bea 499959cc1c
commit 7043288f3e
3 changed files with 79 additions and 0 deletions
--- a/server-api/api.js
+++ b/server-api/api.js
@ -428,6 +428,23 @@ app.get('/Contact/:iduser', (req, res) => {
    });
 });

+app.delete('/Contact/Delete/:id', (req, res) => {
+
+    const id = req.params.id;
+
+    const sql = `DELETE FROM contacts WHERE (idcontact = ?)`;
+    db.query
+    (sql, [
+        id
+    ], (err, result) => {
+        if (err) throw err;
+        console.log(result);
+        res.send('Post delete...');
+    });
+});
+
+//Api pour les events de la page agenda
+
 app.post('/Event/Add', (req, res) => {
    
    let form = req.body;
--- a/src/pages/Repertoire.js
+++ b/src/pages/Repertoire.js
@ -40,6 +40,14 @@ function Repertoire() {
        });
    }, []);

+    function handleDeleteClick(contact) {
+        api.delete('/Contact/Delete/' + contact.idcontact).then((response) => {
+            const newContacts = contacts.filter((c) => c.idcontact !== contact.idcontact);
+            setContacts(newContacts);
+        });
+    
+      }
+
    return (
        <body className={theme}>
            <div className="page_repertoire">
@ -73,6 +81,7 @@ function Repertoire() {
                                        <TableCell>Nom</TableCell>
                                        <TableCell>Prénom</TableCell>
                                        <TableCell>Entreprise</TableCell>
+                                        <TableCell>Supprimer</TableCell>
                                    </TableRow>
                                </TableHead>
                                <TableBody>
@ -82,6 +91,7 @@ function Repertoire() {
                                            <TableCell>{contact.lastname}</TableCell>
                                            <TableCell>{contact.firstname}</TableCell>
                                            <TableCell>{contact.name}</TableCell>
+                                            <TableCell><button className="boutonSuppContact" onClick={() => handleDeleteClick(contact)}>Supprimer</button></TableCell>
                                        </TableRow>
                                    ))}
                                </TableBody>
@ -121,6 +131,23 @@ function Repertoire() {
    );
 };

+function SupprimerContact(props) {
+
+    const navigate = useNavigate();
+    const deleteContact = (id) => {
+        api.delete('/Contact/' + id).then(() => {
+            props.getContactList();
+        });
+    };
+
+    return (
+        <div className="ui main">
+            <h2>Supprimer Contact</h2>
+            <button className="ui button blue" onClick={() => deleteContact(props.id)}>Supprimer</button>
+        </div>
+    );
+}
+
 function AddContact(props) {

    const navigate = useNavigate();
--- a/src/styles/components/_repertoire.scss
+++ b/src/styles/components/_repertoire.scss
@ -268,6 +268,41 @@ body {
                    object-fit: cover;
                    border: 1px solid black;
                }
+                .boutonSuppContact {
+                    color: #ff3838;
+                    border-color: #ff3838;
+                    background-color: transparent;
+                    border: 1px solid #ff3838;
+                    border-radius: .375rem;
+                    padding: .375rem .75rem;
+                    gap: 1rem;
+                    font-size: 1rem;
+                    line-height: 1.5;
+                    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
+                    
+                    &:hover {
+                        color: #fff;
+                        background-color: #ff3838;
+                        border-color: #ff3838;
+                    }
+                    &:focus {
+                        color: #fff;
+                        background-color: #ff3838;
+                        border-color: #ff3838;
+                        box-shadow: 0 0 0 0.2rem rgba(56, 116, 255, 0.5);
+                    }
+                    &:active {
+                        color: #fff;
+                        background-color: #ff3838;
+                        border-color: #ff3838;
+                        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0);
+                    }
+                    &:disabled {
+                        color: #ff3838;
+                        background-color: transparent;
+                        border-color: #ff3838;
+                    }
+                }
            }
        }
    }