feat(monitoring): 添加 API 请求统计和监控面板

本次提交引入了 API 请求统计功能,并将原“密钥状态”页面重构为功能更全面的“监控面板”。

主要变更包括:

- **数据库与服务层:**
    - 新增 `RequestLog` 数据模型 (`app/database/models.py`),用于存储 API 请求的详细信息(时间、模型、密钥、成功状态、状态码、耗时)。
    - 在 `app/database/services.py` 中添加 `add_request_log` 和 `get_request_stats` 函数,分别用于记录单次请求和获取时间窗口内的统计数据。
    - 新增 `app/service/stats_service.py`,封装了获取 API 调用统计逻辑。

- **API 请求日志记录:**
    - 在 Gemini (`gemini_chat_service.py`) 和 OpenAI (`openai_chat_service.py`) 聊天服务中,于 API 调用前后添加了 `add_request_log` 调用,以记录请求的成功与否及耗时。

- **前端监控面板:**
    - 将 `/keys` 路由对应的页面 (`keys_status.html`) 从“密钥状态”重构为“监控面板”。
    - 页面顶部新增统计卡片区域,展示:
        - 密钥统计:总数、有效数、无效数。
        - API 调用统计:1分钟内、1小时内、24小时内、本月调用次数。
    - 密钥列表(有效/无效)采用响应式网格布局 (`grid`),并增加了悬停动效和边框高亮。
    - 优化了有效密钥列表的筛选逻辑,在无匹配项时显示提示信息。
    - 为新的统计卡片和列表项添加了相应的 CSS 样式。
    - 更新了 `keys_status.js` 以支持筛选无结果时的提示。

- **路由与导航:**
    - 在 `app/router/routes.py` 中添加了 `/stats` 端点,用于获取 API 统计数据。
    - 更新了 `config_editor.html` 和 `error_logs.html` 中的导航链接,使其指向新的“监控面板”。

- **日志配置:**
    - 在 `app/log/logger.py` 中,为 `sqlalchemy.exc` 设置了 WARNING 日志级别。

这些更改旨在提供更好的系统可观测性,方便用户监控 API 密钥状态和请求频率。
This commit is contained in:
snaily
2025-04-11 14:45:03 +08:00
parent 51bb71bdb5
commit 7b4652c802
12 changed files with 879 additions and 283 deletions
+2 -24
View File
@@ -469,15 +469,7 @@ async function saveConfig() {
const result = await response.json();
// 显示保存状态
const saveStatus = document.getElementById('saveStatus');
saveStatus.style.opacity = "1";
saveStatus.style.transform = "translate(-50%, -50%) scale(1.1)";
setTimeout(() => {
saveStatus.style.opacity = "0";
saveStatus.style.transform = "translate(-50%, -50%) scale(0.95)";
}, 3000);
// 移除居中的 saveStatus 提示
showNotification('配置保存成功', 'success');
@@ -488,21 +480,7 @@ async function saveConfig() {
console.error('保存配置失败:', error);
// 保存失败时,也尝试重启定时任务,以防万一
await startScheduler();
// 显示错误状态
const saveStatus = document.getElementById('saveStatus');
saveStatus.style.backgroundColor = "#ef4444"; // 红色背景
saveStatus.style.opacity = "1";
saveStatus.style.transform = "translate(-50%, -50%) scale(1.1)";
saveStatus.querySelector('.status-icon i').className = 'fas fa-times-circle';
saveStatus.querySelector('.status-text').textContent = '配置保存失败';
setTimeout(() => {
saveStatus.style.opacity = "0";
saveStatus.style.transform = "translate(-50%, -50%) scale(0.95)";
setTimeout(() => {
saveStatus.style.backgroundColor = "#22c55e"; // 恢复绿色背景
}, 300);
}, 3000);
// 移除居中的 saveStatus 提示
showNotification('保存配置失败: ' + error.message, 'error');
}