(() => { /* ----------------------------------------------------------- 1. Konfiguration ----------------------------------------------------------- */ const DEBUG_MODE = false; const VEHICLE_FILTER = { enabled: true, allowedVehicles: [] }; const KINTO_CFG = { NEW_TEXT: "KINTO Angebot anfordern", STAR: "**", NOTICE_ID: "brutto-hinweis", NOTICE_TEXT: "** Unverbindliche Preisempfehlung der Toyota Deutschland GmbH, Toyota Allee 2, 50858 Köln, inkl. MwSt., zzgl. Überführung", MILEAGE_SELECT_IDS: ["mileage"], DURATION_SELECT_IDS: ["duration"], PRICE_SELECTOR: "#buyBox h6.font-bold.text-4xl", AVAILABLE_TEXT_MATCHES: [ "Kurzfristig verfügbar", "Innerhalb 1 Woche verfügbar", "Ab sofort verfügbar" ], AVAILABLE_TEXT_OVERRIDE: "Kurzfristig verfügbar", DISCLAIMER_TEMPLATE: "*Ein unverbindliches Auto Abo Angebot der **KINTO Deutschland GmbH, Toyota-Allee 5, 50858 Köln** für den %%VEHICLE_NAME%%: " + "**%%ANZAHLUNG%%Vertragslaufzeit: %%TERM_MONTHS%% Monate, " + "monatliche Laufleistung: %%MILEAGE_KM%% km, " + "%%TERM_MONTHS%% mtl. Raten à %%MONTHLY_RATE%% € inkl. MwSt., inkl. Überführungskosten und Services " + "(Versicherung, Wartung, Kfz-Steuer).** Entsprechende Bonität vorausgesetzt. " + "Die Kosten für Kraftstoff sind vom Kunden zu tragen. " + "Alle Angebotspreise verstehen sich auf Basis der **unverbindlichen Preisempfehlung** der Toyota Deutschland GmbH, " + "Toyota-Allee 2, 50858 Köln, per März 2026, inkl. MwSt. " + "**Dieses Angebot ist nur für Privatkunden gültig.** Nach Ablauf der Vertragslaufzeit verlängert sich der Vertrag automatisch um jeweils einen weiteren Monat, " + "wenn er nicht mit einer Frist von einem Monat gekündigt wird. Nur bei teilnehmenden Toyota Händlern. " + "Das Angebot gilt nur bei Anfrage und Genehmigung bis zum 30.09.2026. " + "**Individuelle Preise und Angebote bei teilnehmenden Toyota Händlern.**" }; const VEHICLE_CONFIG = { "toyota-aygo-x-hybrid-pure": { name: "Toyota Aygo X Hybrid Pure 1,5-l-VVT-iE Hybrid, Benzinmotor 68 kW (92 PS) und Elektromotor 59 kW (80 PS), Systemleistung 85 kW (116 PS)", deposit: 1490.00 }, "toyota-yaris-hybrid-active": { name: "Toyota Yaris Hybrid Active 1,5-l-VVT-iE Hybrid, Benzinmotor 68 kW (92 PS) und Elektromotor 59 kW (80 PS), Systemleistung 85 kW (116 PS)", deposit: 0 }, "toyota-c-hr-hybrid-teamplayer": { name: "Toyota C-HR Teamplayer Hybrid, 1,8-l-VVT-i Benzinmotor 72 kW (98 PS) und Elektromotor 70 kW (95 PS), Systemleistung 103 kW (140 PS)", deposit: 0 }, "toyota-gr-yaris": { name: "Toyota GR Yaris", deposit: 0 }, "lexus-lbx-hybrid": { name: "Lexus LBX Hybrid mit 1,5-l-Benzinmotor 67 kW (91 PS) und Elektromotor 69 kW (94 PS), Systemleistung 100 kW (136 PS)", deposit: 1000.00 } }; VEHICLE_FILTER.allowedVehicles = Object.keys(VEHICLE_CONFIG); /* ----------------------------------------------------------- 2. Logging ----------------------------------------------------------- */ const _log = (...args) => { if (DEBUG_MODE) console.log(...args); }; /* ----------------------------------------------------------- 3. Fahrzeugfilter Jede Katalog-Kachel ist selbst ein -Element (kein verschachtelter Link mehr wie im alten Shop). ----------------------------------------------------------- */ function isVehicleAllowed(anchorEl) { if (!VEHICLE_FILTER.enabled) return false; const href = (anchorEl.getAttribute("href") || "").toLowerCase(); return VEHICLE_FILTER.allowedVehicles.some(v => href.includes(v.toLowerCase())); } function getCurrentVehicleSlug() { const pathname = location.pathname.toLowerCase(); return Object.keys(VEHICLE_CONFIG).find(slug => pathname.includes(slug)) ?? null; } function getCurrentVehicleData() { const slug = getCurrentVehicleSlug(); const cfg = slug ? VEHICLE_CONFIG[slug] : null; const h1 = document.querySelector("h1"); const name = cfg?.name || (h1 ? h1.textContent.replace(/\s+/g, " ").trim() : "") || "Toyota Fahrzeug"; const deposit = cfg?.deposit ?? 0; return { name, deposit }; } /* ----------------------------------------------------------- 4. Zentraler MutationObserver (weiterhin noetig, da der Shop eine Vue-SPA ist) ----------------------------------------------------------- */ let mainObserver = null; let scheduledRun = false; function scheduleRun() { if (scheduledRun) return; scheduledRun = true; requestAnimationFrame(() => { scheduledRun = false; mainObserver?.disconnect(); runAllModules(); mainObserver?.observe(document.body, { childList: true, subtree: true }); }); } function startMainObserver() { if (mainObserver) return; mainObserver = new MutationObserver(scheduleRun); mainObserver.observe(document.body, { childList: true, subtree: true }); _log("👁️ Zentraler Observer gestartet"); } const PROCESSED_ATTR = "data-kinto-done"; /* ----------------------------------------------------------- 5. Datenpunkte labeln (PDS). Anker ist der Titel:, WICHTIG: kein "main"-Scope - die Seite hat kein

-Element, dadurch griff frueher gar keine [data-label]-Regel. ----------------------------------------------------------- */ function slugifyLabel(text) { return text .toLowerCase() .replace(/[äöüß]/g, c => ({ ä: "a", ö: "o", ü: "u", ß: "ss" }[c])) .replace(/[^a-z0-9]+/g, "-") .replace(/^-+|-+$/g, ""); } function labelDataPoints() { document.querySelectorAll(`b:not([${PROCESSED_ATTR}])`).forEach(b => { /* Nur echte PdsDataPoint-Titel treffen (DataPoint.vue:

Titel:

...

, eine davon per CSS versteckt) - beide mit der GLEICHEN id="buyBox". getElementById liefert immer nur die erste (die Mobile-Kopie, auf Desktop unsichtbar) -> Text landete unsichtbar dort. Deshalb hier alle Vorkommen behandeln, ueber eine Klasse statt einer (zwangslaeufig doppelten) id identifizieren. */ function insertOrUpdateDisclaimer() { const buyBoxes = document.querySelectorAll('[id="buyBox"]'); if (!buyBoxes.length) return; const html = markdownToHtml(buildDisclaimerText()); buyBoxes.forEach(buyBox => { let p = buyBox.querySelector(".kinto-benefits-disclaimer"); if (!p) { p = document.createElement("p"); p.className = "kinto-benefits-disclaimer"; p.style.cssText = "margin-top:12px;font-size:12px;line-height:1.4;color:#6c757d"; buyBox.appendChild(p); } if (p.innerHTML !== html) p.innerHTML = html; }); } /* ----------------------------------------------------------- 8b. Lead-Formular (checkout-page-leads.vue -> CheckoutSubscriptionOverview.vue, #subscription-overview .subscription-data > li). Kein own_css/own_js- Ausfall wie in der separaten Checkout-App - diese Seite ist Teil des Shop-Nuxt-Apps, alle bisherigen Funktionen liefen hier bereits mit. Es fehlten nur Selektoren fuer diese konkreten Zeilen. ----------------------------------------------------------- */ /* "Sofort verfügbar" -> "Kurzfristig verfügbar" - erste

ist im Template immer die Verfuegbarkeits-Zeile (fester Aufbau in CheckoutSubscriptionOverview.vue, kein v-if davor). */ function forceLeadsAvailabilityText() { document.querySelectorAll(`#subscription-overview .subscription-data li:first-child:not([${PROCESSED_ATTR}="ov-avail"])`).forEach(li => { const text = li.textContent.trim(); if (/verfügbar/i.test(text) && text !== KINTO_CFG.AVAILABLE_TEXT_OVERRIDE) { li.textContent = KINTO_CFG.AVAILABLE_TEXT_OVERRIDE; } li.setAttribute(PROCESSED_ATTR, "ov-avail"); }); } /* "Kosten je Mehrkilometer ..." und "Selbstbeteiligung ..." ausblenden. Position im

Haben Sie Fragen zum KINTO Auto Abo?

FAQ ansehen