From 63de95a57caa7fd80d235270d841ef659d2f92b2 Mon Sep 17 00:00:00 2001 From: rangggu Date: Sun, 29 Dec 2024 17:12:10 +0900 Subject: [PATCH 1/3] =?UTF-8?q?fix=20:=20=EB=9E=9C=EB=94=A9=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=ED=8C=8C=ED=8B=B0=20=EB=A6=AC=EC=8A=A4?= =?UTF-8?q?=ED=8A=B8=EC=97=90=20=EB=93=9C=EB=9D=BC=EC=9D=B4=EB=B2=84=20?= =?UTF-8?q?=ED=94=84=EB=A1=9C=ED=95=84=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/driver.ts | 2 ++ .../LandingPage/PartyList/DriverBox/index.tsx | 35 +++++++++++++++++++ src/pages/LandingPage/PartyList/index.tsx | 26 +++++++++++--- src/types/index.ts | 7 ++++ src/utils/index.ts | 12 +++++++ 5 files changed, 78 insertions(+), 4 deletions(-) create mode 100644 src/pages/LandingPage/PartyList/DriverBox/index.tsx diff --git a/src/api/driver.ts b/src/api/driver.ts index 1ec13ef5..77ca30d3 100644 --- a/src/api/driver.ts +++ b/src/api/driver.ts @@ -10,6 +10,8 @@ export const getRegionDriver = async ( true ); +export const getDriver = async () => await GET(`/driver/search`, true); + export const getDriverInfo = async (driverId: string | number) => await GET(`/driver/${driverId}`, true); diff --git a/src/pages/LandingPage/PartyList/DriverBox/index.tsx b/src/pages/LandingPage/PartyList/DriverBox/index.tsx new file mode 100644 index 00000000..b69fb808 --- /dev/null +++ b/src/pages/LandingPage/PartyList/DriverBox/index.tsx @@ -0,0 +1,35 @@ +import { memo, useCallback } from "react"; +import { useNavigate } from "react-router-dom"; +import { DriverData } from "@/types"; +import basicProfileImage from "@/assets/images/profileImage.png"; + +function DriverBox({ driverId, name, profileImg, region }: DriverData) { + const navigate = useNavigate(); + + const onClickHandler = useCallback(() => { + navigate(`/driver/profile/${driverId}`); + }, [driverId]); + + return ( +
+
+ {name} +
+ +
+
+
{`${region.length === 1 ? region : "다양한 지역"} ${name} 드라이버`}
+
+ ); +} + +export default memo(DriverBox); diff --git a/src/pages/LandingPage/PartyList/index.tsx b/src/pages/LandingPage/PartyList/index.tsx index d7e6aa57..68e75777 100644 --- a/src/pages/LandingPage/PartyList/index.tsx +++ b/src/pages/LandingPage/PartyList/index.tsx @@ -1,19 +1,31 @@ -import { memo, useCallback, useEffect, useState } from "react"; +import { memo, useCallback, useEffect, useMemo, useState } from "react"; import { useSelector } from "react-redux"; import { RootState } from "@/redux/store"; import { getPartyList } from "@/api/party"; -import { dateToString } from "@/utils"; -import { HeartParty } from "@/types"; +import { dateToString, shuffleArray } from "@/utils"; +import { DriverData, HeartParty } from "@/types"; import PartyBox from "./PartyBox"; import NoParty from "./NoParty"; +import { getDriver } from "@/api/driver"; +import DriverBox from "./DriverBox"; function PartyList() { const { region, nowDate, num, price } = useSelector( (state: RootState) => state.partyFilter ); const [partyData, setPartyData] = useState([]); + const [driverData, setDriverData] = useState([]); const [loading, setLoading] = useState(true); + const ramdomSeed = useMemo(() => { + const today = new Date(); + return ( + today.getFullYear() * 10000 + + (today.getMonth() + 1) * 100 + + today.getDate() + ); + }, []); + const getData = useCallback(async () => { const regionQuery = region === "모든 지역" ? "all" : region; const nowDateQuery = @@ -24,12 +36,15 @@ function PartyList() { const priceQuery = price; try { + const driverResult = await getDriver(); const result = await getPartyList( regionQuery, nowDateQuery, numQuery, priceQuery ); + + setDriverData(shuffleArray(driverResult.payload, ramdomSeed)); setPartyData(result.payload); } catch (e) { console.log(e); @@ -44,12 +59,15 @@ function PartyList() { }, [region, nowDate, num, price]); if (loading) return null; - if (partyData.length === 0) return ; + if (partyData.length === 0 && driverData.length === 0) return ; return (
{partyData.map((item) => ( ))} + {driverData.map((item) => ( + + ))}
); } diff --git a/src/types/index.ts b/src/types/index.ts index df073f1a..04a19938 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -142,6 +142,13 @@ export interface RegionDriverData { userNickname: string; } +export interface DriverData { + driverId: number; + name: string; + profileImg: string; + region: string[]; +} + export interface Message { type: string; userId: number; diff --git a/src/utils/index.ts b/src/utils/index.ts index 71e7d8f7..0748b50a 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,3 +1,5 @@ +import { DriverData } from "@/types"; + export function setScreenHeight() { const vh = window.innerHeight * 0.01; document.documentElement.style.setProperty("--vh", `${vh}px`); @@ -182,3 +184,13 @@ export const isIos = () => { UA.indexOf("ipod") > -1 ); }; + +export const shuffleArray = (array: DriverData[], seed: number) => { + const result = [...array]; + for (let i = result.length - 1; i > 0; i--) { + const randomIndex = Math.floor(seed % (i + 1)); + [result[i], result[randomIndex]] = [result[randomIndex], result[i]]; + seed = (seed * 9301 + 49297) % 233280; // 간단한 난수 생성 + } + return result; +}; From c284ec17dbf13606aa3dd2dcd0abeeccdb2fccdf Mon Sep 17 00:00:00 2001 From: rangggu Date: Sun, 29 Dec 2024 18:23:45 +0900 Subject: [PATCH 2/3] =?UTF-8?q?fix=20:=20=EB=93=9C=EB=9D=BC=EC=9D=B4?= =?UTF-8?q?=EB=B2=84=20=ED=94=84=EB=A1=9C=ED=95=84=20cursor=20pointer=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LandingPage/PartyList/DriverBox/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/LandingPage/PartyList/DriverBox/index.tsx b/src/pages/LandingPage/PartyList/DriverBox/index.tsx index b69fb808..d3876e4b 100644 --- a/src/pages/LandingPage/PartyList/DriverBox/index.tsx +++ b/src/pages/LandingPage/PartyList/DriverBox/index.tsx @@ -11,7 +11,7 @@ function DriverBox({ driverId, name, profileImg, region }: DriverData) { }, [driverId]); return ( -
+
Date: Sun, 29 Dec 2024 18:24:05 +0900 Subject: [PATCH 3/3] =?UTF-8?q?fix=20:=20useEffect=20=EC=9D=98=EC=A1=B4?= =?UTF-8?q?=EC=84=B1=20=EB=B0=B0=EC=97=B4=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LandingPage/PartyList/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/LandingPage/PartyList/index.tsx b/src/pages/LandingPage/PartyList/index.tsx index 68e75777..3873311e 100644 --- a/src/pages/LandingPage/PartyList/index.tsx +++ b/src/pages/LandingPage/PartyList/index.tsx @@ -51,12 +51,12 @@ function PartyList() { } finally { setLoading(false); } - }, [region, nowDate, num, price]); + }, [region, nowDate, num, price, ramdomSeed]); useEffect(() => { getData(); window.scrollTo({ top: 0 }); - }, [region, nowDate, num, price]); + }, [region, nowDate, num, price, ramdomSeed]); if (loading) return null; if (partyData.length === 0 && driverData.length === 0) return ;