diff --git a/admin/dashboard/blueprints/system.py b/admin/dashboard/blueprints/system.py
index b592fe3..01cffe2 100644
--- a/admin/dashboard/blueprints/system.py
+++ b/admin/dashboard/blueprints/system.py
@@ -11,6 +11,8 @@ from collections import deque
# 创建系统信息蓝图
system_bp = Blueprint('system', __name__)
logger = logging.getLogger("SystemBlueprint")
+# 记录应用启动时间
+APP_START_TIME = time.time()
# 页面路由
@system_bp.route('/wx_logs')
@@ -31,7 +33,7 @@ def api_system_info():
"cpu_usage": psutil.cpu_percent(),
"memory_usage": psutil.virtual_memory().percent,
"disk_usage": psutil.disk_usage('/').percent,
- "uptime": time.time() - psutil.boot_time(),
+ "uptime": time.time() - APP_START_TIME, # 使用应用启动时间计算运行时长
"timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
}
diff --git a/admin/dashboard/templates/index.html b/admin/dashboard/templates/index.html
index 1f20402..248e47b 100644
--- a/admin/dashboard/templates/index.html
+++ b/admin/dashboard/templates/index.html
@@ -5,7 +5,60 @@
{% block content %}
+
+
+
+
+ 系统状态
+
+
+
+
+
+ 操作系统:
+ {% raw %}{{ systemInfo.os }} {{ systemInfo.os_version }}{% endraw %}
+
+
+ Python版本:
+ {% raw %}{{ systemInfo.python_version }}{% endraw %}
+
+
+ 运行时间:
+ {% raw %}{{ formattedUptime }}{% endraw %}
+
+
+
+
+
+
+
+
CPU使用率: {% raw %}{{ systemInfo.cpu_usage }}{% endraw %}%
+
+
+
+
+
+
内存使用率: {% raw %}{{ systemInfo.memory_usage }}{% endraw %}%
+
+
+
+
+
+
磁盘使用率: {% raw %}{{ systemInfo.disk_usage }}{% endraw %}%
+
+
+
+
+
+
+ 最后更新: {% raw %}{{ systemInfo.timestamp }}{% endraw %}
+
+
+
+
+
+
@@ -150,75 +203,6 @@
-
-
-
-
-
-
-
-
-
- 系统状态
-
-
-
-
-
- 操作系统:
- {% raw %}{{ systemInfo.os }} {{ systemInfo.os_version }}{% endraw %}
-
-
- Python版本:
- {% raw %}{{ systemInfo.python_version }}{% endraw %}
-
-
- 运行时间:
- {% raw %}{{ formattedUptime }}{% endraw %}
-
-
-
-
-
-
- CPU使用率:
- {% raw %}{{ systemInfo.cpu_usage }}{% endraw %}%
-
-
-
-
-
- 内存使用率:
- {% raw %}{{ systemInfo.memory_usage }}{% endraw %}%
-
-
-
-
-
- 磁盘使用率:
- {% raw %}{{ systemInfo.disk_usage }}{% endraw %}%
-
-
-
-
-
-
- 最后更新: {% raw %}{{ systemInfo.timestamp }}{% endraw %}
-
-
-
-
-
-
{% endblock %}
{% block scripts %}
@@ -302,14 +286,78 @@
.then(response => {
if (response.data.success) {
this.systemInfo = response.data.data;
+ this.$nextTick(() => {
+ this.renderSystemCharts();
+ });
}
})
.catch(error => {
console.error('加载系统信息出错:', error);
});
},
- // 添加获取当前用户信息的方法
- loadCurrentUserInfo() {
+ // 渲染系统状态饼图
+ renderSystemCharts() {
+ // 渲染CPU使用率饼图
+ this.renderPieChart('cpuChart', this.systemInfo.cpu_usage, 'CPU使用率');
+
+ // 渲染内存使用率饼图
+ this.renderPieChart('memoryChart', this.systemInfo.memory_usage, '内存使用率');
+
+ // 渲染磁盘使用率饼图
+ this.renderPieChart('diskChart', this.systemInfo.disk_usage, '磁盘使用率');
+ },
+ // 通用饼图渲染方法
+ renderPieChart(chartId, usageValue, label) {
+ const ctx = document.getElementById(chartId).getContext('2d');
+
+ // 销毁旧图表
+ if (this.charts[chartId]) {
+ this.charts[chartId].destroy();
+ }
+
+ // 设置颜色
+ let color = 'rgba(75, 192, 192, 1)'; // 绿色 (低负载)
+ if (usageValue > 70) {
+ color = 'rgba(255, 99, 132, 1)'; // 红色 (高负载)
+ } else if (usageValue > 50) {
+ color = 'rgba(255, 205, 86, 1)'; // 黄色 (中等负载)
+ }
+
+ // 创建新图表
+ this.charts[chartId] = new Chart(ctx, {
+ type: 'doughnut',
+ data: {
+ labels: ['已使用', '可用'],
+ datasets: [{
+ data: [usageValue, 100 - usageValue],
+ backgroundColor: [
+ color,
+ 'rgba(220, 220, 220, 0.6)'
+ ],
+ borderWidth: 0
+ }]
+ },
+ options: {
+ responsive: true,
+ maintainAspectRatio: true,
+ cutout: '70%',
+ plugins: {
+ legend: {
+ display: false
+ },
+ tooltip: {
+ callbacks: {
+ label: function(context) {
+ return context.label + ': ' + context.raw + '%';
+ }
+ }
+ }
+ }
+ }
+ });
+ },
+ // 添加获取当前用户信息的方法
+ loadCurrentUserInfo() {
axios.get('/api/current_user_info')
.then(response => {
this.currentUser = response.data;
@@ -333,10 +381,6 @@
return 'success'; // 绿色 (低负载)
}
},
- // 删除不再使用的方法
- // updateSystemInfoUI() { ... },
- // setProgressColor() { ... },
- // formatUptime() { ... },
loadDashboardSummary(days) {
axios.get(`/api/dashboard_summary?days=${days}`)
@@ -559,6 +603,21 @@
color: #606266;
}
+ /* 饼图容器样式 */
+ .pie-chart-container {
+ padding: 10px;
+ text-align: center;
+ margin-bottom: 0;
+ box-shadow: none;
+ }
+
+ .pie-chart-container h4 {
+ margin-top: 0;
+ margin-bottom: 10px;
+ font-size: 14px;
+ color: #606266;
+ }
+
/* 系统状态卡片样式 */
.system-info-item {
margin-bottom: 15px;
@@ -576,10 +635,5 @@
color: #909399;
margin-top: 10px;
}
-
- /* 进度条样式调整 */
- .el-progress {
- margin-bottom: 15px;
- }
{% endblock %}
\ No newline at end of file