Skip to content

Fix coupon clicks #683

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: develop
Choose a base branch
from
Open

Fix coupon clicks #683

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e7fce76
fix clicking on highlighted coupons
tswfi Mar 12, 2025
efe06c8
some whitespace
tswfi Mar 12, 2025
de4510c
make remove discount a form (it modifies stuff, it should be a post)
tswfi Mar 12, 2025
b24e2a0
bit of refactoring
tswfi Mar 12, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/js/constants/selectors-map.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,12 +35,14 @@ export const listing = {

export const cart = {
container: '.cart-container',
summary: '.cart-summary',
overview: '.cart-overview',
discountCode: '.js-discount .js-code',
discountName: '[name=discount_name]',
displayPromo: '.display-promo',
promoCode: '#promo-code',
deleteLinkAction: 'delete-from-cart',
removeVoucherAction: 'remove-voucher',
productQuantity: '.cart__items .js-quantity-button',
productItem: '.cart__item',
removeFromCartLink: '.remove-from-cart',
Expand Down
22 changes: 11 additions & 11 deletions src/js/pages/cart.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,30 +9,30 @@ import handleCartAction from '../components/UseHandleCartAction';

export default () => {
const {Theme} = window;
const voucherCodes = document.querySelectorAll(Theme.selectors.cart.discountCode);
const cartContainer = document.querySelector<HTMLElement>(Theme.selectors.cart.container);
const cartSummary = document.querySelector<HTMLElement>(Theme.selectors.cart.summary);

voucherCodes.forEach((voucher) => {
voucher.addEventListener('click', (event: Event) => {
event.stopPropagation();
if (cartSummary) {
cartSummary.addEventListener('click', (event: Event) => {
const eventTarget = event.target as HTMLElement;
const voucherTarget = eventTarget.closest(Theme.selectors.cart.discountCode);

if (isHTMLElement(event.currentTarget)) {
const code = event.currentTarget;
if (voucherTarget && isHTMLElement(voucherTarget)) {
const discountInput = document.querySelector<HTMLInputElement>(Theme.selectors.cart.discountName);
const promoCode = document.querySelector(Theme.selectors.cart.promoCode);

if (promoCode && discountInput) {
const formCollapser = new Collapse(promoCode);
const formCollapser = new Collapse(promoCode, {
toggle: false,
});

discountInput.value = code.innerText;
discountInput.value = voucherTarget.innerText;
// Show promo code field
formCollapser.show();
}
}

return false;
});
});
}

if (cartContainer) {
cartContainer.addEventListener('click', (event: Event) => {
Expand Down
12 changes: 8 additions & 4 deletions templates/checkout/_partials/cart-voucher.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,19 +12,23 @@
<ul class="cart-voucher__list">
{foreach from=$cart.vouchers.added item=voucher}
<li class="cart-voucher__item row">
<span class="cart-voucher__name col">{$voucher.name}</span>
<div class="d-flex align-items-center justify-content-end col">
<span class="cart-voucher__name col">{$voucher.name}</span>
<span class="fw-bold">{$voucher.reduction_formatted}</span>
{if isset($voucher.code) && $voucher.code !== ''}
<a href="{$voucher.delete_url}" class="ms-2" data-link-action="remove-voucher"><i class="material-icons" title="{l s='Remove Voucher' d='Shop.Theme.Checkout'}">&#xE872;</i></a>
<form action="{$urls.pages.cart}?action=show" data-form-action="remove-voucher" class="d-flex" method="post">
<input type="hidden" name="token" value="{$static_token}">
<input type="hidden" name="deleteDiscount" value="{$voucher.id_cart_rule}">
<button type="submit" class="btn btn-link ms-2"><span><i class="material-icons" title="{l s='Remove Voucher' d='Shop.Theme.Checkout'}">&#xE872;</i></span></button>
</form>
{/if}
</div>
</li>
{/foreach}
</ul>
{/block}
{/if}

<hr />

<div class="accordion">
Expand All @@ -36,7 +40,7 @@
<div id="promo-code" class="accordion-collapse collapse">
<div class="accordion-body px-0">
{block name='cart_voucher_form'}
<form action="{$urls.pages.cart}" data-link-action="add-voucher" class="d-flex" method="post">
<form action="{$urls.pages.cart}?action=show" data-link-action="add-voucher" class="d-flex" method="post">
<input type="hidden" name="token" value="{$static_token}">
<input type="hidden" name="addDiscount" value="1">
<input class="form-control" type="text" name="discount_name" placeholder="{l s='Paste your voucher here' d='Shop.Theme.Checkout'}">
Expand Down