Versandkosten-System (Pflichtenheft Punkt 9) + kritischen Warenkorb/Checkout-Bug behoben
Neu: - Produkte können eigene Versandkosten je Land (DE/AT/CH/LU) bekommen, gelten nur bei Einzelkauf (genau 1 Stück von 1 Produkt) - Versandkosten-Staffel nach Warenwert je Land, von VanVan im Adminbereich bearbeitbar (neuer Bereich "Versandkosten-Staffel"), greift bei mehreren Produkten/Stück - Versandkostenfrei ab 75 € gilt immer, unabhängig von Einzelkauf/Staffel - Checkout berechnet und zeigt jetzt die echten Versandkosten live beim Länderwechsel an Kritischer Bugfix (unabhängig vom neuen Feature entdeckt): - Warenkorb- und Checkout-Skripte haben "import" innerhalb von define:vars-Skripten benutzt, was Astro als IIFE rendert (kein ES-Modul) — das hat in der echten Live-Version die ganze Zeit zu "Cannot use import statement outside a module" geführt, wodurch Warenkorb und Checkout praktisch nie funktioniert haben. Behoben durch Trennung: define:vars-Skript setzt nur Werte auf window, separates <script type="module"> mit den echten Imports liest sie aus. Mit echtem End-to-End-Test verifiziert (Artikel in Warenkorb legen, Land wechseln, Summe prüfen) statt nur Screenshot.
This commit is contained in:
@@ -32,10 +32,10 @@ const t = useTranslations(lang);
|
||||
<div>
|
||||
<label for="land">{t.checkout.country}</label>
|
||||
<select id="land">
|
||||
<option selected>Schwiz</option>
|
||||
<option>Dütschland</option>
|
||||
<option>Öschterrych</option>
|
||||
<option>Luxemburg</option>
|
||||
<option value="ch" selected>Schwiz</option>
|
||||
<option value="de">Dütschland</option>
|
||||
<option value="at">Öschterrych</option>
|
||||
<option value="lu">Luxemburg</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@@ -74,19 +74,35 @@ const t = useTranslations(lang);
|
||||
</Layout>
|
||||
|
||||
<script define:vars={{ freeLabel: t.checkout.free, totalLabel: t.checkout.total, shippingLabel: t.cart.shipping, emptyCartAlert: t.checkout.emptyCartAlert, thankYouPath: "/ch/checkout/danke/", checkoutLang: lang }}>
|
||||
// WICHTIG: define:vars-Skripte laufen als IIFE, keine "import"-Anweisungen möglich.
|
||||
window.__checkoutVars = { freeLabel, totalLabel, shippingLabel, emptyCartAlert, thankYouPath, checkoutLang };
|
||||
</script>
|
||||
<script type="module">
|
||||
import { getCart, cartTotal } from "../../../scripts/cart";
|
||||
import { formatPrice } from "../../../i18n/format";
|
||||
import { products } from "../../../data/products";
|
||||
import { berechneVersandkosten } from "../../../data/versand";
|
||||
|
||||
const { freeLabel, totalLabel, shippingLabel, emptyCartAlert, thankYouPath, checkoutLang } = window.__checkoutVars;
|
||||
|
||||
const summary = document.getElementById("checkout-summary");
|
||||
const landSelect = document.getElementById("land");
|
||||
const cart = getCart();
|
||||
const subtotal = cartTotal();
|
||||
const shipping = cart.length === 0 ? 0 : subtotal >= 75 ? 0 : 4.95;
|
||||
|
||||
summary.innerHTML = `
|
||||
${cart.map((i) => `<div class="row"><span>${i.menge}× ${i.name}</span><span>${formatPrice(i.preis * i.menge, checkoutLang)}</span></div>`).join("")}
|
||||
<div class="row"><span>${shippingLabel}</span><span>${shipping === 0 ? freeLabel : formatPrice(shipping, checkoutLang)}</span></div>
|
||||
<div class="row total"><span>${totalLabel}</span><span>${formatPrice(subtotal + shipping, checkoutLang)}</span></div>
|
||||
`;
|
||||
function renderSummary() {
|
||||
const land = landSelect.value;
|
||||
const shipping = cart.length === 0 ? 0 : berechneVersandkosten(land, cart.map((i) => ({ slug: i.slug, preis: i.preis, menge: i.menge })), products);
|
||||
|
||||
summary.innerHTML = `
|
||||
${cart.map((i) => `<div class="row"><span>${i.menge}× ${i.name}</span><span>${formatPrice(i.preis * i.menge, checkoutLang)}</span></div>`).join("")}
|
||||
<div class="row"><span>${shippingLabel}</span><span>${shipping === 0 ? freeLabel : formatPrice(shipping, checkoutLang)}</span></div>
|
||||
<div class="row total"><span>${totalLabel}</span><span>${formatPrice(subtotal + shipping, checkoutLang)}</span></div>
|
||||
`;
|
||||
}
|
||||
|
||||
renderSummary();
|
||||
landSelect.addEventListener("change", renderSummary);
|
||||
|
||||
document.getElementById("checkout-form").addEventListener("submit", (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
Reference in New Issue
Block a user