3.9 KiB
Übergabe an die KI der Beraterprofilseite
Binde das vorhandene Kontakt-Popup in die Kontaktbuttons der Beraterprofile
ein. Übergib ausschließlich die Berater-ID als advisorId. Implementiere
kein eigenes Kontaktformular und keine separate E-Mail-Prüfung.
Relevante Dateien
src/shared/berater-daten.json: gemeinsame Datenquelle für Profile und Kontakt; Array mit eindeutigen String-IDs,vorname,nachname, optionalemspitznameundemail. Eigene öffentliche Profilfelder dürfen ergänzt werden.src/shared/berater.js:findAdvisor(advisorId)liefert den passenden Eintrag.src/features/contact/contact-dialog.js: exportiertopenContactDialog({ advisorId }).src/features/contact/contact.css: wird automatisch vom Popup-Modul importiert; die Schriftdateien liegen unterpublic/fonts/.src/features/contact/contact-entry.jsundcontact-test.html: Beispielintegration.src/server/services/contact-service.js: prüft Kunden-E-Mail und Berater-ID, lädt die Empfängeradresse serverseitig aus der JSON.src/server/swagger.json: API-Vertrag fürPOST /api/contact.
Datenvertrag
[
{
"id": "relindis-agethen",
"vorname": "Relindis",
"nachname": "Agethen",
"spitzname": "Lilli",
"email": "relindis.agethen@tri-hub.de"
}
]
Die Profilseite und das Popup müssen dieselben IDs verwenden. E-Mail-Adressen
werden explizit gepflegt und nicht aus Namen erzeugt. Sie müssen auf @tri-hub.de
enden. Keine vertraulichen Informationen in die JSON schreiben: Sie ist Teil
des Frontends. Nach Änderungen API neu starten und Frontend neu bauen.
Einzubindender Code
Beispielbutton (ID aus dem jeweiligen Profil):
<button type="button" data-berater-id="relindis-agethen">
Berater kontaktieren
</button>
Im JavaScript-Modul der Profilseite, einmalig registrieren:
// Importpfad relativ zu dieser Datei anpassen.
import { openContactDialog } from "./src/features/contact/contact-dialog.js";
document.addEventListener("click", (event) => {
const button = event.target.closest("button[data-berater-id]");
if (!button) return;
openContactDialog({ advisorId: button.dataset.beraterId });
});
Bei dynamischer Erzeugung des Buttons die ID aus dem Profil setzen:
button.dataset.beraterId = profile.id;
Alternativ direkt am einzelnen Button binden (nicht zusätzlich zur Delegation):
button.addEventListener("click", () => {
openContactDialog({ advisorId: profile.id });
});
Falls die Profilseite selbst Daten aus der gemeinsamen Datei benötigt:
// Beispiel für ein Modul direkt unter src/; Pfad ggf. anpassen.
import berater from "./shared/berater-daten.json" with { type: "json" };
const profile = berater.find((entry) => entry.id === advisorId);
// profile.vorname, profile.nachname, profile.spitzname und profile.email sind verfügbar.
Das Popup zeigt den getrimmten spitzname, falls nicht leer, sonst den
getrimmten vorname. nachname und das bisherige Feld name werden für die
Überschrift nicht verwendet. Es wird kein „kontaktieren“ angehängt.
Das Popup ermittelt den Anzeigenamen selbst und sendet beim Absenden
{ email, advisorId, reason, simulationAccepted } an /api/contact. Die
Profilseite muss weder Name noch E-Mail an das Popup schicken. Kundenprüfung,
Simulation, Mailpit-Versand und Microsoft-Bookings-Weiterleitung sind bereits
implementiert. Unbekannte IDs sperren das Absenden.
Testen
Mit laufendem Frontend, API und Mailpit:
http://localhost:5173/contact-test.html?berater-id=relindis-agethen.
Für die Kundenadresse eine vorhandene Testbuchung verwenden. Die Prüfung
findet ausschließlich beim Absenden statt. Der Branch ist
feature/terminbuchung-kontaktfeld; die Kontaktdateien müssen im Arbeitsstand
der Profilseite vorhanden sein.