From 75bc4d5c4a1668bc36de33539fa0b07530836201 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 26 Dec 2024 19:37:39 +0300 Subject: [PATCH] feat: ability to reset fault on the dashboard --- src_data/locales/en.json | 12 +++++ src_data/locales/ru.json | 12 +++++ src_data/pages/dashboard.html | 98 +++++++++++++++++++++++++++++++++++ src_data/styles/app.css | 87 +++++++++++++++++++++++++++++++ 4 files changed, 209 insertions(+) diff --git a/src_data/locales/en.json b/src_data/locales/en.json index fd0caa6..58239c2 100644 --- a/src_data/locales/en.json +++ b/src_data/locales/en.json @@ -87,6 +87,18 @@ "turbo": "Turbo mode" }, + "notify": { + "fault": { + "title": "Boiler Fault state is active!", + "note": "It is recommended to inspect the boiler and study the documentation to interpret the fault code:" + }, + "diag": { + "title": "Boiler Diagnostic state is active!", + "note": "Perhaps your boiler needs inspection? It is recommended study the documentation to interpret the diag code:" + }, + "reset": "Try reset" + }, + "states": { "mNetworkConnected": "Network connection", "mMqttConnected": "MQTT connection", diff --git a/src_data/locales/ru.json b/src_data/locales/ru.json index 947bd71..e27b538 100644 --- a/src_data/locales/ru.json +++ b/src_data/locales/ru.json @@ -87,6 +87,18 @@ "turbo": "Турбо" }, + "notify": { + "fault": { + "title": "Состояние неисправности котла активно!", + "note": "Рекомендуется осмотреть котел и изучить документацию котла для расшифровки кода неисправности:" + }, + "diag": { + "title": "Состояние диагностики котла активно!", + "note": "Возможно, вашему котлу требуется проверка? Рекомендуется изучить документацию котла для расшифровки кода диагностики:" + }, + "reset": "Сбросить" + }, + "states": { "mNetworkConnected": "Подключение к сети", "mMqttConnected": "Подключение к MQTT", diff --git a/src_data/pages/dashboard.html b/src_data/pages/dashboard.html index 4e1587a..10cea44 100644 --- a/src_data/pages/dashboard.html +++ b/src_data/pages/dashboard.html @@ -71,6 +71,36 @@ + + + +
@@ -358,6 +388,60 @@ newSettings.dhw.enabled = event.currentTarget.checked; }); + document.querySelector('.notify-fault .reset').addEventListener('click', async (event) => { + const resetBtn = document.querySelector(".notify-fault .reset"); + if (!resetBtn.disabled) { + resetBtn.disabled = true; + } + + let response = await fetch("/api/vars", { + method: "POST", + cache: "no-cache", + credentials: "include", + headers: { + "Content-Type": "application/json" + }, + body: JSON.stringify({ + "actions": { + "resetFault": true + } + }) + }); + + setTimeout(() => { + if (resetBtn.disabled) { + resetBtn.disabled = false; + } + }, 10000); + }); + + document.querySelector('.notify-diag .reset').addEventListener('click', async (event) => { + const resetBtn = document.querySelector(".notify-diag .reset"); + if (!resetBtn.disabled) { + resetBtn.disabled = true; + } + + let response = await fetch("/api/vars", { + method: "POST", + cache: "no-cache", + credentials: "include", + headers: { + "Content-Type": "application/json" + }, + body: JSON.stringify({ + "actions": { + "resetDiagnostic": true + } + }) + }); + + setTimeout(() => { + if (resetBtn.disabled) { + resetBtn.disabled = false; + } + }, 10000); + }); + setTimeout(async function onLoadPage() { let unitSystem = null; @@ -494,6 +578,13 @@ : "-" ); + if (result.slave.fault.active) { + show(".notify-fault"); + + } else { + hide('.notify-fault'); + } + setStatus( '.sDiagActive', result.slave.diag.active ? "success" : "error", @@ -506,6 +597,13 @@ : "-" ); + if (result.slave.diag.active) { + show(".notify-diag"); + + } else { + hide('.notify-diag'); + } + // MASTER setState('.mHeatEnabled', result.master.heating.enabled); diff --git a/src_data/styles/app.css b/src_data/styles/app.css index 4959394..7a5e002 100644 --- a/src_data/styles/app.css +++ b/src_data/styles/app.css @@ -115,6 +115,7 @@ tr.network:hover { font-family: var(--pico-font-family-monospace); } + .thermostat { display: grid; grid-template-columns: 0.5fr 2fr 0.5fr; @@ -193,6 +194,92 @@ tr.network:hover { margin: 1.25rem 0; } + +@media (max-width: 575px) { + .notify { + display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1fr 0.5fr; + gap: 0.5rem 0.5rem; + grid-template-areas: + "notify-content" + "notify-actions"; + } + + .notify-icon { + display: none; + } + + .notify-content { + justify-self: center; + align-self: center; + grid-area: notify-content; + } + + .notify-actions { + justify-self: center; + align-self: center; + grid-area: notify-actions; + } +} + +@media (min-width: 576px) { + .notify { + display: grid; + grid-template-columns: 5rem 1fr 10rem; + grid-template-rows: 1fr; + gap: 0rem 0.5rem; + grid-auto-flow: row; + grid-template-areas: + "notify-icon notify-content notify-actions"; + } + + .notify-icon { + justify-self: center; + align-self: center; + grid-area: notify-icon; + } + + .notify-content { + justify-self: center; + align-self: center; + grid-area: notify-content; + } + + .notify-actions { + justify-self: center; + align-self: center; + grid-area: notify-actions; + } +} + +.notify { + margin: 1rem; + padding: 0.5rem; + border: .25rem solid var(--pico-blockquote-border-color); +} + +.notify-error { + border-color: var(--pico-form-element-invalid-border-color); +} + +.notify-error .notify-icon { + color: var(--pico-form-element-invalid-border-color); +} + +.notify-alarm { + border-color: #c89048; +} + +.notify-alarm .notify-icon { + color: #c89048; +} + +.notify-icon i { + font-size: 2.5rem; +} + + [class*=" icons-"], [class=icons], [class^=icons-] {