DogFatherGit/vans-diy-bastelbedarf
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Warenkorb: Versandkosten werden jetzt sofort berechnet und angezeigt (Länderauswahl direkt im Warenkorb, reagiert live auf Wechsel), statt erst im Checkout

Browse Source
This commit is contained in:
qcigano
2026-08-02 18:19:56 +02:00
parent 559cdfc727
commit 4a12eab876
5 changed files with 88 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/en/warenkorb/index.astro
+19 -5
View File
@@ -26,6 +26,15 @@ const t = useTranslations(lang);
<aside class="card cart-summary">
<h3>🧾 {t.cart.subtotal}</h3>
<div class="summary-row"><span>{t.cart.subtotal}</span><span id="sum-subtotal">0,00 €</span></div>
<div class="ship-country-row">
<label for="cart-land">📦 {t.checkout.country}</label>
<select id="cart-land">
<option value="de">Germany</option>
<option value="at">Austria</option>
<option value="ch">Switzerland</option>
<option value="lu">Luxembourg</option>
</select>
</div>
<div class="summary-row"><span>{t.cart.shipping}</span><span id="sum-shipping">{t.cart.shippingCalculated}</span></div>
<p class="free-shipping-badge" id="shipping-hint"></p>
<hr class="divider" />
@@ -38,16 +47,18 @@ const t = useTranslations(lang);
</section>
</Layout>
<script define:vars={{ freeShipFrom: 75, removeLabel: t.cart.remove, perItemLabel: t.cart.perItem, remainingTemplate: t.cart.remaining("__V__"), freeShippingText: t.cart.freeShipping, cartLang: lang }}>
<script define:vars={{ freeShipFrom: 75, removeLabel: t.cart.remove, perItemLabel: t.cart.perItem, remainingTemplate: t.cart.remaining("__V__"), freeShippingText: t.cart.freeShipping, freeLabel: t.checkout.free, cartLang: lang }}>
// WICHTIG: define:vars-Skripte laufen als IIFE, keine "import"-Anweisungen möglich.
window.__cartVars = { freeShipFrom, removeLabel, perItemLabel, remainingTemplate, freeShippingText, cartLang };
window.__cartVars = { freeShipFrom, removeLabel, perItemLabel, remainingTemplate, freeShippingText, freeLabel, cartLang };
</script>
<script type="module">
import { getCart, updateQuantity, removeFromCart, cartTotal } from "../../../scripts/cart";
import { formatPrice } from "../../../i18n/format";
import { getProduct } from "../../../data/products";
import { getProduct, products } from "../../../data/products";
import { berechneVersandkosten } from "../../../data/versand";
const { freeShipFrom, removeLabel, perItemLabel, remainingTemplate, freeShippingText, cartLang } = window.__cartVars;
const { freeShipFrom, removeLabel, perItemLabel, remainingTemplate, freeShippingText, freeLabel, cartLang } = window.__cartVars;
const landSelect = document.getElementById("cart-land");
function render() {
const cart = getCart();
@@ -89,8 +100,10 @@ const t = useTranslations(lang);
const subtotal = cartTotal();
const remaining = Math.max(0, freeShipFrom - subtotal);
const shipping = berechneVersandkosten(landSelect.value, cart.map((i) => ({ slug: i.slug, preis: i.preis, menge: i.menge })), products);
document.getElementById("sum-subtotal").textContent = formatPrice(subtotal, cartLang);
document.getElementById("sum-total").textContent = formatPrice(subtotal, cartLang);
document.getElementById("sum-shipping").textContent = shipping === 0 ? freeLabel : formatPrice(shipping, cartLang);
document.getElementById("sum-total").textContent = formatPrice(subtotal + shipping, cartLang);
document.getElementById("shipping-hint").textContent =
remaining > 0 ? remainingTemplate.replace("__V__", formatPrice(remaining, cartLang)) : `🩵 ${freeShippingText}`;
@@ -112,4 +125,5 @@ const t = useTranslations(lang);
render();
window.addEventListener("cart:changed", render);
landSelect.addEventListener("change", render);
</script>