// Startseite — Mehrwertpaket Klima & Lüftung promo + product table. // Recreates the captured gconlineplus.de content; nested inside our O+ chrome. // --- Countdown — counts down from 19 Tagen real-time --- const useCountdown = () => { const target = React.useRef(null); if (!target.current) { // ~19 days, 7 hours, 25 minutes, 22 seconds from now. target.current = Date.now() + (19 * 24 * 3600 + 7 * 3600 + 25 * 60 + 22) * 1000; } const [t, setT] = React.useState(() => Math.max(0, Math.floor((target.current - Date.now()) / 1000))); React.useEffect(() => { const id = setInterval(() => setT(Math.max(0, Math.floor((target.current - Date.now()) / 1000))), 1000); return () => clearInterval(id); }, []); const days = Math.floor(t / 86400); const hours = Math.floor((t % 86400) / 3600); const mins = Math.floor((t % 3600) / 60); const secs = t % 60; const pad = (n) => String(n).padStart(2, "0"); return { days: pad(days), hours: pad(hours), mins: pad(mins), secs: pad(secs) }; }; // --- Product data extracted from the capture --- const MEHRWERT_PRODUCTS = [ { kbn: "VFR75", unit: "Rolle", min: 6, title: "VALL ValloFlex Rundrohr R75/50", sub: "Rundrohr 75 mm, 50 m", price: "120,00", color: "#bf2240" }, { kbn: "VAFL2360", unit: "Stück", min: 1, title: "VALL Grundpaket 2/R75/130", sub: "Wohneinheiten bis 130m², Rundrohr 75 mm", price: "999,00", color: "#9ea3a7" }, { kbn: "VAFL2370", unit: "Stück", min: 1, title: "VALL Grundpaket 3/R75/180", sub: "Wohneinheiten bis 180m², Rundrohr 75 mm", price: "1.199,00", color: "#9ea3a7" }, { kbn: "LVELFVAL13", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 6 LUVAQ", sub: "KWL digit SE / 130E, 2xG4/1xF7", price: "40,00", color: "#d4cdb8" }, { kbn: "LVELFVAL6", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 14 LUVAQ", sub: "ValloPlus 240, 2xG4/1xF7", price: "39,00", color: "#d4cdb8" }, { kbn: "LVELFVAL10", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 17 LUVAQ", sub: "ValloMaxx / ValloPlus 1000, 2xG4/1xF7", price: "39,00", color: "#d4cdb8" }, { kbn: "LVELFVAL15", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 4 LUVAQ", sub: "KWL 100/100R/120, 2xG3/1xG4/1xF7", price: "45,00", color: "#d4cdb8" }, { kbn: "LVELFVAL22", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 21 LUVAQ", sub: "ValloMulti 200 SC, 2xG4", price: "12,09", color: "#d4cdb8" }, { kbn: "LVELFVAL26", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 24 LUVAQ", sub: "ValloPlus 350 SC/SE/MV, 2xG4/1xF7", price: "39,00", color: "#d4cdb8" }, { kbn: "LVELFVAL30", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 26 LUVAQ", sub: "ValloMulti 300 SB/SC/MV, 2xG4/1xF7", price: "35,00", color: "#d4cdb8" }, { kbn: "LVELFVAL32", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 27 LUVAQ", sub: "ValloPlus 270 SC/SE/MV, 2xG4/1xF7", price: "30,72", color: "#d4cdb8" }, { kbn: "LVELFVAL34", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 28 LUVAQ", sub: "ValloPlus 510 MV, 2xG4/1xF7", price: "55,00", color: "#d4cdb8" }, { kbn: "LVELFVAL45", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox Nr. 29 LUVAQ", sub: "ValloPlus 850 MV, 2xG4/1xF7", price: "140,00", color: "#d4cdb8" }, { kbn: "LVELFVAL73", unit: "Stück", min: 3, title: "Ersatzfilter für Vallox LUVAQ", sub: "ValloPlus 370 MV/MV-E, 2xG4/1xF7", price: "39,00", color: "#d4cdb8" }, { kbn: "LVTS100", unit: "Stück", min: 3, title: "Schott DN 100 Z-41.3-720 LUVAQ", sub: "f. Decken u. in Schachtw. DIN 18017-3", price: "33,00", color: "#dcdcde" }, { kbn: "LVTS125", unit: "Stück", min: 3, title: "Schott DN 125 Z-41.3-720 LUVAQ", sub: "f. Decken u. in Schachtw. DIN 18017-3", price: "35,00", color: "#dcdcde" }, { kbn: "CELEC60N", unit: "Stück", min: 3, title: "EC-Ventilatoreinsatz 60N COSMO", sub: "mit Nachlauf, 0–60 m³/h", price: "125,00", color: "#e9e7e2" }, { kbn: "CELEC60F", unit: "Stück", min: 3, title: "EC-Ventilatoreinsatz 60F COSMO", sub: "m. Nachlauf u. Feuchtesteuerung, 0–60 m³/h", price: "175,00", color: "#e9e7e2" }, { kbn: "CELGUP", unit: "Stück", min: 3, title: "UP-Gehäuse o. Brandschutz COSMO", sub: "Ausblas seitl. oder hinten", price: "25,00", color: "#dcdcde" }, { kbn: "CVAPCL100N", unit: "Stück", min: 3, title: "Kleinraumvent. APART 100 N-CL COSMO", sub: "Classic Line, mit Nachlauf", price: "69,00", color: "#f4f1ec" }, { kbn: "CVAPCL100F", unit: "Stück", min: 3, title: "Kleinraumvent. APART 100 NF-CL COSMO", sub: "Classic Line, mit Nachlauf / Feuchte", price: "99,00", color: "#f4f1ec" }, { kbn: "CVAPCL120N", unit: "Stück", min: 3, title: "Kleinraumvent. APART 120 N-CL COSMO", sub: "Classic Line, mit Nachlauf", price: "79,00", color: "#f4f1ec" }, { kbn: "CVAPCL120F", unit: "Stück", min: 3, title: "Kleinraumvent. APART 120 NF-CL COSMO", sub: "Classic Line, mit Nachlauf / Feuchte", price: "109,00", color: "#f4f1ec" }, { kbn: "MAICECA1IPVZC",unit: "Stück", min: 3, title: "Kleinraumventilator Maico ECA 100 ipro", sub: "Typ VZC zweistufig", price: "120,00", color: "#f4f1ec" }, { kbn: "MAICECA1IPH", unit: "Stück", min: 3, title: "Kleinraumventilator Maico ECA 100 ipro", sub: "Typ H zweistufig", price: "129,00", color: "#f4f1ec" }, { kbn: "MAICECA1IPF", unit: "Stück", min: 3, title: "Kleinraumventilator Maico ECA 100 ipro", sub: "Typ F zweistufig", price: "136,00", color: "#f4f1ec" }, { kbn: "HELIM1100NCN", unit: "Stück", min: 3, title: "Minilüfter Helios MiniVent M 1/100 N/C", sub: "m. Nachlauf u. Intervallbetrieb", price: "89,00", color: "#f4f1ec" }, { kbn: "HELIM1100P", unit: "Stück", min: 3, title: "Minilüfter Helios MiniVent M 1/100 P", sub: "m. Präsenzmelder", price: "115,00", color: "#f4f1ec" }, { kbn: "HELIM1100F", unit: "Stück", min: 3, title: "Minilüfter Helios MiniVent M 1/100 F", sub: "m. Feuchteverlaufssteuerung", price: "115,00", color: "#f4f1ec" }, { kbn: "LVLVS125", unit: "Stück", min: 20, title: "LUVAQ Lüftungsventil Abluft DN 125", sub: "aus Stahl, RAL9016, m. Einbaurahmen", price: "3,50", color: "#e6e4e0" }, ]; // --- tiny stylised product thumbnail (vent/duct/filter/etc.) --- const ProdThumb = ({ color, kbn }) => { const kind = kbn.startsWith("VFR") ? "tube" : kbn.startsWith("VAFL") ? "coil" : kbn.startsWith("LVELF") ? "filter" : kbn.startsWith("LVTS") ? "schott" : kbn.startsWith("CELG") ? "case" : kbn.startsWith("CELEC") ? "motor" : kbn.startsWith("CVAP") || kbn.startsWith("MAIC") || kbn.startsWith("HELIM") ? "fan" : "valve"; return ( {kind === "tube" && ( {/* coiled red tube */} {[0,1,2,3,4,5].map(i => ( ))} )} {kind === "coil" && ( {/* duct emerging */} )} {kind === "filter" && ( {[0,1,2,3,4,5,6,7,8,9].map(i => ( ))} )} {kind === "schott" && ( )} {kind === "fan" && ( {[0,1,2,3,4,5].map(i => { const a = (i * 60) * Math.PI / 180; const x = 40 + Math.cos(a) * 12; const y = 32 + Math.sin(a) * 12; return ; })} )} {kind === "motor" && ( {[0,1,2,3,4,5,6,7].map(i => { const a = (i * 45) * Math.PI / 180; return ; })} )} {kind === "case" && ( )} {kind === "valve" && ( )} ); }; // --- the Mehrwertpaket promo banner --- const MehrwertPromo = ({ onDismiss, variant = "full" }) => { const { days, hours, mins, secs } = useCountdown(); if (variant === "compact") { return (
Mehrwertpaket
Klima & Lüftung
Endet in {days}T {hours}:{mins}:{secs}
); } return (
{/* stylised ventilation fan — yellow line style */} {/* fan housing */} {/* hub */} {/* four curved fan blades around the hub */} {/* corner mounting holes */}

MEHRWERTPAKET KLIMA & LÜFTUNG

Frische Luft, smarter Preis — unsere Klima- & Lüftungs-Mehrwertpakete bieten alles für effiziente Lösungen, clever kombiniert und günstiger im Paket.

HINWEIS: Die in der Kundenstammkommission vereinbarten Konditionen finden Berücksichtigung. Die Preise sind freibleibend. Durch die Auswahl einer Kundenstammkommission entfallen die hinterlegten Sonderangebotspreise.

{days}Tage
{hours}Stunden
{mins}Minuten
{secs}Sekunden
); }; // --- product row --- const ProductRow = ({ p }) => (
{p.kbn}
{p.title}
{p.sub}
{p.unit} Mindestmenge: {p.min}
{p.price} EUR
); // Show only the first 5 rows — anything beyond the fold is trimmed. const VISIBLE_PRODUCTS = MEHRWERT_PRODUCTS.slice(0, 5); // --- Expert reply notification toast — shown on Startseite when an expert // has responded to an open Ersatzteilanfrage. Pinned to the top-right // of the content column. --- const ExpertNotification = ({ onOpen, onDismiss, variant }) => { const [closing, setClosing] = React.useState(false); const isQuery = variant === "rueckfrage"; const close = () => { setClosing(true); setTimeout(() => onDismiss && onDismiss(), 180); }; return (
{isQuery ? "Rückfrage vom Experten" : "Antwort vom Experten"}
Thomas Brinkmann Ersatzteil-Experte · Sanitär
Anfrage Wasserhahn Küche · ERSU-742183

{isQuery ? "Hallo Max, um das passende Teil zu bestimmen, brauche ich noch ein Detail zu deiner Armatur. Magst du kurz antworten?" : "Hallo Max, anhand deines Fotos habe ich das passende Ersatzteil gefunden. Schau dir bitte den Vorschlag an und gib mir Bescheid, ob es zu deinem Modell passt."}

{isQuery ? "Gerade eben · 11:38" : "Gerade eben · 14:27"}
); }; // --- the whole Startseite --- const ScreenStartseite = ({ notification, notificationVariant, onOpenAnfrage, promoMode = "full" }) => { const [promoOpen, setPromoOpen] = React.useState(true); const [notifyOpen, setNotifyOpen] = React.useState(true); const [filter, setFilter] = React.useState(""); const [tab, setTab] = React.useState("auswahl"); const filtered = VISIBLE_PRODUCTS.filter(p => !filter.trim() || p.kbn.toLowerCase().includes(filter.toLowerCase()) || p.title.toLowerCase().includes(filter.toLowerCase()) || p.sub.toLowerCase().includes(filter.toLowerCase()) ); return (
{promoOpen && promoMode !== "off" && setPromoOpen(false)} />}
setFilter(e.target.value)} />
Artikelnummer Beschreibung Preis
{filtered.map(p => )} {filtered.length === 0 && (
Keine Artikel passen zum Filter „{filter}".
)}
); }; Object.assign(window, { ScreenStartseite });