Refactor templates to externalize JavaScript: Moved inline scripts to separate JS files and added JSON data attributes for better maintainability and performance. Updated consumption, costs, equipment, maintenance, production, reporting, and simulations templates accordingly.

2025-10-21 07:20:02 +02:00
parent 5a84445e90
commit 18f4ae7278
21 changed files with 1963 additions and 1986 deletions
--- a/static/js/parameters.js
+++ b/static/js/parameters.js
@@ -0,0 +1,124 @@
+document.addEventListener("DOMContentLoaded", () => {
+  const dataElement = document.getElementById("parameters-data");
+  let parametersByScenario = {};
+
+  if (dataElement) {
+    try {
+      const parsed = JSON.parse(dataElement.textContent || "{}");
+      if (parsed && typeof parsed === "object") {
+        parametersByScenario = parsed;
+      }
+    } catch (error) {
+      console.error("Unable to parse parameter data", error);
+    }
+  }
+
+  const form = document.getElementById("parameter-form");
+  const scenarioSelect = /** @type {HTMLSelectElement | null} */ (
+    document.getElementById("scenario_id")
+  );
+  const nameInput = /** @type {HTMLInputElement | null} */ (
+    document.getElementById("name")
+  );
+  const valueInput = /** @type {HTMLInputElement | null} */ (
+    document.getElementById("value")
+  );
+  const feedback = document.getElementById("parameter-feedback");
+  const tableBody = document.getElementById("parameter-table-body");
+
+  const setFeedback = (message, variant) => {
+    if (!feedback) {
+      return;
+    }
+    feedback.textContent = message;
+    feedback.classList.remove("success", "error");
+    if (variant) {
+      feedback.classList.add(variant);
+    }
+  };
+
+  const renderTable = (scenarioId) => {
+    if (!tableBody) {
+      return;
+    }
+    tableBody.innerHTML = "";
+    const rows = parametersByScenario[String(scenarioId)] || [];
+    if (!rows.length) {
+      const emptyRow = document.createElement("tr");
+      emptyRow.id = "parameter-empty-state";
+      emptyRow.innerHTML =
+        '<td colspan="4">No parameters recorded for this scenario yet.</td>';
+      tableBody.appendChild(emptyRow);
+      return;
+    }
+    rows.forEach((row) => {
+      const tr = document.createElement("tr");
+      tr.innerHTML = `
+        <td>${row.name}</td>
+        <td>${row.value}</td>
+        <td>${row.distribution_type ?? "—"}</td>
+        <td>${
+          row.distribution_parameters
+            ? JSON.stringify(row.distribution_parameters)
+            : "—"
+        }</td>
+      `;
+      tableBody.appendChild(tr);
+    });
+  };
+
+  if (scenarioSelect) {
+    renderTable(scenarioSelect.value);
+    scenarioSelect.addEventListener("change", () =>
+      renderTable(scenarioSelect.value)
+    );
+  }
+
+  if (!form || !scenarioSelect || !nameInput || !valueInput) {
+    return;
+  }
+
+  form.addEventListener("submit", async (event) => {
+    event.preventDefault();
+
+    const scenarioId = scenarioSelect.value;
+    const payload = {
+      scenario_id: Number(scenarioId),
+      name: nameInput.value.trim(),
+      value: Number(valueInput.value),
+    };
+
+    if (!payload.name) {
+      setFeedback("Parameter name is required.", "error");
+      return;
+    }
+
+    if (!Number.isFinite(payload.value)) {
+      setFeedback("Enter a numeric value.", "error");
+      return;
+    }
+
+    const response = await fetch("/api/parameters/", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(payload),
+    });
+
+    if (!response.ok) {
+      const errorText = await response.text();
+      setFeedback(`Error saving parameter: ${errorText}`, "error");
+      return;
+    }
+
+    const data = await response.json();
+    const scenarioKey = String(scenarioId);
+    parametersByScenario[scenarioKey] = parametersByScenario[scenarioKey] || [];
+    parametersByScenario[scenarioKey].push(data);
+
+    form.reset();
+    scenarioSelect.value = scenarioKey;
+    renderTable(scenarioKey);
+    nameInput.focus();
+    setFeedback("Parameter saved.", "success");
+  });
+});