diff options
Diffstat (limited to 'views/mods/mod_smartcheckout')
| -rw-r--r-- | views/mods/mod_smartcheckout/checkout.phtml | 24 | ||||
| -rw-r--r-- | views/mods/mod_smartcheckout/product_suggestions.phtml | 46 |
2 files changed, 59 insertions, 11 deletions
diff --git a/views/mods/mod_smartcheckout/checkout.phtml b/views/mods/mod_smartcheckout/checkout.phtml index 068d49b..6bae4ca 100644 --- a/views/mods/mod_smartcheckout/checkout.phtml +++ b/views/mods/mod_smartcheckout/checkout.phtml @@ -254,18 +254,19 @@ <div class="sc_choices" :class="{ 'sc_invalid': hasError('shipping') }"> - <label class="sc_choice" v-for="item in state.shipping.list" :key="item.id" :class="{ 'sc_choice_active': form.shipping === item.id }"> + <?php /* Das label umfasst nur die Kopfzeile, Hinweise der Module können eigene Eingabefelder enthalten */ ?> + <div class="sc_choice" v-for="item in state.shipping.list" :key="item.id" :class="{ 'sc_choice_active': form.shipping === item.id }" @click="selectChoice('shipping', item.id, $event)"> <?php /* Radio, Logo und Bezeichnung auf einer Zeile, die Beschreibung darunter */ ?> - <span class="sc_choice_head"> + <label class="sc_choice_head"> <input type="radio" name="wpsg[checkout][shipping]" :value="item.id" v-model="form.shipping" @change="refresh" /> <img class="sc_choice_logo" v-if="item.logo" :src="item.logo" :alt="item.name" /> <span class="sc_choice_name">{{ item.name }}</span> <span class="sc_choice_price" v-if="item.price">{{ item.price }}</span> - </span> - <span class="sc_choice_hint" v-if="item.hint" v-html="item.hint"></span> + </label> + <div class="sc_choice_hint" v-if="item.hint" v-html="item.hint"></div> - </label> + </div> </div> @@ -277,19 +278,20 @@ <div class="sc_choices" :class="{ 'sc_invalid': hasError('payment') }"> - <label class="sc_choice" v-for="item in state.payment.list" :key="item.id" :class="{ 'sc_choice_active': form.payment === item.id }"> + <?php /* Das label umfasst nur die Kopfzeile, Hinweise der Module können eigene Eingabefelder enthalten (z.B. Kreditkarte) */ ?> + <div class="sc_choice" v-for="item in state.payment.list" :key="item.id" :class="{ 'sc_choice_active': form.payment === item.id }" @click="selectChoice('payment', item.id, $event)"> <?php /* Radio, Logo und Bezeichnung auf einer Zeile, Beschreibung und Zusatzangaben darunter */ ?> - <span class="sc_choice_head"> + <label class="sc_choice_head"> <input type="radio" name="wpsg[checkout][payment]" :value="item.id" v-model="form.payment" @change="refresh" /> <img class="sc_choice_logo" v-if="item.logo" :src="item.logo" :alt="item.name" /> <span class="sc_choice_name">{{ item.name }}</span> <span class="sc_choice_price" v-if="item.price">{{ item.price }}</span> - </span> - <span class="sc_choice_hint" v-if="item.hint" v-html="item.hint"></span> - <span class="sc_choice_extra" v-if="item.extra" v-html="item.extra"></span> + </label> + <div class="sc_choice_hint" v-if="item.hint" v-html="item.hint"></div> + <div class="sc_choice_extra" v-if="item.extra" v-html="item.extra"></div> - </label> + </div> </div> diff --git a/views/mods/mod_smartcheckout/product_suggestions.phtml b/views/mods/mod_smartcheckout/product_suggestions.phtml new file mode 100644 index 0000000..78acea5 --- /dev/null +++ b/views/mods/mod_smartcheckout/product_suggestions.phtml @@ -0,0 +1,46 @@ +<?php + + /** + * Kompakte Liste vorgeschlagener Produkte unter den Warenkorbpositionen (Warenkorbteaser, Zubehör) + * + * Das Mengenfeld hat bewusst keinen Namen: es wird bei den Aktualisierungen des Checkouts nicht + * mitgeschickt. Erst der Button überträgt die Menge unter <send_name>[<ID>] (siehe onModuleClick in + * smartcheckout.js). Befüllt über \wpsgSmartcheckout\State::renderSuggestions(). + */ + + $view = $this->view['wpsg_smartcheckout_suggestions']; + +?> +<div class="sc_teaser"> + + <div class="sc_teaser_title"><?php echo esc_html($view['title']); ?></div> + + <?php foreach ($view['products'] as $p) { ?> + <div class="sc_teaser_item" data-sc-item> + + <?php if ($p['image'] !== '') { ?> + <div class="sc_teaser_image"> + <img src="<?php echo esc_url($p['image']); ?>" alt="<?php echo esc_attr($p['name']); ?>" loading="lazy" /> + </div> + <?php } ?> + + <div class="sc_teaser_body"> + <div class="sc_teaser_name"> + <?php if ($p['link'] !== '') { ?> + <a href="<?php echo esc_url($p['link']); ?>"><?php echo esc_html($p['name']); ?></a> + <?php } else { ?> + <?php echo esc_html($p['name']); ?> + <?php } ?> + </div> + <div class="sc_teaser_price"><?php echo esc_html($p['price']); ?></div> + </div> + + <div class="sc_teaser_action"> + <input type="text" inputmode="numeric" class="sc_teaser_amount" value="1" data-sc-amount aria-label="<?php echo esc_attr__('Menge', 'wpsg'); ?>" /> + <button type="button" class="sc_button sc_button_secondary" data-sc-send="<?php echo esc_attr($view['send_name'].'['.intval($p['id']).']'); ?>"><?php echo esc_html__('Hinzufügen', 'wpsg'); ?></button> + </div> + + </div> + <?php } ?> + +</div> |