/** * 容量管理相关功能 */ // 页面加载完成后初始化 document.addEventListener('DOMContentLoaded', function () { // 导航切换事件 document.getElementById('nav-quota').addEventListener('click', function (event) { event.preventDefault(); switchPage('quota'); }); // 更新容量按钮点击事件 document.getElementById('btn-update-quota').addEventListener('click', updateQuota); }); /** * 加载所有用户的容量信息 */ async function loadQuotaInfo() { try { showLoading(); // 获取所有用户的容量信息 const response = await Api.get('/api/quota/users'); // 检查返回的数据是否为空数组 if (Array.isArray(response) && response.length > 0) { // 渲染用户容量列表 renderQuotaList(response); } else { // 如果没有数据,显示空状态 document.getElementById('quota-list').innerHTML = '暂无用户数据'; } } catch (error) { console.error('获取用户容量信息失败:', error); showToast('获取用户容量信息失败: ' + error.message, 'danger'); // 显示错误状态 document.getElementById('quota-list').innerHTML = '加载失败'; } finally { // 延迟关闭loading,确保操作完成 setTimeout(() => { hideLoading(); // 移除所有modal-backdrop元素,防止页面被遮罩覆盖 document.querySelectorAll('.modal-backdrop.fade.show').forEach(el => el.remove()); }, 500); } } /** * 渲染用户容量列表 * @param {Array} quotaList - 用户容量信息列表 */ function renderQuotaList(quotaList) { const quotaListElement = document.getElementById('quota-list'); quotaListElement.innerHTML = ''; quotaList.forEach(userQuota => { const usedFormatted = formatFileSize(userQuota.used); const totalFormatted = formatFileSize(userQuota.total); const row = document.createElement('tr'); row.innerHTML = ` ${userQuota.userId} ${userQuota.userName} ${usedFormatted} ${totalFormatted} ${userQuota.count} `; quotaListElement.appendChild(row); }); // 为所有"修改容量"按钮添加事件监听器 document.querySelectorAll('.btn-update-quota').forEach(button => { button.addEventListener('click', function () { const userId = this.getAttribute('data-user-id'); const userName = this.getAttribute('data-user-name'); const total = this.getAttribute('data-total'); openUpdateQuotaModal(userId, userName, total); }); }); } /** * 打开更新容量模态框 * @param {string} userId - 用户ID * @param {string} userName - 用户名 * @param {string} total - 当前总容量(字节) */ function openUpdateQuotaModal(userId, userName, total) { // 设置模态框中的表单值 document.getElementById('update-user-id').value = userId; document.getElementById('update-user-name').value = userName; // 设置下拉框的默认选中项 const quotaSelect = document.getElementById('update-quota-size'); quotaSelect.value = total; // 如果没有匹配的选项,则选择最接近的一个 if (!quotaSelect.options.namedItem || quotaSelect.selectedIndex === -1) { // 查找最接近的选项 const options = Array.from(quotaSelect.options).slice(1); // 排除第一个"请选择容量"选项 let closestOption = options[0]; let minDifference = Math.abs(parseInt(closestOption.value) - parseInt(total)); for (let i = 1; i < options.length; i++) { const optionValue = parseInt(options[i].value); const difference = Math.abs(optionValue - parseInt(total)); if (difference < minDifference) { minDifference = difference; closestOption = options[i]; } } quotaSelect.value = closestOption.value; } // 显示模态框 const modal = new bootstrap.Modal(document.getElementById('updateQuotaModal')); modal.show(); } /** * 更新用户容量 */ async function updateQuota() { const userId = document.getElementById('update-user-id').value; const quotaSize = document.getElementById('update-quota-size').value; if (!userId || !quotaSize) { showToast('请填写完整的容量信息', 'warning'); return; } try { showLoading(); // 发送更新请求 const requestData = { quota: parseInt(quotaSize),// 直接使用选择的字节数值 userName: document.getElementById('update-user-name').value }; const response = await Api.put(`/api/quota/${userId}`, requestData); if (response.code === '000000') { showToast('容量更新成功', 'success'); // 关闭模态框 const modal = bootstrap.Modal.getInstance(document.getElementById('updateQuotaModal')); if (modal) { modal.hide(); } // 重新加载容量信息 await loadQuotaInfo(); } else { showToast('容量更新失败: ' + response.error, 'danger'); } } catch (error) { console.error('更新容量失败:', error); showToast('更新容量失败: ' + error.message, 'danger'); } finally { // 延迟关闭loading,确保操作完成 setTimeout(() => { hideLoading(); // 移除所有modal-backdrop元素,防止页面被遮罩覆盖 document.querySelectorAll('.modal-backdrop.fade.show').forEach(el => el.remove()); }, 500); } } /** * 格式化文件大小显示 * @param {number} bytes - 字节数 * @returns {string} 格式化后的文件大小 */ function formatFileSize(bytes) { if (bytes === 0) return '0 B'; // 定义特定的容量值 const sizeMap = { 1073741824: '1G', 2147483648: '2G', 3221225472: '3G', 4294967296: '4G', 5368709120: '5G', 6442450944: '6G', 7516192768: '7G', 8589934592: '8G' }; // 如果是预定义的容量值,直接返回对应的标签 if (sizeMap[bytes]) { return sizeMap[bytes]; } // 否则使用常规的格式化方法 const k = 1024; const sizes = ['B', 'KB', 'MB', 'GB', 'TB']; const i = Math.floor(Math.log(bytes) / Math.log(k)); return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; } /** * 根据使用率获取进度条样式类 * @param {number} percentage - 使用率百分比 * @returns {string} 进度条样式类 */ function getProgressClass(percentage) { if (percentage < 50) { return 'bg-success'; } else if (percentage < 80) { return 'bg-warning'; } else { return 'bg-danger'; } }