Feinschliff Phase 2: Dashboard Redesign, RAM Check, Accordions

This commit is contained in:
Hitonabi
2026-06-20 22:30:40 +02:00
parent e3be7fbfb5
commit 8b76adc96e
10 changed files with 358 additions and 119 deletions
+19 -8
View File
@@ -24,17 +24,19 @@ function applyStatus(s) {
if (!s) {
dot.className = "dot off";
label.textContent = "Backend nicht erreichbar";
$("#top-models").textContent = "";
$("#top-active").textContent = "";
$("#top-active-text").textContent = "Backend offline";
showAlert("Backend nicht erreichbar läuft uvicorn?", false);
} else {
const host = s.swap_url.replace(/^https?:\/\//, "");
dot.className = "dot " + (s.swap_ok ? "on" : "off");
label.textContent = (s.swap_ok ? "LLM-Engine: Online " : "LLM-Engine: Offline ") + host;
$("#top-models").textContent = (s.models || []).length;
const active = (s.models || []).find(m => m.state === "running");
$("#top-active").textContent = active ? active.name : "";
if (active) {
$("#top-active-text").innerHTML = `Geladen: <b style="color:var(--teal)">${active.name}</b>`;
} else {
$("#top-active-text").innerHTML = "Kein Modell im VRAM";
}
if (s.swap_ok) hideAlert();
else showAlert(`LLM-Engine nicht erreichbar unter <b>${host}</b> läuft der llama-swap Dienst?`, true);
@@ -44,7 +46,6 @@ function applyStatus(s) {
function applyJobs(jobs) {
lastJobs = jobs || [];
$("#top-jobs").textContent = lastJobs.filter(j => j.state === "running" || j.state === "queued").length;
for (const p of panels) p.onJobs?.(lastJobs);
}
@@ -79,8 +80,18 @@ async function pollSystem() {
// ---- Boot ----
function bootToken() {
const i = $("#token");
i.value = getToken();
i.addEventListener("change", e => { setToken(e.target.value); pollStatus(); });
if (i) {
i.value = getToken();
i.addEventListener("change", e => { setToken(e.target.value); pollStatus(); });
}
const sbtn = $("#nav-settings");
const smod = $("#settings-modal");
const scls = $("#sm-close");
if (sbtn && smod && scls) {
sbtn.addEventListener("click", () => smod.style.display = "flex");
scls.addEventListener("click", () => smod.style.display = "none");
}
}
function tickClock() {
$("#clock").textContent = new Date().toTimeString().slice(0, 5);
@@ -98,4 +109,4 @@ pollSystem();
setInterval(tickClock, 1000);
setInterval(pollStatus, 3000);
setInterval(pollJobs, 1500);
setInterval(pollSystem, 3000);
setInterval(pollSystem, 2000);