Watcher/watcher
4
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects 1 Releases 1 Wiki Activity

Graphen fertig

Browse Source
This commit is contained in:
Daniel Habenicht
2025-08-11 23:07:22 +02:00
parent 588f5851d4
commit 5879673aeb
3 changed files with 25 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
Watcher/Controllers/MonitoringController.cs
View File

@@ -232,17 +232,15 @@ public class MonitoringController : Controller
} }
[HttpGet("cpu-usage")] [HttpGet("cpu-usage")]
public async Task<IActionResult> GetCpuUsageData() public async Task<IActionResult> GetCpuUsageData(int serverId)
{ {
var oneDayAgo = DateTime.UtcNow.AddDays(-1); var oneDayAgo = DateTime.UtcNow.AddDays(-1);
var data = await _context.Metrics var data = await _context.Metrics
.Where(m => m.Timestamp >= oneDayAgo) .Where(m => m.Timestamp >= oneDayAgo && m.ServerId == serverId)
.OrderBy(m => m.Timestamp) .OrderBy(m => m.Timestamp)
.Select(m => new .Select(m => new
{ {
// Hier die Formatierung anpassen label = m.Timestamp.ToUniversalTime().ToString("o"),
// 'o' ist der Standard-Formatbezeichner für ISO 8601-Format mit Zeitzone
label = m.Timestamp.ToUniversalTime().ToString("o"), // Wichtig: ToUniversalTime() für Konsistenz
data = m.CPU_Load data = m.CPU_Load
}) })
.ToListAsync(); .ToListAsync();
@@ -251,17 +249,15 @@ public class MonitoringController : Controller
} }
[HttpGet("ram-usage")] [HttpGet("ram-usage")]
public async Task<IActionResult> GetRamUsageData() public async Task<IActionResult> GetRamUsageData(int serverId)
{ {
var oneDayAgo = DateTime.UtcNow.AddDays(-1); var oneDayAgo = DateTime.UtcNow.AddDays(-1);
var data = await _context.Metrics var data = await _context.Metrics
.Where(m => m.Timestamp >= oneDayAgo) .Where(m => m.Timestamp >= oneDayAgo && m.ServerId == serverId)
.OrderBy(m => m.Timestamp) .OrderBy(m => m.Timestamp)
.Select(m => new .Select(m => new
{ {
// Hier die Formatierung anpassen label = m.Timestamp.ToUniversalTime().ToString("o"),
// 'o' ist der Standard-Formatbezeichner für ISO 8601-Format mit Zeitzone
label = m.Timestamp.ToUniversalTime().ToString("o"), // Wichtig: ToUniversalTime() für Konsistenz
data = m.RAM_Load data = m.RAM_Load
}) })
.ToListAsync(); .ToListAsync();
@@ -270,18 +266,16 @@ public class MonitoringController : Controller
} }
[HttpGet("gpu-usage")] [HttpGet("gpu-usage")]
public async Task<IActionResult> GetGpuUsageData() public async Task<IActionResult> GetGpuUsageData(int serverId)
{ {
var oneDayAgo = DateTime.UtcNow.AddDays(-1); var oneDayAgo = DateTime.UtcNow.AddDays(-1);
var data = await _context.Metrics var data = await _context.Metrics
.Where(m => m.Timestamp >= oneDayAgo) .Where(m => m.Timestamp >= oneDayAgo && m.ServerId == serverId)
.OrderBy(m => m.Timestamp) .OrderBy(m => m.Timestamp)
.Select(m => new .Select(m => new
{ {
// Hier die Formatierung anpassen label = m.Timestamp.ToUniversalTime().ToString("o"),
// 'o' ist der Standard-Formatbezeichner für ISO 8601-Format mit Zeitzone data = m.GPU_Load
label = m.Timestamp.ToUniversalTime().ToString("o"), // Wichtig: ToUniversalTime() für Konsistenz
data = m.RAM_Load
}) })
.ToListAsync(); .ToListAsync();

30
Watcher/Views/Server/Details.cshtml
View File

@@ -52,21 +52,21 @@
<div class="mt-4"> <div class="mt-4">
<h6><i class="bi bi-graph-up me-1"></i>CPU Last</h6> <h6><i class="bi bi-graph-up me-1"></i>CPU Last</h6>
<div class="bg-light border rounded p-4 text-center text-muted" style="height: 1000px; width: 100%"> <div class="bg-light border rounded p-4 text-center text-muted" style="height: 500px; width: 100%">
<canvas id="cpuUsageChart" style="width: 800px; height: 400px; border: 1px solid red;"></canvas> <canvas id="cpuUsageChart" style="width: 800px; height: 400px; border: 1px solid red;"></canvas>
</div> </div>
</div> </div>
</div> </div>
<h6><i class="bi bi-graph-up me-1"></i>RAM Last</h6> <h6><i class="bi bi-graph-up me-1"></i>RAM Last</h6>
<div class="bg-light border rounded p-4 text-center text-muted" style="height: 1000px; width: 100%"> <div class="bg-light border rounded p-4 text-center text-muted" style="height: 500px; width: 100%">
<canvas id="ramUsageChart" style="width: 800px; height: 400px; border: 1px solid red;"></canvas> <canvas id="ramUsageChart" style="width: 800px; height: 400px; border: 1px solid red;"></canvas>
</div> </div>
</div> </div>
<div class="mt-4"></div> <div class="mt-4"></div>
<h6><i class="bi bi-graph-up me-1"></i>GPU Last</h6> <h6><i class="bi bi-graph-up me-1"></i>GPU Last</h6>
<div class="bg-light border rounded p-4 text-center text-muted" style="height: 1000px; width: 100%"> <div class="bg-light border rounded p-4 text-center text-muted" style="height: 500px; width: 100%">
<canvas id="gpuUsageChart" style="width: 800px; height: 400px; border: 1px solid red;"></canvas> <canvas id="gpuUsageChart" style="width: 800px; height: 400px; border: 1px solid red;"></canvas>
</div> </div>
</div> </div>
@@ -81,8 +81,8 @@
<script> <script>
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
const ctx_cpu = document.getElementById('cpuUsageChart').getContext('2d'); const ctx_cpu = document.getElementById('cpuUsageChart').getContext('2d');
const ctx_cpu = document.getElementById('ramUsageChart').getContext('2d'); const ctx_ram = document.getElementById('ramUsageChart').getContext('2d');
const ctx_cpu = document.getElementById('gpuUsageChart').getContext('2d'); const ctx_gpu = document.getElementById('gpuUsageChart').getContext('2d');
const cpuChart = new Chart(ctx_cpu, { const cpuChart = new Chart(ctx_cpu, {
type: 'line', type: 'line',
@@ -107,7 +107,7 @@
max: 100, max: 100,
title: { title: {
display: true, display: true,
text: 'Prozent' text: 'Auslastung in %'
} }
}, },
x: { x: {
@@ -194,7 +194,7 @@
async function loadCpuData() { async function loadCpuData() {
try { try {
const response = await fetch('/monitoring/cpu-usage'); const response = await fetch('/monitoring/cpu-usage?serverId=@Model.Id');
if (!response.ok) { if (!response.ok) {
throw new Error(`HTTP-Fehler: ${response.status}`); throw new Error(`HTTP-Fehler: ${response.status}`);
} }
@@ -217,7 +217,7 @@
async function loadRamData() { async function loadRamData() {
try { try {
const response = await fetch('/monitoring/ram-usage'); const response = await fetch('/monitoring/ram-usage?serverId=@Model.Id');
if (!response.ok) { if (!response.ok) {
throw new Error(`HTTP-Fehler: ${response.status}`); throw new Error(`HTTP-Fehler: ${response.status}`);
} }
@@ -229,10 +229,10 @@
return; return;
} }
cpuChart.data.labels = data.map(d => d.label ?? ''); ramChart.data.labels = data.map(d => d.label ?? '');
cpuChart.data.datasets[0].data = data.map(d => Number(d.data)); ramChart.data.datasets[0].data = data.map(d => Number(d.data));
cpuChart.update(); ramChart.update();
} catch (err) { } catch (err) {
console.error('Fehler beim Laden der RAM-Daten:', err); console.error('Fehler beim Laden der RAM-Daten:', err);
} }
@@ -240,7 +240,7 @@
async function loadGpuData() { async function loadGpuData() {
try { try {
const response = await fetch('/monitoring/gpu-usage'); const response = await fetch('/monitoring/gpu-usage?serverId=@Model.Id');
if (!response.ok) { if (!response.ok) {
throw new Error(`HTTP-Fehler: ${response.status}`); throw new Error(`HTTP-Fehler: ${response.status}`);
} }
@@ -252,10 +252,10 @@
return; return;
} }
cpuChart.data.labels = data.map(d => d.label ?? ''); gpuChart.data.labels = data.map(d => d.label ?? '');
cpuChart.data.datasets[0].data = data.map(d => Number(d.data)); gpuChart.data.datasets[0].data = data.map(d => Number(d.data));
cpuChart.update(); gpuChart.update();
} catch (err) { } catch (err) {
console.error('Fehler beim Laden der GPU-Daten:', err); console.error('Fehler beim Laden der GPU-Daten:', err);
} }

0
Watcher/wwwroot/js/server_uptime.js Normal file
View File