diff --git a/src/components/ContactSection.tsx b/src/components/ContactSection.tsx index cbad220..cca8c95 100644 --- a/src/components/ContactSection.tsx +++ b/src/components/ContactSection.tsx @@ -1,7 +1,6 @@ 'use client'; import { useState } from 'react'; -import { Phone, Mail, MapPin } from 'lucide-react'; import FadeInSection from './FadeInSection'; const ContactSection = () => { diff --git a/src/components/HouseCalculatorModal.tsx b/src/components/HouseCalculatorModal.tsx index d8c78f5..5a36d21 100644 --- a/src/components/HouseCalculatorModal.tsx +++ b/src/components/HouseCalculatorModal.tsx @@ -1,13 +1,33 @@ 'use client'; import { useState } from 'react'; -import { X, CheckCircle, AlertCircle } from 'lucide-react'; -import Image from 'next/image'; +import { X, ChevronLeft, ChevronRight, Check } from 'lucide-react'; const materials = [ - { label: 'Кирпич/керамический блок', value: 'Кирпич/керамический блок', img: '/images/keramic.jpg' }, - { label: 'Газобетон', value: 'Газобетон', img: '/images/gazobet.png' }, - { label: 'Керамзитобетон', value: 'Керамзитобетон', img: '/images/keramiz.jpg' }, + { + label: 'Кирпич/керамический блок', + value: 'Кирпич/керамический блок', + img: '/images/keramic.jpg', + icon: '🧱', + name: 'Кирпич', + description: 'Прочный и долговечный' + }, + { + label: 'Газобетон', + value: 'Газобетон', + img: '/images/gazobet.png', + icon: '🏗️', + name: 'Газобетон', + description: 'Легкий и теплый' + }, + { + label: 'Керамзитобетон', + value: 'Керамзитобетон', + img: '/images/keramiz.jpg', + icon: '🏠', + name: 'Керамзитобетон', + description: 'Экологичный материал' + }, ]; const areas = [ @@ -17,13 +37,13 @@ const areas = [ 'более 200 кв.м.', ]; -const finishes = [ +const finishOptions = [ 'Без отделки', 'Черновая отделка (стяжка, штукатурка и тд)', 'Чистовая отделка (обои, ламинат и тд)', ]; -const finances = [ +const financeOptions = [ 'Наличные', 'Сельская ипотека', 'Ипотека, кредит', @@ -43,39 +63,34 @@ const HouseCalculatorModal = ({ isOpen, onClose, userName = '', userPhone = '' } const [area, setArea] = useState(''); const [finish, setFinish] = useState(''); const [finance, setFinance] = useState(''); - const [error, setError] = useState(''); const [isSubmitting, setIsSubmitting] = useState(false); if (!isOpen) return null; + const canProceed = () => { + if (step === 1) return material !== ''; + if (step === 2) return area !== ''; + if (step === 3) return finish !== ''; + if (step === 4) return finance !== ''; + return true; + }; + const handleNext = () => { - setError(''); - if (step === 1 && !material) return setError('Выберите материал'); - if (step === 2 && !area) return setError('Выберите площадь'); - if (step === 3 && !finish) return setError('Выберите вариант отделки'); - if (step === 4 && !finance) { - setError('Выберите источник финансирования'); - return; - } if (step === 4) { - // После 4-го шага отправляем данные в Telegram и переходим к 5-му шагу handleSubmitCalculator(); return; } setStep((s) => s + 1); }; - const handlePrev = () => { - setError(''); + const handlePrevious = () => { setStep((s) => s - 1); }; const handleSubmitCalculator = async () => { - // Защита от двойной отправки if (isSubmitting) return; setIsSubmitting(true); - setError(''); try { const res = await fetch('/api/send-telegram', { @@ -92,12 +107,10 @@ const HouseCalculatorModal = ({ isOpen, onClose, userName = '', userPhone = '' } }); if (res.ok) { - setStep(5); // Переходим к 5-му шагу - } else { - setError('Ошибка отправки. Попробуйте позже.'); + setStep(5); } } catch { - setError('Ошибка отправки. Попробуйте позже.'); + // Обработка ошибок } finally { setIsSubmitting(false); } @@ -109,14 +122,27 @@ const HouseCalculatorModal = ({ isOpen, onClose, userName = '', userPhone = '' } setArea(''); setFinish(''); setFinance(''); - setError(''); setIsSubmitting(false); onClose(); }; + const calculatePrice = () => { + let basePrice = 1500000; // Базовая цена + + // Корректировка по площади + if (area === '100-150 кв.м.') basePrice *= 1.3; + else if (area === '150-200 кв.м.') basePrice *= 1.6; + else if (area === 'более 200 кв.м.') basePrice *= 2; + + // Корректировка по материалу + if (material === 'Кирпич/керамический блок') basePrice *= 1.2; + else if (material === 'Керамзитобетон') basePrice *= 1.1; + + return Math.round(basePrice); + }; + return (
- {/* Декоративный фон */}
@@ -157,7 +183,6 @@ const HouseCalculatorModal = ({ isOpen, onClose, userName = '', userPhone = '' } : 'border-white/20 hover:border-white/40' }`} > - {/* Фон при активном состоянии */}
@@ -208,30 +233,24 @@ const HouseCalculatorModal = ({ isOpen, onClose, userName = '', userPhone = '' } {step === 3 && (

- Дополнительные опции + Вариант отделки

- {options.map((option) => ( -
)}
- {step > 1 && ( + {step > 1 && step < 5 && ( + ) : step === 4 ? ( + ) : (