Mise a jour des Modals

This commit is contained in:
Joshua 2024-12-05 14:07:11 +01:00
parent 3f56c0245b
commit 54a3154cf7
10 changed files with 85 additions and 113 deletions

View File

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

View File

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

View File

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

View File

@ -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é
if (container_gestion_user.style.display === 'block') {
// Masquer la section "Compte" si elle est déjà affichée
container_gestion_user.style.display = 'none';
container_gestion_user.innerHTML = ''; // On efface le contenu pour éviter la réutilisation
} else {
// Afficher le conteneur et charger le contenu via AJAX
fetch('/gestion-user')
.then(response => {
if (!response.ok) {
throw new Error('Erreur de chargement de la section Compte');
}
return response.text();
})
.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);
});
}
});
fetch('/gestion-user')
.then(response => {
if (!response.ok) {
throw new Error('Erreur');
}
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);
});
});
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);
});
}

View File

@ -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é
if (container_gestion_utilisateurs.style.display === 'block') {
// Masquer la section "Compte" si elle est déjà affichée
container_gestion_utilisateurs.style.display = 'none';
container_gestion_utilisateurs.innerHTML = ''; // On efface le contenu pour éviter la réutilisation
} else {
// Afficher le conteneur et charger le contenu via AJAX
fetch('/user/list')
.then(response => {
if (!response.ok) {
throw new Error('Erreur de chargement de la section Compte');
}
return response.text();
})
.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);
});
}
fetch('/user/list')
.then(response => {
if (!response.ok) {
throw new Error('Erreur de chargement de la section Compte');
}
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);
});
});
document.querySelector('.btn-gestion-utilisateurs').addEventListener('click', function(event) {
event.preventDefault();
function addUser (event) {
document.getElementById('container_modal');
const contentContainer = document.getElementById('container_gestion_utilisateurs1');
// Vérifie si le contenu est déjà affiché
if (container_gestion_utilisateurs1.style.display === 'block') {
// Masquer la section "Compte" si elle est déjà affichée
container_gestion_utilisateurs1.style.display = 'none';
container_gestion_utilisateurs1.innerHTML = ''; // On efface le contenu pour éviter la réutilisation
} else {
// Afficher le conteneur et charger le contenu via AJAX
fetch('/user/add')
.then(response => {
if (!response.ok) {
throw new Error('Erreur de chargement de la section Compte');
}
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);
});
}
});
fetch('/user/add')
.then(response => {
if (!response.ok) {
throw new Error('Erreur de chargement de la section Compte');
}
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);
});
}

View File

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

View File

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

View File

@ -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 %}

View File

@ -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 %}

View File

@ -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 %}