rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Feat: Kontaktformular im Impressum + /api/contact Endpoint ohne Auth (SW by-v986)

Browse source
This commit is contained in:
rene 2026-05-15 16:46:37 +02:00
parent 0f09f5a8dd
commit 3fae57a0e2
5 changed files with 158 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

4
backend/main.py
View file

@ -253,6 +253,7 @@ from routes.challenges import router as challenges_router
from routes.gassi_zeiten import router as gassi_zeiten_router
from routes.help import router as help_router
from routes.feedback import router as feedback_router
from routes.contact import router as contact_router
from routes.invoices import router as invoices_router
app.include_router(auth_router, prefix="/api/auth", tags=["Auth"])
@ -318,6 +319,7 @@ app.include_router(challenges_router, prefix="/api/challenges", ta
app.include_router(gassi_zeiten_router, prefix="/api/gassi-zeiten", tags=["Gassi-Zeiten"])
app.include_router(help_router, prefix="/api/help", tags=["Hilfe/FAQ"])
app.include_router(feedback_router, prefix="/api/feedback", tags=["Feedback"])
app.include_router(contact_router, prefix="/api/contact", tags=["Kontakt"])
app.include_router(invoices_router)
@ -408,7 +410,7 @@ async def serve_media(path: str, request: _Request):
raise _HE(404, "Nicht gefunden.")
return _media_response(filepath)
APP_VER = "985" # muss mit APP_VER in app.js übereinstimmen
APP_VER = "986" # muss mit APP_VER in app.js übereinstimmen
@app.get("/.well-known/assetlinks.json")
async def assetlinks():

52
backend/routes/contact.py Normal file
View file

@ -0,0 +1,52 @@
"""
BAN YARO — Öffentliches Kontaktformular (kein Login erforderlich)
Für Impressum-Kontaktpflicht nach § 5 DDG.
"""
from fastapi import APIRouter, Request
from pydantic import BaseModel, EmailStr, Field
from typing import Annotated
from mailer import send_email, email_html
from ratelimit import check as rl_check
router = APIRouter()
CONTACT_MAIL = "hallo@banyaro.app"
class ContactIn(BaseModel):
name: Annotated[str, Field(min_length=2, max_length=100)]
email: EmailStr
subject: Annotated[str, Field(min_length=3, max_length=150)]
message: Annotated[str, Field(min_length=10, max_length=3000)]
@router.post("")
async def submit_contact(payload: ContactIn, request: Request):
rl_check(request, max_requests=3, window_seconds=3600, key=f"contact_{payload.email}")
body = f"""
<p style="margin:0 0 16px">Neue Kontaktanfrage über das Impressum-Formular:</p>
<table style="width:100%;border-collapse:collapse;font-size:13px;margin-bottom:20px">
<tr><td style="padding:6px 10px;background:#f5f0ea;font-weight:600;width:100px">Name</td>
<td style="padding:6px 10px;border-bottom:1px solid #eee">{payload.name}</td></tr>
<tr><td style="padding:6px 10px;background:#f5f0ea;font-weight:600">E-Mail</td>
<td style="padding:6px 10px;border-bottom:1px solid #eee">{payload.email}</td></tr>
<tr><td style="padding:6px 10px;background:#f5f0ea;font-weight:600">Betreff</td>
<td style="padding:6px 10px;border-bottom:1px solid #eee">{payload.subject}</td></tr>
</table>
<div style="background:#fdf6ef;border-left:4px solid #C4843A;padding:14px 16px;
border-radius:0 8px 8px 0;white-space:pre-wrap;font-size:14px;line-height:1.6">
{payload.message}
</div>"""
plain = f"Kontakt von {payload.name} ({payload.email})\nBetreff: {payload.subject}\n\n{payload.message}"
await send_email(
CONTACT_MAIL,
f"Kontakt: {payload.subject} — {payload.name}",
email_html(body),
plain,
)
return {"ok": True}

2
backend/static/js/app.js
View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung.
============================================================ */
const APP_VER = '985'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VER = '986'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VERSION = '1.6.0'; // ← semantische Version, wird bei make release gesetzt
const IS_STAGING = location.hostname === 'staging.banyaro.app';
// Cache-Bust-Parameter nach Update-Reload sofort entfernen

104
backend/static/js/pages/impressum.js
View file

@ -24,11 +24,58 @@ window.Page_impressum = (() => {
<section style="margin-bottom:var(--space-6)">
<h2 style="font-size:var(--text-base);font-weight:var(--weight-semibold);
color:var(--c-text);margin:0 0 var(--space-2)">Kontakt</h2>
<p style="font-size:var(--text-sm);color:var(--c-text-secondary);line-height:1.7;margin:0">
<p style="font-size:var(--text-sm);color:var(--c-text-secondary);line-height:1.7;margin:0 0 var(--space-4)">
E-Mail: <a href="mailto:hallo@banyaro.app"
style="color:var(--c-primary)">hallo@banyaro.app</a><br>
Wir antworten in der Regel innerhalb von 24 Stunden.
Oder nutze das Formular — wir antworten in der Regel innerhalb von 24 Stunden.
</p>
<form id="contact-form" style="display:flex;flex-direction:column;gap:var(--space-3)">
<div style="display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)">
<div>
<label style="display:block;font-size:var(--text-xs);font-weight:600;margin-bottom:4px;color:var(--c-text)">Name *</label>
<input id="cf-name" type="text" required maxlength="100"
placeholder="Dein Name"
style="width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);
border:1.5px solid var(--c-border);background:var(--c-surface);
color:var(--c-text);font-size:var(--text-sm);box-sizing:border-box">
</div>
<div>
<label style="display:block;font-size:var(--text-xs);font-weight:600;margin-bottom:4px;color:var(--c-text)">E-Mail *</label>
<input id="cf-email" type="email" required maxlength="200"
placeholder="deine@email.de"
style="width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);
border:1.5px solid var(--c-border);background:var(--c-surface);
color:var(--c-text);font-size:var(--text-sm);box-sizing:border-box">
</div>
</div>
<div>
<label style="display:block;font-size:var(--text-xs);font-weight:600;margin-bottom:4px;color:var(--c-text)">Betreff *</label>
<input id="cf-subject" type="text" required maxlength="150"
placeholder="Worum geht es?"
style="width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);
border:1.5px solid var(--c-border);background:var(--c-surface);
color:var(--c-text);font-size:var(--text-sm);box-sizing:border-box">
</div>
<div>
<label style="display:block;font-size:var(--text-xs);font-weight:600;margin-bottom:4px;color:var(--c-text)">Nachricht *</label>
<textarea id="cf-message" required maxlength="3000" rows="5"
placeholder="Deine Nachricht…"
style="width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);
border:1.5px solid var(--c-border);background:var(--c-surface);
color:var(--c-text);font-size:var(--text-sm);resize:vertical;
font-family:inherit;box-sizing:border-box"></textarea>
</div>
<div id="cf-status" style="display:none;padding:var(--space-2) var(--space-3);
border-radius:var(--radius-md);font-size:var(--text-sm)"></div>
<button id="cf-submit" type="submit"
style="align-self:flex-start;padding:var(--space-2) var(--space-5);
border-radius:var(--radius-full);border:none;cursor:pointer;
background:var(--c-primary);color:#fff;font-size:var(--text-sm);
font-weight:600">
Nachricht senden
</button>
</form>
</section>
<section style="margin-bottom:var(--space-6)">
@ -72,7 +119,58 @@ window.Page_impressum = (() => {
`;
}
function _initContactForm(container) {
const form = container.querySelector('#contact-form');
const statusEl = container.querySelector('#cf-status');
const submitBtn = container.querySelector('#cf-submit');
if (!form) return;
form.addEventListener('submit', async e => {
e.preventDefault();
const name = container.querySelector('#cf-name').value.trim();
const email = container.querySelector('#cf-email').value.trim();
const subject = container.querySelector('#cf-subject').value.trim();
const message = container.querySelector('#cf-message').value.trim();
submitBtn.disabled = true;
submitBtn.textContent = 'Wird gesendet…';
statusEl.style.display = 'none';
try {
const res = await fetch('/api/contact', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ name, email, subject, message }),
});
if (!res.ok) {
const err = await res.json().catch(() => ({}));
throw new Error(err.detail || 'Fehler beim Senden.');
}
statusEl.style.display = 'block';
statusEl.style.background = 'var(--c-success-bg, #f0fdf4)';
statusEl.style.color = 'var(--c-success, #16a34a)';
statusEl.textContent = '✓ Nachricht gesendet — wir melden uns bald!';
form.reset();
} catch (err) {
statusEl.style.display = 'block';
statusEl.style.background = '#fef2f2';
statusEl.style.color = '#dc2626';
statusEl.textContent = err.message || 'Fehler beim Senden. Bitte versuche es später erneut.';
submitBtn.disabled = false;
submitBtn.textContent = 'Nachricht senden';
}
});
}
const _origInit = init;
function refresh() {}
return { init, refresh };
return {
init(container) {
_origInit(container);
_initContactForm(container);
},
refresh
};
})();

2
backend/static/sw.js
View file

@ -3,7 +3,7 @@
Offline-Cache + Push Notifications + Tile-Cache
============================================================ */
const CACHE_VERSION = 'by-v985';
const CACHE_VERSION = 'by-v986';
const CACHE_STATIC = `${CACHE_VERSION}-static`;
const CACHE_TILES = 'ban-yaro-tiles-v1'; // bleibt über SW-Updates erhalten
const CACHE_API = 'ban-yaro-api-v1'; // API-Response-Cache