diff --git a/src/components/PartDetailCard.tsx b/src/components/PartDetailCard.tsx index 387bc46..57148a1 100644 --- a/src/components/PartDetailCard.tsx +++ b/src/components/PartDetailCard.tsx @@ -3,7 +3,6 @@ import { useRouter } from 'next/router'; import { useLazyQuery } from '@apollo/client'; import { LaximoOEMResult } from '@/types/laximo'; import { SEARCH_LAXIMO_OEM } from '@/lib/graphql'; -import BrandSelectionModal from './BrandSelectionModal'; interface PartDetailCardProps { oem: string; @@ -30,7 +29,6 @@ const PartDetailCard: React.FC = ({ }) => { const router = useRouter(); const [localExpanded, setLocalExpanded] = useState(false); - const [isBrandModalOpen, setIsBrandModalOpen] = useState(false); // Используем локальное состояние если нет внешнего контроля const expanded = onToggleExpand ? isExpanded : localExpanded; @@ -53,13 +51,12 @@ const PartDetailCard: React.FC = ({ const handleFindOffers = () => { console.log('🔍 Выбрана деталь для поиска предложений:', name, 'OEM:', oem); - // Показываем модал выбора бренда - setIsBrandModalOpen(true); + // Переходим на страницу выбора бренда + const url = `/vehicle-search/${catalogCode}/${vehicleId}/part/${oem}/brands?detailName=${encodeURIComponent(name || '')}`; + router.push(url); }; - const handleCloseBrandModal = () => { - setIsBrandModalOpen(false); - }; + const handleOpenFullInfo = () => { // Переход на отдельную страницу с детальной информацией о детали @@ -250,13 +247,6 @@ const PartDetailCard: React.FC = ({ )} - {/* Модал выбора бренда */} - ); }; diff --git a/src/components/vin/KnotParts.tsx b/src/components/vin/KnotParts.tsx index 6e11cb0..e1eaa2f 100644 --- a/src/components/vin/KnotParts.tsx +++ b/src/components/vin/KnotParts.tsx @@ -1,6 +1,5 @@ import React, { useState } from "react"; import { useRouter } from "next/router"; -import BrandSelectionModal from '../BrandSelectionModal'; interface KnotPartsProps { parts?: Array<{ @@ -15,16 +14,18 @@ interface KnotPartsProps { attributes?: Array<{ key: string; name?: string; value: string }>; }>; selectedCodeOnImage?: string | number; + catalogCode?: string; + vehicleId?: string; } -const KnotParts: React.FC = ({ parts = [], selectedCodeOnImage }) => { - const [isBrandModalOpen, setIsBrandModalOpen] = useState(false); - const [selectedDetail, setSelectedDetail] = useState<{ oem: string; name: string } | null>(null); +const KnotParts: React.FC = ({ parts = [], selectedCodeOnImage, catalogCode, vehicleId }) => { + const router = useRouter(); const handlePriceClick = (part: any) => { - if (part.oem) { - setSelectedDetail({ oem: part.oem, name: part.name || '' }); - setIsBrandModalOpen(true); + if (part.oem && catalogCode && vehicleId !== undefined) { + // Переходим на страницу выбора бренда + const url = `/vehicle-search/${catalogCode}/${vehicleId}/part/${part.oem}/brands?detailName=${encodeURIComponent(part.name || '')}`; + router.push(url); } }; @@ -72,12 +73,6 @@ const KnotParts: React.FC = ({ parts = [], selectedCodeOnImage } ); })} - setIsBrandModalOpen(false)} - articleNumber={selectedDetail?.oem || ''} - detailName={selectedDetail?.name || ''} - /> ); }; diff --git a/src/components/vin/VinLeftbar.tsx b/src/components/vin/VinLeftbar.tsx index f179457..2267871 100644 --- a/src/components/vin/VinLeftbar.tsx +++ b/src/components/vin/VinLeftbar.tsx @@ -1,7 +1,6 @@ import React, { useState, useEffect } from "react"; import { useLazyQuery, useQuery } from '@apollo/client'; import { GET_LAXIMO_FULLTEXT_SEARCH, GET_LAXIMO_CATEGORIES, GET_LAXIMO_UNITS, GET_LAXIMO_QUICK_GROUPS, GET_LAXIMO_QUICK_DETAIL } from '@/lib/graphql/laximo'; -import VinPartCard from './VinPartCard'; interface VinLeftbarProps { vehicleInfo?: { diff --git a/src/components/vin/VinPartCard.tsx b/src/components/vin/VinPartCard.tsx index 8dbd165..71582cb 100644 --- a/src/components/vin/VinPartCard.tsx +++ b/src/components/vin/VinPartCard.tsx @@ -1,22 +1,27 @@ -import React, { useState } from "react"; +import React from "react"; import { useRouter } from 'next/router'; -import BrandSelectionModal from '../BrandSelectionModal'; interface VinPartCardProps { n?: number; oem: string; name: string; onPriceClick?: () => void; + catalogCode?: string; + vehicleId?: string; } -const VinPartCard: React.FC = ({ n, oem, name, onPriceClick }) => { +const VinPartCard: React.FC = ({ n, oem, name, onPriceClick, catalogCode, vehicleId }) => { const router = useRouter(); - const [isBrandModalOpen, setIsBrandModalOpen] = useState(false); const handlePriceClick = (e: React.MouseEvent) => { e.preventDefault(); if (onPriceClick) onPriceClick(); - setIsBrandModalOpen(true); + + if (catalogCode && vehicleId !== undefined) { + // Переходим на страницу выбора бренда + const url = `/vehicle-search/${catalogCode}/${vehicleId}/part/${oem}/brands?detailName=${encodeURIComponent(name || '')}`; + router.push(url); + } }; return ( @@ -36,12 +41,6 @@ const VinPartCard: React.FC = ({ n, oem, name, onPriceClick }) - setIsBrandModalOpen(false)} - articleNumber={oem} - detailName={name} - /> ); }; diff --git a/src/components/vin/VinQuick.tsx b/src/components/vin/VinQuick.tsx index 6080f20..07be433 100644 --- a/src/components/vin/VinQuick.tsx +++ b/src/components/vin/VinQuick.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { useQuery } from '@apollo/client'; +import { useRouter } from 'next/router'; import { GET_LAXIMO_QUICK_DETAIL } from '@/lib/graphql/laximo'; -import BrandSelectionModal from '../BrandSelectionModal'; interface VinQuickProps { quickGroup: any; @@ -13,6 +13,8 @@ interface VinQuickProps { } const VinQuick: React.FC = ({ quickGroup, catalogCode, vehicleId, ssd, onBack, onNodeSelect }) => { + const router = useRouter(); + const { data, loading, error } = useQuery(GET_LAXIMO_QUICK_DETAIL, { variables: { catalogCode, @@ -24,11 +26,6 @@ const VinQuick: React.FC = ({ quickGroup, catalogCode, vehicleId, }); const quickDetail = data?.laximoQuickDetail; - - - const [isBrandModalOpen, setIsBrandModalOpen] = useState(false); - const [selectedDetail, setSelectedDetail] = useState(null); - const handleUnitClick = (unit: any) => { onNodeSelect({ ...unit, @@ -39,13 +36,13 @@ const VinQuick: React.FC = ({ quickGroup, catalogCode, vehicleId, ssd: unit.ssd || ssd // Используем SSD узла, а не родительский }); }; + const handleDetailClick = (detail: any) => { - setSelectedDetail(detail); - setIsBrandModalOpen(true); - }; - const handleCloseBrandModal = () => { - setIsBrandModalOpen(false); - setSelectedDetail(null); + if (detail.oem) { + // Переходим на страницу выбора бренда + const url = `/vehicle-search/${catalogCode}/${vehicleId}/part/${detail.oem}/brands?detailName=${encodeURIComponent(detail.name || '')}`; + router.push(url); + } }; return ( @@ -90,14 +87,6 @@ const VinQuick: React.FC = ({ quickGroup, catalogCode, vehicleId, ) : (
Нет деталей для этой группы
)} - {isBrandModalOpen && selectedDetail && ( - - )} ); }; diff --git a/src/pages/vehicle-search/[brand]/[vehicleId].tsx b/src/pages/vehicle-search/[brand]/[vehicleId].tsx index ab4f9d7..4c251be 100644 --- a/src/pages/vehicle-search/[brand]/[vehicleId].tsx +++ b/src/pages/vehicle-search/[brand]/[vehicleId].tsx @@ -362,6 +362,8 @@ const VehicleDetailsPage = () => { n={idx + 1} name={detail.name} oem={detail.oem} + catalogCode={vehicleInfo.catalog} + vehicleId={vehicleInfo.vehicleid} /> )) ) : ( @@ -419,7 +421,11 @@ const VehicleDetailsPage = () => { ) : unitDetailsError ? (
Ошибка загрузки деталей: {unitDetailsError.message}
) : unitDetails.length > 0 ? ( - + ) : (
Детали не найдены
)} diff --git a/src/pages/vehicle-search/[brand]/[vehicleId]/part/[oemNumber]/brands.tsx b/src/pages/vehicle-search/[brand]/[vehicleId]/part/[oemNumber]/brands.tsx new file mode 100644 index 0000000..3ef9246 --- /dev/null +++ b/src/pages/vehicle-search/[brand]/[vehicleId]/part/[oemNumber]/brands.tsx @@ -0,0 +1,259 @@ +import React, { useState, useEffect } from 'react'; +import { useRouter } from 'next/router'; +import { useQuery } from '@apollo/client'; +import Head from 'next/head'; +import Footer from '@/components/Footer'; +import { GET_BRANDS_BY_CODE, GET_LAXIMO_CATALOG_INFO } from '@/lib/graphql'; +import { LaximoCatalogInfo } from '@/types/laximo'; + +const InfoBrandSelection = ({ + brandName, + oemNumber, + detailName +}: { + brandName: string; + oemNumber: string; + detailName?: string; +}) => ( +
+
+
+
+ +
Главная
+ +
→
+ +
Каталог
+ +
→
+
{brandName}
+
→
+
Деталь {oemNumber}
+
→
+
Выбор производителя
+
+
+
+

Выберите производителя

+
+
+
+ {detailName && Деталь: {detailName} • } + Артикул: {oemNumber} +
+
+
+
+); + +const BrandSelectionPage = () => { + const router = useRouter(); + const { brand, vehicleId, oemNumber, detailName } = router.query; + + // Получаем информацию о каталоге + const { data: catalogData, loading: catalogLoading } = useQuery<{ laximoCatalogInfo: LaximoCatalogInfo }>( + GET_LAXIMO_CATALOG_INFO, + { + variables: { catalogCode: brand }, + skip: !brand, + errorPolicy: 'all', + } + ); + + // Получаем список брендов по артикулу + const { data, loading, error } = useQuery(GET_BRANDS_BY_CODE, { + variables: { code: oemNumber }, + skip: !oemNumber, + errorPolicy: 'all' + }); + + if (!brand || vehicleId === undefined || vehicleId === null || !oemNumber) { + return ( + <> + + Выбор производителя + +
+
+

+ Неверные параметры +

+

+ Неверные параметры для выбора производителя +

+ +
+
+