Bewaesserungsanlage/Webserver/Templates/dashboard/dashboard.html

109 lines
4.1 KiB
HTML

{% include "header.html" %}
<!DOCTYPE html>
<html lang="de">
<head>
<link rel="stylesheet" href="{{ url_for('static', filename='Styles/dashboard.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='Styles/scrollingTable.css') }}">
<title>{{ translater.getTranslation("Irrigation") }}{{ translater.getTranslation("system") }}</title>
<style>
@media screen and (min-width: 2051px){
#zones{
grid-template-rows: repeat( {{ (zoneManager.zones|length / 3) + 1 }} , minmax(150px, auto));
}
}
@media screen and (max-width: 2050px) and (min-width: 1351px){
#zones{
grid-template-rows: repeat( {{ (zoneManager.zones|length / 2) + 1 }} , minmax(150px, auto));
}
}
@media screen and (max-width: 1350px){
#zones{
grid-template-rows: repeat( {{ zoneManager.zones|length }} , minmax(150px, auto));
}
}
</style>
<script src="{{ url_for('static', filename='js/dashboard.js') }}"></script>
<script>
function refreshContent() {
executeAction('get_dashboard_pipeline_html', '0', '0', refreshPipeline);
{% for zone in zoneManager.zones %}
executeAction('get_zone_info', {{ zone.number }}, '0', refreshZone);
{% endfor %}
}
function buttonDeleteJobById(jobId) {
if(jobId == "all") {
if(confirm('{{ translater.getTranslation("delete all planed and cancel running jobs?")}}')){
document.getElementById("jobListBody").innerHTML = "";
} else {
return
}
} else {
var jobToDelete = document.getElementById("job_" + jobId);
document.getElementById("jobListBody").removeChild(jobToDelete);
}
deleteJobById('delete_job_by_id',jobId);
}
</script>
</head>
<body>
<main>
<h2>{{ translater.getTranslation("Dashboard") }}</h2>
<div id="pipeline" class="scrollingtable">
<div id="jobListTable">
<div>
<table>
<caption>{{ translater.getTranslation("planed irrigationjobs") }}</caption>
<thead id="jobListHead">
<tr>
<th><div label="Nr."></div></th>
<th><div label="{{ translater.getTranslation("Zone") }}"></div></th>
<th><div label="{{ translater.getTranslation("planed duration") }}"></div></th>
<th><div label="{{ translater.getTranslation("delete") }}"></div></th>
<th class="scrollbarhead"></th> <!--ALWAYS ADD THIS EXTRA CELL AT END OF HEADER ROW-->
</tr>
</thead>
<tbody id="jobListBody">
{% include "dashboard/pipeline.html" %}
</tbody>
</table>
</div>
<p id="text_no_jobs">{{ translater.getTranslation("currently there are no planned jobs.")}}</p>
<button id="button_delete_all_jobs" onclick="buttonDeleteJobById('all')">{{ translater.getTranslation("delete and cancel all jobs")}}</button>
</div>
</div>
<h3>{{ translater.getTranslation("irrigation zones") }}</h3>
<button onclick="switchZoneMode(false, 'all')">{{ translater.getTranslation("switch all to")}} {{ translater.getTranslation("manual mode") }}</button>
<button onclick="switchZoneMode(true, 'all')">{{ translater.getTranslation("switch all to")}} {{ translater.getTranslation("automatic mode") }}</button>
<div id="zones">
{% for zone in zoneManager.zones %}
<div id="zone_{{ zone.number }}" class="zone">
{% include "dashboard/zone.html" %}
</div>
{% endfor %}
</div>
</main>
<p><br><br></p>
</body>
</html>
{% include "footer.html" %}