Files
protekauto-frontend/src/pages/vin.tsx

65 lines
2.1 KiB
TypeScript

import Head from "next/head";
import Header from "@/components/Header";
import Footer from "@/components/Footer";
import CatalogSubscribe from "@/components/CatalogSubscribe";
import MobileMenuBottomSection from "@/components/MobileMenuBottomSection";
import InfoVin from "@/components/vin/InfoVin";
import VinLeftbar from "@/components/vin/VinLeftbar";
import VinCategory from "@/components/vin/VinCategory";
import VinKnot from "@/components/vin/VinKnot";
import React, { useState } from "react";
import MetaTags from "@/components/MetaTags";
import { getMetaByPath } from "@/lib/meta-config";
export default function Vin() {
const [showKnot, setShowKnot] = useState(false);
// Обработчик для передачи в VinCategory и для делегирования на .link-2
const handleCategoryClick = (e?: React.MouseEvent) => {
if (e) e.preventDefault();
setShowKnot(true);
};
React.useEffect(() => {
// Делегируем клик на все .link-2 (если они есть на странице)
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 metaData = getMetaByPath('/vin');
return (
<>
<MetaTags {...metaData} />
<InfoVin />
<section className="main">
<div className="w-layout-blockcontainer container-vin w-container">
<div className="w-layout-hflex flex-block-13">
<VinLeftbar />
{/* Категории или Knot */}
{showKnot ? (
<VinKnot />
) : (
<VinCategory onCategoryClick={handleCategoryClick} />
)}
</div>
</div>
</section>
<section className="section-3">
<CatalogSubscribe />
</section>
<Footer />
<MobileMenuBottomSection />
</>
);
}