Dynamic display of activation status

This commit is contained in:
Charles 2026-02-11 11:07:33 +01:00
parent 934720b85a
commit 7d1e2ee4e7
2 changed files with 42 additions and 70 deletions

View File

@ -18,7 +18,7 @@ export default class extends Controller {
orgId: Number orgId: Number
} }
static targets = ["select"]; static targets = ["select", "statusButton"];
connect() { connect() {
this.roleSelect(); this.roleSelect();
@ -875,71 +875,47 @@ export default class extends Controller {
}); });
}; };
async deactivateUser(event) { async toggleStatus(event) {
event.preventDefault(); event.preventDefault();
const userId = this.idValue;
if (!userId) { const button = this.statusButtonTarget;
console.error(`User ID not found!`); const isActive = button.dataset.active === "true";
return; const newStatus = isActive ? 'deactivate' : 'activate';
} const confirmMsg = isActive ? "Désactiver cet utilisateur ?" : "Réactiver cet utilisateur ?";
if (confirm(`Voulez-vous vraiment désactiver cet utilisateur ?`)) { if (!confirm(confirmMsg)) return;
try {
const formData = new FormData();
formData.append('status', 'deactivate');
const response = await fetch(`/user/activeStatus/${userId}`, { try {
method: 'POST', const formData = new FormData();
body: formData, formData.append('status', newStatus);
headers: {'X-Requested-With': 'XMLHttpRequest'}
});
if (response.ok) { const response = await fetch(`/user/activeStatus/${this.idValue}`, {
alert('Utilisateur désactivé avec succès'); method: 'POST',
// If you need to refresh the UI, do it here body: formData,
// e.g., window.location.reload(); headers: {'X-Requested-With': 'XMLHttpRequest'}
} else { });
const text = await response.text();
alert('Erreur: ' + text); if (response.ok) {
} this.updateButtonUI(!isActive);
} catch (err) { } else {
alert('Erreur lors de la communication avec le serveur'); alert('Erreur lors de la mise à jour');
} }
} catch (err) {
alert('Erreur de connexion');
} }
} }
async activateUser(event) { updateButtonUI(nowActive) {
event.preventDefault(); const btn = this.statusButtonTarget;
const userId = this.idValue;
if (!userId) { if (nowActive) {
console.error(`User ID not found!`); btn.textContent = "Désactiver";
return; btn.classList.replace("btn-success", "btn-secondary");
} btn.dataset.active = "true";
} else {
if (confirm(`Voulez-vous vraiment activer cet utilisateur ?`)) { btn.textContent = "Réactiver";
try { btn.classList.replace("btn-secondary", "btn-success");
const formData = new FormData(); btn.dataset.active = "false";
formData.append('status', 'activate');
const response = await fetch(`/user/activeStatus/${userId}`, {
method: 'POST',
body: formData,
headers: {'X-Requested-With': 'XMLHttpRequest'}
});
if (response.ok) {
alert('Utilisateur activé avec succès');
// If you need to refresh the UI, do it here
// e.g., window.location.reload();
} else {
const text = await response.text();
alert('Erreur: ' + text);
}
} catch (err) {
alert('Erreur lors de la communication avec le serveur');
}
} }
} }
} }

View File

@ -12,22 +12,18 @@
{% endfor %} {% endfor %}
{% endfor %} {% endfor %}
<div class="card-header border-0 d-flex justify-content-between align-items-center "> <div class="card-header border-0 d-flex justify-content-between align-items-center ">
<div class="card-title"> <div class="card-title"><h1>Gestion Utilisateur</h1></div>
<h1>Gestion Utilisateur</h1>
</div>
<div class="d-flex gap-2"> <div class="d-flex gap-2">
{% if is_granted("ROLE_ADMIN") %} {% if is_granted("ROLE_ADMIN") %}
{% if user.active %} <button
<button class="btn btn-secondary" data-action="click->user#deactivateUser">Désactiver</button> class="btn {{ user.active ? 'btn-secondary' : 'btn-success' }}"
{# <a href="{{ path('user_active_status', {'id': user.id, 'status':'deactivate'}) }}"#} data-user-target="statusButton"
{# class="btn btn-secondary">Désactiver</a>#} data-action="click->user#toggleStatus"
{% else %} data-active="{{ user.active ? 'true' : 'false' }}">
<button class="btn btn-success" data-action="click->user#activateUser">Réactiver</button> {{ user.active ? 'Désactiver' : 'Réactiver' }}
{# <a href="{{ path('user_active_status', {'id': user.id, 'status':'activate'}) }}"#} </button>
{# class="btn btn-success">Réactiver</a>#}
{% endif %} <a href="{{ path('user_delete', {'id': user.id}) }}" class="btn btn-warning">Supprimer</a>
<a href="{{ path('user_delete', {'id': user.id}) }}"
class="btn btn-warning">Supprimer</a>
{% endif %} {% endif %}
</div> </div>
</div> </div>