2022-07-30 00:19:30 +02:00
<!DOCTYPE html>
< html lang = "de" >
< head >
2022-08-16 03:22:01 +02:00
< link rel = "stylesheet" href = "{{ url_for('static', filename='Styles/dashboard.css') }}" >
2022-08-15 01:10:34 +02:00
< title > {{ translater.getTranslation("Irrigation") }}{{ translater.getTranslation("system") }}< / title >
< style >
@media screen and (min-width: 2051px){
2022-08-17 02:15:26 +02:00
#zones{
2022-08-16 03:22:01 +02:00
grid-template-rows: repeat( {{ (zoneManager.zones|length / 3) + 1 }} , minmax(150px, auto));
2022-08-15 01:10:34 +02:00
}
}
@media screen and (max-width: 2050px) and (min-width: 1351px){
2022-08-17 02:15:26 +02:00
#zones{
2022-08-16 03:22:01 +02:00
grid-template-rows: repeat( {{ (zoneManager.zones|length / 2) + 1 }} , minmax(150px, auto));
2022-08-15 01:10:34 +02:00
}
}
@media screen and (max-width: 1350px){
2022-08-17 02:15:26 +02:00
#zones{
2022-08-16 03:22:01 +02:00
grid-template-rows: repeat( {{ zoneManager.zones|length }} , minmax(150px, auto));
2022-08-15 01:10:34 +02:00
}
}
< / style >
2022-08-16 03:22:01 +02:00
2022-07-30 00:19:30 +02:00
< / head >
< body >
{% include "header.html" %}
< main >
2022-08-17 02:15:26 +02:00
2022-08-15 01:10:34 +02:00
< h2 > {{ translater.getTranslation("Dashboard") }}< / h2 >
2022-08-17 02:15:26 +02:00
< h3 > {{ translater.getTranslation("planed irrigationjobs") }}< / h3 >
< div id = "pipeline" >
< table >
< thead >
< tr >
< td > ID< / td >
< td > {{ translater.getTranslation("Zone") }}< / td >
< td > {{ translater.getTranslation("planed duration") }}< / td >
< / tr >
< / thead >
< tbody >
{% for job in zoneManager.pipeLine %}
< tr >
< td > {{ job.id }}< / td >
< td > {{ job.zone.number|string + ": " + job.zone.name }}< / td >
< td > {{ ((job.duration/60)|int)|string + " " + translater.getTranslation("minutes")}}< / td >
2022-08-17 02:23:12 +02:00
< td > < button onclick = "executeAction('delete_job_by_id','{{ job.id }}', 0)" > {{ translater.getTranslation("delete") }}< / button > < / td >
2022-08-17 02:15:26 +02:00
< / tr >
{% endfor %}
< / tbody >
< / table >
< / div >
< h3 > {{ translater.getTranslation("irrigation zones") }}< / h3 >
< div id = "zones" >
2022-08-16 03:22:01 +02:00
{% for zone in zoneManager.zones %}
2022-08-15 01:10:34 +02:00
< div id = "zone_{{ zone.number }}" class = "zone" >
< a href = "/zones/{{ zone.number}}" >
2022-08-17 02:15:26 +02:00
< h4 > {{ zone.name }}< / h3 >
2022-08-15 01:10:34 +02:00
< / 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 >
2022-08-17 02:15:26 +02:00
< td class = "value" >
{{ translater.getTranslation("switched on") if zone.state else translater.getTranslation("switched off") }}
< / td >
2022-08-16 03:22:01 +02:00
< td >
< select id = "duration_zone_{{ zone.number }}" >
{% for option in zoneManager.systemSettings.webDurationOptions %}
< option value = "{{ option }}" > {{ option }} {{ translater.getTranslation("minutes") }}< / option >
{% endfor %}
< / select >
< button onclick = "executeActionByValueID({{'" switch_zone_off " ' if zone . state else ' " switch_zone_on " ' } } , ' { { zone . number } } ' , ' duration_zone_ { { zone . number } } ' , 60 ) " > {{ translater.getTranslation("turn off") if zone.state else translater.getTranslation("turn on") }}< / button >
2022-08-15 01:10:34 +02:00
< / td >
< / tr >
2022-08-17 02:15:26 +02:00
{% if (zone.setState == 1 or zone.setState == 2) %}
< tr >
< td > < / td >
< td > < / td >
< td >
{{translater.getTranslation("until") + zone.endTimeSetState|string}}
< / td >
< td >
< button onclick = "executeAction({{'" switch_zone_off " ' if zone . state else ' " switch_zone_on " ' } } , ' { { zone . number } } ' , -1 ) " > {{ translater.getTranslation("cancel") }}< / button >
< / td >
< / tr >
{% endif %}
{% if zone.planedDuration > 0 %}
< tr >
< td > < / td >
< td > < / td >
< td >
{{translater.getTranslation("irragation is planed for") + " " + ((zone.planedDuration/60)|int)|string + " " + translater.getTranslation("minutes") + "." }}
< / td >
< td >
< button onclick = "executeAction('delete_jobs_for_zone','{{ zone.number }}', 0)" > {{ translater.getTranslation("delete") }}< / button >
< / td >
< / tr >
{% endif %}
2022-08-15 01:10:34 +02:00
< tr >
2022-08-23 17:18:51 +02:00
< td >
< label class = "toggle" >
< input type = "checkbox" { { " checked " if zone . autoMode } } onchange = "switchZoneMode(this.checked, {{ zone.number }})" >
< span class = "slider" > < / span >
< span class = "labels" data-on = "A" data-off = "H" > < / span >
< / label >
2022-08-15 01:10:34 +02:00
< / 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 >
2022-08-16 03:22:01 +02:00
< td >
< button onclick = "executeAction('switch_zone_mode','{{ zone.number }}', '{{ 'manual' if zone.autoMode else 'automatic' }}')" > {{translater.getTranslation("switch to manual mode") if zone.autoMode else translater.getTranslation("switch to automatic mode")}}< / button >
< / td >
2022-08-15 01:10:34 +02:00
< / tr >
< tr >
< td class = "icon" >
< span class = "outer_dot" >
2022-08-15 23:58:07 +02:00
< span class = "inner_icon {{ 'dot_green' if(zone.actualHumidity >= zone.desiredHumidity) else 'dot_red' }}" > < / span >
2022-08-15 01:10:34 +02:00
< / span >
< / td >
< td class = "property" > {{ translater.getTranslation("actual humidity") }}:< / td >
2022-08-15 23:58:07 +02:00
< td class = "value" > {{ zone.actualHumidity}}< / td >
2022-08-15 01:10:34 +02:00
< / tr >
< tr >
< td class = "icon" >
< / td >
< td class = "property" > {{ translater.getTranslation("desired humidity") }}:< / td >
2022-08-15 23:58:07 +02:00
< td class = "value" > {{ zone.desiredHumidity }}< / td >
2022-08-15 01:10:34 +02:00
< / tr >
< / tbody >
< / table >
< p class = "zone_number" > {{ zone.number }}< / p >
< / div >
{% endfor %}
2022-07-30 00:19:30 +02:00
< / div >
< / main >
2022-08-15 01:10:34 +02:00
< p > < br > < br > < / p >
2022-07-30 00:19:30 +02:00
< / body >
< / html >