Roman_Schenk/Bewaesserungsanlage
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

created Dashboard

Browse Source
This commit is contained in:
schrom01
2022-08-15 01:10:34 +02:00
parent a74ae43fb6
commit 62a17bc63d
13 changed files with 413 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Webserver/Templates/dashboard.html
+78 -34
View File
@@ -2,8 +2,28 @@
<html lang="de">
<head>
<link rel="stylesheet" href="../static/Styles/main.css">
<link rel="stylesheet" href="../static/Styles/dashboard.css">
<meta charset="UTF-8">
<title>Bewässerungssystem</title>
<title>{{ translater.getTranslation("Irrigation") }}{{ translater.getTranslation("system") }}</title>
<style>
@media screen and (min-width: 2051px){
#content{
grid-template-rows: repeat( {{ (zones|length / 3) + 1 }} , minmax(150px, auto));
}
}
@media screen and (max-width: 2050px) and (min-width: 1351px){
#content{
grid-template-rows: repeat( {{ (zones|length / 2) + 1 }} , minmax(150px, auto));
}
}
@media screen and (max-width: 1350px){
#content{
grid-template-rows: repeat( {{ zones|length }} , minmax(150px, auto));
}
}
</style>
</head>
<body>
{% include "header.html" %}
@@ -11,43 +31,67 @@
<main>
<h2>Dashboard</h2>
<h2>{{ translater.getTranslation("Dashboard") }}</h2>
<div>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
</p>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
</p>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
</p>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
</p>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit.
Sed excepturi quod dicta temporibus eveniet corporis incidunt molestiae, laborum deleniti.
Molestiae architecto quod veritatis laudantium aliquid aperiam earum quia voluptates saepe!
</p>
<div id="content">
{% for zone in zones %}
<div id="zone_{{ zone.number }}" class="zone">
<a href="/zones/{{ zone.number}}">
<h3>{{ zone.name }}</h3>
</a>
<table>
<tbody>
<tr>
<td class="icon">
<span class="outer_dot">
<span class="inner_icon {{ 'dot_green' if zone.state else 'dot_red' }}"></span>
</span>
</td>
<td class="property">{{ translater.getTranslation("state") }}:</td>
<td class="value">
<p class="state">{{ translater.getTranslation("switched on") if zone.state else translater.getTranslation("switched off") }}</p>
<p class="on_off" href="">{{ translater.getTranslation("turn off") if zone.state else translater.getTranslation("turn on") }}</p>
</td>
</tr>
<tr>
<td class="icon">
<span class="outer_dot">
<p class="inner_icon">{{'A' if zone.autoMode else 'M'}}</p>
</span>
</td>
<td class="property">{{ translater.getTranslation("operating mode") }}:</td>
<td class="value">{{translater.getTranslation("automatic mode") if zone.autoMode else translater.getTranslation("manual mode")}}</td>
</tr>
<tr>
<td class="icon">
<span class="outer_dot">
<span class="inner_icon {{ 'dot_green' if(zone.actualValue >= zone.setValue) else 'dot_red' }}"></span>
</span>
</td>
<td class="property">{{ translater.getTranslation("actual humidity") }}:</td>
<td class="value">{{ zone.actualValue}}</td>
</tr>
<tr>
<td class="icon">
</td>
<td class="property">{{ translater.getTranslation("desired humidity") }}:</td>
<td class="value">{{ zone.setValue }}</td>
</tr>
</tbody>
</table>
<p class="zone_number">{{ zone.number }}</p>
</div>
{% endfor %}
</div>
</main>
<p><br><br></p>
</body>
</html>