Mise a jour des Modals

public/css/Compte/GestionUser.css

@@ -1,4 +1,4 @@
-#container_gestion_user {
+#container_modal {
     background-color: white;
     margin-left: 20%; /* Centrage vertical */
     margin-top: 5%;
@@ -7,7 +7,6 @@
     width: 75%; /* Largeur du contenu de la modal */
     height: 100%; /* Hauteur du contenu de la modal */
     box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
-    display: none;
 }
 
 body {

public/css/Compte/index.css

@@ -48,7 +48,7 @@
     }
 }
 
-#container_gestion_user {
+#container_modal {
     background-color: white;
     margin-left: 20%; /* Centrage vertical */
     margin-top: 5%;
@@ -57,7 +57,6 @@
     width: 75%; /* Largeur du contenu de la modal */
     height: 100%; /* Hauteur du contenu de la modal */
     box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
-    display: none;
 }
 
 a{

public/css/GestionUtilisateurs/GestionUtilisateurs.css

@@ -1,4 +1,4 @@
-#container_gestion_utilisateurs {
+#container_modal {
     background-color: white;
     margin-left: 20%; /* Centrage vertical */
     margin-top: 5%;
@@ -7,17 +7,4 @@
     width: 75%; /* Largeur du contenu de la modal */
     height: 100%; /* Hauteur du contenu de la modal */
     box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
-    display: none;
-}
-
-#container_gestion_utilisateurs1 {
-    background-color: white;
-    margin-left: 20%; /* Centrage vertical */
-    margin-top: 5%;
-    padding: 20px;
-    border: 1px solid black;
-    width: 75%; /* Largeur du contenu de la modal */
-    height: 100%; /* Hauteur du contenu de la modal */
-    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
-    display: none;
 }

public/js/Compte/CompteModal.js

@@ -1,29 +1,40 @@
 document.querySelector('.btn-info-compte').addEventListener('click', function(event) {
     event.preventDefault();
 
-    const contentContainer = document.getElementById('container-gestion-user');
+    document.getElementById('container_modal');
 
-    // Vérifie si le contenu est déjà affiché
+    fetch('/gestion-user')
-    if (container_gestion_user.style.display === 'block') {
+        .then(response => {
-        // Masquer la section "Compte" si elle est déjà affichée
+            if (!response.ok) {
-        container_gestion_user.style.display = 'none';
+                throw new Error('Erreur');
-        container_gestion_user.innerHTML = ''; // On efface le contenu pour éviter la réutilisation
+            }
-    } else {
+            return response.text();
-        // Afficher le conteneur et charger le contenu via AJAX
+        })
-        fetch('/gestion-user')
+        .then(html => {
-            .then(response => {
+            // Insérer le HTML dans le conteneur et l'afficher
-                if (!response.ok) {
+            container_modal.innerHTML = html;
-                    throw new Error('Erreur de chargement de la section Compte');
+            container_modal.style.display = 'block';
-                }
+        })
-                return response.text();
+        .catch(error => {
-            })
+            console.error('Erreur:', error);
-            .then(html => {
+        });
-                // Insérer le HTML dans le conteneur et l'afficher
-                container_gestion_user.innerHTML = html;
-                container_gestion_user.style.display = 'block';
-            })
-            .catch(error => {
-                console.error('Erreur:', error);
-            });
-    }
 });
+
+function updateUser (event) {
+    document.getElementById('container_modal');
+    const userIdString = event.getAttribute('data-id');
+    let userId = parseInt(userIdString);
+
+    fetch(`/user/update/${userId}`)
+        .then(response => {
+            return response.text();
+        })
+        .then(html => {
+            // Insérer le HTML dans le conteneur et l'afficher
+            container_modal.innerHTML = html;
+            container_modal.style.display = 'block';
+        })
+        .catch(error => {
+            console.error('Erreur:', error);
+        });
+}

public/js/GestionUtilisateurs/GestionUtilisateurs.js

@@ -1,59 +1,41 @@
 document.querySelector('.btn-gestion-utilisateurs').addEventListener('click', function(event) {
     event.preventDefault();
 
-    const contentContainer = document.getElementById('container_gestion_utilisateurs');
+    document.getElementById('container_modal');
 
-    // Vérifie si le contenu est déjà affiché
+    fetch('/user/list')
-    if (container_gestion_utilisateurs.style.display === 'block') {
+        .then(response => {
-        // Masquer la section "Compte" si elle est déjà affichée
+            if (!response.ok) {
-        container_gestion_utilisateurs.style.display = 'none';
+                throw new Error('Erreur de chargement de la section Compte');
-        container_gestion_utilisateurs.innerHTML = ''; // On efface le contenu pour éviter la réutilisation
+            }
-    } else {
+            return response.text();
-        // Afficher le conteneur et charger le contenu via AJAX
+        })
-        fetch('/user/list')
+        .then(html => {
-            .then(response => {
+            // Insérer le HTML dans le conteneur et l'afficher
-                if (!response.ok) {
+            container_modal.innerHTML = html;
-                    throw new Error('Erreur de chargement de la section Compte');
+            container_modal.style.display = 'block';
-                }
+        })
-                return response.text();
+        .catch(error => {
-            })
+            console.error('Erreur:', error);
-            .then(html => {
+        });
-                // Insérer le HTML dans le conteneur et l'afficher
-                container_gestion_utilisateurs.innerHTML = html;
-                container_gestion_utilisateurs.style.display = 'block';
-            })
-            .catch(error => {
-                console.error('Erreur:', error);
-            });
-    }
 });
 
-document.querySelector('.btn-gestion-utilisateurs').addEventListener('click', function(event) {
+function addUser (event) {
-    event.preventDefault();
+    document.getElementById('container_modal');
 
-    const contentContainer = document.getElementById('container_gestion_utilisateurs1');
+    fetch('/user/add')
-
+        .then(response => {
-    // Vérifie si le contenu est déjà affiché
+            if (!response.ok) {
-    if (container_gestion_utilisateurs1.style.display === 'block') {
+                throw new Error('Erreur de chargement de la section Compte');
-        // Masquer la section "Compte" si elle est déjà affichée
+            }
-        container_gestion_utilisateurs1.style.display = 'none';
+            return response.text();
-        container_gestion_utilisateurs1.innerHTML = ''; // On efface le contenu pour éviter la réutilisation
+        })
-    } else {
+        .then(html => {
-        // Afficher le conteneur et charger le contenu via AJAX
+            // Insérer le HTML dans le conteneur et l'afficher
-        fetch('/user/add')
+            container_modal.innerHTML = html;
-            .then(response => {
+            container_modal.style.display = 'block';
-                if (!response.ok) {
+        })
-                    throw new Error('Erreur de chargement de la section Compte');
+        .catch(error => {
-                }
+            console.error('Erreur:', error);
-                return response.text();
+        });
-            })
+}
-            .then(html => {
-                // Insérer le HTML dans le conteneur et l'afficher
-                container_gestion_utilisateurs1.innerHTML = html;
-                container_gestion_utilisateurs1.style.display = 'block';
-            })
-            .catch(error => {
-                console.error('Erreur:', error);
-            });
-    }
-});

src/Form/UpdateUserType.php

@@ -39,6 +39,8 @@ class UpdateUserType extends AbstractType
                 'choices' => [
                     'Admin' => 'ROLE_ADMIN',
                     'User' => 'ROLE_USER',
+                    'Cuisinier' => 'ROLE_CUISINIER',
+                    'Serveur' => 'ROLE_SERVEUR',
                 ],
                 'expanded' => true,
                 'multiple' => true,

templates/index/admin.html.twig

@@ -118,15 +118,7 @@
         </div>
     </div>
 
-    <div id="container_gestion_user">
+    <div id="container_modal">
-        <!-- Contenu par défaut, ou vous pouvez laisser vide -->
-    </div>
-
-    <div id="container_gestion_utilisateurs">
-        <!-- Contenu par défaut, ou vous pouvez laisser vide -->
-    </div>
-
-    <div id="container_gestion_utilisateurs1">
         <!-- Contenu par défaut, ou vous pouvez laisser vide -->
     </div>
 

templates/user/add.html.twig

@@ -97,9 +97,5 @@
         </div>
 
         {{ form_end(registrationForm) }}
-
-        <div class="btn-container">
-            <a href="{{ path('list_user') }}" class="btn-list btn-primary">Liste des Utilisateur</a>
-        </div>
     </div>
 {% endblock %}

templates/user/gestion.html.twig

@@ -24,13 +24,13 @@
                 <span class="user-info-label">Roles :</span>
                 <span class="user-info-value">{{ app.user.getRolesAsString() }}</span>
             </div>
-
-            <div class="btn-update">
-                <button class="btn-update">Modifier</button>
-            </div>
         </div>
     </form>
 
+    <div class="btn-update">
+        <button onclick="updateUser(this)" data-id="{{ app.user.id }}" class="btn-update">Modifier</button>
+    </div>
+
 {% endblock %}
 
 {% block javascripts %}

templates/user/list.html.twig

@@ -78,7 +78,11 @@
         </tbody>
     </table>
     <div class="btn-container">
-        <a href="{{ path('add_user') }}" class="btn btn-add-user btn-primary">Ajouter un Utilisateur</a>
+        <button onclick="addUser(this)" id="btn-add-user" class="btn btn-add-user btn-primary">Ajouter un Utilisateur</button>
     </div>
 </div>
 {% endblock %}
+
+{% block javascripts %}
+    <script src="{{ asset('js/GestionUtilisateurs/GestionUtilisateurs.js') }}" defer></script>
+{% endblock %}