Datepicker in konto.php
This commit is contained in:
p3t3rp1Lz
parent
7f2f35b7de
commit
237b0c4900
62
forms/datepicker.php
Normal file
62
forms/datepicker.php
Normal file
@ -0,0 +1,62 @@
|
||||
<?php
|
||||
header('Content-Type: application/json');
|
||||
require_once __DIR__ . '/../includes/db_connect.php';
|
||||
|
||||
$start = $_POST['start'] ?? null;
|
||||
$end = $_POST['end'] ?? null;
|
||||
$konto_id = $_POST['konto_id'] ?? null;
|
||||
|
||||
if (!$start || !$end || !$konto_id) {
|
||||
echo json_encode(['success'=>false,'message'=>'Kein Zeitraum']); exit;
|
||||
}
|
||||
|
||||
$stmt = $pdo->prepare("SELECT kb.id AS kontobewegung_id,
|
||||
kb.betrag,
|
||||
kb.beschreibung,
|
||||
kb.datum_ausgegeben,
|
||||
kb.datum_abgebucht,
|
||||
kb.kostenfix_id
|
||||
FROM kontobewegung kb
|
||||
LEFT OUTER JOIN kostenfix kf ON kf.id = kb.kostenfix_id
|
||||
WHERE kb.konto_id = :konto_id
|
||||
AND kb.datum_ausgegeben BETWEEN :von AND :bis
|
||||
ORDER BY datum_ausgegeben DESC,
|
||||
kb.id DESC;");
|
||||
$stmt->execute(['konto_id' => $konto_id,
|
||||
'von'=>$start,
|
||||
'bis'=>$end]);
|
||||
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
$tabelle_gesamt = [];
|
||||
foreach($rows as $r) {
|
||||
$tabelle_zeile = [];
|
||||
$tabelle_zeile["datum_abgebucht"] = "<td class=\"td_datum\" onClick=\"ändereUmsatz("
|
||||
. $r['kontobewegung_id']
|
||||
. ", " . $konto_id . ")\">"
|
||||
. ($r['datum_abgebucht'] ?? '')
|
||||
. "</td>";
|
||||
$tabelle_zeile["datum_ausgegeben"] = "<td class=\"td_datum\" onClick=\"ändereUmsatz("
|
||||
. $r['kontobewegung_id']
|
||||
. ", " . $konto_id . ")\">"
|
||||
. ($r['datum_ausgegeben'] ?? '')
|
||||
. "</td>";
|
||||
$tabelle_zeile["beschreibung"] = "<td class=\"td_text\" onClick=\"ändereUmsatz("
|
||||
. $r['kontobewegung_id']
|
||||
. ", " . $konto_id . ")\">"
|
||||
. ($r['beschreibung'] ?? '')
|
||||
. "</td>";
|
||||
|
||||
$tabelle_zeile["betrag"] = "<td class=\""
|
||||
. ($r['betrag'] < 0 ? 'td_zahl_neg' : 'td_zahl_pos')
|
||||
. "\" onClick=\"ändereUmsatz("
|
||||
. $r['kontobewegung_id']
|
||||
. ", " . $konto_id . ")\">"
|
||||
. (number_format($r['betrag'], 2, ",", "."))
|
||||
. " €</td>";
|
||||
|
||||
$tabelle_zeile["tr_class"] = $r['kostenfix_id'] ? "konto_fixKosten" : "standard";
|
||||
|
||||
$tabelle_gesamt[] = $tabelle_zeile;
|
||||
}
|
||||
|
||||
echo json_encode(['success'=>true,'rows'=>$tabelle_gesamt]);
|
||||
112
konto.php
112
konto.php
@ -18,6 +18,13 @@
|
||||
$konto_kontostand = $konto[0]['kontostand'];
|
||||
$konto_backgroundColor = $konto[0]['backgroundcolor'];
|
||||
|
||||
|
||||
$stmt = $pdo->query("SELECT (date_trunc('month', CURRENT_DATE::date) - interval '2 month')::date AS von,
|
||||
(date_trunc('month', CURRENT_DATE::date) + interval '1 month' - interval '1 day')::date AS bis;");
|
||||
$monat_aktuell = $stmt->fetchAll(PDO::FETCH_ASSOC)[0];
|
||||
|
||||
$selectedRange = $_GET['range'] ?? $monat_aktuell['von'] . " to " . $monat_aktuell['bis'];
|
||||
|
||||
$stmt = $pdo->prepare("SELECT kb.id AS kontobewegung_id,
|
||||
kb.betrag,
|
||||
kb.beschreibung,
|
||||
@ -27,24 +34,106 @@
|
||||
FROM kontobewegung kb
|
||||
LEFT OUTER JOIN kostenfix kf ON kf.id = kb.kostenfix_id
|
||||
WHERE kb.konto_id = :konto_id
|
||||
AND kb.datum_ausgegeben BETWEEN :von AND :bis
|
||||
ORDER BY datum_ausgegeben DESC,
|
||||
kb.id DESC;");
|
||||
$stmt->execute(['konto_id' => $konto_id]);
|
||||
$stmt->execute(['konto_id' => $konto_id, 'von' => $monat_aktuell['von'], 'bis' => $monat_aktuell['bis']]);
|
||||
$kontobewegung = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
|
||||
|
||||
<script>
|
||||
function ändereUmsatz(kontobewegung_id, konto_id) {
|
||||
document.getElementById("hiddenInputÄndereUmsatzKontobewegungID").value = kontobewegung_id;
|
||||
document.getElementById("hiddenInputÄndereUmsatzKontoID").value = konto_id;
|
||||
|
||||
//console.log("DEBUG: ", document.getElementById("hiddenInputÄndereUmsatzKontobewegungID").value);
|
||||
|
||||
document.getElementById("hiddenFormÄndereUmsatz").submit();
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
flatpickr("#rangePicker", {
|
||||
mode: "range",
|
||||
dateFormat: "Y-m-d",
|
||||
/*defaultDate: ["2025-11-01","2025-11-30"]*/
|
||||
closeOnSelect: false,
|
||||
|
||||
onReady: function (selectedDates, dateStr, instance) {
|
||||
const fpContainer = instance.calendarContainer;
|
||||
|
||||
if (fpContainer.querySelector(".fp-apply-btn")) return;
|
||||
|
||||
const applyBtn = document.createElement("button");
|
||||
applyBtn.textContent = "Filtern";
|
||||
applyBtn.type = "button";
|
||||
applyBtn.className = "fp-apply-btn";
|
||||
|
||||
applyBtn.style.margin = "8px";
|
||||
applyBtn.style.padding = "6px 12px";
|
||||
applyBtn.style.fontSize = "14px";
|
||||
|
||||
applyBtn.addEventListener("click", () => {
|
||||
const value = instance.input.value;
|
||||
|
||||
datum(<?= $konto_id ?>, value);
|
||||
|
||||
instance.close();
|
||||
});
|
||||
|
||||
fpContainer.appendChild(applyBtn);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function datum(konto_id) {
|
||||
const val = document.getElementById('rangePicker').value; // "YYYY-MM-DD to YYYY-MM-DD"
|
||||
if (!val) return alert('Bitte Zeitraum wählen');
|
||||
|
||||
const parts = val.split(' to ');
|
||||
const start = parts[0];
|
||||
const end = parts[1] ?? parts[0];
|
||||
|
||||
fetch('forms/datepicker.php', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
||||
body: `start=${encodeURIComponent(start)}&end=${encodeURIComponent(end)}&konto_id=${encodeURIComponent(konto_id)}`
|
||||
})
|
||||
.then(res => {
|
||||
if (!res.ok) {
|
||||
throw new Error("HTTP Fehler " + res.status);
|
||||
}
|
||||
return res.text(); // zuerst als Text holen
|
||||
})
|
||||
.then(txt => {
|
||||
//console.log("Antwort-Text:", txt); // prüfen was wirklich kommt
|
||||
return JSON.parse(txt);
|
||||
})
|
||||
//.then(data => console.log("JSON:", data)) //LOGAusgabe
|
||||
.then(data => {
|
||||
if (!data.success) return alert('Fehler: ' + (data.message||''));
|
||||
// data.rows = Array mit Ergebnissen - Tabelle ersetzen
|
||||
const tbody = document.getElementById('tableBody');
|
||||
tbody.innerHTML = ''; // löschen
|
||||
data.rows.forEach(r => {
|
||||
const tr = document.createElement('tr');
|
||||
tr.innerHTML = r.datum_abgebucht + r.datum_ausgegeben + r.beschreibung + r.betrag;
|
||||
tr.classList.add(r.tr_class);
|
||||
tbody.appendChild(tr);
|
||||
});
|
||||
})
|
||||
.catch(err => console.error("Fehler:", err));
|
||||
}
|
||||
|
||||
function escapeHtml(s){ return String(s).replace(/[&<>"']/g, c=>({ '&':'&','<':'<','>':'>','"':'"',"'":''' })[c]); }
|
||||
function numberFormat(n){ return Number(n).toLocaleString('de-DE', {minimumFractionDigits:2, maximumFractionDigits:2}); }
|
||||
|
||||
</script>
|
||||
<style>
|
||||
tr.standard {
|
||||
@ -78,15 +167,23 @@
|
||||
</div>
|
||||
<div class="inhalt">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th id="th_gebucht">gebucht</th>
|
||||
<th id="th_ausgegeben">ausgegeben</th>
|
||||
<th id="th_ausgegeben">
|
||||
<!--ausgegeben-->
|
||||
<div class="range-wrapper">
|
||||
<input id="rangePicker" type="text" placeholder="ausgegben" value="<?= htmlspecialchars($selectedRange) ?>">
|
||||
<!--button id="applyRange" type="button" onClick="datum(< ?= htmlspecialchars($konto_id) ?>)">Anwenden</button-->
|
||||
</div>
|
||||
</th>
|
||||
<th id="th_beschreibung">Beschreibung</th>
|
||||
<th id="th_betrag">Betrag</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tableBody">
|
||||
<?php foreach ($kontobewegung as $y): ?>
|
||||
<tr <?= $y['kostenfix_id'] ? 'class="konto_fixKosten"' : 'class="standard"' ?>>
|
||||
<!--tr style="background-color: < ?= $konto_backgroundColor ?>"-->
|
||||
<td class="td_datum"
|
||||
onClick="ändereUmsatz(<?= htmlspecialchars($y['kontobewegung_id']) ?>, <?= htmlspecialchars($konto_id) ?>)">
|
||||
<?= empty($y['datum_abgebucht']) ? '' : htmlspecialchars($y['datum_abgebucht']) ?>
|
||||
@ -103,15 +200,16 @@
|
||||
onClick="ändereUmsatz(<?= htmlspecialchars($y['kontobewegung_id']) ?>, <?= htmlspecialchars($konto_id) ?>)">
|
||||
<?= number_format($y['betrag'], 2, ",", ".") ?> €
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<form id="hiddenFormÄndereUmsatz" method="post" action="kontobewegung_edit.php">
|
||||
<input id="hiddenInputÄndereUmsatzKontobewegungID" type="hidden" name="kontobewegung_id">
|
||||
<input id="hiddenInputÄndereUmsatzKontoID" type="hidden" name="konto_id">
|
||||
<input id="hiddenInputEditTyp" type="hidden" name="editTyp" value="edit">
|
||||
</form>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
||||
10
style.css
10
style.css
@ -291,6 +291,16 @@ td.td_datum {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
#rangePicker {
|
||||
width: 90%;
|
||||
background-color: rgb(185, 185, 185);
|
||||
border: none;
|
||||
text-align: center;
|
||||
color: black;
|
||||
line-height: 0.8;
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
|
||||
/****************************************/
|
||||
/* Umsatz_edit */
|
||||
/****************************************/
|
||||
|
||||
Loading…
Reference in New Issue
Block a user