Refactor membership PDF generation logic to improve maintainability and validation; remove deprecated form filling methods and enhance email notification process. Update membership page styles for better layout and user experience.

This commit is contained in:
Torsten Schulz (local)
2025-10-23 15:04:45 +02:00
parent 28a2d05ab5
commit 95ea3a26bc
11 changed files with 862 additions and 800 deletions

View File

@@ -1,20 +1,16 @@
<template>
<div class="min-h-full py-16 bg-gray-50">
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
<h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-6">
<h1 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-2">
Mitgliedschaft
</h1>
<div class="w-24 h-1 bg-primary-600 mb-8"></div>
<div class="w-24 h-1 bg-primary-600 mb-4"></div>
<!-- Mitgliedschaftspläne (ohne "Noch Fragen" Box) -->
<div class="mb-12">
<section id="membership" class="py-16 sm:py-20 bg-gradient-to-b from-gray-50 to-white">
<div class="mb-4">
<section id="membership" class="py-8 sm:py-12 bg-gradient-to-b from-gray-50 to-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-16">
<h2 class="text-4xl sm:text-5xl font-display font-bold text-gray-900 mb-4">
Mitgliedschaft
</h2>
<div class="w-24 h-1 bg-primary-600 mx-auto mb-6"></div>
<div class="text-center mb-8">
<p class="text-xl text-gray-600 max-w-3xl mx-auto">
Werden Sie Teil unserer Tischtennis-Familie - Wählen Sie die passende Mitgliedschaft für sich
</p>
@@ -25,7 +21,7 @@
</div>
<!-- Satzung Download -->
<div class="mt-16 bg-white rounded-2xl shadow-xl p-8 border border-gray-100">
<div class="mt-4 bg-white rounded-2xl shadow-xl p-8 border border-gray-100">
<div class="text-center mb-8">
<h3 class="text-3xl font-display font-bold text-gray-900 mb-4">
Vereinsatzung
@@ -388,19 +384,8 @@
</ul>
</div>
<!-- Submit Buttons -->
<div class="flex flex-col sm:flex-row gap-4 justify-center pt-6">
<button
type="button"
id="fillDummyData"
class="px-6 py-3 bg-gray-600 hover:bg-gray-700 text-white font-semibold rounded-lg transition-colors flex items-center justify-center"
>
<svg class="mr-2 h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
</svg>
Mit Testdaten füllen
</button>
<!-- Submit Button -->
<div class="flex justify-center pt-6">
<button
type="submit"
id="submitBtn"
@@ -439,29 +424,8 @@
// Einfaches JavaScript ohne Vue.js-Reaktivität
onMounted(() => {
const form = document.getElementById('membershipForm')
const fillDummyBtn = document.getElementById('fillDummyData')
const submitBtn = document.getElementById('submitBtn')
// Testdaten füllen
fillDummyBtn.addEventListener('click', () => {
document.getElementById('nachname').value = 'Mustermann'
document.getElementById('vorname').value = 'Max'
document.getElementById('strasse').value = 'Musterstraße 123'
document.getElementById('plz').value = '60437'
document.getElementById('ort').value = 'Frankfurt am Main'
document.getElementById('geburtsdatum').value = '1990-05-15'
document.getElementById('telefon_privat').value = '069 12345678'
document.getElementById('email').value = 'max.mustermann@example.com'
document.getElementById('telefon_mobil').value = '0171 1234567'
document.getElementById('kontoinhaber').value = 'Max Mustermann'
document.getElementById('iban').value = 'DE89 3704 0044 0532 0130 00'
document.getElementById('bic').value = 'COBADEFFXXX'
document.getElementById('bank').value = 'Commerzbank AG'
document.querySelector('input[name="lastschrift_erlaubt"]').checked = true
document.querySelector('input[name="datenschutz_einverstanden"]').checked = true
document.querySelector('input[name="satzung_anerkannt"]').checked = true
})
// Formular absenden
form.addEventListener('submit', async (e) => {
e.preventDefault()