Grotti 3.6.0: Lauf-Identität nach Filament-Pause, robustere Queue, Projekte/Aufträge list-first und API-Polish.

web/templates/aktivitaet.html

@@ -19,7 +19,14 @@
   </div>
 </div>
 <div class="toolbar" id="f-kind" role="group" aria-label="Art"></div>
-<div class="toolbar" id="f-host" role="group" aria-label="Drucker"></div>
+<div class="toolbar" aria-label="Drucker">
+  <label class="field inline" for="f-host">
+    <span class="sr-only">Drucker</span>
+    <select id="f-host" title="Drucker">
+      <option value="">Alle Drucker</option>
+    </select>
+  </label>
+</div>
 
 <p id="tl-note" class="tiny"></p>
 <div class="timeline" id="timeline">
@@ -67,11 +74,13 @@ function renderFilters() {
     KINDS.map(([k, label]) =>
       `<button type="button" class="fchip ${filter.kinds.has(k) ? "on" : ""}" data-kind="${k}"><span class="tl-dot ${k}"></span>${label}</button>`
     ).join("");
-  document.getElementById("f-host").innerHTML =
-    `<button type="button" class="fchip ${filter.host ? "" : "on"}" data-host="">Alle Drucker</button>` +
+  const hostSel = document.getElementById("f-host");
+  const cur = filter.host;
+  hostSel.innerHTML = '<option value="">Alle Drucker</option>' +
     printers.map((p) =>
-      `<button type="button" class="fchip ${filter.host === p.host ? "on" : ""}" data-host="${escapeHtml(p.host)}">${escapeHtml(p.name)}</button>`
+      `<option value="${escapeHtml(p.host)}">${escapeHtml(p.name)}</option>`
     ).join("");
+  if ([...hostSel.options].some((o) => o.value === cur)) hostSel.value = cur;
 }
 
 function sinceIso() {
@@ -165,8 +174,6 @@ document.addEventListener("click", (e) => {
     if (!k) filter.kinds.clear();
     else if (filter.kinds.has(k)) filter.kinds.delete(k);
     else filter.kinds.add(k);
-  } else if (e.target.closest("#f-host [data-host]")) {
-    filter.host = e.target.closest("[data-host]").dataset.host;
   } else {
     return;
   }
@@ -175,6 +182,13 @@ document.addEventListener("click", (e) => {
   load();
 });
 
+document.getElementById("f-host").addEventListener("change", () => {
+  filter.host = document.getElementById("f-host").value || "";
+  syncUrl();
+  renderFilters();
+  load();
+});
+
 document.getElementById("tl-refresh").addEventListener("click", load);
 document.getElementById("tl-read").addEventListener("click", async () => {
   await api("/ereignisse/gelesen", { method: "POST", json: {} });