// ФриТаун — sections part 2: ForSale, Services, Works, CTA, Footer, Modal const { useState: useState2, useEffect: useEffect2, useRef: useRef2, useMemo: useMemo2 } = React; // ============================================================================ // ForSale — «В продаже»: 4 вкладки (готовые дома / строится / земля / квартиры) // ============================================================================ function ForSale({ onOpenForm }) { const data = useSiteData(); const head = data.sectionTitles.forSale || { eyebrow: "02 · В продаже", title: "В продаже", sub: "" }; const cats = (data.forSaleCategories || []).slice(); const items = data.forSaleItems || []; const [cat, setCat] = React.useState(cats[0] ? cats[0].id : "ready"); const [active, setActive] = React.useState(null); const curCat = cats.find(c => c.id === cat) || cats[0] || { id: "ready", label: "Готовые дома", hasMortgage: true }; const list = items.filter(i => i.category === cat); return (
{head.eyebrow}

{head.title}

{head.sub}

{list.length} в этой категории
{/* Tabs */}
{cats.map(c => { const count = items.filter(i => i.category === c.id).length; return ( ); })}
{/* Cards */}
{list.length === 0 &&
— В этой категории пока пусто —
} {list.map((it, i) => ( setActive({ it, num: i + 1, cat: curCat })} /> ))}
setActive(null)} onCTA={() => { setActive(null); onOpenForm && onOpenForm(); }} />
); } function ForSaleCard({ it, num, catLabel, hasMortgage, onOpen }) { const images = getAllImages(it); const cover = images[0]; const numLabel = "#" + String(num).padStart(2, "0"); return (
{cover ? ( {it.name} ) : (
{it.name} · {it.area} {it.category === "land" ? "сот." : "м²"}
)} {hasMortgage && Ипотека} {images.length > 1 && ◙ {images.length}} {numLabel}
{catLabel}

{it.name}

{it.address &&
{it.address}
}
{it.category === "land" ? ( <> ◧ {it.land || it.area} сот. {it.year ? ▢ {it.year} : null} ) : ( <> ◧ {it.area} м² {it.beds ? ◉ {it.beds} комн. : null} {it.floors ? ▢ {it.floors} эт. : null} )}
{Number(it.price).toFixed(1)} млн ₽
Открыть →
); } function ForSaleModal({ entry, onClose, onCTA }) { React.useEffect(() => { if (!entry) return; const onKey = (e) => { if (e.key === "Escape") onClose(); }; window.addEventListener("keydown", onKey); const prev = document.body.style.overflow; document.body.style.overflow = "hidden"; return () => { window.removeEventListener("keydown", onKey); document.body.style.overflow = prev; }; }, [entry, onClose]); if (!entry) return null; const { it, num, cat } = entry; const features = Array.isArray(it.features) ? it.features : []; const images = getAllImages(it); const numLabel = "#" + String(num).padStart(2, "0"); const hasMortgage = !!cat.hasMortgage; return (
e.stopPropagation()}>
{numLabel}
{cat.label}

{it.name}

{it.address &&
{it.address}
}
{it.category === "land" ? ( <>
Площадь{it.land || it.area} сот.
Цена{Number(it.price).toFixed(2)} млн ₽
) : ( <>
Площадь{it.area} м²
{it.beds ?
Комнат{it.beds}
: null} {it.floors ?
Этажей{it.floors}
: null} {it.year ?
Год{it.year}
: null}
Цена{Number(it.price).toFixed(1)} млн ₽
)}
{it.description &&

{it.description}

} {features.length > 0 && (
    {features.map((f, i) =>
  • {f}
    • )}
)} {hasMortgage && ( )}
); } // ----- Mortgage calculator (используется внутри карточек объектов в продаже) ----- function MortgageCalc({ priceMln }) { const data = useSiteData(); const cfg = data.mortgage || { defaultDown: 20, defaultYears: 20, defaultRate: 6.5, minYears: 5, maxYears: 30, minDown: 10, maxDown: 90 }; const [down, setDown] = React.useState(cfg.defaultDown); // % const [years, setYears] = React.useState(cfg.defaultYears); const [rate, setRate] = React.useState(cfg.defaultRate); // % const priceRub = Math.round((priceMln || 0) * 1_000_000); const downRub = Math.round(priceRub * (down / 100)); const loan = Math.max(0, priceRub - downRub); const months = Math.max(1, Math.round(years * 12)); const r = (rate / 100) / 12; // Аннуитет const monthly = r === 0 ? loan / months : (loan * r) / (1 - Math.pow(1 + r, -months)); const monthlyRounded = Math.max(0, Math.round(monthly)); const overpay = Math.max(0, Math.round(monthlyRounded * months - loan)); const fmt = (n) => Number(n).toLocaleString("ru-RU"); return (
Ипотечный калькулятор Предварительный расчёт. Условия зависят от банка.
{down}% · {fmt(downRub)} ₽
setDown(+e.target.value)} />
{years} лет
setYears(+e.target.value)} />
{rate.toFixed(1)}%
setRate(+e.target.value)} />
Ежемесячный платёж
{fmt(monthlyRounded)} ₽/мес
Сумма кредита{fmt(loan)} ₽
Переплата{fmt(overpay)} ₽
Итого выплат{fmt(loan + overpay)} ₽
); } // ============================================================================ // Services — «Услуги»: 2 ветки (строительство-смета / ремонтные работы) // ============================================================================ function Services({ onOpenForm }) { const data = useSiteData(); const head = data.sectionTitles.services || { eyebrow: "03 · Услуги", title: "Услуги", sub: "" }; const services = data.services || []; const [active, setActive] = React.useState(services[0] ? services[0].id : "construction"); const cur = services.find(s => s.id === active) || services[0]; return (
{head.eyebrow}

{head.title}

{head.sub}

{/* Picker */}
{services.map((s, i) => ( ))}
{/* Detail */} {cur && (
{cur.eyebrow}

{cur.label}

{cur.desc}

    {(cur.items || []).map((it, i) => (
  • {it.k} {it.price}
    • ))}
)}
); } // ---------- Works carousel (без изменений) ---------- function Works() { const data = useSiteData(); const head = data.sectionTitles.works; const works = data.works || []; const [idx, setIdx] = React.useState(0); const trackRef = React.useRef(null); const max = Math.max(0, works.length - 1); const prev = () => setIdx(i => Math.max(0, i - 1)); const next = () => setIdx(i => Math.min(max, i + 1)); return (
{head.eyebrow}

{head.title}

{head.sub}

{works.map((w, i) => (
{w.image ? ( {w.name} ) : (
{w.type}
)}
{w.name} {w.year}
{w.type}
))}
); } // ---------- CTA band ---------- function CTABand({ onOpenForm }) { const data = useSiteData(); return (

{data.ctaBand}

{data.meta.phone}
); } // ---------- Footer ---------- function Footer() { const data = useSiteData(); const m = data.meta; const [addrLine1, addrLine2] = (m.address || "").split(",").length > 1 ? [m.address.split(",")[0], m.address.split(",").slice(1).join(",").trim()] : [m.address, ""]; return ( ); } // ---------- Modal ---------- function Modal({ open, onClose }) { const [name, setName] = React.useState(""); const [phone, setPhone] = React.useState(""); const [type, setType] = React.useState("Строительство дома"); const [message, setMessage] = React.useState(""); const [errors, setErrors] = React.useState({}); const [submitted, setSubmitted] = React.useState(false); React.useEffect(() => { if (open) { setSubmitted(false); setErrors({}); } const onKey = (e) => { if (e.key === "Escape") onClose(); }; window.addEventListener("keydown", onKey); return () => window.removeEventListener("keydown", onKey); }, [open, onClose]); if (!open) return null; const submit = (e) => { e.preventDefault(); const errs = {}; if (!name.trim()) errs.name = "Укажите имя"; if (!phone.trim() || phone.replace(/\D/g, "").length < 10) errs.phone = "Укажите корректный телефон"; setErrors(errs); if (Object.keys(errs).length) return; try { if (window.SiteData && window.SiteData.notifications) { window.SiteData.notifications.add({ name: name.trim(), phone: phone.trim(), type: type, message: message.trim(), }); } } catch (err) { /* noop */ } setSubmitted(true); }; return (
e.stopPropagation()}> {!submitted ? ( <>

Оставить заявку

Перезвоним в течение 30 минут в рабочее время.

setName(e.target.value)} placeholder="Иван" /> {errors.name &&
{errors.name}
}
setPhone(e.target.value)} placeholder="+7 (___) ___-__-__" /> {errors.phone &&
{errors.phone}
}