VladislavOstapov/ospaz-site
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

добавил моточасы и запущенный насос в прочие показатели, изменил немного верстку

Browse Source
This commit is contained in:
VladislavOstapov 2024-01-15 17:00:57 +03:00
parent 097257c1f5
commit 96acd59ff1
2 changed files with 52 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
static/css/style.css
View File

@ -45,7 +45,7 @@ body {
}
#content {
margin: 0.2em;
margin: 0.5em;
}
/* ========== MAIN STYLES ========== */

71
templates/index.html
View File

@ -11,15 +11,25 @@
{% block styles %}
<style>
.content-wrapper {
/* родительский блок для всех групп параметров */
.params-wrapper, .multiply-params-wrapper {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.content-block {
/* блок с заголовком и группой параметров */
.params-wrapper > div {
margin: 0.5em;
}
.multiply-params-wrapper > .params-group {
margin-right: 1em;
}
/* блок непосредственно с параметрами */
.params-group {
/*border: red 1px dashed;*/
}
#canvas-wrapper {
max-width: 1000px;
@ -28,38 +38,59 @@
{% endblock %}
{% block content %}
<div>
<div class="content-wrapper">
<div class="content-block">
<h2>Состояние насосной станции</h2>
<div class="params-wrapper">
<div>
<h2>Состояние насосной станции</h2>
<div class="params-group">
<p>Последнее обновление: <span id="pump-last-update"></span></p>
<p>Регистр аварий: <span id="pump-alarms"></span></p>
<p>Состояние КА: <span id="pump-stage"></span></p>
<p>Текущий расход: <span id="pump-flow-meter"></span>м³</p>
</div>
<div class="content-block">
<h2>Состояние резервуара</h2>
</div>
<div>
<h2>Состояние резервуара</h2>
<div class="params-group">
<p>Последнее обновление: <span id="tank-last-update"></span></p>
<p>Текущий уровень воды: <span id="tank-level-now"></span>%</p>
<p>Уровень воды <span id="tank-level-dir"></span></p>
<p>Статус: <span id="tank-status"></span></p>
</div>
</div>
<div class="content-block chart">
<div id="canvas-wrapper"><canvas id="water_level"></canvas></div>
</div>
<div class="content-block">
</div>
<div class="content-block chart">
<div id="canvas-wrapper"><canvas id="water_level"></canvas></div>
</div>
<div class="params-wrapper">
<div>
<h2>Прочие показатели</h2>
<p>Частота ПЧ: <span id="pump-vfd-freq"></span>Гц</p>
<p>Ток ПЧ: <span id="pump-vfd-curr"></span>А</p>
<p>Ошибка ПЧ: <span id="pump-vfd-error"></span></p>
<p>Текущее значение с радара: <span id="tank-raw-now"></span></p>
<div class="multiply-params-wrapper">
<div class="params-group">
<p>Частота ПЧ: <span id="pump-vfd-freq"></span>Гц</p>
<p>Ток ПЧ: <span id="pump-vfd-curr"></span>А</p>
<p>Ошибка ПЧ: <span id="pump-vfd-error"></span></p>
<p>Текущее значение с радара: <span id="tank-raw-now"></span></p>
</div>
<div class="params-group">
<p>Запущенный насос: <span id="pump-running" class="value-bad">NI</span></p>
<p>Моточасы насоса 1: <span id="pump-moto-watch-1" class="value-bad">NI</span></p>
<p>Моточасы насоса 2: <span id="pump-moto-watch-2" class="value-bad">NI</span></p>
</div>
</div>
</div>
<div class="content-block">
</div>
<div class="params-wrapper">
<div>
<h2>Настройки</h2>
<div>
<label for="settings-chart-time">Период на графике (дней): </label>
<input id="settings-chart-time" type="number" min="1" max="31">
<div class="params-group">
<p>
<label for="settings-chart-time">Период на графике (дней): </label>
<input id="settings-chart-time" type="number" min="1" max="31">
</p>
</div>
</div>
</div>