Удалены модальные окна выбора бренда из компонентов PartDetailCard, KnotParts, VinPartCard и VinQuick. Вместо этого добавлена логика для перехода на страницу выбора бренда при клике на деталь. Обновлены компоненты для передачи параметров catalogCode и vehicleId. Исправлены типы и улучшена читаемость кода.

This commit is contained in:
Bivekich
2025-07-02 18:03:37 +03:00
parent a9e4b74179
commit 8aa5ab007d
8 changed files with 298 additions and 61 deletions

View File

@ -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<PartDetailCardProps> = ({
}) => {
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<PartDetailCardProps> = ({
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<PartDetailCardProps> = ({
</div>
)}
{/* Модал выбора бренда */}
<BrandSelectionModal
isOpen={isBrandModalOpen}
onClose={handleCloseBrandModal}
articleNumber={oem}
detailName={name}
/>
</div>
);
};

View File

@ -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<KnotPartsProps> = ({ parts = [], selectedCodeOnImage }) => {
const [isBrandModalOpen, setIsBrandModalOpen] = useState(false);
const [selectedDetail, setSelectedDetail] = useState<{ oem: string; name: string } | null>(null);
const KnotParts: React.FC<KnotPartsProps> = ({ 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<KnotPartsProps> = ({ parts = [], selectedCodeOnImage }
);
})}
</div>
<BrandSelectionModal
isOpen={isBrandModalOpen}
onClose={() => setIsBrandModalOpen(false)}
articleNumber={selectedDetail?.oem || ''}
detailName={selectedDetail?.name || ''}
/>
</>
);
};

View File

@ -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?: {

View File

@ -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<VinPartCardProps> = ({ n, oem, name, onPriceClick }) => {
const VinPartCard: React.FC<VinPartCardProps> = ({ 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<VinPartCardProps> = ({ n, oem, name, onPriceClick })
</div>
</div>
</div>
<BrandSelectionModal
isOpen={isBrandModalOpen}
onClose={() => setIsBrandModalOpen(false)}
articleNumber={oem}
detailName={name}
/>
</>
);
};

View File

@ -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<VinQuickProps> = ({ 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<VinQuickProps> = ({ quickGroup, catalogCode, vehicleId,
});
const quickDetail = data?.laximoQuickDetail;
const [isBrandModalOpen, setIsBrandModalOpen] = useState(false);
const [selectedDetail, setSelectedDetail] = useState<any>(null);
const handleUnitClick = (unit: any) => {
onNodeSelect({
...unit,
@ -39,13 +36,13 @@ const VinQuick: React.FC<VinQuickProps> = ({ 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<VinQuickProps> = ({ quickGroup, catalogCode, vehicleId,
) : (
<div className="text-center text-gray-500 py-4">Нет деталей для этой группы</div>
)}
{isBrandModalOpen && selectedDetail && (
<BrandSelectionModal
isOpen={isBrandModalOpen}
onClose={handleCloseBrandModal}
articleNumber={selectedDetail.oem}
detailName={selectedDetail.name}
/>
)}
</div>
);
};