125 lines
3.7 KiB
JavaScript
125 lines
3.7 KiB
JavaScript
// 用户列表页面交互
|
|
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);
|
|
}
|