Noleggio in corso

{noleggio.tipo} · {noleggio.cliente}

Consegna

{dataConsegna ? fmtDate(new Date(dataConsegna)) : '—'}

Rientro

{dataRientro ? fmtDate(new Date(dataRientro)) : '—'}

Rientro previsto {badgeLabel}

Commerciale: {noleggio.commerciale}

); } function ProductDetail({ p, role, back, onPrenota, onPDF, listino, onStr, onStorico, archive, toast, attributi }) { const vp = useViewport(); const [watched, setWatched] = useState(false); const [watchBusy, setWatchBusy] = useState(false); const [showMin, setShowMin] = useState(false); const [battOn, setBattOn] = useState(false); const cat = CATEGORIE.find(c=>c.id===p.cat); // Nomi degli attributi marcati "sede" → mostrati nella sezione ubicazione, non nella scheda tecnica const sedeNames = (attributi||[]).filter(a=>a.sede).map(a=>a.nome); const sedeValues = sedeNames.map(n => p.attr && p.attr[n] ? { nome:n, val:p.attr[n] } : null).filter(Boolean); const isNoleggio = p.prezzoConsigliato==null && p.prezzoGiorno!=null; const canBook = !['VENDUTO','ARCHIVIATO','NOLEGGIATO','IN_ARRIVO'].includes(p.stato); const hasMin = p.prezzoMinimo!=null; const isNoleggiato = p.stato === 'NOLEGGIATO'; // Carica lo stato iniziale watched useEffect(() => { let cancelled = false; (async () => { const isW = await window.WatchAPI?.isWatching?.(p.id); if (!cancelled) setWatched(!!isW); })(); return () => { cancelled = true; }; }, [p.id]); const handleToggleWatch = async () => { if (watchBusy) return; setWatchBusy(true); const result = await window.WatchAPI?.toggleWatch?.(p.id); setWatchBusy(false); if (!result?.ok) { toast?.('Errore aggiornamento tieni d\'occhio'); return; } setWatched(result.watching); toast?.(result.watching ? 'Aggiunto ai mezzi tenuti d\'occhio' : 'Rimosso dai mezzi tenuti d\'occhio'); }; return (

{/* breadcrumb */}

{cat.nome} {p.sub && <> · {p.sub}}

{/* LEFT — gallery + tech */}

{/* gallery */} {/* technical data */}

Dati tecnici

Attributi attivi per la categoria {cat.nome}

{Object.entries(p.attr).filter(([k])=>!sedeNames.includes(k)).map(([k,v]) => )}

{/* RIGHT — summary + price + actions */}

{p.nuovo && NUOVO} {prodMatricola(p)}

{prodLabel(p)}

{sedeValues.length>0 ? (

{sedeValues.map(s => (

{s.val}

))}

) : p.posizione ? (

{p.posizione}

) : null}

{/* Card noleggio in corso — solo se NOLEGGIATO */} {isNoleggiato && } {/* price card */}

{isNoleggio ? (

) : ( <>

{showMin?'Prezzo minimo autorizzato':'Prezzo di listino'} {hasMin && ( )}

{fmtEur(showMin?p.prezzoMinimo:p.prezzoConsigliato)}

{(p.liste||[p.dest]).join(' · ')}

{p.prezzoGiorno!=null && (

Anche a noleggio{fmtEur(p.prezzoGiorno)}/g · {fmtEur(p.prezzoMese)}/m

)} )}

{/* actions */}

onPrenota(p)} disabled={!canBook}> {canBook ? 'Prenota questo mezzo' : 'Non prenotabile'}

onPDF(p, { withBattery: battOn })}>Genera PDF {watched?'Seguito':'Tieni d\u2019occhio'}

Listino STR — noleggio breve onStorico(p)}>Storico macchina

{/* summary */}

{p.sub && } 1?'Liste':'Lista'} value={(p.liste||[p.dest]).join(' · ')} />

); } function PriceBox({ label, value }) { return (

{label}

{value}

); } /* ============================================================ ProductGallery — galleria foto prodotto con miniature cliccabili ============================================================ */ function ProductGallery({ productId }) { const [media, setMedia] = useState([]); const [selectedIdx, setSelectedIdx] = useState(0); const [loading, setLoading] = useState(true); const [isStd, setIsStd] = useState(true); // formato ~5:4? const onMainLoad = (e) => { const img = e.target; if (img.naturalWidth && img.naturalHeight) { const ratio = img.naturalWidth / img.naturalHeight; setIsStd(Math.abs(ratio - 1350/1080) < 0.06); } }; useEffect(() => { let cancelled = false; (async () => { try { const list = await window.DataAPI.list('product_media', { eq:['product_id', productId] }) || []; const sorted = list.slice().sort((a,b) => { if (a.is_main && !b.is_main) return -1; if (!a.is_main && b.is_main) return 1; return (a.ordine||0) - (b.ordine||0); }); if (!cancelled) { setMedia(sorted); setSelectedIdx(0); } } catch(e) { console.error('ProductGallery load product_media:', e?.message || e, e); } finally { if (!cancelled) setLoading(false); } })(); return () => { cancelled = true; }; }, [productId]); const selected = media[selectedIdx]; if (loading) { return

; } if (media.length === 0) { return (

Nessuna foto disponibile

); } return ( <>

{/* Sfondo sfocato solo se la foto NON è nel formato standard 5:4 */} {!isStd && ( )}

{media.length > 1 && (

{media.slice(0, 8).map((m, i) => ( ))}

)} ); } Object.assign(window, { ProductDetail, BatterySim, InfoRow, PriceBox, NoleggioCorsoCard, ProductGallery });