Feature: Ajout modification du mot de passe dans l'administration

- Ajout bouton 🔑 Mot de passe pour chaque utilisateur
- Fonction changeUserPassword avec confirmation du mot de passe
- Validation de longueur minimum (6 caractères)
- Double saisie pour confirmation
- Utilisation de la route PUT /api/users/:id existante
- Style bleu pour le bouton d'édition
- Event delegation pour le nouveau bouton
- Permet aux admins de changer leur propre mot de passe
This commit is contained in:
Claude committed 2025-11-11 13:33:11 +00:00
1 parent bdd2f7a86b
commit 2d2834b70a
2 files changed
+55 -4

No files matched your search

+15 -1
View File
@@ -509,15 +509,29 @@
background: var(--color-background);
}
.btn-edit-user,
.btn-delete-user {
padding: var(--spacing-sm) var(--spacing-md);
background: var(--color-danger);
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-size: 0.875rem;
transition: all var(--transition-speed);
margin-right: var(--spacing-sm);
}
.btn-edit-user {
background: var(--color-primary);
}
.btn-edit-user:hover {
background: #2980b9;
transform: translateY(-1px);
}
.btn-delete-user {
background: var(--color-danger);
}
.btn-delete-user:hover {
+40 -3
View File
@@ -692,11 +692,14 @@ function renderUsersTable(users) {
<td>${user.is_admin ? '✓ Oui' : '✗ Non'}</td>
<td>${new Date(user.created_at).toLocaleDateString('fr-FR')}</td>
<td>
<button class="btn-edit-user" data-user-id="${user.id}" data-username="${escapeHtml(user.username)}">
🔑 Mot de passe
</button>
${user.id !== state.user.id ? `
<button class="btn-delete-user" data-user-id="${user.id}" data-username="${escapeHtml(user.username)}">
🗑️ Supprimer
</button>
` : '<span style="color: var(--text-secondary);">Vous-même</span>'}
` : ''}
</td>
</tr>
`).join('');
@@ -756,6 +759,32 @@ async function createUser() {
}
}
async function changeUserPassword(id, username) {
const password = prompt(`Nouveau mot de passe pour "${username}" :`);
if (!password) return;
if (password.length < 6) {
alert('Le mot de passe doit contenir au moins 6 caractères');
return;
}
const confirmPassword = prompt('Confirmer le nouveau mot de passe :');
if (password !== confirmPassword) {
alert('Les mots de passe ne correspondent pas');
return;
}
try {
await api.put(`/api/users/${id}`, { password });
alert('Mot de passe modifié avec succès');
} catch (error) {
console.error('Erreur modification mot de passe:', error);
alert('Erreur lors de la modification du mot de passe');
}
}
async function deleteUser(id, username) {
const confirmed = await confirmDialog.show({
icon: '⚠️',
@@ -899,11 +928,19 @@ async function init() {
});
}
// Event delegation pour les boutons de suppression d'utilisateurs
// Event delegation pour les boutons d'administration des utilisateurs
const usersTableBody = document.getElementById('usersTableBody');
if (usersTableBody) {
usersTableBody.addEventListener('click', (e) => {
if (e.target.classList.contains('btn-delete-user') || e.target.closest('.btn-delete-user')) {
// Bouton changer mot de passe
if (e.target.classList.contains('btn-edit-user') || e.target.closest('.btn-edit-user')) {
const btn = e.target.classList.contains('btn-edit-user') ? e.target : e.target.closest('.btn-edit-user');
const userId = parseInt(btn.dataset.userId);
const username = btn.dataset.username;
changeUserPassword(userId, username);
}
// Bouton supprimer utilisateur
else if (e.target.classList.contains('btn-delete-user') || e.target.closest('.btn-delete-user')) {
const btn = e.target.classList.contains('btn-delete-user') ? e.target : e.target.closest('.btn-delete-user');
const userId = parseInt(btn.dataset.userId);
const username = btn.dataset.username;