20251216: Einnahmen/Ausgaben Diagramm
This commit is contained in:
parent
6e0322c636
commit
f451433b74
@ -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>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user