Add OTC order date picker
This commit is contained in:
@@ -328,6 +328,13 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo '<p class="sg-body sg-form-sections-card__sentence">Der Preis wird durch die Anzahl aller Flaschen geteilt und das Ergebnis ist der Preis jeder einzelnen Flasche.</p>';
|
||||
echo '</div>';
|
||||
echo '</section>';
|
||||
echo '<section class="sg-form-sections-card__chapter" aria-labelledby="otc-order-date-title">';
|
||||
echo '<h2 id="otc-order-date-title" class="sg-strong sg-form-sections-card__chapter-title">Datum</h2>';
|
||||
echo '<div class="sg-form-sections-card__field-group">';
|
||||
echo '<label class="sg-label" for="otc-order-date">Bestelldatum</label>';
|
||||
echo '<input class="sg-interaction-element sg-input-single-line" type="date" id="otc-order-date" value="' . htmlspecialchars(date('Y-m-d'), ENT_QUOTES, 'UTF-8') . '" data-otc-order-date>';
|
||||
echo '</div>';
|
||||
echo '</section>';
|
||||
echo '<section class="sg-form-sections-card__chapter" aria-labelledby="otc-payment-title">';
|
||||
echo '<h2 id="otc-payment-title" class="sg-strong sg-form-sections-card__chapter-title">Bezahlung</h2>';
|
||||
echo '<div class="sg-form-sections-card__field-group">';
|
||||
@@ -713,6 +720,8 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " const form = overlay.querySelector('[data-otc-order-form]');";
|
||||
echo " const productInputs = Array.from(form.querySelectorAll('[data-otc-order-product]'));";
|
||||
echo " const totalPriceInput = form.querySelector('[data-otc-order-total-price]');";
|
||||
echo " const orderDateInput = form.querySelector('[data-otc-order-date]');";
|
||||
echo " const orderDateDefaultValue = orderDateInput ? orderDateInput.value : '';";
|
||||
echo " const paymentMethodInput = form.querySelector('[data-otc-order-payment-method]');";
|
||||
echo " const firstNameInput = form.querySelector('[data-otc-order-first-name]');";
|
||||
echo " const lastNameInput = form.querySelector('[data-otc-order-last-name]');";
|
||||
@@ -734,6 +743,19 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " const clearSuccess = () => {";
|
||||
echo " if (successEl) { successEl.textContent = successDefaultText; successEl.classList.add('hidden'); }";
|
||||
echo " };";
|
||||
echo " const getTodayValue = () => {";
|
||||
echo " const now = new Date();";
|
||||
echo " const year = now.getFullYear();";
|
||||
echo " const month = String(now.getMonth() + 1).padStart(2, '0');";
|
||||
echo " const day = String(now.getDate()).padStart(2, '0');";
|
||||
echo " return year + '-' + month + '-' + day;";
|
||||
echo " };";
|
||||
echo " const ensureCurrentOrderDate = () => {";
|
||||
echo " if (!orderDateInput) { return; }";
|
||||
echo " if (!orderDateInput.value || orderDateInput.value === orderDateDefaultValue) {";
|
||||
echo " orderDateInput.value = getTodayValue();";
|
||||
echo " }";
|
||||
echo " };";
|
||||
echo " const toggleOverlay = (isOpen) => {";
|
||||
echo " overlay.dataset.open = String(isOpen);";
|
||||
echo " overlay.setAttribute('aria-hidden', String(!isOpen));";
|
||||
@@ -742,6 +764,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " if (isOpen) {";
|
||||
echo " clearError();";
|
||||
echo " clearSuccess();";
|
||||
echo " ensureCurrentOrderDate();";
|
||||
echo " requestAnimationFrame(() => {";
|
||||
echo " (productInputs[0] || totalPriceInput || submitBtn)?.focus();";
|
||||
echo " });";
|
||||
@@ -761,6 +784,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " });";
|
||||
echo " const isValid = totalQty > 0";
|
||||
echo " && totalPrice > 0";
|
||||
echo " && !!getFieldValue(orderDateInput)";
|
||||
echo " && !!getFieldValue(paymentMethodInput)";
|
||||
echo " && !!getFieldValue(firstNameInput)";
|
||||
echo " && !!getFieldValue(lastNameInput)";
|
||||
@@ -776,6 +800,8 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " errorMsg = 'Mindestens ein Produkt mit Menge > 0 erforderlich.';";
|
||||
echo " } else if (totalPrice <= 0) {";
|
||||
echo " errorMsg = 'Preis muss größer als 0 sein.';";
|
||||
echo " } else if (!getFieldValue(orderDateInput)) {";
|
||||
echo " errorMsg = 'Bestelldatum auswählen.';";
|
||||
echo " } else if (!getFieldValue(paymentMethodInput)) {";
|
||||
echo " errorMsg = 'Zahlungsart auswählen.';";
|
||||
echo " } else if (!getFieldValue(firstNameInput) || !getFieldValue(lastNameInput) || !getFieldValue(streetInput) || !getFieldValue(houseNumberInput) || !getFieldValue(zipInput) || !getFieldValue(cityInput)) {";
|
||||
@@ -819,7 +845,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " toggleOverlay(false);";
|
||||
echo " }";
|
||||
echo " });";
|
||||
echo " [totalPriceInput, paymentMethodInput, firstNameInput, lastNameInput, streetInput, houseNumberInput, zipInput, cityInput].forEach((input) => {";
|
||||
echo " [totalPriceInput, orderDateInput, paymentMethodInput, firstNameInput, lastNameInput, streetInput, houseNumberInput, zipInput, cityInput].forEach((input) => {";
|
||||
echo " if (!input) { return; }";
|
||||
echo " input.addEventListener('input', updateFormState);";
|
||||
echo " input.addEventListener('change', updateFormState);";
|
||||
@@ -838,6 +864,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
||||
echo " const orderData = {";
|
||||
echo " products: products,";
|
||||
echo " totalPrice: parseFloat(totalPriceInput.value || '0') || 0,";
|
||||
echo " orderDate: orderDateInput ? orderDateInput.value : '',";
|
||||
echo " paymentMethod: paymentMethodInput ? paymentMethodInput.value : '',";
|
||||
echo " billing: {";
|
||||
echo " firstName: getFieldValue(firstNameInput),";
|
||||
|
||||
Reference in New Issue
Block a user