allucanget/calminer
2
0
Fork 0
Code Pull Requests Actions Packages Releases Activity

feat: Add currency and unit support across models, routes, and templates; enhance UI for consumption, costs, and production

Browse Source
This commit is contained in:
zwitschi
2025-10-21 09:53:04 +02:00
parent 139ae04538
commit fcea39deb0
18 changed files with 354 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
static/js/consumption.js
View File

@@ -1,6 +1,6 @@
document.addEventListener("DOMContentLoaded", () => {
const dataElement = document.getElementById("consumption-data");
let data = { scenarios: [], consumption: {} };
let data = { scenarios: [], consumption: {}, unit_options: [] };
if (dataElement) {
try {
@@ -12,6 +12,9 @@ document.addEventListener("DOMContentLoaded", () => {
parsed.consumption && typeof parsed.consumption === "object"
? parsed.consumption
: {},
unit_options: Array.isArray(parsed.unit_options)
? parsed.unit_options
: [],
};
}
} catch (error) {
@@ -26,6 +29,10 @@ document.addEventListener("DOMContentLoaded", () => {
const emptyState = document.getElementById("consumption-empty");
const form = document.getElementById("consumption-form");
const feedbackEl = document.getElementById("consumption-feedback");
const unitSelect = document.getElementById("consumption-form-unit");
const unitSymbolInput = document.getElementById(
"consumption-form-unit-symbol"
);
const showFeedback = (message, type = "success") => {
if (!feedbackEl) {
@@ -50,6 +57,16 @@ document.addEventListener("DOMContentLoaded", () => {
maximumFractionDigits: 2,
});
const formatMeasurement = (amount, symbol, name) => {
if (symbol) {
return `${formatAmount(amount)} ${symbol}`;
}
if (name) {
return `${formatAmount(amount)} ${name}`;
}
return formatAmount(amount);
};
const renderConsumptionRows = (scenarioId) => {
if (!tableBody || !tableWrapper || !emptyState) {
return;
@@ -73,7 +90,11 @@ document.addEventListener("DOMContentLoaded", () => {
records.forEach((record) => {
const row = document.createElement("tr");
row.innerHTML = `
<td>${formatAmount(record.amount)}</td>
<td>${formatMeasurement(
record.amount,
record.unit_symbol,
record.unit_name
)}</td>
<td>${record.description || "—"}</td>
`;
tableBody.appendChild(row);
@@ -107,10 +128,14 @@ document.addEventListener("DOMContentLoaded", () => {
const formData = new FormData(form);
const scenarioId = formData.get("scenario_id");
const unitName = formData.get("unit_name");
const unitSymbol = formData.get("unit_symbol");
const payload = {
scenario_id: scenarioId ? Number(scenarioId) : null,
amount: Number(formData.get("amount")),
description: formData.get("description") || null,
unit_name: unitName ? String(unitName) : null,
unit_symbol: unitSymbol ? String(unitSymbol) : null,
};
try {
@@ -136,6 +161,7 @@ document.addEventListener("DOMContentLoaded", () => {
consumptionByScenario[mapKey].push(result);
form.reset();
syncUnitSelection();
showFeedback("Consumption record saved.", "success");
if (filterSelect && filterSelect.value === String(result.scenario_id)) {
@@ -150,6 +176,29 @@ document.addEventListener("DOMContentLoaded", () => {
form.addEventListener("submit", submitConsumption);
}
const syncUnitSelection = () => {
if (!unitSelect || !unitSymbolInput) {
return;
}
if (!unitSelect.value && unitSelect.options.length > 0) {
const firstOption = Array.from(unitSelect.options).find(
(option) => option.value
);
if (firstOption) {
firstOption.selected = true;
}
}
const selectedOption = unitSelect.options[unitSelect.selectedIndex];
unitSymbolInput.value = selectedOption
? selectedOption.getAttribute("data-symbol") || ""
: "";
};
if (unitSelect) {
unitSelect.addEventListener("change", syncUnitSelection);
syncUnitSelection();
}
if (filterSelect && filterSelect.value) {
renderConsumptionRows(filterSelect.value);
}

71
static/js/costs.js
View File

@@ -2,6 +2,7 @@ document.addEventListener("DOMContentLoaded", () => {
const dataElement = document.getElementById("costs-payload");
let capexByScenario = {};
let opexByScenario = {};
let currencyOptions = [];
if (dataElement) {
try {
@@ -13,6 +14,9 @@ document.addEventListener("DOMContentLoaded", () => {
if (parsed.opex && typeof parsed.opex === "object") {
opexByScenario = parsed.opex;
}
if (Array.isArray(parsed.currency_options)) {
currencyOptions = parsed.currency_options;
}
}
} catch (error) {
console.error("Unable to parse cost data", error);
@@ -34,6 +38,8 @@ document.addEventListener("DOMContentLoaded", () => {
const opexFeedback = document.getElementById("opex-feedback");
const capexFormScenario = document.getElementById("capex-form-scenario");
const opexFormScenario = document.getElementById("opex-form-scenario");
const capexCurrencySelect = document.getElementById("capex-form-currency");
const opexCurrencySelect = document.getElementById("opex-form-currency");
const showFeedback = (element, message, type = "success") => {
if (!element) {
@@ -58,9 +64,44 @@ document.addEventListener("DOMContentLoaded", () => {
maximumFractionDigits: 2,
});
const formatCurrencyAmount = (value, currencyCode) => {
if (!currencyCode) {
return formatAmount(value);
}
try {
return new Intl.NumberFormat(undefined, {
style: "currency",
currency: currencyCode,
minimumFractionDigits: 2,
maximumFractionDigits: 2,
}).format(Number(value));
} catch (error) {
return `${currencyCode} ${formatAmount(value)}`;
}
};
const sumAmount = (records) =>
records.reduce((total, record) => total + Number(record.amount || 0), 0);
const describeTotal = (records) => {
if (!records || records.length === 0) {
return "—";
}
const total = sumAmount(records);
const currencyCodes = Array.from(
new Set(
records
.map((record) => (record.currency_code || "").trim().toUpperCase())
.filter(Boolean)
)
);
if (currencyCodes.length === 1) {
return formatCurrencyAmount(total, currencyCodes[0]);
}
return `${formatAmount(total)} (mixed)`;
};
const renderCostTables = (scenarioId) => {
if (
!capexTableBody ||
@@ -86,7 +127,7 @@ document.addEventListener("DOMContentLoaded", () => {
capexRecords.forEach((record) => {
const row = document.createElement("tr");
row.innerHTML = `
<td>${formatAmount(record.amount)}</td>
<td>${formatCurrencyAmount(record.amount, record.currency_code)}</td>
<td>${record.description || "—"}</td>
`;
capexTableBody.appendChild(row);
@@ -100,15 +141,15 @@ document.addEventListener("DOMContentLoaded", () => {
opexRecords.forEach((record) => {
const row = document.createElement("tr");
row.innerHTML = `
<td>${formatAmount(record.amount)}</td>
<td>${formatCurrencyAmount(record.amount, record.currency_code)}</td>
<td>${record.description || "—"}</td>
`;
opexTableBody.appendChild(row);
});
}
capexTotal.textContent = formatAmount(sumAmount(capexRecords));
opexTotal.textContent = formatAmount(sumAmount(opexRecords));
capexTotal.textContent = describeTotal(capexRecords);
opexTotal.textContent = describeTotal(opexRecords);
};
const toggleCostView = (show) => {
@@ -153,6 +194,18 @@ document.addEventListener("DOMContentLoaded", () => {
}
};
const ensureCurrencySelection = (selectElement) => {
if (!selectElement || selectElement.value) {
return;
}
const firstOption = selectElement.querySelector(
"option[value]:not([value=''])"
);
if (firstOption && firstOption.value) {
selectElement.value = firstOption.value;
}
};
if (filterSelect) {
filterSelect.addEventListener("change", (event) => {
const value = event.target.value;
@@ -173,10 +226,12 @@ document.addEventListener("DOMContentLoaded", () => {
const formData = new FormData(event.target);
const scenarioId = formData.get("scenario_id");
const currencyCode = formData.get("currency_code");
const payload = {
scenario_id: scenarioId ? Number(scenarioId) : null,
amount: Number(formData.get("amount")),
description: formData.get("description") || null,
currency_code: currencyCode ? String(currencyCode).toUpperCase() : null,
};
if (!payload.scenario_id) {
@@ -184,6 +239,11 @@ document.addEventListener("DOMContentLoaded", () => {
return;
}
if (!payload.currency_code) {
showFeedback(feedbackEl, "Choose a currency before submitting.", "error");
return;
}
try {
const response = await fetch(targetUrl, {
method: "POST",
@@ -206,6 +266,7 @@ document.addEventListener("DOMContentLoaded", () => {
storageMap[mapKey].push(result);
event.target.reset();
ensureCurrencySelection(event.target.querySelector("select[name='currency_code']"));
showFeedback(feedbackEl, "Entry saved successfully.", "success");
if (filterSelect && filterSelect.value === mapKey) {
@@ -221,12 +282,14 @@ document.addEventListener("DOMContentLoaded", () => {
};
if (capexForm) {
ensureCurrencySelection(capexCurrencySelect);
capexForm.addEventListener("submit", (event) =>
submitCostEntry(event, "/api/costs/capex", capexByScenario, capexFeedback)
);
}
if (opexForm) {
ensureCurrencySelection(opexCurrencySelect);
opexForm.addEventListener("submit", (event) =>
submitCostEntry(event, "/api/costs/opex", opexByScenario, opexFeedback)
);

51
static/js/production.js
View File

@@ -1,6 +1,6 @@
document.addEventListener("DOMContentLoaded", () => {
const dataElement = document.getElementById("production-data");
let data = { scenarios: [], production: {} };
let data = { scenarios: [], production: {}, unit_options: [] };
if (dataElement) {
try {
@@ -12,6 +12,9 @@ document.addEventListener("DOMContentLoaded", () => {
parsed.production && typeof parsed.production === "object"
? parsed.production
: {},
unit_options: Array.isArray(parsed.unit_options)
? parsed.unit_options
: [],
};
}
} catch (error) {
@@ -26,6 +29,8 @@ document.addEventListener("DOMContentLoaded", () => {
const emptyState = document.getElementById("production-empty");
const form = document.getElementById("production-form");
const feedbackEl = document.getElementById("production-feedback");
const unitSelect = document.getElementById("production-form-unit");
const unitSymbolInput = document.getElementById("production-form-unit-symbol");
const showFeedback = (message, type = "success") => {
if (!feedbackEl) {
@@ -50,6 +55,16 @@ document.addEventListener("DOMContentLoaded", () => {
maximumFractionDigits: 2,
});
const formatMeasurement = (amount, symbol, name) => {
if (symbol) {
return `${formatAmount(amount)} ${symbol}`;
}
if (name) {
return `${formatAmount(amount)} ${name}`;
}
return formatAmount(amount);
};
const renderProductionRows = (scenarioId) => {
if (!tableBody || !tableWrapper || !emptyState) {
return;
@@ -74,7 +89,11 @@ document.addEventListener("DOMContentLoaded", () => {
records.forEach((record) => {
const row = document.createElement("tr");
row.innerHTML = `
<td>${formatAmount(record.amount)}</td>
<td>${formatMeasurement(
record.amount,
record.unit_symbol,
record.unit_name
)}</td>
<td>${record.description || "—"}</td>
`;
tableBody.appendChild(row);
@@ -108,10 +127,14 @@ document.addEventListener("DOMContentLoaded", () => {
const formData = new FormData(form);
const scenarioId = formData.get("scenario_id");
const unitName = formData.get("unit_name");
const unitSymbol = formData.get("unit_symbol");
const payload = {
scenario_id: scenarioId ? Number(scenarioId) : null,
amount: Number(formData.get("amount")),
description: formData.get("description") || null,
unit_name: unitName ? String(unitName) : null,
unit_symbol: unitSymbol ? String(unitSymbol) : null,
};
try {
@@ -137,6 +160,7 @@ document.addEventListener("DOMContentLoaded", () => {
productionByScenario[mapKey].push(result);
form.reset();
syncUnitSelection();
showFeedback("Production output saved.", "success");
if (filterSelect && filterSelect.value === String(result.scenario_id)) {
@@ -151,6 +175,29 @@ document.addEventListener("DOMContentLoaded", () => {
form.addEventListener("submit", submitProduction);
}
const syncUnitSelection = () => {
if (!unitSelect || !unitSymbolInput) {
return;
}
if (!unitSelect.value && unitSelect.options.length > 0) {
const firstOption = Array.from(unitSelect.options).find(
(option) => option.value
);
if (firstOption) {
firstOption.selected = true;
}
}
const selectedOption = unitSelect.options[unitSelect.selectedIndex];
unitSymbolInput.value = selectedOption
? selectedOption.getAttribute("data-symbol") || ""
: "";
};
if (unitSelect) {
unitSelect.addEventListener("change", syncUnitSelection);
syncUnitSelection();
}
if (filterSelect && filterSelect.value) {
renderProductionRows(filterSelect.value);
}