Téléverser les fichiers vers "/"

This commit is contained in:
2025-11-14 15:25:38 +00:00
parent de714a2c30
commit 7e326796cf
2 changed files with 109 additions and 0 deletions

61
index.html Normal file
View File

@@ -0,0 +1,61 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Moniteur Système</title>
<style>
/* Un peu de style pour que ce soit joli */
body { font-family: sans-serif; background: #222; color: #eee; }
.container { max-width: 600px; margin: 40px auto; padding: 20px; background: #333; border-radius: 8px; }
.stat { margin-bottom: 15px; font-size: 1.5em; }
.label { display: inline-block; width: 150px; color: #aaa; }
.value { color: #fff; font-weight: bold; }
</style>
</head>
<body>
<div class="container">
<h1>Statut du Système</h1>
<div class="stat">
<span class="label">Température CPU:</span>
<span class="value" id="temp">-- °C</span>
</div>
<div class="stat">
<span class="label">Usage CPU:</span>
<span class="value" id="cpu">-- %</span>
</div>
<div class="stat">
<span class="label">Usage RAM:</span>
<span class="value" id="ram">-- %</span>
</div>
</div>
<script>
// Ce script s'exécute dans le navigateur
async function updateData() {
try {
// 1. Appelle notre backend Python
const response = await fetch('/api/data');
const data = await response.json();
// 2. Met à jour les valeurs dans le HTML
document.getElementById('temp').innerText = data.cpu_temp.toFixed(1) + " °C";
document.getElementById('cpu').innerText = data.cpu_percent.toFixed(1) + " %";
document.getElementById('ram').innerText = data.ram_percent.toFixed(1) + " %";
} catch (error) {
console.error("Erreur de rafraîchissement:", error);
}
}
// Met à jour les données toutes les 2 secondes (2000 ms)
setInterval(updateData, 2000);
// Lance une première fois au chargement
updateData();
</script>
</body>
</html>