Удален файл интеграции с Parts Index API и обновлены компоненты для работы с корзиной и избранным. Добавлены функции для обработки добавления товаров в корзину с уведомлениями, улучшена логика работы с избранным, а также добавлены фильтры для истории поиска по производителю.

This commit is contained in:
Bivekich
2025-06-29 03:36:21 +03:00
parent d268bb3359
commit 7f91da525f
23 changed files with 685 additions and 780 deletions

View File

@ -1,4 +1,5 @@
import React, { useState } from "react";
import { useRouter } from "next/router";
import Filters, { FilterConfig } from "./Filters";
import { useFavorites } from "@/contexts/FavoritesContext";
@ -8,9 +9,9 @@ interface FavoriteListProps {
onFilterChange?: (type: string, value: any) => void;
searchQuery?: string;
onSearchChange?: (value: string) => void;
sortBy?: 'name' | 'brand' | 'price' | 'date';
sortBy?: 'name' | 'brand' | 'date';
sortOrder?: 'asc' | 'desc';
onSortChange?: (sortBy: 'name' | 'brand' | 'price' | 'date') => void;
onSortChange?: (sortBy: 'name' | 'brand' | 'date') => void;
onSortOrderChange?: (sortOrder: 'asc' | 'desc') => void;
}
@ -25,6 +26,7 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
onSortChange,
onSortOrderChange
}) => {
const router = useRouter();
const { favorites, removeFromFavorites, clearFavorites } = useFavorites();
const handleRemove = (id: string) => {
@ -35,6 +37,14 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
clearFavorites();
};
// Функция для поиска товара
const handleSearchItem = (item: any) => {
// Формируем поисковый запрос из бренда и артикула
const searchQuery = `${item.brand} ${item.article}`;
// Переходим на страницу поиска с результатами
router.push(`/search-result?article=${encodeURIComponent(item.article)}&brand=${encodeURIComponent(item.brand)}`);
};
// Состояние для hover на иконке удаления всех
const [removeAllHover, setRemoveAllHover] = useState(false);
// Состояние для hover на корзине отдельного товара
@ -82,11 +92,6 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
case 'brand':
comparison = a.brand.localeCompare(b.brand);
break;
case 'price':
const priceA = a.price || 0;
const priceB = b.price || 0;
comparison = priceA - priceB;
break;
case 'date':
comparison = new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime();
break;
@ -97,29 +102,19 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
return sortOrder === 'asc' ? comparison : -comparison;
});
const formatPrice = (price?: number, currency?: string) => {
if (!price) {
return 'Цена не указана';
}
if (currency === 'RUB') {
return `от ${price.toLocaleString('ru-RU')}`;
}
return `от ${price} ${currency || ''}`;
};
const handleSortClick = (newSortBy: 'name' | 'brand' | 'price' | 'date') => {
const handleSortClick = (newSortBy: 'name' | 'brand' | 'date') => {
if (sortBy === newSortBy) {
// Если тот же столбец, меняем порядок
onSortOrderChange?.(sortOrder === 'asc' ? 'desc' : 'asc');
} else {
// Если новый столбец, устанавливаем его и порядок по умолчанию
onSortChange?.(newSortBy);
onSortOrderChange?.(newSortBy === 'price' ? 'asc' : 'desc');
onSortOrderChange?.(newSortBy === 'date' ? 'desc' : 'asc');
}
};
// SVG-галочки для сортировки — всегда видны у всех колонок
const getSortIcon = (columnSort: 'name' | 'brand' | 'price' | 'date') => {
const getSortIcon = (columnSort: 'name' | 'brand' | 'date') => {
const isActive = sortBy === columnSort;
const isAsc = sortOrder === 'asc';
const color = isActive ? 'var(--_button---primary)' : '#94a3b8';
@ -176,6 +171,9 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
</div>
<div className="sort-item-comments">Комментарий</div>
</div>
<div className="w-layout-hflex add-to-cart-block-copy">
<div className="text-sm font-medium text-gray-600">Действия</div>
</div>
{favorites.length > 0 && (
<div
className="w-layout-hflex select-all-block"
@ -233,12 +231,22 @@ const FavoriteList: React.FC<FavoriteListProps> = ({
</div>
</div>
<div className="w-layout-hflex add-to-cart-block-copy">
<h4
className="heading-9-copy-copy cursor-pointer hover:text-blue-600 flex items-center gap-1"
onClick={() => handleSortClick('price')}
<button
onClick={() => handleSearchItem(item)}
className="px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg transition-colors duration-200 flex items-center gap-2 text-sm font-medium"
>
{formatPrice(item.price, item.currency)} {getSortIcon('price')}
</h4>
<svg
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<circle cx="11" cy="11" r="8" stroke="currentColor" strokeWidth="2"/>
<path d="m21 21-4.35-4.35" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
</svg>
Поиск
</button>
<div className="w-layout-hflex control-element-copy">
{/* Корзина с hover-эффектом для удаления товара */}
<span