// 用户列表页面交互 document.addEventListener('DOMContentLoaded', function() { // 处理状态切换按钮 const toggleStatusButtons = document.querySelectorAll('.toggle-status'); toggleStatusButtons.forEach(button => { button.addEventListener('click', function() { const userId = this.getAttribute('data-id'); const newStatus = parseInt(this.getAttribute('data-status')); const statusText = newStatus === 1 ? '启用' : '禁用'; if (confirm(`确定要${statusText}该用户吗?`)) { toggleUserStatus(userId, newStatus); } }); }); // 处理删除按钮 const deleteButtons = document.querySelectorAll('.delete-user'); const deleteModal = $('#deleteModal'); let userIdToDelete = null; deleteButtons.forEach(button => { button.addEventListener('click', function() { userIdToDelete = this.getAttribute('data-id'); deleteModal.modal('show'); }); }); // 确认删除按钮 document.getElementById('confirmDelete').addEventListener('click', function() { if (userIdToDelete) { deleteUser(userIdToDelete); deleteModal.modal('hide'); } }); // 自动提交表单的下拉菜单 const autoSubmitSelects = document.querySelectorAll('select[name="status"], select[name="role_id"]'); autoSubmitSelects.forEach(select => { select.addEventListener('change', function() { this.closest('form').submit(); }); }); }); // 切换用户状态 function toggleUserStatus(userId, status) { fetch(`/user/status/${userId}`, { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-Requested-With': 'XMLHttpRequest' }, body: JSON.stringify({ status: status }) }) .then(response => response.json()) .then(data => { if (data.success) { showAlert(data.message, 'success'); setTimeout(() => { window.location.reload(); }, 1500); } else { showAlert(data.message, 'error'); } }) .catch(error => { console.error('Error:', error); showAlert('操作失败,请稍后重试', 'error'); }); } // 删除用户 function deleteUser(userId) { fetch(`/user/delete/${userId}`, { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-Requested-With': 'XMLHttpRequest' } }) .then(response => response.json()) .then(data => { if (data.success) { showAlert(data.message, 'success'); setTimeout(() => { window.location.reload(); }, 1500); } else { showAlert(data.message, 'error'); } }) .catch(error => { console.error('Error:', error); showAlert('操作失败,请稍后重试', 'error'); }); } // 显示通知 function showAlert(message, type) { // 检查是否已有通知元素 let alertBox = document.querySelector('.alert-box'); if (!alertBox) { alertBox = document.createElement('div'); alertBox.className = 'alert-box'; document.body.appendChild(alertBox); } // 创建新的通知 const alert = document.createElement('div'); alert.className = `alert alert-${type === 'success' ? 'success' : 'danger'} fade-in`; alert.innerHTML = message; // 添加到通知框中 alertBox.appendChild(alert); // 自动关闭 setTimeout(() => { alert.classList.add('fade-out'); setTimeout(() => { alertBox.removeChild(alert); }, 500); }, 3000); }