Исправлены расчеты цен в корзине и добавлена логика загрузки единиц для категорий. Обновлены компоненты CartInfo, CartList, CartSummary, VinCategory и VinLeftbar для корректного отображения итоговых цен и улучшения взаимодействия с пользователем.

2025-07-08 13:25:49 +03:00
parent f0e873fdd1
commit 8055886082
7 changed files with 231 additions and 107 deletions
--- a/src/pages/vehicle-search/[brand]/[vehicleId].tsx
+++ b/src/pages/vehicle-search/[brand]/[vehicleId].tsx
@ -74,32 +74,7 @@ const VehicleDetailsPage = () => {
  });
  const [selectedNode, setSelectedNode] = useState<any | null>(null);
  const [selectedQuickGroup, setSelectedQuickGroup] = useState<any | null>(null);
-  const handleCategoryClick = (e?: React.MouseEvent) => {
-    if (e) e.preventDefault();
-    setShowKnot(true);
-  };
-  useEffect(() => {
-    const handler = (e: Event) => {
-      const target = e.target as HTMLElement;
-      if (target.classList.contains('link-2')) {
-        e.preventDefault();
-        setShowKnot(true);
-      }
-    };
-    document.addEventListener('click', handler);
-    return () => document.removeEventListener('click', handler);
-  }, []);
-  // ====== КОНЕЦ ХУКОВ ======
-
-  // Получаем информацию о каталоге
-  const { data: catalogData } = useQuery<{ laximoCatalogInfo: LaximoCatalogInfo }>(
-    GET_LAXIMO_CATALOG_INFO,
-    {
-      variables: { catalogCode: brand },
-      skip: !brand
-    }
-  );
-
+  
  // Получаем информацию о выбранном автомобиле
  const ssdFromQuery = Array.isArray(router.query.ssd) ? router.query.ssd[0] : router.query.ssd;
  const useStorage = router.query.use_storage === '1';
@ -118,9 +93,16 @@ const VehicleDetailsPage = () => {
  } else if (ssdFromQuery && ssdFromQuery.trim() !== '') {
    finalSsd = ssdFromQuery;
  }
-  

-  
+  // Получаем информацию о каталоге
+  const { data: catalogData } = useQuery<{ laximoCatalogInfo: LaximoCatalogInfo }>(
+    GET_LAXIMO_CATALOG_INFO,
+    {
+      variables: { catalogCode: brand },
+      skip: !brand
+    }
+  );
+
  const { data: vehicleData, loading: vehicleLoading, error: vehicleError } = useQuery<{ laximoVehicleInfo: LaximoVehicleInfo }>(
    GET_LAXIMO_VEHICLE_INFO,
    {
@ -155,6 +137,27 @@ const VehicleDetailsPage = () => {
    }
  );

+  // Получаем детали выбранного узла, если он выбран
+  const {
+    data: unitDetailsData,
+    loading: unitDetailsLoading,
+    error: unitDetailsError
+  } = useQuery(
+    GET_LAXIMO_UNIT_DETAILS,
+    {
+      variables: selectedNode
+        ? {
+            catalogCode: selectedNode.catalogCode || selectedNode.catalog || brand,
+            vehicleId: selectedNode.vehicleId || vehicleId,
+            unitId: selectedNode.unitid || selectedNode.unitId,
+            ssd: selectedNode.ssd || finalSsd || '',
+          }
+        : { catalogCode: '', vehicleId: '', unitId: '', ssd: '' },
+      skip: !selectedNode,
+      errorPolicy: 'all',
+    }
+  );
+
  // Автоматическое перенаправление на правильный vehicleId если API вернул другой ID
  useEffect(() => {
    if (vehicleData?.laximoVehicleInfo && vehicleData.laximoVehicleInfo.vehicleid !== vehicleId) {
@ -181,27 +184,54 @@ const VehicleDetailsPage = () => {
      return;
    }
  }, [vehicleData, vehicleId, brand, finalSsd, router]);
-  
-  // Получаем детали выбранного узла, если он выбран
-  const {
-    data: unitDetailsData,
-    loading: unitDetailsLoading,
-    error: unitDetailsError
-  } = useQuery(
-    GET_LAXIMO_UNIT_DETAILS,
-    {
-      variables: selectedNode
-        ? {
-            catalogCode: selectedNode.catalogCode || selectedNode.catalog || brand,
-            vehicleId: selectedNode.vehicleId || vehicleId,
-            unitId: selectedNode.unitid || selectedNode.unitId,
-            ssd: selectedNode.ssd || finalSsd || '',
-          }
-        : { catalogCode: '', vehicleId: '', unitId: '', ssd: '' },
-      skip: !selectedNode,
-      errorPolicy: 'all',
+
+  // Следим за изменением quickgroup в URL и обновляем selectedQuickGroup
+  useEffect(() => {
+    const quickgroupId = router.query.quickgroup as string;
+    if (quickgroupId) {
+      // Используем функциональное обновление состояния для избежания dependency
+      setSelectedQuickGroup((prev: any) => {
+        if (prev && prev.quickgroupid === quickgroupId) return prev;
+        return { quickgroupid: quickgroupId };
+      });
+    } else {
+      setSelectedQuickGroup(null);
    }
-  );
+  }, [router.query.quickgroup]);
+
+  // Следить за изменением unitid в URL и обновлять selectedNode
+  useEffect(() => {
+    const unitid = router.query.unitid as string;
+    if (unitid) {
+      // Используем функциональное обновление состояния для избежания dependency
+      setSelectedNode((prev: any) => {
+        if (prev && (prev.unitid === unitid || prev.id === unitid)) return prev;
+        return { unitid };
+      });
+    } else {
+      setSelectedNode(null);
+    }
+  }, [router.query.unitid]);
+
+  const handleCategoryClick = (e?: React.MouseEvent) => {
+    if (e) e.preventDefault();
+    setShowKnot(true);
+  };
+  
+  useEffect(() => {
+    const handler = (e: Event) => {
+      const target = e.target as HTMLElement;
+      if (target.classList.contains('link-2')) {
+        e.preventDefault();
+        setShowKnot(true);
+      }
+    };
+    document.addEventListener('click', handler);
+    return () => document.removeEventListener('click', handler);
+  }, []);
+  // ====== КОНЕЦ ХУКОВ ======
+
+
  const unitDetails = unitDetailsData?.laximoUnitDetails || [];
  
  // Логируем ошибки
@ -312,6 +342,12 @@ const VehicleDetailsPage = () => {
  // --- Синхронизация selectedQuickGroup с URL ---
  // Функция для открытия VinQuick и добавления quickgroup в URL
  const openQuickGroup = (group: any) => {
+    // Проверяем что group не null и имеет quickgroupid
+    if (!group || !group.quickgroupid) {
+      console.warn('⚠️ openQuickGroup: получен null или группа без quickgroupid:', group);
+      return;
+    }
+    
    setSelectedQuickGroup(group);
    router.push(
      { pathname: router.pathname, query: { ...router.query, quickgroup: group.quickgroupid } },
@ -329,24 +365,20 @@ const VehicleDetailsPage = () => {
      { shallow: true }
    );
  };
-  // Следим за изменением quickgroup в URL и обновляем selectedQuickGroup
-  useEffect(() => {
-    const quickgroupId = router.query.quickgroup as string;
-    if (quickgroupId) {
-      // Найти группу по id (в openedPath или где-то ещё)
-      // Для простоты: если есть selectedQuickGroup и id совпадает — ничего не делаем
-      if (selectedQuickGroup && selectedQuickGroup.quickgroupid === quickgroupId) return;
-      // Иначе ищем в openedPath или в категориях (можно доработать)
-      // Пока просто создаём объект-заглушку
-      setSelectedQuickGroup({ quickgroupid: quickgroupId });
-    } else {
-      setSelectedQuickGroup(null);
-    }
-  }, [router.query.quickgroup]);

  // --- Синхронизация selectedNode (KnotIn) с URL ---
  // Открыть KnotIn и добавить unitid в URL
  const openKnot = (node: any) => {
+    // ОТЛАДКА: Логируем узел который получили
+    console.log('🔍 [vehicleId].tsx openKnot получил узел:', {
+      unitId: node.unitid,
+      unitName: node.name,
+      hasSsd: !!node.ssd,
+      nodeSsd: node.ssd ? `${node.ssd.substring(0, 50)}...` : 'отсутствует',
+      vehicleSsd: vehicleInfo.ssd ? `${vehicleInfo.ssd.substring(0, 50)}...` : 'отсутствует',
+      ssdLength: node.ssd?.length || 0
+    });
+    
    setSelectedNode(node);
    router.push(
      { pathname: router.pathname, query: { ...router.query, unitid: node.unitid || node.id } },
@ -364,17 +396,6 @@ const VehicleDetailsPage = () => {
      { shallow: true }
    );
  };
-  // Следить за изменением unitid в URL и обновлять selectedNode
-  useEffect(() => {
-    const unitid = router.query.unitid as string;
-    if (unitid) {
-      if (selectedNode && (selectedNode.unitid === unitid || selectedNode.id === unitid)) return;
-      // Можно доработать: искать node по unitid в категориях/группах
-      setSelectedNode({ unitid });
-    } else {
-      setSelectedNode(null);
-    }
-  }, [router.query.unitid]);

  return (
    <>
@ -407,7 +428,22 @@ const VehicleDetailsPage = () => {
                        setSearchState({ loading, error, query, isSearching: isSearching || false });
                      }}
                      onNodeSelect={openKnot}
-                      onActiveTabChange={(tab) => setActiveTab(tab)}
+                      onActiveTabChange={(tab) => {
+                        setActiveTab(tab);
+                        // Сбрасываем состояние при смене вкладки
+                        setSelectedQuickGroup(null);
+                        setSelectedNode(null);
+                        setOpenedPath([]);
+                        // Очищаем URL от параметров quickgroup и unitid
+                        const { quickgroup, unitid, ...rest } = router.query;
+                        if (quickgroup || unitid) {
+                          router.push(
+                            { pathname: router.pathname, query: rest },
+                            undefined,
+                            { shallow: true }
+                          );
+                        }
+                      }}
                      onQuickGroupSelect={openQuickGroup}
                      activeTab={activeTab}
                      openedPath={openedPath}
@ -512,7 +548,6 @@ const VehicleDetailsPage = () => {
                    unitId={selectedNode.unitid}
                    unitName={selectedNode.name}
                    parts={unitDetails}
-                    onBack={closeKnot}
                  />
                  {unitDetailsLoading ? (
                    <div style={{ padding: 24, textAlign: 'center' }}>Загружаем детали узла...</div>