änderung der übergabe der vertragsnummer

routes/register.js

@@ -1,62 +1,76 @@
-const express = require('express');
+const express = require("express");
-const Database = require('better-sqlite3');
+const Database = require("better-sqlite3");
-const validateSepa = require('../utils/sepaValidator');
+const validateSepa = require("../utils/sepaValidator");
-const { encrypt } = require('../utils/crypto');
+const { encrypt } = require("../utils/crypto");
-const generateVertragsnummer = require('../utils/vertragsnummer');
+const generateVertragsnummer = require("../utils/vertragsnummer");
-const createContractPdf = require('../utils/contractPdf');
+const createContractPdf = require("../utils/contractPdf");
-const sendContractMail = require('../utils/sendContractMail');
+const sendContractMail = require("../utils/sendContractMail");
-const sendAdminMail = require('../utils/sendAdminMail');
+const sendAdminMail = require("../utils/sendAdminMail");
 
 const router = express.Router();
-const db = new Database('plusfit.db');
+const db = new Database("plusfit.db");
 
 /* =========================
    Helper
    ========================= */
 function loadActiveContracts() {
-    return db.prepare(`
+  return db
+    .prepare(
+      `
         SELECT *
         FROM vertragsarten
         WHERE aktiv = 1
         ORDER BY betrag ASC
-    `).all();
+    `,
+    )
+    .all();
 }
 
 /* =========================
    GET /register
    ========================= */
-router.get('/', (req, res) => {
+router.get("/", (req, res) => {
   const vertragId = req.query.vertrag || null;
 
-    return res.render('register', {
+  const vertraege = loadActiveContracts();
-        vertragsarten: loadActiveContracts(),
+
-        selectedVertrag: vertragId,
+  // Prüfen ob Vertrag existiert
-        formData: {}
+  const selected = vertraege.find((v) => v.id == vertragId);
+
+  return res.render("register", {
+    vertragsarten: vertraege,
+    selectedVertrag: selected ? selected.id : null,
+    selectedVertragData: selected || null,
+    formData: {},
   });
 });
 
 /* =========================
    POST /register/create
    ========================= */
-router.post('/create', async (req, res) => {
+router.post("/create", async (req, res) => {
   const u = req.body;
   const vertragsarten = loadActiveContracts();
 
   /* =========================
        Vertragsdaten laden
        ========================= */
-    const contractData = db.prepare(`
+  const contractData = db
+    .prepare(
+      `
         SELECT name, laufzeit, betrag
         FROM vertragsarten
         WHERE id = ? AND aktiv = 1
-    `).get(u.vertragsvariante);
+    `,
+    )
+    .get(u.vertragsvariante);
 
   if (!contractData) {
-        return res.render('register', {
+    return res.render("register", {
       vertragsarten,
       selectedVertrag: u.vertragsvariante,
-            error: 'Vertragsdaten konnten nicht geladen werden.',
+      error: "Vertragsdaten konnten nicht geladen werden.",
-            formData: u
+      formData: u,
     });
   }
 
@@ -64,11 +78,11 @@ router.post('/create', async (req, res) => {
        Pflicht-Zustimmungen
        ========================= */
   if (!u.agreeConsent || !u.agreeAgb || !u.agreeSepa) {
-        return res.render('register', {
+    return res.render("register", {
       vertragsarten,
       selectedVertrag: u.vertragsvariante,
-            error: 'Bitte bestätige alle rechtlichen Hinweise, um fortzufahren.',
+      error: "Bitte bestätige alle rechtlichen Hinweise, um fortzufahren.",
-            formData: u
+      formData: u,
     });
   }
 
@@ -78,32 +92,36 @@ router.post('/create', async (req, res) => {
   const sepaError = validateSepa({
     ibanValue: u.iban,
     bic: u.bic,
-        mandatsreferenz: u.mandatsreferenz
+    mandatsreferenz: u.mandatsreferenz,
   });
 
   if (sepaError) {
-        return res.render('register', {
+    return res.render("register", {
       vertragsarten,
       selectedVertrag: u.vertragsvariante,
       error: sepaError,
-            formData: u
+      formData: u,
     });
   }
 
   /* =========================
        Logische Prüfungen
        ========================= */
-    const mandatsExists = db.prepare(`
+  const mandatsExists = db
+    .prepare(
+      `
         SELECT id FROM users
         WHERE mandatsreferenz = ?
-    `).get(u.mandatsreferenz);
+    `,
+    )
+    .get(u.mandatsreferenz);
 
   if (mandatsExists) {
-        return res.render('register', {
+    return res.render("register", {
       vertragsarten,
       selectedVertrag: u.vertragsvariante,
-            error: 'Diese Mandatsreferenz ist bereits vergeben.',
+      error: "Diese Mandatsreferenz ist bereits vergeben.",
-            formData: u
+      formData: u,
     });
   }
 
@@ -114,12 +132,14 @@ router.post('/create', async (req, res) => {
 
   const zustimmungsDatum = new Date().toISOString();
   const zustimmungsIp = (
-        req.headers['x-forwarded-for'] ||
+    req.headers["x-forwarded-for"] ||
     req.socket?.remoteAddress ||
-        ''
+    ""
-    ).split(',')[0].trim();
+  )
+    .split(",")[0]
+    .trim();
 
-    const vertragsversion = 'v1.0';
+  const vertragsversion = "v1.0";
 
   const widerrufBis = new Date();
   widerrufBis.setDate(widerrufBis.getDate() + 14);
@@ -133,7 +153,8 @@ router.post('/create', async (req, res) => {
   /* =========================
        SPEICHERN
        ========================= */
-    db.prepare(`
+  db.prepare(
+    `
         INSERT INTO users (
             vertragsnummer,
             vertragsvariante,
@@ -165,13 +186,21 @@ router.post('/create', async (req, res) => {
             ?,?,
             0
         )
-    `).run(
+    `,
+  ).run(
     vertragsnummer,
     u.vertragsvariante,
 
-        u.vorname, u.nachname,
+    u.vorname,
-        u.strasse, u.hausnummer, u.plz, u.ort, u.land,
+    u.nachname,
-        u.mobil, u.telefon, u.email,
+    u.strasse,
+    u.hausnummer,
+    u.plz,
+    u.ort,
+    u.land,
+    u.mobil,
+    u.telefon,
+    u.email,
 
     u.kontoinhaber,
     ibanEncrypted,
@@ -186,7 +215,7 @@ router.post('/create', async (req, res) => {
     vertragsversion,
 
     widerrufBis.toISOString(),
-        'aktiv'
+    "aktiv",
   );
 
   /* =========================
@@ -200,8 +229,8 @@ router.post('/create', async (req, res) => {
     laufzeit: contractData.laufzeit,
     betrag: contractData.betrag,
     datum: zustimmungsDatum,
-    ip: zustimmungsIp
+    ip: zustimmungsIp,
-});
+  });
 
   /* =========================
        Vertragsmail
@@ -213,10 +242,10 @@ router.post('/create', async (req, res) => {
     vertragName: contractData.name,
     betrag: contractData.betrag,
     datum: zustimmungsDatum,
-    pdfPath
+    pdfPath,
-});
+  });
 
-await sendAdminMail({
+  await sendAdminMail({
     vertragsnummer,
     vorname: u.vorname,
     nachname: u.nachname,
@@ -224,13 +253,13 @@ await sendAdminMail({
     vertragName: contractData.name,
     betrag: contractData.betrag,
     datum: zustimmungsDatum,
-    ip: zustimmungsIp
+    ip: zustimmungsIp,
-});
+  });
 
   /* =========================
        ERFOLG
        ========================= */
-    return res.render('registerSuccess', { vertragsnummer });
+  return res.render("registerSuccess", { vertragsnummer });
 });
 
 module.exports = router;

views/register.ejs

@@ -1,61 +1,64 @@
 <%- include('partials/header') %>
 
 <style>
-.step { display: none; }
+.step{display:none}
-.step.active { display: block; }
+.step.active{display:block}
 
-.container-form {
+.container-form{max-width:700px;margin:auto}
-    max-width: 700px;
+
-    margin: auto;
+.progress{height:10px;margin-bottom:30px}
+
+.step-nav{
+display:flex;
+justify-content:space-between;
+font-size:14px;
+margin-bottom:20px
 }
 
-.progress {
+.step-nav span.active{
-    height: 10px;
+font-weight:bold;
-    margin-bottom: 30px;
+color:#3b3be3
-}
-
-.step-nav {
-    display: flex;
-    justify-content: space-between;
-    font-size: 14px;
-    margin-bottom: 20px;
-}
-
-.step-nav span.active {
-    font-weight: bold;
-    color: #3b3be3;
 }
 
 @media(max-width:768px){
-    h4{font-size:18px;}
+h4{font-size:18px}
-    button{width:100%;}
+button{width:100%}
 }
 </style>
 
+
 <div class="container-form">
 
-<% if (typeof error !== 'undefined') { %>
+<% if(error){ %>
 <div class="alert alert-danger">
-    ⚠️ <%= error %>
+⚠️ <%= error %>
 </div>
 <% } %>
 
 <h3 class="text-center mb-4">Mitglied werden</h3>
 
+
+<!-- Progress -->
 <div class="progress">
-    <div id="progressBar"
+<div id="progressBar"
-         class="progress-bar bg-primary"
+class="progress-bar bg-primary"
-         style="width:33%">
+style="width:33%">
-    </div>
+</div>
 </div>
 
+
+<!-- Nav -->
 <div class="step-nav text-center mb-3">
-    <span id="nav1">Daten</span>
+<span id="nav1">Daten</span>
-    <span id="nav2">Bank</span>
+<span id="nav2">Bank</span>
-    <span id="nav3">Prüfen</span>
+<span id="nav3">Prüfen</span>
 </div>
 
-<form method="POST" action="/register/create" id="registerForm">
+
+<form method="POST"
+action="/register/create"
+id="registerForm">
+
 
 <!-- ================= STEP 1 ================= -->
 <div class="step" id="step1">
@@ -66,14 +69,16 @@
 <input name="nachname" class="form-control mb-2" placeholder="Nachname" required>
 
 <input type="date"
-       name="geburtsdatum"
+name="geburtsdatum"
-       id="geburtsdatum"
+id="geburtsdatum"
-       class="form-control mb-2"
+class="form-control mb-2"
-       required>
+required>
 
 <input name="mobil" class="form-control mb-2" placeholder="Mobilnummer" required>
+
 <input type="email" name="email" class="form-control mb-2" placeholder="E-Mail" required>
 
+
 <h5 class="mt-3">Adresse</h5>
 
 <input name="strasse" class="form-control mb-2" placeholder="Straße" required>
@@ -82,12 +87,17 @@
 <input name="ort" class="form-control mb-2" placeholder="Ort" required>
 <input name="land" class="form-control mb-2" value="Deutschland">
 
-<button type="button" class="btn btn-primary mt-3" onclick="nextStep(2)">
+
+<button type="button"
+class="btn btn-primary mt-3"
+onclick="nextStep(2)">
 Weiter →
 </button>
 
 </div>
 
+
+
 <!-- ================= STEP 2 ================= -->
 <div class="step" id="step2">
 
@@ -98,29 +108,40 @@ Weiter →
 <input name="iban" class="form-control mb-2" placeholder="IBAN" required>
 <input name="bic" class="form-control mb-2" placeholder="BIC" required>
 
+
 <div class="form-check mt-2">
-    <input class="form-check-input"
+<input class="form-check-input"
-           type="checkbox"
+type="checkbox"
-           name="agreeSepa"
+name="agreeSepa"
-           value="on"
+value="on"
-           required>
+required>
-    <label class="form-check-label">
+
-        SEPA-Mandat erteilen
+<label class="form-check-label">
-    </label>
+SEPA-Mandat erteilen
+</label>
 </div>
 
+
 <div class="d-flex justify-content-between mt-4">
-<button type="button" class="btn btn-secondary" onclick="nextStep(1)">
+
+<button type="button"
+class="btn btn-secondary"
+onclick="nextStep(1)">
 ← Zurück
 </button>
 
-<button type="button" class="btn btn-primary" onclick="nextStep(3)">
+<button type="button"
+class="btn btn-primary"
+onclick="nextStep(3)">
 Weiter →
 </button>
+
 </div>
 
 </div>
 
+
+
 <!-- ================= STEP 3 ================= -->
 <div class="step" id="step3">
 
@@ -130,198 +151,290 @@ Weiter →
 <div id="summaryBox"></div>
 </div>
 
+
+<!-- Vertrag hidden -->
+<input type="hidden"
+name="vertragsvariante"
+id="vertragHidden"
+value="<%= selectedVertrag || '' %>">
+
+
 <h5>Vertrag</h5>
 
-<select name="vertragsvariante" class="form-select mb-3" required>
+<div class="alert alert-info">
-<option value="">Bitte wählen</option>
+
-<% vertragsarten.forEach(v => { %>
+<b>
-<option value="<%= v.id %>">
+<% if(selectedVertragData){ %>
-<%= v.name %> – <%= v.betrag.toFixed(2) %> €
+<%= selectedVertragData.name %> –
-</option>
+<%= selectedVertragData.betrag.toFixed(2) %> € / Monat
-<% }) %>
+<% }else{ %>
-</select>
+Kein Vertrag gewählt
+<% } %>
+</b>
+
+</div>
+
+
 
 <h5>Rechtliches</h5>
 
+
+<!-- Eltern -->
 <div class="form-check mb-2 d-none" id="consentBox">
+
 <input class="form-check-input"
-       type="checkbox"
+type="checkbox"
-       name="agreeConsent"
+name="agreeConsent"
-       id="agreeConsent"
+id="agreeConsent"
-       value="on">
+value="on">
+
 <label class="form-check-label">
 Einverständnis der Erziehungsberechtigten
 </label>
+
 </div>
 
+
+<!-- AGB -->
 <div class="form-check mb-3">
+
 <input class="form-check-input"
-       type="checkbox"
+type="checkbox"
-       name="agreeAgb"
+name="agreeAgb"
-       value="on"
+value="on"
-       required>
+required>
+
 <label class="form-check-label">
-<a href="https://plusfit24.de/wp-content/uploads/2022/11/AG_PlusFit24.pdf" target="_blank" rel="noopener noreferrer">
+<a href="https://plusfit24.de/wp-content/uploads/2022/11/AG_PlusFit24.pdf"
-    AGB gelesen
+target="_blank">
+AGB gelesen
 </a>
 </label>
+
 </div>
 
+
 <div class="d-flex justify-content-between mt-4">
-<button type="button" class="btn btn-secondary" onclick="nextStep(2)">
+
+<button type="button"
+class="btn btn-secondary"
+onclick="nextStep(2)">
 ← Zurück
 </button>
 
-<button type="submit" class="btn btn-success btn-lg">
+<button type="submit"
+class="btn btn-success btn-lg">
 Abschließen
 </button>
+
 </div>
 
 </div>
 
+
 </form>
 </div>
 
+
+
 <script>
 
-window.fromServerError = <%= typeof errorStep !== 'undefined' ? 'true' : 'false' %>;
+window.fromServerError =
-let currentStep = <%= typeof errorStep !== 'undefined' ? errorStep : 1 %>;
+<%= typeof errorStep !== 'undefined' ? 'true' : 'false' %>;
+
+let currentStep =
+<%= typeof errorStep !== 'undefined' ? errorStep : 1 %>;
 
 const form = document.getElementById('registerForm');
 
+
 function nextStep(step){
 
-    if(step > currentStep && !window.fromServerError){
+if(step > currentStep && !window.fromServerError){
-        if(!validateStep(currentStep)) return;
+if(!validateStep(currentStep)) return;
-    }
-
-    saveForm();
-
-    currentStep = step;
-
-    document.querySelectorAll('.step')
-        .forEach(s => s.classList.remove('active'));
-
-    document.getElementById('step'+step)
-        .classList.add('active');
-
-    updateNav();
-    updateProgress();
-
-    if(step === 3){
-        buildSummary();
-        checkAgeAndConsent();
-    }
 }
 
+saveForm();
+
+currentStep = step;
+
+document.querySelectorAll('.step')
+.forEach(s=>s.classList.remove('active'));
+
+document.getElementById('step'+step)
+.classList.add('active');
+
+updateNav();
+updateProgress();
+
+if(step===3){
+buildSummary();
+checkAgeAndConsent();
+}
+}
+
+
 function validateStep(step){
-    const container = document.getElementById('step'+step);
-    const fields = container.querySelectorAll('input,select');
 
-    for(let field of fields){
+const container =
-        if(!field.checkValidity()){
+document.getElementById('step'+step);
-            field.reportValidity();
+
-            return false;
+const fields =
-        }
+container.querySelectorAll('input,select');
-    }
+
-    return true;
+for(let field of fields){
+
+if(!field.checkValidity()){
+field.reportValidity();
+return false;
 }
+}
+
+return true;
+}
+
 
 function updateProgress(){
-    document.getElementById('progressBar')
+document.getElementById('progressBar')
-    .style.width = (currentStep * 33) + '%';
+.style.width = (currentStep*33)+'%';
 }
 
+
 function updateNav(){
-    document.querySelectorAll('.step-nav span')
-        .forEach(n => n.classList.remove('active'));
 
-    document.getElementById('nav'+currentStep)
+document.querySelectorAll('.step-nav span')
-        .classList.add('active');
+.forEach(n=>n.classList.remove('active'));
+
+document.getElementById('nav'+currentStep)
+.classList.add('active');
 }
 
+
 function isUnder18(){
-    const bday = document.getElementById('geburtsdatum').value;
-    if(!bday) return false;
 
-    const birth = new Date(bday);
+const bday =
-    const today = new Date();
+document.getElementById('geburtsdatum').value;
 
-    let age = today.getFullYear() - birth.getFullYear();
+if(!bday) return false;
-    if(today.getMonth() < birth.getMonth() ||
+
-       (today.getMonth() === birth.getMonth() &&
+const birth = new Date(bday);
-        today.getDate() < birth.getDate())){
+const today = new Date();
-        age--;
+
-    }
+let age = today.getFullYear()-birth.getFullYear();
-    return age < 18;
+
+if(today.getMonth()<birth.getMonth() ||
+(today.getMonth()===birth.getMonth() &&
+today.getDate()<birth.getDate())){
+age--;
 }
 
+return age<18;
+}
+
+
 function checkAgeAndConsent(){
-    const box = document.getElementById('consentBox');
-    const checkbox = document.getElementById('agreeConsent');
 
-    if(isUnder18()){
+const box =
-        box.classList.remove('d-none');
+document.getElementById('consentBox');
-        checkbox.required = true;
+
-    }else{
+const checkbox =
-        box.classList.add('d-none');
+document.getElementById('agreeConsent');
-        checkbox.required = false;
+
-        checkbox.checked = true;
+if(isUnder18()){
-    }
+
+box.classList.remove('d-none');
+checkbox.required=true;
+
+}else{
+
+box.classList.add('d-none');
+checkbox.required=false;
+checkbox.checked=true;
+}
 }
 
-form.addEventListener('input', saveForm);
+
+form.addEventListener('input',saveForm);
+
 
 function saveForm(){
-    const data = {};
+
-    Array.from(form.elements).forEach(el=>{
+const data={};
-        if(!el.name) return;
+
-        if(el.type === 'checkbox'){
+Array.from(form.elements).forEach(el=>{
-            data[el.name] = el.checked ? 'on' : '';
+
-        }else{
+if(!el.name) return;
-            data[el.name] = el.value;
+
-        }
+if(el.type==='checkbox'){
-    });
+data[el.name]=el.checked?'on':'';
-    localStorage.setItem('registerData', JSON.stringify(data));
+}else{
+data[el.name]=el.value;
 }
-
-function loadForm(){
-    const data = JSON.parse(localStorage.getItem('registerData'));
-    if(!data) return;
-
-    Object.keys(data).forEach(key=>{
-        const field = form.elements[key];
-        if(!field) return;
-
-        if(field.type === 'checkbox'){
-            field.checked = data[key] === 'on';
-        }else{
-            field.value = data[key];
-        }
-    });
-}
-
-function buildSummary(){
-    const data = JSON.parse(localStorage.getItem('registerData'));
-    if(!data) return;
-
-    document.getElementById('summaryBox').innerHTML = `
-    <b>Name:</b> ${data.vorname} ${data.nachname}<br>
-    <b>Geburtsdatum:</b> ${data.geburtsdatum}<br>
-    <b>Email:</b> ${data.email}<br>
-    <b>Mobil:</b> ${data.mobil}<br>
-    <b>Adresse:</b> ${data.strasse} ${data.hausnummer}, ${data.plz} ${data.ort}<br>
-    <b>IBAN:</b> ${data.iban}
-    `;
-}
-
-form.addEventListener('submit',()=>{
-    localStorage.removeItem('registerData');
 });
 
+localStorage.setItem(
+'registerData',
+JSON.stringify(data)
+);
+}
+
+
+function loadForm(){
+
+const data =
+JSON.parse(localStorage.getItem('registerData'));
+
+if(!data) return;
+
+Object.keys(data).forEach(key=>{
+
+const field=form.elements[key];
+if(!field) return;
+
+if(field.type==='checkbox'){
+field.checked=data[key]==='on';
+}else{
+field.value=data[key];
+}
+});
+}
+
+
+function buildSummary(){
+
+const data =
+JSON.parse(localStorage.getItem('registerData'));
+
+if(!data) return;
+
+document.getElementById('summaryBox')
+.innerHTML=`
+
+<b>Name:</b> ${data.vorname} ${data.nachname}<br>
+<b>Geburtsdatum:</b> ${data.geburtsdatum}<br>
+<b>Email:</b> ${data.email}<br>
+<b>Mobil:</b> ${data.mobil}<br>
+<b>Adresse:</b>
+${data.strasse} ${data.hausnummer},
+${data.plz} ${data.ort}<br>
+<b>IBAN:</b> ${data.iban}
+
+`;
+}
+
+
+form.addEventListener('submit',()=>{
+localStorage.removeItem('registerData');
+});
+
+
 loadForm();
-setTimeout(()=>{ nextStep(currentStep); },100);
+
+setTimeout(()=>{
+nextStep(currentStep);
+},100);
 
 </script>
 
+
 <%- include('partials/footer') %>