tba-git/shop-old
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(kasse): Entwurf neue Kassenansicht content_cash_desk_neu.tpl (Schritte links, Bestellkasten rechts, Feldmarkierung statt Alert), Weiche ?ansicht=neu

Browse Source 
Feldnamen, IDs und content_cash_desk.js unveraendert; nur Markup, CSS und Absende-Pruefung neu.
This commit is contained in:
Thomas Bartelt
2026-09-18 20:09:05 +02:00
parent 5c80931569
commit 49ac0f7e35
2 changed files with 578 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/website_cashdesk.php
+4
View File
@@ -362,6 +362,10 @@ class website_cashdesk {
// "Bestellen" als denselben Vorgang erkennbar (siehe save_order()).
$this->layout_object->assign('checkout_nonce', $this->checkout_nonce_holen());
// 18.09.2026 -- Entwurf der neuen Kassenansicht zum Anschauen: /Kasse/?ansicht=neu
if (isset($_GET['ansicht']) && $_GET['ansicht'] === 'neu') {
return $this->layout_object->_fetch('content_cash_desk_neu.tpl');
}
return $this->layout_object->_fetch('content_cash_desk.tpl');
} else if (isset($_GET['token']) && $_GET['token']) {
web/intelectra_shop/themes/theme2/templates/content_cash_desk_neu.tpl
+574
View File
@@ -0,0 +1,574 @@
{* =====================================================================================
Kasse NEU (theme2) -- Entwurf 18.09.2026, liegt neben content_cash_desk.tpl.
Ansehen: /Kasse/?guest_order=1&ansicht=neu (Gast) bzw. /Kasse/?ansicht=neu (eingeloggt).
Weiche in website_cashdesk.php.
Nur Darstellung ist neu. Alle Feldnamen, IDs und Klassen, an denen Modul und
content_cash_desk.js haengen, sind unveraendert: order_form, cashdesk_action,
checkout_nonce, billing[...] / shipping[...] mit den bekannten IDs, billing_address_select,
shipping_address_select (-1 = wie Rechnung, -2/'' = eigene), payment_method,
shipping_method, agreements_accepted, giftcertificate[...], customer_info,
send_order_button, cashdesk_button_save_billing/_shipping, *_save_message,
.shipping_address_form_container, .cashdesk_agreement_header + *_wrapper.
Layout: links die Schritte (Kontakt, Rechnungsadresse, Lieferadresse, Versand, Zahlung,
Anmerkung, Rechtliches), rechts der Bestellkasten (Positionen, Summen, Gutschein,
Bestellen-Knopf, Gewaehrleistungs-Label). Unter 640px Spaltenbreite stapelt es.
Pflichtfeld-Pruefung vor dem Absenden markiert Felder statt eines Alerts.
===================================================================================== *}
{$ck_guest = (isset($guest_order) && $guest_order == 1)}
{$ck_express = (isset($express_active) && $express_active)}
{$ck_merchant = (isset($customer) && $customer->group_id == 101)}
{if $ck_guest}{$ck_url = "/Kasse/?guest_order=1&ansicht=neu"}{else}{$ck_url = "/Kasse/?ansicht=neu"}{/if}
<div class="ck">
<div class="ck-steps">
<a href="/Warenkorb/?ansicht=neu" class="ck-step ck-step-done">1&nbsp;Warenkorb</a>
<span class="ck-step ck-step-now">2&nbsp;Kasse</span>
<span class="ck-step">3&nbsp;Fertig</span>
</div>
<h1 class="ck-title">Kasse{if $ck_guest} <span class="ck-muted">als Gast</span>{/if}</h1>
{if $error_message}
<div class="ck-alert" id="ck-server-errors">
{foreach from=$error_message item=message}<div>{$message}</div>{/foreach}
</div>
{/if}
<div class="ck-alert" id="ck-client-errors" hidden></div>
{if $ck_express}
<div class="ck-info">
<strong>Express-Kauf:</strong> Adresse, E-Mail und Zahlart wurden von {$express_label|escape} &uuml;bernommen.
Bitte pr&uuml;fen und unten abschlie&szlig;en &ndash; die Zahlung wird erst dann eingezogen.
</div>
{/if}
<form id="order_form" method="post" action="{$ck_url}" class="ck-grid">
<input type="hidden" id="cashdesk_action" name="cashdesk_action" value="" />
<input type="hidden" name="checkout_nonce" value="{$checkout_nonce|escape}" />
<div class="ck-main">
{* ---------------------------------------------------------------- 1 Kontakt *}
{if $ck_guest}
<section class="ck-sec">
<h2 class="ck-h"><span class="ck-num">1</span>Kontakt</h2>
<div class="ck-fields">
<div class="ck-f ck-f-2">
<label for="guest_order_email">E-Mail <em>*</em></label>
<input id="guest_order_email" type="email" name="billing[email]" autocomplete="email" value="{if isset($personal_data.billing.email)}{$personal_data.billing.email|escape}{/if}" data-req="1" data-label="E-Mail" />
<small>F&uuml;r die Bestellbest&auml;tigung.</small>
</div>
<div class="ck-f ck-f-2">
<label for="guest_order_phone">Telefon <span class="ck-muted">(optional)</span></label>
<input id="guest_order_phone" type="tel" name="billing[phone]" autocomplete="tel" value="{if isset($personal_data.billing.phone)}{$personal_data.billing.phone|escape}{/if}" />
<small>Nur bei R&uuml;ckfragen zur Lieferung.</small>
</div>
</div>
</section>
{elseif isset($customer) && $customer->email == ''}
<section class="ck-sec">
<h2 class="ck-h"><span class="ck-num">1</span>Kontakt</h2>
<div class="ck-fields">
<div class="ck-f ck-f-1">
<label for="customer_order_email">E-Mail f&uuml;r die Bestellbenachrichtigung <em>*</em></label>
<input id="customer_order_email" type="email" name="billing[email]" value="{if isset($personal_data.billing.email)}{$personal_data.billing.email|escape}{/if}" data-req="1" data-label="E-Mail" />
</div>
</div>
</section>
{/if}
{* ---------------------------------------------------------------- 2 Rechnungsadresse *}
<section class="ck-sec">
<h2 class="ck-h"><span class="ck-num">{if $ck_guest || (isset($customer) && $customer->email == '')}2{else}1{/if}</span>Rechnungsadresse</h2>
<div id="billing_address_container" class="ck-fields">
{if !$ck_guest}
<div class="ck-f ck-f-1">
<label for="billing_address_select">Adresse aus Ihrem Adressbuch</label>
<select class="formatted" id="billing_address_select" name="billing[address]" size="1">
<option value="">Rechnungsanschrift w&auml;hlen</option>
<option value="">Neue Adresse anlegen</option>
{foreach from=$addresses key=address_id item=address}
<option value="{$address_id}" {if (!(isset($personal_data.billing.address) && $personal_data.billing.address) && $customer->default_address == $address_id) || (isset($personal_data.billing.address) && $personal_data.billing.address == $address_id)}selected="selected"{/if}>
{if $address->honorific == 2}Firma {$address->company}{else}{if $address->honorific == 1}Frau{else}Herr{/if} {$address->firstname} {$address->surname}{/if}, {$address->street} {$address->house_number}, {$address->zip_code} {$address->city}{foreach from=$countries item=country}{if $country->id == $address->country}, {$country->name}{/if}{/foreach}
</option>
{/foreach}
</select>
</div>
{else}
<input id="input_billing_address" type="hidden" name="billing[billing_address]" value="{if isset($personal_data.billing.billing_address)}{$personal_data.billing.billing_address|escape}{/if}" />
{/if}
<div class="ck-f ck-f-3">
<label for="billing_honorific">Anrede{if !$ck_express} <em>*</em>{/if}</label>
<select id="billing_honorific" class="formatted{if !$ck_express} obligatory{/if}" name="billing[honorific]" {if !$ck_express}data-req="1" data-label="Anrede"{/if}>
<option value="">Bitte w&auml;hlen</option>
<option value="0" {if isset($personal_data.billing.honorific) && $personal_data.billing.honorific !== '' && $personal_data.billing.honorific == 0}selected{/if}>Herr</option>
<option value="1" {if isset($personal_data.billing.honorific) && $personal_data.billing.honorific == 1}selected{/if}>Frau</option>
<option value="2" {if isset($personal_data.billing.honorific) && $personal_data.billing.honorific == 2}selected{/if}>Firma</option>
</select>
</div>
<div class="ck-f ck-f-3">
<label for="billing_firstname" class="address_person">Vorname <em>*</em></label>
<input type="text" id="billing_firstname" class="formatted obligatory" name="billing[firstname]" autocomplete="given-name" value="{if isset($personal_data.billing.firstname)}{$personal_data.billing.firstname|escape}{/if}" data-req="person" data-label="Vorname" />
</div>
<div class="ck-f ck-f-3">
<label for="billing_surname" class="address_person">Nachname <em>*</em></label>
<input type="text" id="billing_surname" class="formatted obligatory" name="billing[surname]" autocomplete="family-name" value="{if isset($personal_data.billing.surname)}{$personal_data.billing.surname|escape}{/if}" data-req="person" data-label="Nachname" />
</div>
<div class="ck-f ck-f-1">
<label for="billing_company" class="address_company">Firma <span class="ck-muted ck-company-hint">(bei Anrede „Firma" Pflicht)</span></label>
<input type="text" id="billing_company" class="formatted" name="billing[company]" autocomplete="organization" value="{if isset($personal_data.billing.company)}{$personal_data.billing.company|escape}{/if}" data-req="company" data-label="Firma" />
</div>
<div class="ck-f ck-f-2w">
<label for="billing_street">Stra&szlig;e <em>*</em></label>
<input type="text" id="billing_street" class="formatted obligatory" name="billing[street]" autocomplete="address-line1" value="{if isset($personal_data.billing.street)}{$personal_data.billing.street|escape}{/if}" data-req="1" data-label="Stra&szlig;e" />
</div>
<div class="ck-f ck-f-2n">
<label for="billing_house_number">Nr. <em>*</em></label>
<input type="text" id="billing_house_number" class="formatted obligatory" name="billing[house_number]" value="{if isset($personal_data.billing.house_number)}{$personal_data.billing.house_number|escape}{/if}" data-req="1" data-label="Hausnummer" />
</div>
<div class="ck-f ck-f-3">
<label for="billing_zip_code">PLZ <em>*</em></label>
<input type="text" id="billing_zip_code" class="formatted obligatory" name="billing[zip_code]" autocomplete="postal-code" inputmode="numeric" value="{if isset($personal_data.billing.zip_code)}{$personal_data.billing.zip_code|escape}{/if}" data-req="1" data-label="PLZ" />
</div>
<div class="ck-f ck-f-3">
<label for="billing_city">Ort <em>*</em></label>
<input type="text" id="billing_city" class="formatted obligatory" name="billing[city]" autocomplete="address-level2" value="{if isset($personal_data.billing.city)}{$personal_data.billing.city|escape}{/if}" data-req="1" data-label="Ort" />
</div>
<div class="ck-f ck-f-3">
<label for="bill_country">Land <em>*</em></label>
<select id="bill_country" class="formatted obligatory" name="billing[country]" data-req="1" data-label="Land">
<option value="">Land w&auml;hlen</option>
{foreach from=$countries item=country}
<option value="{$country->id}" {if isset($billing_address['country']) && $billing_address['country'] == $country->id}selected{/if}>{$country->name}</option>
{/foreach}
</select>
<small>Bestimmt die Versandkosten.</small>
</div>
{if !$ck_guest}
<div class="ck-f ck-f-1 ck-save">
<span id="billing_save_message"></span>
<button type="button" id="cashdesk_button_save_billing" class="ck-btn ck-btn-ghost">Adresse speichern</button>
</div>
{/if}
</div>
</section>
{* ---------------------------------------------------------------- 3 Lieferadresse *}
<section class="ck-sec">
<h2 class="ck-h"><span class="ck-num">{if $ck_guest || (isset($customer) && $customer->email == '')}3{else}2{/if}</span>Lieferadresse</h2>
<div id="shipping_address_container" class="ck-fields">
<div class="ck-f ck-f-1">
<select class="formatted" id="shipping_address_select" name="shipping[address]" size="1">
{if $ck_guest}
<option value="-1">Wie Rechnungsadresse</option>
<option value="-2" {if isset($personal_data.shipping.address) && $personal_data.shipping.address == -2}selected="selected"{/if}>Abweichende Lieferadresse eingeben</option>
{else}
<option value="-1">Wie Rechnungsadresse</option>
<option value="">Neue Lieferadresse anlegen</option>
{foreach from=$addresses key=address_id item=address}
<option value="{$address_id}" {if isset($personal_data.shipping.address) && $personal_data.shipping.address == $address_id}selected="selected"{/if}>
{if $address->honorific == 2}Firma {$address->company}{else}{if $address->honorific == 1}Frau{else}Herr{/if} {$address->firstname} {$address->surname}{/if}, {$address->street} {$address->house_number}, {$address->zip_code} {$address->city}{foreach from=$countries item=country}{if $country->id == $address->country}, {$country->name}{/if}{/foreach}
</option>
{/foreach}
{/if}
</select>
</div>
<div class="shipping_address_form_container ck-fields ck-sub" style="display:none;">
<div class="ck-f ck-f-3">
<label for="shipping_honorific">Anrede{if !$ck_express} <em>*</em>{/if}</label>
<select id="shipping_honorific" class="formatted{if !$ck_express} obligatory{/if}" name="shipping[honorific]" {if !$ck_express}data-req="1" data-label="Anrede (Lieferadresse)"{/if}>
<option value=""{if !isset($personal_data.shipping.honorific) || $personal_data.shipping.honorific == ''} selected{/if}>Bitte w&auml;hlen</option>
<option value="0"{if isset($personal_data.shipping.honorific) && $personal_data.shipping.honorific !== '' && $personal_data.shipping.honorific == 0} selected{/if}>Herr</option>
<option value="1"{if isset($personal_data.shipping.honorific) && $personal_data.shipping.honorific == 1} selected{/if}>Frau</option>
<option value="2"{if isset($personal_data.shipping.honorific) && $personal_data.shipping.honorific == 2} selected{/if}>Firma</option>
</select>
</div>
<div class="ck-f ck-f-3">
<label for="shipping_firstname" class="address_person">Vorname <em>*</em></label>
<input type="text" id="shipping_firstname" class="formatted obligatory" name="shipping[firstname]" value="{if isset($personal_data.shipping.firstname)}{$personal_data.shipping.firstname|escape}{/if}" data-req="person" data-label="Vorname (Lieferadresse)" />
</div>
<div class="ck-f ck-f-3">
<label for="shipping_surname" class="address_person">Nachname <em>*</em></label>
<input type="text" id="shipping_surname" class="formatted obligatory" name="shipping[surname]" value="{if isset($personal_data.shipping.surname)}{$personal_data.shipping.surname|escape}{/if}" data-req="person" data-label="Nachname (Lieferadresse)" />
</div>
<div class="ck-f ck-f-1">
<label for="shipping_company" class="address_company">Firma <span class="ck-muted ck-company-hint">(bei Anrede „Firma" Pflicht)</span></label>
<input type="text" id="shipping_company" class="formatted" name="shipping[company]" value="{if isset($personal_data.shipping.company)}{$personal_data.shipping.company|escape}{/if}" data-req="company" data-label="Firma (Lieferadresse)" />
</div>
<div class="ck-f ck-f-2w">
<label for="shipping_street">Stra&szlig;e <em>*</em></label>
<input type="text" id="shipping_street" class="formatted obligatory" name="shipping[street]" value="{if isset($personal_data.shipping.street)}{$personal_data.shipping.street|escape}{/if}" data-req="1" data-label="Stra&szlig;e (Lieferadresse)" />
</div>
<div class="ck-f ck-f-2n">
<label for="shipping_house_number">Nr. <em>*</em></label>
<input type="text" id="shipping_house_number" class="formatted obligatory" name="shipping[house_number]" value="{if isset($personal_data.shipping.house_number)}{$personal_data.shipping.house_number|escape}{/if}" data-req="1" data-label="Hausnummer (Lieferadresse)" />
</div>
<div class="ck-f ck-f-3">
<label for="shipping_zip_code">PLZ <em>*</em></label>
<input type="text" id="shipping_zip_code" class="formatted obligatory" name="shipping[zip_code]" inputmode="numeric" value="{if isset($personal_data.shipping.zip_code)}{$personal_data.shipping.zip_code|escape}{/if}" data-req="1" data-label="PLZ (Lieferadresse)" />
</div>
<div class="ck-f ck-f-3">
<label for="shipping_city">Ort <em>*</em></label>
<input type="text" id="shipping_city" class="formatted obligatory" name="shipping[city]" value="{if isset($personal_data.shipping.city)}{$personal_data.shipping.city|escape}{/if}" data-req="1" data-label="Ort (Lieferadresse)" />
</div>
<div class="ck-f ck-f-3">
<label for="shipping_country">Land <em>*</em></label>
<select id="shipping_country" class="formatted obligatory" name="shipping[country]" data-req="1" data-label="Land (Lieferadresse)">
<option value="">Land w&auml;hlen</option>
{foreach from=$countries item=country}
<option value="{$country->id}" {if (isset($personal_data.shipping.country) && $personal_data.shipping.country > 0 && $personal_data.shipping.country == $country->id) || ((!isset($personal_data.shipping.country) || !$personal_data.shipping.country) && isset($default_address_country_id) && $default_address_country_id == $country->id)}selected{/if}>{$country->name}</option>
{/foreach}
</select>
</div>
{if !$ck_guest}
<div class="ck-f ck-f-1 ck-save">
<span id="shipping_save_message"></span>
<button type="button" id="cashdesk_button_save_shipping" class="ck-btn ck-btn-ghost">Lieferadresse speichern</button>
</div>
{/if}
</div>
</div>
</section>
{* ---------------------------------------------------------------- 4 Versand *}
<section class="ck-sec">
<h2 class="ck-h"><span class="ck-num">{if $ck_guest || (isset($customer) && $customer->email == '')}4{else}3{/if}</span>Versand</h2>
<div class="ck-options">
{foreach item=deliverer from=$deliverers name=delivererLoop}
<label class="ck-opt">
<input type="radio" name="shipping_method" value="{$deliverer->id}" {if (isset($personal_data.shipping_method) && $personal_data.shipping_method == $deliverer->id) || (!isset($personal_data.shipping_method) && $smarty.foreach.delivererLoop.first)}checked{/if} />
<span class="ck-opt-body">
<span class="ck-opt-name">{$deliverer->name}</span>
{if $deliverer->bulk_goods_price_add}<span class="ck-opt-sub">{$deliverer->bulk_goods_price_add|number_format:"2":",":"."} &euro; Sperrgutaufschlag</span>{/if}
</span>
<span class="ck-opt-price">{if $deliverer->price_add > 0}{$deliverer->price_add|number_format:"2":",":"."} &euro;{else}{if $deliverer->id != 5}kostenlos{else}nach Vereinbarung{/if}{/if}</span>
</label>
{/foreach}
</div>
</section>
{* ---------------------------------------------------------------- 5 Zahlung *}
<section class="ck-sec">
<h2 class="ck-h"><span class="ck-num">{if $ck_guest || (isset($customer) && $customer->email == '')}5{else}4{/if}</span>Zahlung</h2>
<div class="ck-options">
{foreach item=pMethod from=$payment_methods name=pMethodLoop}
{if ($pMethod->helperjoinkey != 'be' && $pMethod->helperjoinkey != 'r') || ($pMethod->helperjoinkey == 'be' && $customer->direct_debit_active == 1) || ($pMethod->helperjoinkey == 'r' && $customer->rechnung_active == 1)}
{if $pMethod->activeType > 0}
<label class="ck-opt ck-opt-pay ck-pay-{$pMethod->module|default:'std'}">
<input type="radio" name="payment_method" value="{$pMethod->id}" id="selection_{$pMethod->helperjoinkey}" {if (isset($personal_data.payment_method) && $personal_data.payment_method == $pMethod->id) || (!isset($personal_data.payment_method) && $smarty.foreach.pMethodLoop.first)}checked="checked"{/if} />
<span class="ck-opt-body">
<span class="ck-opt-name">{$pMethod->name}</span>
{if $pMethod->module != 'klarna' && $pMethod->module != 'paymorrow' && $pMethod->module != 'computop_billpay' && $pMethod->order_text}
<span class="ck-opt-sub">{$pMethod->order_text|replace:'[#customer_freetextfield3]':$customer->freetextfield3}</span>
{/if}
{if isset($payment_method_feedback) && $pMethod->id == $payment_method_feedback.payment_method && $payment_method_feedback.message != ''}
<span class="ck-opt-err">{$payment_method_feedback.message}</span>
{/if}
</span>
<span class="ck-opt-price">
{if $pMethod->module == 'paypal_v2' || $pMethod->module == 'paypal'}<img class="ck-paylogo" src="https://www.paypalobjects.com/webstatic/de_DE/i/de-pp-logo-100px.png" alt="PayPal" />{/if}
{if $pMethod->paymentAdd != 0}
{if $pMethod->accountType == '0'}+ {$pMethod->paymentAdd|number_format:"2":",":"."} &euro;
{elseif $pMethod->accountType == '1'}&minus; {$pMethod->paymentAdd|number_format:"2":",":"."} &euro;
{elseif $pMethod->accountType == '2'}+ {$pMethod->rawAdd|number_format:"2":",":"."} %
{elseif $pMethod->accountType == '3'}&minus; {$pMethod->rawAdd|number_format:"2":",":"."} %{/if}
{else}{if $pMethod->id != 14}kostenlos{else}nach Vereinbarung{/if}{/if}
</span>
</label>
{/if}
{/if}
{/foreach}
</div>
</section>
{* ---------------------------------------------------------------- 6 Anmerkung *}
{if $system_configuration.shoppingcart_ordertext == 1}
<section class="ck-sec">
<details class="ck-note"{if isset($customer_info) && $customer_info} open{/if}>
<summary>Anmerkung zur Bestellung <span class="ck-muted">(optional)</span></summary>
<textarea id="customer_info" name="customer_info" rows="3" placeholder="Zum Beispiel Ger&auml;tetyp, Farbe oder ein Hinweis f&uuml;r den Versand.">{if isset($customer_info)}{$customer_info|escape}{/if}</textarea>
</details>
</section>
{/if}
{* ---------------------------------------------------------------- 7 Rechtliches *}
<section class="ck-sec ck-legal">
<h2 class="ck-h"><span class="ck-num">{if $ck_guest || (isset($customer) && $customer->email == '')}6{else}5{/if}</span>Rechtliches</h2>
<div class="ck-legal-links">
{if $agb_data.widerruf != '' && !$ck_merchant}
<button type="button" id="power_of_revocation" class="cashdesk_agreement_header ck-link">{$template_text.default.cashdesk_title_widerruf|default:'Widerrufsbelehrung'}</button>
{/if}
{if $agb_data.datenschutz != '' && !$ck_merchant}
<button type="button" id="data_privacy" class="cashdesk_agreement_header ck-link">{$template_text.cashdesk.cashdesk_title_datenschutz|default:'Datenschutz'}</button>
{/if}
<button type="button" id="terms_and_conditions" class="cashdesk_agreement_header ck-link">{$template_text.cashdesk.cashdesk_title_agb|default:'AGB'}</button>
</div>
{if $agb_data.widerruf != '' && !$ck_merchant}
<div id="power_of_revocation_wrapper" class="ck-legal-text" style="display:none;"><div id="power_of_revocation_content">{$agb_data.widerruf}</div></div>
{/if}
{if $agb_data.datenschutz != '' && !$ck_merchant}
<div id="data_privacy_wrapper" class="ck-legal-text" style="display:none;"><div id="data_privacy_content">{$agb_data.datenschutz}</div></div>
{/if}
<div id="terms_and_conditions_wrapper" class="ck-legal-text" style="display:none;"><div id="terms_and_conditions_content">{if $ck_merchant && $agb_data.agbs_b2b != ''}{$agb_data.agbs_b2b}{else}{$agb_data.agbs}{/if}</div></div>
<label class="ck-check" id="ck-agree">
<input id="agreements_accepted" type="checkbox" value="1" name="agreements_accepted" />
<span>{if $ck_merchant}{$template_text.cashdesk.agreement_checkbox_text_merchant}{else}{$template_text.cashdesk.agreement_checkbox_text}{/if}</span>
</label>
<p class="ck-muted ck-small">Sie erhalten diese Hinweise nach Abschluss nochmals per E-Mail und k&ouml;nnen sie speichern.</p>
<div id="klarna_agreements_info" style="display:none;"><input id="klarna_agreements_accepted" type="checkbox" value="1" name="klarna_agreements_accepted" /></div>
</section>
<div class="ck-back"><a href="/Warenkorb/?ansicht=neu">&larr; Zur&uuml;ck zum Warenkorb</a></div>
</div>
{* ---------------------------------------------------------------- Bestellkasten *}
<aside class="ck-side">
<div class="ck-box">
<div class="ck-box-h">Ihre Bestellung</div>
{if $shoppingcart.items}
<div class="ck-items">
{foreach item=item from=$shoppingcart.items}
<div class="ck-item">
<img src="{$SHOP_DIR}images/article/thumb_{if $item->default_image_file_name}{$item->default_image_file_name}{else}default_image.png{/if}" alt="" />
<span class="ck-item-name">{$item->name}<span class="ck-item-nr">{if $item->attribute_7 && $item->number != $item->attribute_7}{$item->attribute_7}{else}{$item->number}{/if} &middot; {$item->quantity} &times; {$item->calculatedPrices.shownPrice|number_format:"2":",":"."} &euro;</span></span>
<span class="ck-item-sum">{($item->calculatedPrices.shownPrice * $item->quantity)|number_format:"2":",":"."} &euro;</span>
</div>
{/foreach}
</div>
{if isset($personal_data.payment_method) && $personal_data.payment_method && isset($payment_methods[$personal_data.payment_method])}
{assign var=usedPaymentMethod value=$payment_methods[$personal_data.payment_method]}
{/if}
{if isset($personal_data.shipping_method) && $personal_data.shipping_method && isset($deliverers[$personal_data.shipping_method])}
{assign var=usedShippingMethod value=$deliverers[$personal_data.shipping_method]}
{/if}
<div class="ck-line"><span>Zwischensumme</span><span>{$shoppingcart.shown_price_sum|number_format:"2":",":"."} &euro;</span></div>
{if isset($usedPaymentMethod) && $usedPaymentMethod->paymentAddShown != 0}
<div class="ck-line ck-muted"><span>{if $usedPaymentMethod->accountType == '1' || $usedPaymentMethod->accountType == '3'}abzgl.{else}zzgl.{/if} Zahlartgeb&uuml;hr</span><span>{$usedPaymentMethod->paymentAddShown|number_format:"2":",":"."} &euro;</span></div>
{/if}
<div class="ck-line ck-muted"><span>Versand{if isset($usedShippingMethod)} ({$usedShippingMethod->name|truncate:22:"&hellip;"}){/if}</span><span>{if isset($usedShippingMethod) && $usedShippingMethod->price_add_shown != 0}{$usedShippingMethod->price_add_shown|number_format:"2":",":"."} &euro;{else}kostenlos{/if}</span></div>
{foreach $shoppingcart.tax_values as $taxRate => $taxData}
<div class="ck-line ck-muted"><span>{if $shoppingcartVATUsage}inkl.{else}zzgl.{/if} MwSt. {$taxRate} %</span><span>{if $taxRate == '19.00'}{($taxData['vat'] + $shoppingcart.payment_method_vat + $shoppingcart.shipping_method_vat)|number_format:"2":",":"."}{else}{$taxData['vat']|number_format:"2":",":"."}{/if} &euro;</span></div>
{/foreach}
{if isset($giftcertificatevalue) && $giftcertificatevalue}
<input type="hidden" name="giftcertificate[has_gift_certificate]" value="yes" />
<input type="hidden" name="giftcertificate[gift_certificat_code]" value="{$giftcode|escape}" />
<div class="ck-line"><span>Gutschein {$giftcode|escape}</span><span>&minus; {$giftcertificatevalue|default:0|number_format:"2":",":"."} &euro;</span></div>
<div class="ck-line ck-total"><span>Gesamt</span><span>{($shoppingcart.order_total - ($giftcertificatevalue|default:0))|number_format:"2":",":"."} &euro;</span></div>
{else}
<div class="ck-line ck-total"><span>Gesamt</span><span>{$shoppingcart.order_total|number_format:"2":",":"."} &euro;</span></div>
{if $system_configuration.cashdesk_giftcertificate == 1}
<div class="ck-gift">
<input type="hidden" name="giftcertificate[has_gift_certificate]" id="has_gift_certificate" {if $giftcode}value="yes"{/if} />
<label for="giftCertificateCodeFields" class="ck-muted ck-small">{if $gftcertificateerrormessage}<span class="ck-err">{$gftcertificateerrormessage}</span>{else}Gutscheincode{/if}</label>
<div class="ck-gift-row">
<input type="text" name="giftcertificate[gift_certificat_code]" id="giftCertificateCodeFields" placeholder="Code" {if $giftcode}value="{$giftcode|escape}"{/if} />
<button type="button" id="ck-gift-apply" class="ck-btn ck-btn-ghost">Einl&ouml;sen</button>
</div>
</div>
{/if}
{/if}
<div class="ck-taxtext ck-muted ck-small">{if $shoppingcartVATUsage}Alle Preise inkl. MwSt.{else}Alle Preise zzgl. MwSt.{/if}</div>
<button type="button" id="send_order_button" class="ck-btn ck-btn-primary">{$template_text.content_cashdesk.cashdesk_button|default:'Zahlungspflichtig bestellen'}</button>
<div class="ck-muted ck-small ck-center">Mit dem Klick geben Sie eine verbindliche Bestellung ab.</div>
{else}
<p>Ihr Warenkorb ist leer.</p>
{/if}
</div>
<a class="ck-label" href="{$THEME_DIR}/media/images/label-gewaehrleistung.webp" target="_blank" rel="noopener" title="Gesetzliche Gew&auml;hrleistung: gro&szlig; anzeigen">
<img src="{$THEME_DIR}/media/images/label-gewaehrleistung.webp" alt="Gesetzliche Gew&auml;hrleistung" />
</a>
</aside>
</form>
</div>
{literal}
<style>
.ck { font-family: Arial, Helvetica, sans-serif; color: #222; font-size: 14px; line-height: 1.45; container-type: inline-size; }
.ck *, .ck *:before, .ck *:after { box-sizing: border-box; }
.ck-muted { color: #777; font-weight: 400; }
.ck-small { font-size: 12px; }
.ck-center { text-align: center; }
.ck-err { color: #b00020; }
.ck-steps { display: flex; gap: 6px; margin-bottom: 14px; font-size: 12px; }
.ck-step { padding: 4px 10px; border-radius: 12px; background: #eee; color: #777; text-decoration: none; }
.ck-step-done { background: #e8f3e0; color: #3a6b1f; }
.ck-step-now { background: #FF6700; color: #fff; font-weight: 700; }
.ck-title { font-size: 24px; font-weight: 700; margin: 0 0 14px; }
.ck-alert { background: #fdecec; border: 1px solid #f3b4b4; color: #8a1c1c; padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; }
.ck-alert[hidden] { display: none; }
.ck-info { background: #eef8e8; border: 1px solid #b8d6a8; padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; }
.ck-grid { display: flex; gap: 20px; align-items: flex-start; }
.ck-main { flex: 1 1 auto; min-width: 0; }
.ck-side { flex: 0 0 280px; position: sticky; top: 16px; }
.ck-sec { border: 1px solid #e3e3e3; border-radius: 8px; padding: 16px 18px; margin-bottom: 14px; background: #fff; }
.ck-h { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 700; margin: 0 0 12px; }
.ck-num { display: inline-flex; width: 24px; height: 24px; border-radius: 50%; background: #FF6700; color: #fff; font-size: 13px; align-items: center; justify-content: center; }
.ck-fields { display: flex; flex-wrap: wrap; gap: 10px 12px; }
.ck-sub { width: 100%; margin-top: 4px; }
.ck-f { display: flex; flex-direction: column; gap: 4px; }
.ck-f label { font-size: 13px; font-weight: 700; color: #333; }
.ck-f label em { color: #FF6700; font-style: normal; }
.ck-f small { color: #888; font-size: 11px; }
.ck-f-1 { flex: 1 1 100%; }
.ck-f-2 { flex: 1 1 calc(50% - 6px); }
.ck-f-3 { flex: 1 1 calc(33.333% - 8px); min-width: 130px; }
.ck-f-2w { flex: 3 1 60%; }
.ck-f-2n { flex: 1 1 90px; max-width: 120px; }
.ck input[type=text], .ck input[type=email], .ck input[type=tel], .ck select, .ck textarea {
width: 100%; height: 38px; border: 1px solid #cfcfcf; border-radius: 6px; padding: 0 10px; font: inherit; color: #222 !important; background: #fff; }
.ck textarea { height: auto; padding: 8px 10px; }
.ck input:focus, .ck select:focus, .ck textarea:focus { outline: none; border-color: #FF6700; box-shadow: 0 0 0 2px rgba(255,103,0,.15); }
.ck .ck-invalid { border-color: #d00 !important; background: #fff6f6; }
.ck-save { flex-direction: row; align-items: center; justify-content: flex-end; gap: 12px; }
.ck-save span { font-size: 12px; }
.ck-options { display: flex; flex-direction: column; gap: 8px; }
.ck-opt { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid #ddd; border-radius: 6px; cursor: pointer; }
.ck-opt:has(input:checked) { border-color: #FF6700; background: #fff8f3; }
.ck-opt input { margin: 0; accent-color: #FF6700; flex: 0 0 auto; }
.ck-opt-body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ck-opt-name { font-weight: 700; }
.ck-opt-sub { font-size: 12px; color: #777; }
.ck-opt-err { font-size: 12px; color: #b00020; }
.ck-opt-price { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; font-weight: 700; white-space: nowrap; }
.ck-paylogo { height: 18px; width: auto; }
.ck-note summary { cursor: pointer; font-weight: 700; }
.ck-note textarea { margin-top: 8px; }
.ck-legal-links { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.ck-link { background: #f4f4f4; border: 1px solid #ddd; border-radius: 14px; padding: 4px 12px; font: inherit; font-size: 13px; cursor: pointer; }
.ck-link:hover { border-color: #FF6700; color: #FF6700; }
.ck-legal-text { max-height: 260px; overflow: auto; border: 1px solid #e3e3e3; border-radius: 6px; padding: 10px 12px; margin-bottom: 10px; font-size: 13px; background: #fafafa; }
.ck-check { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid #ddd; border-radius: 6px; cursor: pointer; }
.ck-check input { margin-top: 3px; accent-color: #FF6700; }
.ck-check.ck-invalid { border-color: #d00; background: #fff6f6; }
.ck-back { margin: 6px 0 20px; }
.ck-back a { color: #555; text-decoration: none; }
.ck-back a:hover { color: #FF6700; }
.ck-box { background: #fafafa; border: 1px solid #e3e3e3; border-radius: 8px; padding: 16px; }
.ck-box-h { font-weight: 700; font-size: 16px; margin-bottom: 10px; }
.ck-items { border-bottom: 1px solid #ddd; margin-bottom: 8px; }
.ck-item { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid #eee; }
.ck-item img { width: 40px; height: 40px; object-fit: contain; border: 1px solid #eee; border-radius: 4px; background: #fff; flex: 0 0 auto; }
.ck-item-name { flex: 1 1 auto; min-width: 0; font-size: 12px; line-height: 1.3; }
.ck-item-nr { display: block; color: #888; font-size: 11px; }
.ck-item-sum { flex: 0 0 auto; font-weight: 700; font-size: 13px; white-space: nowrap; }
.ck-line { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; font-size: 13px; }
.ck-total { border-top: 1px solid #ddd; margin-top: 8px; padding-top: 10px; font-size: 18px; font-weight: 700; }
.ck-gift { margin-top: 8px; }
.ck-gift-row { display: flex; gap: 6px; }
.ck-gift-row input { height: 34px; }
.ck-gift-row .ck-btn { width: auto; height: 34px; margin: 0; padding: 0 12px; font-size: 13px; }
.ck-taxtext { margin: 6px 0 12px; }
.ck-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 46px; margin-top: 8px;
border-radius: 6px; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; text-decoration: none; border: 1px solid transparent; }
.ck-btn-primary { background: #FF6700; color: #fff; }
.ck-btn-primary:hover { background: #e45a00; }
.ck-btn-ghost { background: #fff; color: #555; border-color: #cfcfcf; font-weight: 400; height: 36px; font-size: 13px; width: auto; padding: 0 14px; }
.ck-btn-ghost:hover { border-color: #999; }
.ck-label { display: block; margin-top: 12px; border: 1px solid #e3e3e3; border-radius: 8px; overflow: hidden; background: #fff; }
.ck-label img { display: block; width: 100%; height: auto; }
@container (max-width: 640px) {
.ck-grid { display: block; }
.ck-side { position: static; margin-top: 16px; }
}
@media (max-width: 560px) {
.ck-grid { display: block; }
.ck-side { position: static; margin-top: 16px; }
.ck-f-3 { flex-basis: 100%; }
}
</style>
<script type="text/javascript">
$(document).ready(function() {
// ---- Pflichtfelder markieren statt Alert. Regeln:
// data-req="1" immer Pflicht (wenn sichtbar)
// data-req="person" Pflicht, wenn Anrede des Blocks Herr/Frau ist (oder Express: immer)
// data-req="company" Pflicht, wenn Anrede des Blocks Firma ist
var expressActive = window.ckExpress === true;
function block(el) { return $(el).closest('#billing_address_container').length ? 'billing' : 'shipping'; }
function pruefen() {
var fehler = [];
$('.ck .ck-invalid').removeClass('ck-invalid');
var shippingEigen = $('#shipping_address_select').val() != -1;
$('.ck [data-req]').each(function() {
var $f = $(this);
if (!$f.is(':visible')) { return; }
var b = block(this);
if (b === 'shipping' && !shippingEigen) { return; }
var anrede = $('#' + b + '_honorific').val();
var art = $f.data('req'), noetig = false;
if (art == 1 || art === '1') { noetig = true; }
else if (art === 'person') { noetig = expressActive || anrede === '0' || anrede === '1'; }
else if (art === 'company') { noetig = anrede === '2'; }
if (noetig && $.trim($f.val() || '') === '') { $f.addClass('ck-invalid'); fehler.push($f.data('label')); }
});
if (!$('#agreements_accepted').is(':checked')) { $('#ck-agree').addClass('ck-invalid'); fehler.push('Zustimmung zu AGB und Widerruf'); }
var $box = $('#ck-client-errors');
if (fehler.length) {
$box.html('<strong>Bitte noch ausfüllen:</strong> ' + fehler.join(', ')).prop('hidden', false);
var $first = $('.ck .ck-invalid').first();
if ($first.length) { $('html, body').animate({ scrollTop: $first.offset().top - 90 }, 250); $first.find('input,select').addBack('input,select').first().focus(); }
return false;
}
$box.prop('hidden', true);
return true;
}
$('#send_order_button').click(function(e) {
e.preventDefault();
if (!pruefen()) { return; }
$(this).prop('disabled', true).text('Bitte warten …');
$('#cashdesk_action').val('ready2fly');
$('#order_form').submit();
});
// Laenderwechsel und Gutschein: Seite neu rechnen (wie bisher ueber cashdesk_action=reload)
$('#bill_country, #shipping_country').change(function() { $('#cashdesk_action').val('reload'); $('#order_form').submit(); });
$('#ck-gift-apply').click(function(e) { e.preventDefault(); $('#has_gift_certificate').val('yes'); $('#cashdesk_action').val('reload'); $('#order_form').submit(); });
// Firma-Hinweis nur bei Anrede Firma zeigen
function firmaHinweis() {
$('#billing_address_container .ck-company-hint').toggle($('#billing_honorific').val() === '2');
$('#shipping_address_container .ck-company-hint').toggle($('#shipping_honorific').val() === '2');
}
$('#billing_honorific, #shipping_honorific').change(firmaHinweis); firmaHinweis();
// Lieferadresse: eigenes Formular ein-/ausblenden (Gast; eingeloggt macht es content_cash_desk.js)
$('#shipping_address_select').change(function() { $('.shipping_address_form_container').toggle($(this).val() != -1); });
$('.shipping_address_form_container').toggle($('#shipping_address_select').val() != -1);
});
</script>
{/literal}
{if $ck_express}<script type="text/javascript">window.ckExpress = true;</script>{/if}
{if !$ck_guest && $addresses}
<script type="text/javascript">
var addresses = new Array();
{foreach from=$addresses key=num item=address}
addresses[{$num}] = {literal}{{/literal}
company: '{$address->company|escape:'javascript'}', honorific: '{$address->honorific}', firstname: '{$address->firstname|escape:'javascript'}',
surname: '{$address->surname|escape:'javascript'}', street: '{$address->street|escape:'javascript'}', house_number: '{$address->house_number|escape:'javascript'}',
zip_code: '{$address->zip_code|escape:'javascript'}', city: '{$address->city|escape:'javascript'}', country: '{$address->country}'
{literal}}{/literal};
{/foreach}
</script>
{else}
<script type="text/javascript">var addresses = undefined;</script>
{/if}
<script src="{$PARENT_THEME_DIR}/media/js/content_cash_desk.js?version=1" type="text/javascript"></script>