-
@@ -434,33 +520,141 @@
// showMessage('错误信息', 'error');
// showMessage('提示信息', 'info');
- // 初始化图表
- const accessCtx = document.getElementById('accessChart').getContext('2d');
- new Chart(accessCtx, {
- type: 'line',
- data: {
- labels: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
- datasets: [{
- label: '访问量',
- data: [0, 0, 0, 0, 0, 0, 0],
- borderColor: 'rgb(75, 192, 192)',
- tension: 0.1
- }]
- }
- });
+ // 初始化图表变量
+ let accessChartInstance = null;
+ let storageChartInstance = null;
- const storageCtx = document.getElementById('storageChart').getContext('2d');
- new Chart(storageCtx, {
- type: 'doughnut',
- data: {
- labels: ['阿里云盘', '百度网盘'],
- datasets: [{
- data: [0, 0],
- backgroundColor: ['#ff6384', '#36a2eb']
- }]
- }
- });
+ // 初始化图表函数
+ function initCharts() {
+ const accessCtx = document.getElementById('accessChart').getContext('2d');
+ accessChartInstance = new Chart(accessCtx, {
+ type: 'line',
+ data: {
+ labels: [], // 初始为空，稍后填充
+ datasets: [{
+ label: '访问量', // 暂时保留，实际数据需记录日志
+ data: [], // 初始为空
+ borderColor: 'rgb(75, 192, 192)',
+ tension: 0.1
+ }]
+ },
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ scales: {
+ x: {
+ grid: { display: false },
+ ticks: { color: '#6c757d' } // X轴标签颜色
+ },
+ y: {
+ grid: { color: 'rgba(108, 117, 125, 0.2)' }, // Y轴网格线颜色
+ ticks: { color: '#6c757d' } // Y轴标签颜色
+ }
+ },
+ plugins: {
+ legend: {
+ labels: { color: '#343a40' } // 图例文字颜色
+ }
+ }
+ }
+ });
+ const storageCtx = document.getElementById('storageChart').getContext('2d');
+ storageChartInstance = new Chart(storageCtx, {
+ type: 'doughnut',
+ data: {
+ labels: [], // 初始为空
+ datasets: [{
+ data: [], // 初始为空
+ backgroundColor: [ // 提供更多颜色以备不时之需
+ '#ff6384',
+ '#36a2eb',
+ '#ffce56',
+ '#4bc0c0',
+ '#9966ff',
+ '#ff9f40'
+ ]
+ }]
+ },
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ plugins: {
+ legend: {
+ position: 'top',
+ labels: { color: '#343a40' } // 图例文字颜色
+ }
+ }
+ }
+ });
+ }
+
+ // 更新仪表盘数据函数
+ function updateDashboard() {
+ $.ajax({
+ url: '/admin/dashboard_data',
+ type: 'GET',
+ success: function(response) {
+ if (response.status && response.data) {
+ // 更新美化后的KPI卡片值
+ $('#dashboard .kpi-value').eq(0).text(response.data.user_drives_count || 0);
+ $('#dashboard .kpi-value').eq(1).text(response.data.active_links_count || 0);
+ $('#dashboard .kpi-value').eq(2).text(response.data.total_links_count || 0);
+ } else {
+ showMessage('获取仪表盘数据失败', 'error');
+ }
+ },
+ error: function(error) {
+ console.error('获取仪表盘数据出错:', error);
+ showMessage('获取仪表盘数据时发生网络错误', 'error');
+ }
+ });
+ }
+
+ // 更新统计图表函数
+ function updateStatisticsCharts() {
+ $.ajax({
+ url: '/admin/statistics_data',
+ type: 'GET',
+ success: function(response) {
+ if (response.status && response.data) {
+ // 更新网盘使用分布图 (Doughnut Chart)
+ if (response.data.drives_by_provider && storageChartInstance) {
+ const providerData = response.data.drives_by_provider;
+ const labels = Object.keys(providerData);
+ const data = Object.values(providerData);
+
+ storageChartInstance.data.labels = labels;
+ storageChartInstance.data.datasets[0].data = data;
+ storageChartInstance.update();
+ }
+
+ // 更新外链访问趋势图 (Line Chart) - 需要后端实现日志记录和数据提供
+ // 示例：假设 response.data.access_trend = [{date: '2023-01-01', count: 10}, ...]
+ // if (response.data.access_trend && accessChartInstance) {
+ // const trendData = response.data.access_trend;
+ // accessChartInstance.data.labels = trendData.map(item => item.date);
+ // accessChartInstance.data.datasets[0].data = trendData.map(item => item.count);
+ // accessChartInstance.update();
+ // } else {
+ // 如果没有访问数据，显示空状态或提示
+ if (accessChartInstance) {
+ accessChartInstance.data.labels = ['无数据'];
+ accessChartInstance.data.datasets[0].data = [0];
+ accessChartInstance.update();
+ }
+ // }
+ } else {
+ showMessage('获取统计数据失败', 'error');
+ }
+ },
+ error: function(error) {
+ console.error('获取统计数据出错:', error);
+ showMessage('获取统计数据时发生网络错误', 'error');
+ }
+ });
+ }
+
// json编辑器处理
function initAceEditor(editorElement) {
const editor = ace.edit(editorElement);
@@ -536,6 +730,14 @@
bindAddAccountEvent(); // 初始化添加账号事件
bindAddExlinkEvents(); // 初始化添加外链事件
loadExternalLinks(); // 加载外链列表
+ setupModalFocusManagement(); // <-- 添加此行：初始化模态框焦点管理
+
+ initCharts(); // <-- 新增：初始化图表
+ updateDashboard(); // <-- 新增：加载仪表盘数据
+ updateStatisticsCharts(); // <-- 新增：加载统计图表数据
+
+ // 重新加载账户列表以获取初始数据（如果需要）
+ refreshAccountsList();
});
// 设置默认JSON模板 (Add Modal specific)
@@ -887,8 +1089,22 @@
row.append(`
${remainingCount} / ${totalQuota} | `);
// 状态
+ let isExpired = false;
+ if (link.expiry_time) {
+ try {
+ const expiryDate = new Date(link.expiry_time); // Directly parse ISO string
+ if (!isNaN(expiryDate.getTime()) && new Date() > expiryDate) {
+ isExpired = true;
+ }
+ } catch (e) {
+ console.error("Error parsing expiry_time in admin list:", link.expiry_time, e);
+ // Optionally treat parse error as expired or show different status
+ }
+ }
+
let statusBadge = '';
- if (remainingCount <= 0) {
+ // 如果剩余次数用完 或 已过期，则禁用
+ if (remainingCount <= 0 || isExpired) {
statusBadge = '
已禁用';
} else {
statusBadge = '
正常';
@@ -1021,9 +1237,14 @@
return;
}
- // 转换日期时间格式：从YYYY-MM-DDThh:mm到YYYY-MM-DD hh:mm:ss
- const expiryDate = new Date(expiry_time);
- const formattedExpiryTime = expiryDate.toISOString().replace('T', ' ').substring(0, 19);
+ // 转换日期时间格式：从YYYY-MM-DDThh:mm到完整的ISO 8601 UTC字符串
+ const expiryDate = new Date(expiry_time); // 解析本地时间输入
+ // 检查日期是否有效
+ if (isNaN(expiryDate.getTime())) {
+ showMessage('无效的日期时间格式', 'error');
+ return;
+ }
+ const expiryTimeISO = expiryDate.toISOString(); // 转换为ISO 8601 UTC字符串 (e.g., "2025-04-12T11:08:00.000Z")
// 发送创建外链请求
$.ajax({
@@ -1033,7 +1254,7 @@
data: JSON.stringify({
drive_id: drive_id,
total_quota: total_quota,
- expiry_time: formattedExpiryTime,
+ expiry_time: expiryTimeISO, // <-- 使用完整的 ISO UTC 字符串
remarks: remarks
}),
success: function(response) {
@@ -1091,6 +1312,43 @@
});
});
}
+
+ // Focus management for modals to fix aria-hidden warning
+ function setupModalFocusManagement() {
+ const modals = document.querySelectorAll('.modal');
+ let triggerElement = null;
+
+ modals.forEach(modal => {
+ // Store the trigger element when the modal is about to show
+ modal.addEventListener('show.bs.modal', function (event) {
+ // event.relatedTarget is the element that triggered the modal
+ triggerElement = event.relatedTarget;
+ });
+
+ // Return focus when the modal is hidden
+ modal.addEventListener('hidden.bs.modal', function () {
+ // Small delay to ensure the modal is fully hidden and elements are interactable
+ setTimeout(() => {
+ if (triggerElement && typeof triggerElement.focus === 'function') {
+ // Check if trigger element still exists and is focusable
+ if (document.body.contains(triggerElement)) {
+ triggerElement.focus();
+ } else {
+ // Fallback if trigger element is gone (e.g., deleted from DOM)
+ // Focusing body might not be ideal UX, consider a more specific fallback if needed
+ document.body.focus();
+ console.log("Modal trigger element no longer exists, focusing body.");
+ }
+ } else {
+ // Fallback if no trigger element recorded or it's not focusable
+ document.body.focus();
+ console.log("No modal trigger element recorded or it's not focusable, focusing body.");
+ }
+ triggerElement = null; // Reset for the next modal
+ }, 0);
+ });
+ });
+ }