ClaudeandClaude Opus 5.5
4ab154bfa2
- Bestellseite: Pflichtangaben direkt ueber dem Button, Zahlungsarten, Wahl des Leistungsbeginns (sofort / nach Widerrufsfrist via 15 Tage Stripe-Probezeit), keine Vorauswahl - Zustimmungsnachweis: Zeitpunkt, Version, Wahl, IP, Browser in Stripe- Metadaten und Appwrite (neue Attribute, Setup-Skript ergaenzt) - Checkout: Karte + SEPA (Fallback nur Karte), korrigierter Hinweistext - Vertragsbestaetigung mit PDF der Vertragsunterlagen statt HTML - Kuendigen/Widerrufen: Formular direkt (keine Zwischenseite), Wunsch- termin, Druck/PDF der Bestaetigung, Vorbefuellung bei Login - Widerrufsbutton im Abo waehrend der Frist, 'beginnt am'-Status - Pilotbetrieb per ABO_PILOT_EMAILS - Vertragsbedingungen v2, Datenschutzerklaerung, Kalkulator ohne MwSt und mit 100/80 EUR Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
78 lines
3.6 KiB
JavaScript
78 lines
3.6 KiB
JavaScript
// Oeffentliche Erklaerungsseiten: Kuendigung (§ 312k BGB) und Widerruf (§ 356a BGB).
|
|
// Ohne Login erreichbar, Formular sofort sichtbar (keine Zwischenschritte).
|
|
// Nach dem Absenden: Bestaetigung mit Datum/Uhrzeit, speicher- und druckbar.
|
|
function initLegalForm({ endpoint, fields }) {
|
|
const form = document.getElementById('decl-form')
|
|
const done = document.getElementById('done')
|
|
const errEl = document.getElementById('form-error')
|
|
const esc = (s) => String(s || '').replace(/[&<>"]/g, (c) => ({ '&': '&', '<': '<', '>': '>', '"': '"' })[c])
|
|
|
|
// Angemeldete Kunden nicht erneut identifizieren lassen: Felder vorbefuellen
|
|
fetch('/api/auth/me', { credentials: 'same-origin' })
|
|
.then((r) => (r.ok ? r.json() : null))
|
|
.then((me) => {
|
|
const c = me?.customer
|
|
if (!c) return
|
|
if (form.elements.name && !form.elements.name.value) form.elements.name.value = c.name || ''
|
|
if (form.elements.email && !form.elements.email.value) form.elements.email.value = c.email || ''
|
|
if (form.elements.customerNumber && !form.elements.customerNumber.value) form.elements.customerNumber.value = c.code || ''
|
|
})
|
|
.catch(() => {})
|
|
|
|
const reasonWrap = document.getElementById('reason-wrap')
|
|
form.querySelectorAll('[name="kind"]').forEach((r) =>
|
|
r.addEventListener('change', () => reasonWrap?.classList.toggle('hidden', form.kind.value !== 'ausserordentlich'))
|
|
)
|
|
const dateInput = document.getElementById('effective-date')
|
|
form.querySelectorAll('[name="when"]').forEach((r) =>
|
|
r.addEventListener('change', () => {
|
|
const onDate = form.when.value === 'datum'
|
|
dateInput?.classList.toggle('hidden', !onDate)
|
|
if (onDate) dateInput?.focus()
|
|
})
|
|
)
|
|
|
|
form.addEventListener('submit', async (ev) => {
|
|
ev.preventDefault()
|
|
errEl.classList.add('hidden')
|
|
const payload = {}
|
|
for (const f of fields) payload[f] = String(form.elements[f]?.value ?? '').trim()
|
|
if (form.when?.value === 'datum') payload.effective = dateInput?.value || ''
|
|
const btn = form.querySelector('button[type="submit"]')
|
|
btn.disabled = true
|
|
try {
|
|
const res = await fetch(endpoint, {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(payload),
|
|
})
|
|
const data = await res.json().catch(() => ({}))
|
|
if (!res.ok) throw new Error(data.error || `Fehler ${res.status}`)
|
|
const at = new Date(data.receivedAt).toLocaleString('de-DE', { dateStyle: 'full', timeStyle: 'medium' })
|
|
document.getElementById('done-at').textContent = at
|
|
const rows = [['Vertrag', 'WEBklar Wartungs-Abo']]
|
|
for (const f of fields) {
|
|
if (!payload[f] || f === 'effective') continue
|
|
const label = form.querySelector(`[data-label-for="${f}"]`)?.dataset.label || f
|
|
const value = form.querySelector(`[name="${f}"]:checked`)?.dataset.text || payload[f]
|
|
rows.push([label, value])
|
|
}
|
|
if (form.when) {
|
|
rows.push(['Zeitpunkt', payload.effective
|
|
? `zum ${new Date(payload.effective + 'T12:00:00').toLocaleDateString('de-DE')} (Ende des dann laufenden Abrechnungsmonats)`
|
|
: 'zum nächstmöglichen Zeitpunkt'])
|
|
}
|
|
document.getElementById('done-list').innerHTML = rows.map(([k, v]) => `<dt>${esc(k)}</dt><dd>${esc(v)}</dd>`).join('')
|
|
form.classList.add('hidden')
|
|
done.classList.remove('hidden')
|
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
} catch (err) {
|
|
errEl.textContent = err.message
|
|
errEl.classList.remove('hidden')
|
|
btn.disabled = false
|
|
}
|
|
})
|
|
|
|
document.getElementById('print-btn')?.addEventListener('click', () => window.print())
|
|
}
|