Update package-lock.json and package.json to include 'globals' dependency and improve code formatting in various components for better readability.
Some checks failed
Code Analysis (JS/Vue) / analyze (push) Failing after 54s

This commit is contained in:
Torsten Schulz (local)
2025-12-20 10:17:16 +01:00
parent 861802b716
commit b20b89d333
72 changed files with 5338 additions and 2008 deletions

View File

@@ -13,19 +13,27 @@
<!-- Authentication Info -->
<div class="bg-blue-50 border-l-4 border-blue-500 p-6 rounded-lg mb-8">
<h2 class="text-xl font-semibold text-blue-900 mb-2">Authentifizierung</h2>
<h2 class="text-xl font-semibold text-blue-900 mb-2">
Authentifizierung
</h2>
<p class="text-blue-800 mb-4">
Alle API-Endpoints erfordern Authentifizierung (außer Login). Es werden zwei Methoden unterstützt:
</p>
<div class="space-y-3">
<div>
<strong class="text-blue-900">1. Cookie-basiert:</strong>
<p class="text-blue-700 text-sm mt-1">Nach dem Login über <code>/api/auth/login</code> wird automatisch ein Cookie gesetzt.</p>
<p class="text-blue-700 text-sm mt-1">
Nach dem Login über <code>/api/auth/login</code> wird automatisch ein Cookie gesetzt.
</p>
</div>
<div>
<strong class="text-blue-900">2. Authorization Header:</strong>
<p class="text-blue-700 text-sm mt-1">Header: <code>Authorization: Bearer &lt;token&gt;</code></p>
<p class="text-blue-700 text-sm">Der Token wird im Login-Response im Feld <code>token</code> zurückgegeben.</p>
<p class="text-blue-700 text-sm mt-1">
Header: <code>Authorization: Bearer &lt;token&gt;</code>
</p>
<p class="text-blue-700 text-sm">
Der Token wird im Login-Response im Feld <code>token</code> zurückgegeben.
</p>
</div>
</div>
</div>
@@ -34,19 +42,27 @@
<div class="space-y-8">
<!-- Authentication Endpoints -->
<section class="bg-white rounded-xl shadow-lg p-6">
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">Authentifizierung</h2>
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">
Authentifizierung
</h2>
<div class="space-y-6">
<!-- Login -->
<div class="border-l-4 border-primary-600 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">POST /api/auth/login</h3>
<h3 class="text-lg font-semibold text-gray-900">
POST /api/auth/login
</h3>
<span class="px-2 py-1 text-xs font-medium bg-green-100 text-green-800 rounded">Öffentlich</span>
</div>
<p class="text-gray-600 mb-3">Benutzer einloggen und Token erhalten</p>
<p class="text-gray-600 mb-3">
Benutzer einloggen und Token erhalten
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"email": "benutzer@example.com",
"password": "passwort"
@@ -54,7 +70,9 @@
</div>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"success": true,
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
@@ -71,13 +89,19 @@
<!-- Logout -->
<div class="border-l-4 border-primary-600 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">POST /api/auth/logout</h3>
<h3 class="text-lg font-semibold text-gray-900">
POST /api/auth/logout
</h3>
<span class="px-2 py-1 text-xs font-medium bg-yellow-100 text-yellow-800 rounded">Auth erforderlich</span>
</div>
<p class="text-gray-600 mb-3">Benutzer ausloggen</p>
<p class="text-gray-600 mb-3">
Benutzer ausloggen
</p>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"success": true,
"message": "Erfolgreich ausgeloggt"
@@ -88,13 +112,19 @@
<!-- Auth Status -->
<div class="border-l-4 border-primary-600 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">GET /api/auth/status</h3>
<h3 class="text-lg font-semibold text-gray-900">
GET /api/auth/status
</h3>
<span class="px-2 py-1 text-xs font-medium bg-yellow-100 text-yellow-800 rounded">Auth erforderlich</span>
</div>
<p class="text-gray-600 mb-3">Aktuellen Authentifizierungsstatus abrufen</p>
<p class="text-gray-600 mb-3">
Aktuellen Authentifizierungsstatus abrufen
</p>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"isLoggedIn": true,
"user": {
@@ -112,19 +142,27 @@
<!-- Members Endpoints -->
<section class="bg-white rounded-xl shadow-lg p-6">
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">Mitglieder</h2>
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">
Mitglieder
</h2>
<div class="space-y-6">
<!-- Get Members -->
<div class="border-l-4 border-primary-600 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">GET /api/members</h3>
<h3 class="text-lg font-semibold text-gray-900">
GET /api/members
</h3>
<span class="px-2 py-1 text-xs font-medium bg-yellow-100 text-yellow-800 rounded">Auth erforderlich</span>
</div>
<p class="text-gray-600 mb-3">Alle Mitglieder abrufen (mit Merge aus registrierten Benutzern)</p>
<p class="text-gray-600 mb-3">
Alle Mitglieder abrufen (mit Merge aus registrierten Benutzern)
</p>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"success": true,
"members": [
@@ -148,13 +186,19 @@
<!-- Post Members -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">POST /api/members</h3>
<h3 class="text-lg font-semibold text-gray-900">
POST /api/members
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Neues Mitglied hinzufügen oder bestehendes bearbeiten</p>
<p class="text-gray-600 mb-3">
Neues Mitglied hinzufügen oder bestehendes bearbeiten
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"id": "optional-für-update",
"firstName": "Max",
@@ -168,7 +212,9 @@
</div>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"success": true,
"message": "Mitglied erfolgreich gespeichert."
@@ -185,13 +231,19 @@
<!-- Bulk Import Members -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">POST /api/members/bulk</h3>
<h3 class="text-lg font-semibold text-gray-900">
POST /api/members/bulk
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Mehrere Mitglieder auf einmal importieren (Bulk-Import)</p>
<p class="text-gray-600 mb-3">
Mehrere Mitglieder auf einmal importieren (Bulk-Import)
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"members": [
{
@@ -214,7 +266,9 @@
</div>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"success": true,
"summary": {
@@ -253,20 +307,28 @@
<!-- Delete Members -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">DELETE /api/members</h3>
<h3 class="text-lg font-semibold text-gray-900">
DELETE /api/members
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Mitglied löschen</p>
<p class="text-gray-600 mb-3">
Mitglied löschen
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"id": "member-id"
}</code></pre>
</div>
<div class="bg-gray-50 rounded-lg p-4">
<p class="text-sm font-medium text-gray-700 mb-2">Response:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Response:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"success": true,
"message": "Mitglied erfolgreich gelöscht."
@@ -278,28 +340,40 @@
<!-- News Endpoints -->
<section class="bg-white rounded-xl shadow-lg p-6">
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">News</h2>
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">
News
</h2>
<div class="space-y-6">
<!-- Get News -->
<div class="border-l-4 border-primary-600 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">GET /api/news</h3>
<h3 class="text-lg font-semibold text-gray-900">
GET /api/news
</h3>
<span class="px-2 py-1 text-xs font-medium bg-yellow-100 text-yellow-800 rounded">Auth erforderlich</span>
</div>
<p class="text-gray-600 mb-3">Alle News abrufen (inkl. interner News)</p>
<p class="text-gray-600 mb-3">
Alle News abrufen (inkl. interner News)
</p>
</div>
<!-- Post News -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">POST /api/news</h3>
<h3 class="text-lg font-semibold text-gray-900">
POST /api/news
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Neue News erstellen oder bestehende bearbeiten</p>
<p class="text-gray-600 mb-3">
Neue News erstellen oder bestehende bearbeiten
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"id": "optional-für-update",
"title": "Titel der News",
@@ -314,13 +388,19 @@
<!-- Delete News -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">DELETE /api/news</h3>
<h3 class="text-lg font-semibold text-gray-900">
DELETE /api/news
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">News löschen</p>
<p class="text-gray-600 mb-3">
News löschen
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"id": "news-id"
}</code></pre>
@@ -331,28 +411,40 @@
<!-- Termine Endpoints -->
<section class="bg-white rounded-xl shadow-lg p-6">
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">Termine</h2>
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">
Termine
</h2>
<div class="space-y-6">
<!-- Get Termine -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">GET /api/termine-manage</h3>
<h3 class="text-lg font-semibold text-gray-900">
GET /api/termine-manage
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Alle Termine abrufen (für Verwaltung)</p>
<p class="text-gray-600 mb-3">
Alle Termine abrufen (für Verwaltung)
</p>
</div>
<!-- Post Termine -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">POST /api/termine-manage</h3>
<h3 class="text-lg font-semibold text-gray-900">
POST /api/termine-manage
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Neuen Termin erstellen</p>
<p class="text-gray-600 mb-3">
Neuen Termin erstellen
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>{
"datum": "2025-12-25",
"uhrzeit": "19:00",
@@ -366,13 +458,19 @@
<!-- Delete Termine -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">DELETE /api/termine-manage</h3>
<h3 class="text-lg font-semibold text-gray-900">
DELETE /api/termine-manage
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Termin löschen</p>
<p class="text-gray-600 mb-3">
Termin löschen
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Query Parameters:</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Query Parameters:
</p>
<pre class="text-xs bg-gray-900 text-gray-100 p-3 rounded overflow-x-auto"><code>?datum=2025-12-25&uhrzeit=19:00&titel=Weihnachtsfeier&beschreibung=...&kategorie=...</code></pre>
</div>
</div>
@@ -381,29 +479,43 @@
<!-- Config Endpoints -->
<section class="bg-white rounded-xl shadow-lg p-6">
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">Konfiguration</h2>
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">
Konfiguration
</h2>
<div class="space-y-6">
<!-- Get Config -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">GET /api/config</h3>
<h3 class="text-lg font-semibold text-gray-900">
GET /api/config
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Vereinskonfiguration abrufen</p>
<p class="text-gray-600 mb-3">
Vereinskonfiguration abrufen
</p>
</div>
<!-- Put Config -->
<div class="border-l-4 border-red-500 pl-4">
<div class="flex items-center justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-900">PUT /api/config</h3>
<h3 class="text-lg font-semibold text-gray-900">
PUT /api/config
</h3>
<span class="px-2 py-1 text-xs font-medium bg-red-100 text-red-800 rounded">admin/vorstand</span>
</div>
<p class="text-gray-600 mb-3">Vereinskonfiguration aktualisieren</p>
<p class="text-gray-600 mb-3">
Vereinskonfiguration aktualisieren
</p>
<div class="bg-gray-50 rounded-lg p-4 mb-3">
<p class="text-sm font-medium text-gray-700 mb-2">Request Body:</p>
<p class="text-xs text-gray-600">Komplettes Config-Objekt mit allen Einstellungen</p>
<p class="text-sm font-medium text-gray-700 mb-2">
Request Body:
</p>
<p class="text-xs text-gray-600">
Komplettes Config-Objekt mit allen Einstellungen
</p>
</div>
</div>
</div>
@@ -412,11 +524,15 @@
<!-- Example Usage -->
<div class="mt-12 bg-white rounded-xl shadow-lg p-6">
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">Beispiel-Usage</h2>
<h2 class="text-2xl font-display font-bold text-gray-900 mb-6">
Beispiel-Usage
</h2>
<div class="space-y-4">
<div>
<h3 class="text-lg font-semibold text-gray-900 mb-2">cURL Beispiel:</h3>
<h3 class="text-lg font-semibold text-gray-900 mb-2">
cURL Beispiel:
</h3>
<pre class="text-xs bg-gray-900 text-gray-100 p-4 rounded overflow-x-auto"><code># Login und Token erhalten
curl -X POST http://localhost:3100/api/auth/login \
-H "Content-Type: application/json" \
@@ -457,7 +573,9 @@ curl -X POST http://localhost:3100/api/members/bulk \
</div>
<div>
<h3 class="text-lg font-semibold text-gray-900 mb-2">JavaScript/Fetch Beispiel:</h3>
<h3 class="text-lg font-semibold text-gray-900 mb-2">
JavaScript/Fetch Beispiel:
</h3>
<pre class="text-xs bg-gray-900 text-gray-100 p-4 rounded overflow-x-auto"><code>// Login
const loginResponse = await fetch('/api/auth/login', {
method: 'POST',
@@ -516,7 +634,9 @@ const result = await bulkResponse.json()
<!-- Role Legend -->
<div class="mt-8 bg-gray-50 rounded-xl p-6">
<h2 class="text-xl font-semibold text-gray-900 mb-4">Legende</h2>
<h2 class="text-xl font-semibold text-gray-900 mb-4">
Legende
</h2>
<div class="grid md:grid-cols-3 gap-4">
<div class="flex items-center space-x-2">
<span class="px-2 py-1 text-xs font-medium bg-green-100 text-green-800 rounded">Öffentlich</span>