BivekiGroup/protekauto-frontend
4
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Обновлены компоненты VehicleSearchResults и InfoVin для поддержки отображения дополнительных атрибутов автомобиля. В VehicleSearchResults добавлена логика для отображения атрибутов из API, а в InfoVin реализован вывод основных параметров и tooltip с полной информацией об автомобиле. Обновлены GraphQL запросы для получения атрибутов. Исправлены типы для LaximoVehicleSearchResult.

Browse Source
This commit is contained in:
Bivekich
2025-07-02 17:52:55 +03:00
parent 35d807f234
commit a9e4b74179
5 changed files with 318 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
src/components/VehicleSearchResults.tsx
View File

@ -90,53 +90,68 @@ const VehicleSearchResults: React.FC<VehicleSearchResultsProps> = ({
<h5 className="text-sm font-semibold text-gray-700 mb-2">Основные характеристики</h5>
{renderAttribute('Марка', vehicle.brand)}
{renderAttribute('Модель', vehicle.model)}
{renderAttribute('Год', vehicle.year)}
{renderAttribute('Кузов', vehicle.bodytype)}
{renderAttribute('Двигатель', vehicle.engine)}
{renderAttribute('Трансмиссия', vehicle.transmission)}
</div>
{/* Дополнительные характеристики */}
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Дополнительные характеристики</h5>
{renderAttribute('Класс', vehicle.grade)}
{renderAttribute('Цвет кузова', vehicle.framecolor)}
{renderAttribute('Цвет салона', vehicle.trimcolor)}
{renderAttribute('Рынок', vehicle.market)}
{renderAttribute('Регион производства', vehicle.creationregion)}
{renderAttribute('Регион назначения', vehicle.destinationregion)}
</div>
{/* Технические характеристики */}
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Технические характеристики</h5>
{renderAttribute('Информация о двигателе', vehicle.engine_info)}
{renderAttribute('Номер двигателя', vehicle.engineno)}
{renderAttribute('Дата производства', vehicle.date)}
{renderAttribute('Произведен', vehicle.manufactured)}
{renderAttribute('Период производства', vehicle.prodPeriod)}
{renderAttribute('Диапазон производства', vehicle.prodRange)}
</div>
{/* Даты и периоды */}
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Даты и периоды</h5>
{renderAttribute('Дата с', vehicle.datefrom)}
{renderAttribute('Дата по', vehicle.dateto)}
{renderAttribute('Модельный год с', vehicle.modelyearfrom)}
{renderAttribute('Модельный год по', vehicle.modelyearto)}
</div>
{/* Опции и описание */}
{(vehicle.options || vehicle.description || vehicle.notes) && (
{/* Все атрибуты из API */}
{vehicle.attributes && vehicle.attributes.length > 0 && (
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Опции и описание</h5>
{renderAttribute('Опции', vehicle.options)}
{renderAttribute('Описание', vehicle.description)}
{renderAttribute('Примечания', vehicle.notes)}
<h5 className="text-sm font-semibold text-gray-700 mb-2">Дополнительные характеристики</h5>
{vehicle.attributes.map((attr, attrIndex) => (
<div key={attrIndex} className="flex justify-between py-1 border-b border-gray-100">
<span className="text-sm text-gray-600 font-medium">{attr.name || attr.key}:</span>
<span className="text-sm text-gray-900">{attr.value}</span>
</div>
))}
</div>
)}
{/* Технические характеристики (fallback для старых данных) */}
{(!vehicle.attributes || vehicle.attributes.length === 0) && (
<>
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Дополнительные характеристики</h5>
{renderAttribute('Год', vehicle.year)}
{renderAttribute('Кузов', vehicle.bodytype)}
{renderAttribute('Трансмиссия', vehicle.transmission)}
{renderAttribute('Класс', vehicle.grade)}
{renderAttribute('Цвет кузова', vehicle.framecolor)}
{renderAttribute('Цвет салона', vehicle.trimcolor)}
{renderAttribute('Рынок', vehicle.market)}
{renderAttribute('Регион производства', vehicle.creationregion)}
{renderAttribute('Регион назначения', vehicle.destinationregion)}
</div>
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Технические характеристики</h5>
{renderAttribute('Информация о двигателе', vehicle.engine_info)}
{renderAttribute('Номер двигателя', vehicle.engineno)}
{renderAttribute('Дата производства', vehicle.date)}
{renderAttribute('Произведен', vehicle.manufactured)}
{renderAttribute('Период производства', vehicle.prodPeriod)}
{renderAttribute('Диапазон производства', vehicle.prodRange)}
</div>
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Даты и периоды</h5>
{renderAttribute('Дата с', vehicle.datefrom)}
{renderAttribute('Дата по', vehicle.dateto)}
{renderAttribute('Модельный год с', vehicle.modelyearfrom)}
{renderAttribute('Модельный год по', vehicle.modelyearto)}
</div>
{/* Опции и описание */}
{(vehicle.options || vehicle.description || vehicle.notes) && (
<div className="space-y-1 mb-4">
<h5 className="text-sm font-semibold text-gray-700 mb-2">Опции и описание</h5>
{renderAttribute('Опции', vehicle.options)}
{renderAttribute('Описание', vehicle.description)}
{renderAttribute('Примечания', vehicle.notes)}
</div>
)}
</>
)}
{/* Системная информация */}
<div className="mt-4 pt-3 border-t border-gray-200">
<div className="text-xs text-gray-400 space-y-1">