From 23a4047ae05632f651be23b36dee441d7d335841 Mon Sep 17 00:00:00 2001 From: inmake Date: Tue, 17 Sep 2024 14:02:07 +0500 Subject: [PATCH] upd --- client/src/components/Test/FloorItem.tsx | 2 +- client/src/pages/ComplexWingPage.tsx | 43 +++++++++++++++++------- 2 files changed, 31 insertions(+), 14 deletions(-) diff --git a/client/src/components/Test/FloorItem.tsx b/client/src/components/Test/FloorItem.tsx index c881dd2..bc24243 100644 --- a/client/src/components/Test/FloorItem.tsx +++ b/client/src/components/Test/FloorItem.tsx @@ -26,7 +26,7 @@ function FloorItem({ floor, onSelected }: Props) { } else { setSelected(false); } - }, 50); + }, 0); }, []); return ( diff --git a/client/src/pages/ComplexWingPage.tsx b/client/src/pages/ComplexWingPage.tsx index 7c7dac6..ef64642 100644 --- a/client/src/pages/ComplexWingPage.tsx +++ b/client/src/pages/ComplexWingPage.tsx @@ -59,6 +59,7 @@ function ComplexWingPage() { const [selectedFloor, setSelectedFloor] = useState(); // const [showFloorPlanSidebar, setShowFloorPlanSidebar] = useState(false); const refFloors = useRef(null); + const [scrolled, setScrolled] = useState(false); function handleResize() { if (window.innerHeight > window.innerWidth) { @@ -97,6 +98,32 @@ function ComplexWingPage() { setImageHeight(ref.current!.naturalHeight); } + function scrollNext() { + setScrolled(true); + + refFloors.current?.scrollBy({ + left: 84, + behavior: "smooth", + }); + + setTimeout(() => { + setScrolled(false); + }, 250); + } + + function scrollPrev() { + setScrolled(true); + + refFloors.current?.scrollBy({ + left: -84, + behavior: "smooth", + }); + + setTimeout(() => { + setScrolled(false); + }, 250); + } + useEffect(() => { handleResize(); @@ -109,7 +136,7 @@ function ComplexWingPage() { return (
@@ -535,24 +562,14 @@ function ComplexWingPage() { icon={} onlyIcon className="absolute top-0 left-0 ring-0 w-9 h-9" - onClick={() => - refFloors.current?.scrollBy({ - left: -32, - behavior: "smooth", - }) - } + onClick={() => !scrolled && scrollPrev()} /> } onlyIcon className="absolute top-0 right-0 ring-0 w-9 h-9" - onClick={() => - refFloors.current?.scrollBy({ - left: 32, - behavior: "smooth", - }) - } + onClick={() => !scrolled && scrollNext()} />