home/power-consumption
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust month view to year view.

Browse Source
This commit is contained in:
Christian Steinle
2025-03-29 14:22:24 +01:00
parent 0319687d97
commit 5e2d693345
5 changed files with 47 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
functions/functions.php
View File

@@ -22,6 +22,17 @@ function build_date_dropdown(mysqli $db, string $table): array
return $dates;
}
function get_month(mysqli $db, string $table): array
{
$date_query = 'SELECT MIN(date) AS first, MAX(date) AS last FROM ' . $table . ';';
$date = $db->query($date_query)->fetch_assoc();
$first_date = new DateTime($date['first']);
$last_date = new DateTime($date['last']);
return ['first' => $first_date, 'last' => $last_date];
}
function get_years(mysqli $db, string $table): array
{
$years_query = 'SELECT MIN(YEAR(date)) AS first, MAX(YEAR(date)) AS last FROM ' . $table . ';';

4
public/css/layout.css
View File

@@ -4,6 +4,10 @@ body {
flex-direction: column;
}
input[type="number"] {
font-size: 1.3rem;
}
div > span {
text-align: right;
}

42
public/index.php
View File

@@ -19,8 +19,9 @@ if (isset($_POST['action']) && $_POST['action'] == 'set_values') {
$local_db->query($query);
}
$dates = build_date_dropdown($local_db, $table_aggregation);
$chosen_date = (isset($_POST['date'])) ? $_POST['date'] : $dates[0];
$actual = new DateTime();
$dates = get_month($local_db, $table_aggregation);
$chosen_date = (isset($_POST['date'])) ? $_POST['date'] : $actual->format('Y-m');
$data = get_aggregation($local_db, $table_aggregation, $chosen_date);
$month_values = get_month_aggregation($local_db, $table_aggregation, $chosen_date);
$year_values = get_year_aggregation($local_db, $table_aggregation, $chosen_date);
@@ -29,6 +30,7 @@ $month_production = get_month_production($local_db, $table_production, $chosen_d
$year_production = get_year_production($local_db, $table_production, $chosen_date);
$last_value = get_last_value($local_db, $table_aggregation, $chosen_date);
$chosen_date_time = new DateTime($chosen_date);
?>
<!DOCTYPE html>
<html lang="de">
@@ -37,19 +39,23 @@ $last_value = get_last_value($local_db, $table_aggregation, $chosen_date);
<link rel="stylesheet" href="/css/layout.css"/>
</head>
<body>
<form style="display: grid; grid-template-columns: 5% 5% 20% 5% 5%; gap: 10px;" action="/index.php" method="post">
<label for="date">Datum</label>
<select name="date" id="date" onchange="submit();">
<?php
foreach ($dates as $date) {
$selected = ($date == $chosen_date) ? ' selected="selected"' : '';
echo '<option value="' . $date . '"' . $selected . '>' . $date . '</option>';
}
?>
</select>
<span></span>
<a class="button" href="production.php">Werte setzen</a>
<a class="button" href="year.php">Jahresübersicht</a>
<form id="date_form" style="align-self: center; width: 500px; display: grid; grid-template-columns: 20% 20% 20% 20% 20%; gap: 10px;" action="/index.php" method="post">
<?php
if ($dates['first'] < $chosen_date_time) {
echo "<button type='button' onclick='submit_form(\"" . $chosen_date_time->modify('-1 month')->format('Y-m') . "\")'><</button>";
} else {
echo '<span></span>';
}
echo '<span style="text-align: center">' . $chosen_date_time->modify('+1 month')->format('Y-m') . '</span>';
if ($dates['last'] > $chosen_date_time->modify('+1 month')) {
echo "<button type='button' onclick='submit_form(\"" . $chosen_date_time->format('Y-m') . "\")'>></button>";
} else {
echo '<span></span>';
}
?>
<a class="button" href="year.php">Jahr</a>
<a class="button" href="production.php">Werte</a>
<input type="hidden" name="date" id="date" value=""/>
</form>
<div style="display: grid; grid-template-columns: 5% 15% 15% 15% 15% 15% 15%; gap: 2px 10px; margin-top: 5px; border-top: 2px solid gray; padding-top: 5px;">
@@ -120,6 +126,12 @@ $last_value = get_last_value($local_db, $table_aggregation, $chosen_date);
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.js"></script>
<script>
function submit_form(value) {
document.getElementById('date').value = value;
document.getElementById('date_form').submit();
}
const chart = document.getElementById('chart');
new Chart(chart, {

2
public/production.php
View File

@@ -59,7 +59,7 @@ $month_production = get_month_production($local_db, $table_production, $chosen_d
</form>
<form action="production.php" method="post"
style="display: grid; grid-template-columns: 5% 5% 5% 5% 5%; gap: 2px 10px; margin-top: 10px;">
style="display: grid; grid-template-columns: 5% 5% 5% 5% 5%; gap: 2px 10px; margin-top: 10px; font-size: 1.3rem;">
<?php
foreach ($production_values as $daily_production) {
?>

7
public/year.php
View File

@@ -21,13 +21,12 @@ $values = get_year_values($local_db, $table_aggregation, $chosen_year);
<body>
<form id="year_form"
style="align-self: center; width: 500px; display: grid; grid-template-columns: 25% 25% 25% 25%; gap: 10px;"
style="align-self: center; width: 500px; display: grid; grid-template-columns: 20% 20% 20% 20% 20%; gap: 10px;"
action="/year.php"
method="post">
<a class="button" href="index.php">Monatsübersicht</a>
<?php
if ($years['first'] < $chosen_year) {
echo "<button type='button' onclick='submit_form(2024)'><</button>";
echo "<button type='button' onclick='submit_form(" . $chosen_year - 1 . ")'><</button>";
} else {
echo '<span></span>';
}
@@ -38,6 +37,8 @@ $values = get_year_values($local_db, $table_aggregation, $chosen_year);
echo '<span></span>';
}
?>
<a class="button" href="index.php">Monat</a>
<a class="button" href="production.php">Werte</a>
<input type="hidden" name="year" id="year" value=""/>
</form>
<div id="chart-container">