// Results listing page — premium redesign // Araç görseli — yerel dosya öncelikli, hata olursa SVG silhouette (page-home.jsx'ten) const ResultVehicleImg = ({ cat, name, catLabel, accent }) => { const [src, setSrc] = React.useState(`img/vehicles/${cat}.jpg`); const [failed, setFailed] = React.useState(false); const onErr = () => { if (src.endsWith(".jpg")) { setSrc(`img/vehicles/${cat}.webp`); return; } if (src.endsWith(".webp")) { setSrc(`img/vehicles/${cat}.png`); return; } setFailed(true); }; return (
{catLabel}
{failed ? (
{typeof CAR_SVG !== "undefined" && CAR_SVG[cat]} {name}
) : ( {name} )}
); }; // Statik fallback — API bağlanana kadar gösterilir const RESULTS_DATA = [ { id: "shuttle", cat: "shuttle", catLabel: "SHUTTLE", name: "Paylaşımlı Shuttle", model: "Mercedes Sprinter · 16 koltuk", pax: 16, bag: 16, doors: 4, priceTry: 280, perSeat: true, eco: true, features: ["A/C Klimalı", "Wi-Fi", "Profesyonel Şoför", "Paylaşımlı"], img: "Mercedes Sprinter Shuttle" }, { id: "taxi", cat: "taxi", catLabel: "TAXI", name: "Özel Taksi Transfer", model: "Toyota Corolla / Renault Talisman", pax: 3, bag: 3, doors: 4, priceTry: 1200, perSeat: false, features: ["A/C Klimalı", "Özel Transfer", "Wi-Fi", "Su İkramı"], img: "Sedan Taxi" }, { id: "vip", cat: "vip", catLabel: "VIP CAR", name: "VIP Premium Transfer", model: "Mercedes E-Class W213", pax: 3, bag: 3, doors: 4, priceTry: 2400, perSeat: false, featured: true, features: ["Premium Deri", "Wi-Fi", "Su & Atıştırmalık", "Karşılama Tabelası", "Lüks Şoför"], img: "Mercedes E-Class VIP" }, { id: "minivan", cat: "minivan", catLabel: "MINIVAN", name: "Aile / Grup Minivan", model: "Mercedes Vito Tourer", pax: 7, bag: 7, doors: 5, priceTry: 1800, perSeat: false, family: true, features: ["A/C Klimalı", "Wi-Fi", "Geniş Bagaj", "Bebek Koltuğu Eklenebilir"], img: "Mercedes Vito Minivan" }, { id: "vip-van", cat: "minivan", catLabel: "VIP MINIVAN", name: "VIP Minivan", model: "Mercedes V-Class", pax: 6, bag: 6, doors: 5, priceTry: 3200, perSeat: false, features: ["Premium Deri", "Wi-Fi", "Su & Atıştırmalık", "Geniş Bagaj"], img: "Mercedes V-Class VIP" }, ]; const CAT_META = { shuttle: { label: "Shuttle", icon: "users", accent: "#6B7596" }, taxi: { label: "Taxi", icon: "car", accent: "#0B3D91" }, vip: { label: "VIP Car", icon: "sparkle", accent: "#B91C1C" }, minivan: { label: "Minivan", icon: "bag", accent: "#4F46A8" }, }; const addMinutes = (hhmm, mins) => { const [h, m] = hhmm.split(":").map(Number); const total = h * 60 + m + mins; const nh = Math.floor((total % (24 * 60)) / 60); const nm = total % 60; return `${String(nh).padStart(2, "0")}:${String(nm).padStart(2, "0")}`; }; const ResultsPage = ({ lang, ccy, query, setQuery, onSearch, onSelect }) => { const [filter, setFilter] = React.useState({ shuttle: true, taxi: true, vip: true, minivan: true }); const [features, setFeatures] = React.useState({ ac: true, wifi: false, baby: false, sign: false, water: false }); const [sort, setSort] = React.useState("recommended"); const [activeCat, setActiveCat] = React.useState("all"); const [priceMax, setPriceMax] = React.useState(5000); // API'den araç listesi — hata olursa RESULTS_DATA fallback const [apiVehicles, setApiVehicles] = React.useState(null); React.useEffect(() => { const pax = (query.adults || 1) + (query.children || 0); engApi.get(`/api/vehicle/search?passengers=${pax}`) .then(data => setApiVehicles(data.map(mapVehicle))) .catch(() => setApiVehicles(null)); }, [query.adults, query.children]); const allData = apiVehicles || RESULTS_DATA; const fromName = query.from?.name || "Antalya Havalimanı (AYT)"; const toName = query.to?.name || "Lara Bölgesi"; const distance = 42; const duration = 38; const pickupTime = query.pickupTime || "14:30"; const dropoffTime = addMinutes(pickupTime, duration); const counts = { all: allData.length }; allData.forEach(r => { counts[r.cat] = (counts[r.cat] || 0) + 1; }); const visible = allData.filter(r => (activeCat === "all" || r.cat === activeCat) && filter[r.cat] && r.priceTry <= priceMax); const sorted = [...visible].sort((a, b) => { if (sort === "price-asc") return a.priceTry - b.priceTry; if (sort === "price-desc") return b.priceTry - a.priceTry; if (sort === "pax") return b.pax - a.pax; return (b.featured ? 1 : 0) - (a.featured ? 1 : 0) || a.priceTry - b.priceTry; }); return (
{/* Compact widget */}
{/* Trip overview banner */}
{pickupTime} · ALIŞ {fromName}
{duration} dk {distance} km
{dropoffTime} · BIRAKIŞ {toName}
{query.adults} yetişkin{query.children > 0 ? `, ${query.children} çocuk` : ""}
{query.pickupDate}
{/* Category tabs */}
{[ { id: "all", label: "Tüm Araçlar", icon: "car" }, { id: "shuttle", label: "Shuttle", icon: "users" }, { id: "taxi", label: "Taxi", icon: "car" }, { id: "vip", label: "VIP Car", icon: "sparkle" }, { id: "minivan", label: "Minivan", icon: "bag" }, ].map(c => ( ))}
{/* Results main */}
{sorted.length} araç bulundu
Tüm fiyatlara KDV dahildir · ücretsiz iptal · sabit fiyat garantisi
Sırala
{sorted.map((r, idx) => { const p = fmtPrice(r.priceTry, ccy); const meta = CAT_META[r.cat]; return (
{r.featured && (
★ EN POPÜLER
)} {/* Image */}
{r.eco && (
EKO
)} {r.family && (
AİLE
)}
4 görsel ↓
{[0,1,2,3].map(i => )}
{/* Body */}

{r.name}

{r.model}
{r.pax} yolcu {r.bag} bagaj {r.doors} kapı A/C
{/* Trip mini-strip */}
{pickupTime} · ALIŞ
{fromName}
~{duration} dk {distance} km
{dropoffTime} · BIRAKIŞ
{toName}
{r.features.slice(0, 4).map(f => ( {f} ))} {r.features.length > 4 && ( +{r.features.length - 4} özellik )}
{/* Side / price */}
{r.perSeat ? "Kişi başı" : "Toplam fiyat"}
{p.symbol}{p.value}
· KDV dahil
{r.priceTry > 1500 && (
ya da 3 taksit{" "} {fmtPrice(Math.round(r.priceTry / 3), ccy).symbol}{fmtPrice(Math.round(r.priceTry / 3), ccy).value}
)}
Ücretsiz iptal · 24 saat
Anında onay
); })} {sorted.length === 0 && (
Filtrelerle eşleşen araç yok

Filtreleri sıfırlayın ya da kategoriyi "Tüm Araçlar" yapın.

)}
Aradığınızı bulamadınız mı?
7/24 müşteri hizmetlerimiz size özel araç ve fiyat teklifi hazırlasın.
); }; window.ResultsPage = ResultsPage;