From d6d086299f658995f8e493dee534433ac2c67472 Mon Sep 17 00:00:00 2001 From: egortriston Date: Fri, 4 Jul 2025 18:51:57 +0300 Subject: [PATCH] =?UTF-8?q?=D0=A1=D0=BE=D0=B7=D0=B4=D0=B0=D0=BD=D0=B8?= =?UTF-8?q?=D0=B5=20=D0=BF=D1=80=D0=BE=D1=82=D0=BE=D1=82=D0=B8=D0=BF=D0=B0?= =?UTF-8?q?=20=D0=B3=D0=BB=D0=B0=D0=B2=D0=BD=D0=BE=D0=B9=20=D1=81=D1=82?= =?UTF-8?q?=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D1=8B=20home-new,=20=D0=B8=D0=B7?= =?UTF-8?q?=D0=BC=D0=B5=D0=BD=D0=B5=D0=BD=D0=B8=D0=B5=20=D1=81=D1=82=D0=B8?= =?UTF-8?q?=D0=BB=D0=B5=D0=B9=20=D0=BD=D0=B0=20=D0=BE=D1=81=D1=82=D0=B0?= =?UTF-8?q?=D0=BB=D1=8C=D0=BD=D1=8B=D1=85=20=D1=81=D1=82=D1=80=D0=B0=D0=BD?= =?UTF-8?q?=D0=B8=D1=86=D0=B0=D1=85.=20=D0=A2=D1=80=D0=B5=D0=B1=D1=83?= =?UTF-8?q?=D0=B5=D1=82=D1=81=D1=8F=20=D0=B4=D0=B0=D0=BB=D1=8C=D0=BD=D0=B5?= =?UTF-8?q?=D0=B9=D1=88=D0=B5=D0=B5=20=D1=82=D0=B5=D1=81=D1=82=D0=B8=D1=80?= =?UTF-8?q?=D0=BE=D0=B2=D0=B0=D0=BD=D0=B8=D0=B5.=20=D0=BB=D0=BE=D0=B3?= =?UTF-8?q?=D0=B8=D0=BA=D0=B0=20=D0=B2=D1=8B=D0=B1=D0=BE=D1=80=D0=B0=20?= =?UTF-8?q?=D0=B0=D0=B2=D1=82=D0=BE=20=D1=81=D0=B4=D0=B5=D0=BB=D0=B0=D0=BD?= =?UTF-8?q?=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/VehicleSearchResults.tsx | 10 +- src/components/index/BestPriceSection.tsx | 43 + .../index/BrandSelectionSection.tsx | 158 ++ src/components/index/CategoryNavSection.tsx | 39 + src/components/index/IndexTopMenuNav.tsx | 36 + src/components/index/NewArrivalsSection.tsx | 54 + src/components/index/NewsAndPromos.tsx | 2 +- src/components/index/ProductOfDaySection.tsx | 67 + src/components/index/PromoImagesSection.tsx | 21 + src/components/index/SupportVinSection.tsx | 25 + src/components/index/TopSalesSection.tsx | 44 + src/pages/home-new.tsx | 44 + src/styles/my.css | 200 ++ src/styles/protekproject.webflow.css | 2441 ++++++++++------- 14 files changed, 2153 insertions(+), 1031 deletions(-) create mode 100644 src/components/index/BestPriceSection.tsx create mode 100644 src/components/index/BrandSelectionSection.tsx create mode 100644 src/components/index/CategoryNavSection.tsx create mode 100644 src/components/index/IndexTopMenuNav.tsx create mode 100644 src/components/index/NewArrivalsSection.tsx create mode 100644 src/components/index/ProductOfDaySection.tsx create mode 100644 src/components/index/PromoImagesSection.tsx create mode 100644 src/components/index/SupportVinSection.tsx create mode 100644 src/components/index/TopSalesSection.tsx create mode 100644 src/pages/home-new.tsx diff --git a/src/components/VehicleSearchResults.tsx b/src/components/VehicleSearchResults.tsx index c74deb8..4843421 100644 --- a/src/components/VehicleSearchResults.tsx +++ b/src/components/VehicleSearchResults.tsx @@ -79,7 +79,7 @@ const VehicleSearchResults: React.FC = ({

{vehicle.name || `${vehicle.brand} ${vehicle.model}`} -

+

{vehicle.modification} ({vehicle.year})

@@ -91,7 +91,7 @@ const VehicleSearchResults: React.FC = ({ {renderAttribute('Марка', vehicle.brand)} {renderAttribute('Модель', vehicle.model)} {renderAttribute('Двигатель', vehicle.engine)} -
+ {/* Все атрибуты из API */} {vehicle.attributes && vehicle.attributes.length > 0 && ( @@ -103,8 +103,8 @@ const VehicleSearchResults: React.FC = ({ {attr.value} ))} - - )} + + )} {/* Технические характеристики (fallback для старых данных) */} {(!vehicle.attributes || vehicle.attributes.length === 0) && ( @@ -170,7 +170,7 @@ const VehicleSearchResults: React.FC = ({ 
                   {JSON.stringify(vehicle, null, 2)}
- + )} ))} diff --git a/src/components/index/BestPriceSection.tsx b/src/components/index/BestPriceSection.tsx new file mode 100644 index 0000000..7fa6bd1 --- /dev/null +++ b/src/components/index/BestPriceSection.tsx @@ -0,0 +1,43 @@ +import React from "react"; + +const BestPriceSection: React.FC = () => ( +
+
+
+
+

ЛУЧШАЯ ЦЕНА!

+
Подборка лучших предложенийпо цене
+ Показать все +
+
+ {[...Array(8)].map((_, i) => ( +
+
+
+
+
+
-35%
+
+
+
+
от 17 087 ₽
+
22 347 ₽
+
+
+
Аккумуляторная батарея TYUMEN BATTERY "STANDARD", 6CT-60L, 60
+ +
+
+
+ +
+
+
+ ))} +
+
+
+
+); + +export default BestPriceSection; \ No newline at end of file diff --git a/src/components/index/BrandSelectionSection.tsx b/src/components/index/BrandSelectionSection.tsx new file mode 100644 index 0000000..cc3011b --- /dev/null +++ b/src/components/index/BrandSelectionSection.tsx @@ -0,0 +1,158 @@ +import React, { useState } from "react"; +import { useRouter } from "next/router"; +import { useQuery } from "@apollo/client"; +import { GET_LAXIMO_BRANDS } from "@/lib/graphql"; +import { LaximoBrand } from "@/types/laximo"; + +const tabs = [ + "Техническое обслуживание", + "Легковые", + "Грузовые", + "Коммерческие", +]; + +type Brand = { name: string; code?: string }; + +const BrandSelectionSection: React.FC = () => { + const [activeTab, setActiveTab] = useState(0); + const [selectedBrand, setSelectedBrand] = useState(""); + const router = useRouter(); + + const { data, loading, error } = useQuery<{ laximoBrands: LaximoBrand[] }>(GET_LAXIMO_BRANDS, { + errorPolicy: 'all' + }); + + const staticBrands: Brand[] = [ + { name: "Audi" }, + { name: "BMW" }, + { name: "Cadillac" }, + { name: "Chevrolet" }, + { name: "Citroen" }, + { name: "Fiat" }, + { name: "Mazda" } + ]; + + let brands: Brand[] = staticBrands; + if (data?.laximoBrands && data.laximoBrands.length > 0) { + brands = data.laximoBrands.map(brand => ({ + name: brand.name, + code: brand.code + })); + } else if (error) { + console.warn('Laximo API недоступен, используются статические данные:', error.message); + } + + const handleBrandClick = (brand: Brand) => { + if (brand.code) { + router.push(`/brands?selected=${brand.code}`); + } else { + console.warn('Brand code not available for', brand.name); + } + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + if (selectedBrand) { + const found = brands.find(b => b.code === selectedBrand || b.name === selectedBrand); + if (found && found.code) { + router.push(`/brands?selected=${found.code}`); + return; + } + } + router.push("/brands"); + }; + + if (loading) { + return ( +
+
+
+

Подбор по маркам

+
Загрузка брендов...
+
+
+
+ ); + } + + return ( +
+
+
+

Подбор по маркам

+
+
+
+ {tabs.map((tab, idx) => ( +
setActiveTab(idx)} + style={{ cursor: "pointer" }} + > + {tab} +
+ ))} +
+
+ {[...Array(5)].map((_, colIdx) => ( +
+ {brands.slice(colIdx * Math.ceil(brands.length / 5), (colIdx + 1) * Math.ceil(brands.length / 5)).map((brand, idx) => ( + + ))} +
+ ))} +
+ +
+
+

ПОДБОР АВТОЗАПЧАСТЕЙ ПО МАРКЕ АВТО

+
+
+ +
+ +
+
+
+
Thank you! Your submission has been received!
+
+
+
Oops! Something went wrong while submitting the form.
+
+
+
+
+
+
+
+ ); +}; + +export default BrandSelectionSection; \ No newline at end of file diff --git a/src/components/index/CategoryNavSection.tsx b/src/components/index/CategoryNavSection.tsx new file mode 100644 index 0000000..f5a0dec --- /dev/null +++ b/src/components/index/CategoryNavSection.tsx @@ -0,0 +1,39 @@ +import React from "react"; + +const CategoryNavSection: React.FC = () => ( +
+
+
+
+
Детали для ТО
+
+
+
Шины
+
+
+
Диски
+
+
+
Масла и жидкости
+
+
+
Инструменты
+
+
+
Автохимия
+
+
+
Аксессуары
+
+
+
Электрика
+
+
+
АКБ
+
+
+
+
+); + +export default CategoryNavSection; \ No newline at end of file diff --git a/src/components/index/IndexTopMenuNav.tsx b/src/components/index/IndexTopMenuNav.tsx new file mode 100644 index 0000000..0ba236c --- /dev/null +++ b/src/components/index/IndexTopMenuNav.tsx @@ -0,0 +1,36 @@ +import React from 'react'; + +const IndexTopMenuNav = () => ( +
+ +
+); + +export default IndexTopMenuNav; \ No newline at end of file diff --git a/src/components/index/NewArrivalsSection.tsx b/src/components/index/NewArrivalsSection.tsx new file mode 100644 index 0000000..2fbc904 --- /dev/null +++ b/src/components/index/NewArrivalsSection.tsx @@ -0,0 +1,54 @@ +import React from "react"; + +const NewArrivalsSection: React.FC = () => ( +
+
+
+
+

Новое поступление

+
+
+ {[...Array(8)].map((_, i) => ( +
+
+
+
+
+ Новое поступление: Аккумуляторная батарея TYUMEN BATTERY +
-35%
+
+
+
+
от 17 087 ₽
+
22 347 ₽
+
+
+
+
Аккумуляторная батарея TYUMEN BATTERY "STANDARD", 6CT-60L, 60
+
Borsehung
+
+ +
+
+
+ +
+
+
+ ))} +
+
+
+
+); + +export default NewArrivalsSection; \ No newline at end of file diff --git a/src/components/index/NewsAndPromos.tsx b/src/components/index/NewsAndPromos.tsx index a3d1d92..b9a9604 100644 --- a/src/components/index/NewsAndPromos.tsx +++ b/src/components/index/NewsAndPromos.tsx @@ -3,7 +3,7 @@ import NewsCard from "@/components/news/NewsCard"; import Link from "next/link"; const NewsAndPromos = () => ( -
+
diff --git a/src/components/index/ProductOfDaySection.tsx b/src/components/index/ProductOfDaySection.tsx new file mode 100644 index 0000000..02f3ca2 --- /dev/null +++ b/src/components/index/ProductOfDaySection.tsx @@ -0,0 +1,67 @@ +import React from "react"; + +const ProductOfDaySection: React.FC = () => ( +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+
+
+
+
+
+
+

ТОВАРЫ ДНЯ

+
-35%
+
+
+
+
+
от 17 087 ₽
+
22 347 ₽
+
+
Аккумуляторная батарея TYUMEN BATTERY "STANDARD", 6CT-60L, 60
+
+
+
+
+
+ +
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+); + +export default ProductOfDaySection; \ No newline at end of file diff --git a/src/components/index/PromoImagesSection.tsx b/src/components/index/PromoImagesSection.tsx new file mode 100644 index 0000000..678f547 --- /dev/null +++ b/src/components/index/PromoImagesSection.tsx @@ -0,0 +1,21 @@ +import React from "react"; + +const PromoImagesSection: React.FC = () => ( +
+
+
+
+ Промо 1 +
+
+ Промо 2 +
+
+ Промо 3 +
+
+
+
+); + +export default PromoImagesSection; \ No newline at end of file diff --git a/src/components/index/SupportVinSection.tsx b/src/components/index/SupportVinSection.tsx new file mode 100644 index 0000000..0c4bb32 --- /dev/null +++ b/src/components/index/SupportVinSection.tsx @@ -0,0 +1,25 @@ +import React from "react"; + +const SupportVinSection: React.FC = () => ( +
+
+ Поддержка: помощь с VIN-запросом +
+
+

МЫ ВСЕГДА РАДЫ ПОМОЧЬ

+
+ Если вам нужна помощь с подбором автозапчастей, то воспользуйтесь формой VIN-запроса. Введите идентификационный номер (VIN) вашего автомобиля — и мы найдём нужную деталь. +
+
+ Отправить VIN-запрос +
+
+
+); + +export default SupportVinSection; \ No newline at end of file diff --git a/src/components/index/TopSalesSection.tsx b/src/components/index/TopSalesSection.tsx new file mode 100644 index 0000000..f622498 --- /dev/null +++ b/src/components/index/TopSalesSection.tsx @@ -0,0 +1,44 @@ +import React from "react"; + +const TopSalesSection: React.FC = () => ( +
+
+
+
+

Топ продаж

+
+
+ {[...Array(8)].map((_, i) => ( +
+
+
+
+
+
-35%
+
+
+
+
от 17 087 ₽
+
22 347 ₽
+
+
+
+
Аккумуляторная батарея TYUMEN BATTERY "STANDARD", 6CT-60L, 60
+
Borsehung
+
+ +
+
+
+ +
+
+
+ ))} +
+
+
+
+); + +export default TopSalesSection; \ No newline at end of file diff --git a/src/pages/home-new.tsx b/src/pages/home-new.tsx new file mode 100644 index 0000000..5d76b89 --- /dev/null +++ b/src/pages/home-new.tsx @@ -0,0 +1,44 @@ +import React from 'react'; +import Head from 'next/head'; +import CatalogSubscribe from "@/components/CatalogSubscribe"; +import MobileMenuBottomSection from "@/components/MobileMenuBottomSection"; +import NewsAndPromos from "@/components/index/NewsAndPromos"; +import Footer from "@/components/Footer"; +import IndexTopMenuNav from "@/components/index/IndexTopMenuNav"; +import ProductOfDaySection from "@/components/index/ProductOfDaySection"; +import CategoryNavSection from "@/components/index/CategoryNavSection"; +import BrandSelectionSection from "@/components/index/BrandSelectionSection"; +import BestPriceSection from "@/components/index/BestPriceSection"; +import TopSalesSection from "@/components/index/TopSalesSection"; +import PromoImagesSection from "@/components/index/PromoImagesSection"; +import NewArrivalsSection from '@/components/index/NewArrivalsSection'; +import SupportVinSection from '@/components/index/SupportVinSection'; + +export default function HomeNew () { + return ( + <> + + Home New + + + + + + + + + + + + + + + +
+ +
+