20251216: Einnahmen/Ausgaben Diagramm

This commit is contained in:
p3t3rp1Lz 2025-12-16 17:49:55 +01:00
parent 6e0322c636
commit f451433b74

View File

@ -147,7 +147,44 @@ $kontenJson = json_encode($konten);
$gesamtJson = json_encode($gesamt); $gesamtJson = json_encode($gesamt);
$farbenJson = json_encode($farben); $farbenJson = json_encode($farben);
$stmt = $pdo->query("SELECT SUM(CASE WHEN kb.betrag > 0 THEN kb.betrag
WHEN kb.betrag < 0 THEN 0
END) AS einnahmen,
SUM(CASE WHEN kb.betrag < 0 THEN kb.betrag
WHEN kb.betrag > 0 THEN 0
END) AS ausgaben,
SUM(kb.betrag) AS gesamt,
m.name_kurz || ' ' || EXTRACT(YEAR FROM CAST(kb.datum_ausgegeben AS DATE)) AS jahr
FROM kontobewegung kb
JOIN monat m ON m.wert = CASE WHEN EXTRACT(MONTH FROM CAST(kb.datum_ausgegeben AS DATE)) < 10 THEN '0' || EXTRACT(MONTH FROM CAST(kb.datum_ausgegeben AS DATE))
WHEN EXTRACT(MONTH FROM CAST(kb.datum_ausgegeben AS DATE)) >= 10 THEN '' || EXTRACT(MONTH FROM CAST(kb.datum_ausgegeben AS DATE))
END
WHERE konto_id IN (1, 3, 4)
AND (gegenkonto_id IS NULL OR gegenkonto_id NOT IN (1, 3, 4))
GROUP BY EXTRACT(YEAR FROM CAST(kb.datum_ausgegeben AS DATE)),
m.name_kurz,
m.wert
ORDER BY EXTRACT(YEAR FROM CAST(kb.datum_ausgegeben AS DATE)),
m.wert;");
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
$labels = [];
$kosten = ['Einnahmen', 'Ausgaben'];
foreach ($rows as $row) {
$labels[] = $row['jahr'] . ' / ' . $row['gesamt'];
$kosten['Einnahmen'][] = $row['einnahmen'];
$kosten['Ausgaben'][] = $row['ausgaben'];
//$kosten['negative']
}
echo var_dump($kosten['Ausgaben']);
$labelsJson = json_encode($labels);
$kostenJson = json_encode($kosten);
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
@ -170,6 +207,7 @@ $farbenJson = json_encode($farben);
<div class="inhalt"> <div class="inhalt">
<div class="diagramm" id="chartKonten"></div> <div class="diagramm" id="chartKonten"></div>
<div class="diagramm" id="chartGesamt"></div> <div class="diagramm" id="chartGesamt"></div>
<div class="diagramm" id="chartEA"></div>
</div> </div>
<script> <script>
@ -184,18 +222,20 @@ $farbenJson = json_encode($farben);
var layout = { var layout = {
margin: { t: 20 }, margin: { t: 20 },
xaxis: { xaxis: {
title: { text: 'Monat'},
showgrid: true, showgrid: true,
zeroline: true zeroline: true
}, },
yaxis: { yaxis: {
title: { text: 'Kontostand Monatsende'},
showgrid: true, showgrid: true,
showline: true, showline: true,
separatethousands: false separatethousands: false,
exponentformat: "none",
tickformat: ",.2f",
ticksuffix: ""
}, },
plot_bgcolor: '#b9b9b9', plot_bgcolor: '#b9b9b9',
paper_bgcolor: '#b9b9b9' paper_bgcolor: '#b9b9b9',
separators: ",."
}; };
var modeBar = {modeBarButtonsToRemove: ['lasso2d', 'select2d', 'zoom2d', 'pan2d', 'autoScale2d'], var modeBar = {modeBarButtonsToRemove: ['lasso2d', 'select2d', 'zoom2d', 'pan2d', 'autoScale2d'],
@ -238,6 +278,54 @@ $farbenJson = json_encode($farben);
} }
Plotly.newPlot('chartGesamt', tracesGesamt, layout, modeBar); Plotly.newPlot('chartGesamt', tracesGesamt, layout, modeBar);
const labels = <?= $labelsJson ?>;
const kosten = <?= $kostenJson ?>;
var layout2 = {
barmode: 'relative',
xaxis: {
showgrid: true,
zeroline: true
},
yaxis: {
showgrid: true,
showline: true,
separatethousands: false,
exponentformat: "none",
tickformat: ",.2f",
ticksuffix: ""
},
plot_bgcolor: '#b9b9b9',
paper_bgcolor: '#b9b9b9',
separators: ",."
};
var data = [{
type: 'bar',
x: labels,
y: kosten['Ausgaben'],
base: 0,
marker: {
color: 'red'
},
name: 'Ausgaben',
hovertemplate: "%{y:,.2f} €<extra></extra>",
},
{
type: 'bar',
x: labels,
y: kosten['Einnahmen'],
base: 0,
marker: {
color: 'blue'
},
name: 'Einnahmen',
hovertemplate: "%{y:,.2f} €<extra></extra>",
}];
Plotly.newPlot('chartEA', data, layout2);
</script> </script>
<?= $system === 'test' ? '<div class="menue"><h2 class="seitentitel">Testsystem</h2></div>' : '' ?> <?= $system === 'test' ? '<div class="menue"><h2 class="seitentitel">Testsystem</h2></div>' : '' ?>
</body> </body>