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.

templates/ParameterInput.html

@@ -44,125 +44,7 @@ endblock %} {% block content %}
 </section>
 {% endblock %} {% block scripts %} {{ super() }}
 <script id="parameters-data" type="application/json">
-  {{ parameters_by_scenario | tojson | safe }}
-</script>
-<script>
-  document.addEventListener("DOMContentLoaded", () => {
-    const dataElement = document.getElementById("parameters-data");
-    const parsedData = dataElement
-      ? JSON.parse(dataElement.textContent || "{}")
-      : {};
-    const parametersByScenario =
-      parsedData && typeof parsedData === "object" ? parsedData : {};
-    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");
-    });
-  });
+  {{ parameters_by_scenario | tojson }}
 </script>
+<script src="/static/js/parameters.js"></script>
 {% endblock %}