First commit - es tut schon mal ganz gut
This commit is contained in:
82
app/api/ausgaben/[id]/route.ts
Normal file
82
app/api/ausgaben/[id]/route.ts
Normal file
@@ -0,0 +1,82 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
import { getDbPool } from '@/lib/db';
|
||||
import { ResultSetHeader } from 'mysql2';
|
||||
|
||||
// PUT /api/ausgaben/[id] - Update entry
|
||||
export async function PUT(
|
||||
request: Request,
|
||||
context: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const { id } = await context.params;
|
||||
const body = await request.json();
|
||||
const { Datum, WochTag, Wo, Was, Wieviel, Wie, OK } = body;
|
||||
|
||||
const pool = getDbPool();
|
||||
|
||||
const query = `
|
||||
UPDATE Ausgaben_Tag
|
||||
SET Datum = ?, WochTag = ?, Wo = ?, Was = ?, Wieviel = ?, Wie = ?, OK = ?
|
||||
WHERE ID = ?
|
||||
`;
|
||||
|
||||
const [result] = await pool.query<ResultSetHeader>(query, [
|
||||
Datum,
|
||||
WochTag,
|
||||
Wo,
|
||||
Was,
|
||||
parseFloat(Wieviel),
|
||||
Wie,
|
||||
OK || 0,
|
||||
parseInt(id),
|
||||
]);
|
||||
|
||||
if (result.affectedRows === 0) {
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Entry not found' },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
return NextResponse.json({
|
||||
success: true,
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Database error:', error);
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Database error' },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// DELETE /api/ausgaben/[id] - Delete entry
|
||||
export async function DELETE(
|
||||
request: Request,
|
||||
context: { params: Promise<{ id: string }> }
|
||||
) {
|
||||
try {
|
||||
const { id } = await context.params;
|
||||
const pool = getDbPool();
|
||||
|
||||
const query = 'DELETE FROM Ausgaben_Tag WHERE ID = ?';
|
||||
const [result] = await pool.query<ResultSetHeader>(query, [parseInt(id)]);
|
||||
|
||||
if (result.affectedRows === 0) {
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Entry not found' },
|
||||
{ status: 404 }
|
||||
);
|
||||
}
|
||||
|
||||
return NextResponse.json({
|
||||
success: true,
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Database error:', error);
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Database error' },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
86
app/api/ausgaben/route.ts
Normal file
86
app/api/ausgaben/route.ts
Normal file
@@ -0,0 +1,86 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
import { getDbPool } from '@/lib/db';
|
||||
import { RowDataPacket, ResultSetHeader } from 'mysql2';
|
||||
|
||||
// GET /api/ausgaben - Fetch entries
|
||||
export async function GET(request: Request) {
|
||||
try {
|
||||
const { searchParams } = new URL(request.url);
|
||||
const limit = searchParams.get('limit') || '10';
|
||||
const startDate = searchParams.get('startDate');
|
||||
const month = searchParams.get('month');
|
||||
const year = searchParams.get('year');
|
||||
|
||||
const pool = getDbPool();
|
||||
|
||||
let query = 'SELECT * FROM Ausgaben_Tag';
|
||||
const params: any[] = [];
|
||||
|
||||
if (month && year) {
|
||||
query += ' WHERE YEAR(Datum) = ? AND MONTH(Datum) = ?';
|
||||
params.push(year, month);
|
||||
} else if (startDate) {
|
||||
query += ' WHERE Datum >= ?';
|
||||
params.push(startDate);
|
||||
}
|
||||
|
||||
query += ' ORDER BY Datum DESC, ID DESC LIMIT ?';
|
||||
params.push(parseInt(limit));
|
||||
|
||||
const [rows] = await pool.query<RowDataPacket[]>(query, params);
|
||||
|
||||
return NextResponse.json({
|
||||
success: true,
|
||||
data: rows,
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Database error:', error);
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Database error' },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// POST /api/ausgaben - Create new entry
|
||||
export async function POST(request: Request) {
|
||||
try {
|
||||
const body = await request.json();
|
||||
const { Datum, WochTag, Wo, Was, Wieviel, Wie, OK } = body;
|
||||
|
||||
if (!Datum || !Wo || !Was || !Wieviel || !Wie) {
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Missing required fields' },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
const pool = getDbPool();
|
||||
|
||||
const query = `
|
||||
INSERT INTO Ausgaben_Tag (Datum, WochTag, Wo, Was, Wieviel, Wie, OK)
|
||||
VALUES (?, ?, ?, ?, ?, ?, ?)
|
||||
`;
|
||||
|
||||
const [result] = await pool.query<ResultSetHeader>(query, [
|
||||
Datum,
|
||||
WochTag,
|
||||
Wo,
|
||||
Was,
|
||||
parseFloat(Wieviel),
|
||||
Wie,
|
||||
OK || 0,
|
||||
]);
|
||||
|
||||
return NextResponse.json({
|
||||
success: true,
|
||||
id: result.insertId,
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Database error:', error);
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Database error' },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
69
app/api/ausgaben/stats/route.ts
Normal file
69
app/api/ausgaben/stats/route.ts
Normal file
@@ -0,0 +1,69 @@
|
||||
import { NextResponse } from 'next/server';
|
||||
import { getDbPool } from '@/lib/db';
|
||||
import { RowDataPacket } from 'mysql2';
|
||||
|
||||
// GET /api/ausgaben/stats - Get monthly statistics
|
||||
export async function GET(request: Request) {
|
||||
try {
|
||||
const { searchParams } = new URL(request.url);
|
||||
const month = searchParams.get('month');
|
||||
const year = searchParams.get('year');
|
||||
|
||||
if (!month || !year) {
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Month and year are required' },
|
||||
{ status: 400 }
|
||||
);
|
||||
}
|
||||
|
||||
const pool = getDbPool();
|
||||
|
||||
// Get total ausgaben and breakdown by payment type
|
||||
const query = `
|
||||
SELECT
|
||||
SUM(CASE WHEN Wie IN ('EC-R', 'EC-B', 'bar-R', 'bar-B', 'Ueber') THEN Wieviel ELSE 0 END) as totalAusgaben,
|
||||
SUM(CASE WHEN Wie = 'EC-R' THEN Wieviel ELSE 0 END) as ECR,
|
||||
SUM(CASE WHEN Wie = 'EC-B' THEN Wieviel ELSE 0 END) as ECB,
|
||||
SUM(CASE WHEN Wie = 'bar-R' THEN Wieviel ELSE 0 END) as barR,
|
||||
SUM(CASE WHEN Wie = 'bar-B' THEN Wieviel ELSE 0 END) as barB,
|
||||
SUM(CASE WHEN Wie = 'Einnahme' THEN Wieviel ELSE 0 END) as Einnahmen,
|
||||
SUM(CASE WHEN Wie = 'Ueber' THEN Wieviel ELSE 0 END) as Ueberweisungen
|
||||
FROM Ausgaben_Tag
|
||||
WHERE YEAR(Datum) = ? AND MONTH(Datum) = ?
|
||||
`;
|
||||
|
||||
const [rows] = await pool.query<RowDataPacket[]>(query, [year, month]);
|
||||
|
||||
const data = rows[0] || {
|
||||
totalAusgaben: 0,
|
||||
ECR: 0,
|
||||
ECB: 0,
|
||||
barR: 0,
|
||||
barB: 0,
|
||||
Einnahmen: 0,
|
||||
Ueberweisungen: 0,
|
||||
};
|
||||
|
||||
// Convert string values from MySQL to numbers
|
||||
const parsedData = {
|
||||
totalAusgaben: parseFloat(data.totalAusgaben) || 0,
|
||||
ECR: parseFloat(data.ECR) || 0,
|
||||
ECB: parseFloat(data.ECB) || 0,
|
||||
barR: parseFloat(data.barR) || 0,
|
||||
barB: parseFloat(data.barB) || 0,
|
||||
Einnahmen: parseFloat(data.Einnahmen) || 0,
|
||||
Ueberweisungen: parseFloat(data.Ueberweisungen) || 0,
|
||||
};
|
||||
|
||||
return NextResponse.json({
|
||||
success: true,
|
||||
data: parsedData,
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Database error:', error);
|
||||
return NextResponse.json(
|
||||
{ success: false, error: 'Database error' },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
18
app/globals.css
Normal file
18
app/globals.css
Normal file
@@ -0,0 +1,18 @@
|
||||
/* stylelint-disable at-rule-no-unknown */
|
||||
@import "tailwindcss";
|
||||
|
||||
:root {
|
||||
--background: #ffffff;
|
||||
--foreground: #171717;
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
--color-background: var(--background);
|
||||
--color-foreground: var(--foreground);
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--background);
|
||||
color: var(--foreground);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
21
app/layout.tsx
Normal file
21
app/layout.tsx
Normal file
@@ -0,0 +1,21 @@
|
||||
import type { Metadata } from "next";
|
||||
import "./globals.css";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Ausgaben - Log",
|
||||
description: "Ausgaben-Tracking Anwendung",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="de">
|
||||
<body className="antialiased">
|
||||
{children}
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
89
app/page.tsx
Normal file
89
app/page.tsx
Normal file
@@ -0,0 +1,89 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useEffect } from 'react';
|
||||
import AusgabenForm from '@/components/AusgabenForm';
|
||||
import AusgabenList from '@/components/AusgabenList';
|
||||
import { AusgabenEntry } from '@/types/ausgaben';
|
||||
import packageJson from '@/package.json';
|
||||
|
||||
export default function Home() {
|
||||
const [entries, setEntries] = useState<AusgabenEntry[]>([]);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [selectedEntry, setSelectedEntry] = useState<AusgabenEntry | null>(null);
|
||||
|
||||
const version = packageJson.version;
|
||||
|
||||
useEffect(() => {
|
||||
fetchRecentEntries();
|
||||
}, []);
|
||||
|
||||
const fetchRecentEntries = async () => {
|
||||
setIsLoading(true);
|
||||
try {
|
||||
const response = await fetch('/api/ausgaben?limit=10', {
|
||||
cache: 'no-store',
|
||||
headers: {
|
||||
'Cache-Control': 'no-cache',
|
||||
},
|
||||
});
|
||||
const data = await response.json();
|
||||
if (data.success) {
|
||||
setEntries(data.data);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching entries:', error);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSuccess = () => {
|
||||
setSelectedEntry(null);
|
||||
setTimeout(() => {
|
||||
fetchRecentEntries();
|
||||
}, 100);
|
||||
};
|
||||
|
||||
const handleDelete = (id: number) => {
|
||||
setEntries(entries.filter(entry => entry.ID !== id));
|
||||
};
|
||||
|
||||
const handleEdit = (entry: AusgabenEntry) => {
|
||||
setSelectedEntry(entry);
|
||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-white py-4 px-4">
|
||||
<main className="max-w-7xl mx-auto border-2 border-black rounded-lg p-6 bg-[#FFFFDD]">
|
||||
<h1 className="text-3xl font-bold text-center mb-6">Ausgaben - Log</h1>
|
||||
|
||||
<div>
|
||||
<h2 className="text-xl font-semibold mb-4">Eingabe</h2>
|
||||
<AusgabenForm onSuccess={handleSuccess} selectedEntry={selectedEntry} />
|
||||
|
||||
<div className="mt-6 bg-white border border-black rounded-lg shadow-md p-6">
|
||||
<h3 className="text-xl font-semibold mb-4">Letzte 10 Einträge</h3>
|
||||
{isLoading ? (
|
||||
<div className="text-center py-4">Lade Daten...</div>
|
||||
) : (
|
||||
<AusgabenList entries={entries} onDelete={handleDelete} onEdit={handleEdit} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<footer className="mt-8 flex justify-between items-center text-sm text-gray-600 px-4 border-t-2 border-black pt-4">
|
||||
<div>
|
||||
<a href="mailto:rxf@gmx.de" className="text-blue-600 hover:underline">
|
||||
mailto:rxf@gmx.de
|
||||
</a>
|
||||
</div>
|
||||
<div className="text-right">
|
||||
Version {version}
|
||||
</div>
|
||||
</footer>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user