asdasd

modules/pi_control/assets/console.js

@@ -165,6 +165,10 @@
   const queueBody = document.querySelector('[data-queue-body]');
   const countdownEl = document.querySelector('[data-queue-countdown]');
   const refreshBtn = document.querySelector('[data-queue-refresh]');
+  const queueBtn = document.querySelector('[data-queue-button]');
+  const queueCount = document.querySelector('[data-queue-count]');
+  const queueModal = document.querySelector('[data-queue-modal]');
+  const queueClose = document.querySelector('[data-queue-close]');
   if (!queueBody || !countdownEl) return;
 
   let remaining = 10;
@@ -179,6 +183,10 @@
       if (data && data.html) {
         queueBody.innerHTML = data.html;
       }
+      if (queueCount && typeof data.count === 'number') {
+        queueCount.textContent = String(data.count);
+        queueCount.style.display = data.count > 0 ? 'inline-flex' : 'none';
+      }
       remaining = data && data.next ? data.next : 10;
     } catch (e) {
       // ignore
@@ -195,6 +203,7 @@
   };
 
   setInterval(tick, 1000);
+  fetchQueue();
   if (refreshBtn) {
     refreshBtn.addEventListener('click', () => {
       fetchQueue();
@@ -203,6 +212,59 @@
     });
   }
 
+  if (queueBtn && queueModal) {
+    queueBtn.addEventListener('click', () => {
+      queueModal.classList.add('is-open');
+      queueModal.setAttribute('aria-hidden', 'false');
+      fetchQueue();
+    });
+  }
+  if (queueClose && queueModal) {
+    queueClose.addEventListener('click', () => {
+      queueModal.classList.remove('is-open');
+      queueModal.setAttribute('aria-hidden', 'true');
+    });
+  }
+  if (queueModal) {
+    queueModal.addEventListener('click', (e) => {
+      if (e.target === queueModal) {
+        queueModal.classList.remove('is-open');
+        queueModal.setAttribute('aria-hidden', 'true');
+      }
+    });
+  }
+
+  queueBody.addEventListener('click', async (e) => {
+    const btn = e.target.closest('[data-queue-action]');
+    if (!btn) return;
+    const runId = btn.getAttribute('data-run-id');
+    const action = btn.getAttribute('data-queue-action');
+    if (!runId || !action) return;
+    const url = new URL(window.location.href);
+    url.searchParams.set('queue_action_json', '1');
+    const formData = new FormData();
+    formData.set('run_id', runId);
+    formData.set('action', action);
+    try {
+      const res = await fetch(url.toString(), { method: 'POST', body: formData, cache: 'no-store' });
+      const data = await res.json();
+      if (!data.ok) {
+        if (consoleNotice) {
+          consoleNotice.textContent = data.error || 'Aktion fehlgeschlagen.';
+          consoleNotice.style.display = 'block';
+        }
+      }
+    } catch (err) {
+      if (consoleNotice) {
+        consoleNotice.textContent = 'Aktion fehlgeschlagen.';
+        consoleNotice.style.display = 'block';
+      }
+    }
+    fetchQueue();
+    remaining = 10;
+    countdownEl.textContent = String(remaining);
+  });
+
   const consoleForm = document.querySelector('[data-console-form]');
   const consoleError = document.querySelector('[data-console-error]');
   const consoleNotice = document.querySelector('[data-console-notice]');