From 7021c3ceb85b910f407b2d571c1305f0cc9063e1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Sun, 6 Sep 2026 08:25:16 +0200
Subject: [PATCH] OTC-Zahlungsarten automatisch fortsetzen

---
 modules/shared/auth/ui/home.php | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/modules/shared/auth/ui/home.php b/modules/shared/auth/ui/home.php
index fe8a06f..de08341 100644
--- a/modules/shared/auth/ui/home.php
+++ b/modules/shared/auth/ui/home.php
@@ -411,7 +411,9 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
     echo '<input class="sg-interaction-element sg-input-single-line" type="number" id="otc-payment-amount-1" min="0.01" step="0.01" value="0.00" data-otc-payment-amount>';
     echo '</div>';
     echo '</div>';
-    echo '<button class="sg-interaction-element sg-button sg-button--active" type="button" data-otc-payment-add>+ Bezahlart hinzufügen</button>';
+    echo '<div class="sg-form-sections-card__actions-segment">';
+    echo '<button class="sg-interaction-element sg-button sg-button--active" type="button" data-otc-payment-add>Bezahlart hinzufügen</button>';
+    echo '</div>';
     echo '</section>';
     echo '<section class="sg-form-sections-card__chapter" aria-labelledby="otc-billing-title">';
     echo '<h2 id="otc-billing-title" class="sg-strong sg-form-sections-card__chapter-title">Rechnungsadresse</h2>';
@@ -1004,6 +1006,8 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
     echo "  const orderDateDefaultValue = orderDateInput ? orderDateInput.value : '';";
     echo "  const paymentRows = form.querySelector('[data-otc-payment-rows]');";
     echo "  const addPaymentButton = form.querySelector('[data-otc-payment-add]');";
+    echo "  const paymentOptionValues = ['twint', 'card', 'cash', 'paypal', 'bank_transfer'];";
+    echo "  const paymentOptionLabels = { twint: 'Twint', card: 'Kreditkarte', cash: 'Barzahlung', paypal: 'PayPal', bank_transfer: 'Überweisung' };";
     echo "  const firstNameInput = form.querySelector('[data-otc-order-first-name]');";
     echo "  const lastNameInput = form.querySelector('[data-otc-order-last-name]');";
     echo "  const streetInput = form.querySelector('[data-otc-order-street]');";
@@ -1057,6 +1061,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
     echo "  };";
     echo "  const getInputValue = (input) => parseInt(input.value || '0', 10) || 0;";
     echo "  const getFieldValue = (input) => (input ? input.value.trim() : '');";
+    echo "  const updatePaymentAddButton = () => { addPaymentButton.disabled = paymentRows.querySelectorAll('[data-otc-payment-row]').length >= paymentOptionValues.length; };";
     echo "  const updateFormState = () => {";
     echo "    const totalQty = productInputs.reduce((sum, input) => sum + getInputValue(input), 0);";
     echo "    const totalPrice = parseFloat(totalPriceInput.value || '0') || 0;";
@@ -1094,6 +1099,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
     echo "  const resetForm = (preserveSuccess = false) => {";
     echo "    form.reset();";
     echo "    Array.from(paymentRows.querySelectorAll('[data-otc-payment-row]')).slice(1).forEach((row) => row.remove());";
+    echo "    updatePaymentAddButton();";
     echo "    clearError();";
     echo "    if (!preserveSuccess) { clearSuccess(); }";
     echo "    if (!preserveSuccess) { updateFormState(); }";
@@ -1138,19 +1144,24 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
     echo "  const bindPaymentRow = (row) => {";
     echo "    row.querySelectorAll('select, input').forEach((input) => { input.addEventListener('input', updateFormState); input.addEventListener('change', updateFormState); });";
     echo "  };";
-    echo "  const paymentOptions = '<option value=\"twint\">Twint</option><option value=\"card\">Kreditkarte</option><option value=\"cash\">Barzahlung</option><option value=\"paypal\">PayPal</option><option value=\"bank_transfer\">Überweisung</option>';";
+    echo "  const paymentOptions = paymentOptionValues.map((value) => '<option value=\"' + value + '\">' + paymentOptionLabels[value] + '</option>').join('');";
     echo "  const addPaymentRow = () => {";
     echo "    const number = paymentRows.querySelectorAll('[data-otc-payment-row]').length + 1;";
+    echo "    if (number > paymentOptionValues.length) { updatePaymentAddButton(); return; }";
+    echo "    const nextPaymentMethod = paymentOptionValues[number - 1];";
     echo "    const row = document.createElement('div');";
     echo "    row.className = 'sg-form-sections-card__field-group';";
     echo "    row.dataset.otcPaymentRow = '';";
     echo "    row.innerHTML = '<label class=\"sg-label\" for=\"otc-payment-method-' + number + '\">Bezahlart</label><select class=\"sg-interaction-element sg-input-single-line\" id=\"otc-payment-method-' + number + '\" data-otc-payment-method>' + paymentOptions + '</select><label class=\"sg-label\" for=\"otc-payment-amount-' + number + '\">Betrag (CHF)</label><input class=\"sg-interaction-element sg-input-single-line\" type=\"number\" id=\"otc-payment-amount-' + number + '\" min=\"0.01\" step=\"0.01\" value=\"0.00\" data-otc-payment-amount>';";
+    echo "    row.querySelector('[data-otc-payment-method]').value = nextPaymentMethod;";
     echo "    paymentRows.appendChild(row);";
     echo "    bindPaymentRow(row);";
+    echo "    updatePaymentAddButton();";
     echo "    updateFormState();";
     echo "  };";
     echo "  addPaymentButton.addEventListener('click', addPaymentRow);";
     echo "  bindPaymentRow(paymentRows.querySelector('[data-otc-payment-row]'));";
+    echo "  updatePaymentAddButton();";
     echo "  form.addEventListener('submit', async (event) => {";
     echo "    event.preventDefault();";
     echo "    let submissionSucceeded = false;";