admin/e-cosplay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

```

Browse Source 
✨ feat(dashboard): Ajoute affichage des serveurs Google Compute et OVH.
Ajoute le script mqtt et la class ServerCard pour afficher le status serveur.
```
This commit is contained in:
Serreau Jovann
2025-11-06 08:04:11 +01:00
parent c188ea380a
commit e738753a6a
6 changed files with 100 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
assets/admin.js
View File

@@ -30,6 +30,9 @@ function script() {
}
function full() {
const sidebar = document.getElementById('sidebar');
const sidebarToggle = document.getElementById('sidebar-toggle');

61
assets/class/ServerCard.js
View File

@@ -13,7 +13,64 @@ export class ServerCard extends HTMLDivElement{
this.update()
}
update() {
fetch("/api-interne/server/"+this.getAttribute('id')).then(e=>e.json()).then((rslt)=>{
let mqttClient = mqtt.connect('wss://wsmqtt.esy-web.dev');
mqttClient.on("connect", () => {
mqttClient.subscribe('server/'+this.getAttribute('id')+'/metric')
mqttClient.subscribe('server/'+this.getAttribute('id')+'/online')
});
mqttClient.on("message", (topic, message) => {
if(topic == "server/"+this.getAttribute('id')+"/online") {
let json = JSON.parse(message.toString());
if(json.status) {
this.s.classList = "s font-semibold bg-RUNNING";
this.s.innerText = "RUNNING";
} else {
this.s.classList = "s font-semibold bg-STOPPED";
this.s.innerText = "STOPPED";
}
}
if(topic == "server/"+this.getAttribute('id')+"/metric") {
let json = JSON.parse(message.toString());
this.cpu.querySelector('.p').innerText = json.cpu + "%";
this.cpu.querySelector('.gauge >div').style.width = json.cpu + "%";
if (json.cpu <= 70) {
this.cpu.querySelector('.gauge >div').classList = "bg-green-500 h-2 rounded-l-full";
}
if (json.cpu>=71 && json.cpu <=90) {
this.cpu.querySelector('.gauge >div').classList = "bg-orange-500 h-2 rounded-l-full";
}
if (json.cpu>=91) {
this.cpu.querySelector('.gauge >div').classList = "bg-red-500 h-2 rounded-l-full";
}
this.ram.querySelector('.p').innerText = json.memory + "%";
this.ram.querySelector('.gauge >div').style.width = json.memory + "%";
if (json.memory <= 70) {
this.ram.querySelector('.gauge >div').classList = "bg-green-500 h-2 rounded-l-full";
}
if (json.memory>=71 && json.memory <=90) {
this.ram.querySelector('.gauge >div').classList = "bg-orange-500 h-2 rounded-l-full";
}
if (json.ram>=91) {
this.ram.querySelector('.gauge >div').classList = "bg-red-500 h-2 rounded-l-full";
}
this.hdd.querySelector('.p').innerText = json.disk + "%";
this.hdd.querySelector('.gauge >div').style.width = json.disk + "%";
if (json.disk <= 70) {
this.hdd.querySelector('.gauge >div').classList = "bg-green-500 h-2 rounded-l-full";
}
if (json.disk>=71 && json.disk <=90) {
this.hdd.querySelector('.gauge >div').classList = "bg-orange-500 h-2 rounded-l-full";
}
if (json.disk>=91) {
this.hdd.querySelector('.gauge >div').classList = "bg-red-500 h-2 rounded-l-full";
}
}
});
/*fetch("/api-interne/server/"+this.getAttribute('id')).then(e=>e.json()).then((rslt)=>{
this.s.classList = "s font-semibold bg-"+rslt.status;
this.s.innerText = rslt.status;
@@ -28,6 +85,6 @@ export class ServerCard extends HTMLDivElement{
this.hdd.querySelector('.p').innerText = rslt.hdd+"%";
this.hdd.querySelector('.gauge >div').style.width = rslt.hdd+"%";
this.hdd.querySelector('.gauge >div').classList = "bg-"+rslt.hdd_color+"-500 h-2 rounded-l-full";
})
})*/
}
}