1 ere phase complète

resources/views/clients.blade.php

@@ -17,6 +17,7 @@
                                             <th scope=\"col\">Nom du client</th> 
                                             <th scope=\"col\">Adresse e-mail</th> 
                                             <th scope=\"col\">Voir le client</th>
+                                            <th scope=\"col\">Supprimer</th>
                                         </tr> 
                                     </thead>
                                     <tbody> `;
@@ -25,16 +26,103 @@
                 table.innerHTML += `<tr> 
                                         <td>${c.nom}</td>
                                         <td>${c.email}</td>
-                                        <td><a href="{{ url('/clients/${c.id}') }}">le client ${c.id}<a></td>
+                                        <td><a href="#" onclick="leClient(${c.id});">Informations</a></td>
+                                        <td><a href="#" onclick="supprimer(${c.id});">supprimer</a></td>
                                     </tr>`;
                 });
-                list.innerHTML += "</tbody> </table>"
+                list.innerHTML += "</tbody> </table> "
 
             } catch (error) {
                 console.error('Erreur :', error);
                 list.innerHTML = '<li>Impossible de charger les clients</li>';
             }
         }
+        
+        async function supprimer(id){
+                try{
+                    await fetch(`http://192.168.56.56:8000/api/clients/${id}`, {
+                        method: 'DELETE'
+                    });
+                    await loadClients();
+                }catch(err){
+                    console.error(err);
+                }
+            }
+
+        async function leClient(id) {
+            try {
+                const response = await fetch(`http://192.168.56.56:8000/api/clients/${id}`, {
+                    method: 'GET'
+                });
+
+                if (!response.ok) {
+                    throw new Error("Client introuvable");
+                }
+
+                const client = await response.json();
+
+                // zone d'affichage
+                const zone = document.getElementById("client-info");
+
+                // formulaire
+                zone.innerHTML = `
+                    <h2>Modifier le client</h2>
+
+                    <form onsubmit="updateClient(${client.id}); return false;">
+                        
+                        <label>Nom :</label><br>
+                        <input type="text" id="edit-nom" value="${client.nom}" required><br><br>
+
+                        <label>Prénom :</label><br>
+                        <input type="text" id="edit-prenom" value="${client.prenom}" required><br><br>
+
+                        <label>Email :</label><br>
+                        <input type="email" id="edit-email" value="${client.email}" required><br><br>
+
+                        <label>Numéro de téléphone :</label><br>
+                        <input type="text" id="edit-ntelephone" value="${client.ntelephone ?? ''}"><br><br>
+
+                        <button type="submit">Mettre à jour</button>
+                    </form>
+                `;
+            } catch (error) {
+                console.error(error);
+                document.getElementById("client-info").innerHTML =
+                    "<p>Erreur lors du chargement du client.</p>";
+            }
+        }
+
+        async function updateClient(id) {
+            try {
+                const nom = document.getElementById("edit-nom").value;
+                const prenom = document.getElementById("edit-prenom").value;
+                const email = document.getElementById("edit-email").value;
+                const telephone = document.getElementById("edit-ntelephone").value;
+
+                const response = await fetch(`http://192.168.56.56:8000/api/clients/${id}`, {
+                    method: 'PUT',
+                    headers: { "Content-Type": "application/json" },
+                    body: JSON.stringify({ nom, prenom, email, telephone })
+                });
+
+                if (!response.ok) {
+                    throw new Error("Erreur de mise à jour");
+                }
+
+                alert("Client mis à jour !");
+                loadClients();
+
+            } catch (err) {
+                console.error(err);
+                alert("Impossible de mettre à jour le client.");
+            }
+        }
+
+
         loadClients();
+
+        
     </script>
-@endsection
+    <div id="client-info"></div>
+@endsection
+