From ef855fdd5b8e5918e9b39e3f55cb007866421209 Mon Sep 17 00:00:00 2001 From: Seonghwan Sim Date: Sat, 8 Jun 2024 05:58:10 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat=20:=20=EC=9B=80=EC=A7=81=EC=9D=B4?= =?UTF-8?q?=EB=A9=B4=20=EB=8B=A4=EB=A5=B8=20=EA=B3=B3=EB=8F=84=20=EC=B0=8E?= =?UTF-8?q?=ED=9E=88=EA=B2=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/routes/map/MapContainer.jsx | 25 +++++++++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/src/routes/map/MapContainer.jsx b/src/routes/map/MapContainer.jsx index 8e0e2e9..35f5dbe 100644 --- a/src/routes/map/MapContainer.jsx +++ b/src/routes/map/MapContainer.jsx @@ -101,6 +101,7 @@ function FirePoints({ score }) { export default function MapContainer() { const [detail, setDetail] = useRecoilState(detailState); const [ID, setID] = useRecoilState(storeIdState); + const [result, setResult] = useState(""); // console.log(detail); const toggleDetail = () => { @@ -144,6 +145,19 @@ export default function MapContainer() { alert("Geolocation을 사용할 수 없습니다."); } }, []); + // console.log(result); + + useEffect(() => { + if (result.getLng && result.getLat) { + fetch( + `http://223.p-e.kr:8080/get/stores?x=${result.getLng()}&y=${result.getLat()}&radius=1000` + ) + .then((response) => response.json()) + .then((data) => { + setData(data); + }); + } + }, [result]); const EventMarkerContainer = ({ position, @@ -186,7 +200,6 @@ export default function MapContainer() { position={position} // 마커를 표시할 위치 onClick={(marker) => { map.panTo(marker.getPosition()); // 지도 중앙을 마커 - // console.log(marker); handleIsOpen(); // 열고 닫는거 }} image={{ @@ -235,7 +248,15 @@ export default function MapContainer() { return ( - + { + const latlng = map.getCenter(); + console.log(latlng.getLat(), latlng.getLng()); + setResult(latlng); + }} + > {data.map((value) => ( Date: Sat, 8 Jun 2024 06:55:34 +0900 Subject: [PATCH 2/3] =?UTF-8?q?style=20:=20cursor=20pointer=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/header/header.jsx | 84 +++++++++++++++++++++---------- src/components/review/onLogin.jsx | 2 +- src/routes/mainpage/Main.jsx | 5 +- src/routes/map/MapContainer.jsx | 7 +-- src/routes/test/RamenTest.jsx | 10 +++- src/routes/test/Test.jsx | 6 +++ 6 files changed, 80 insertions(+), 34 deletions(-) diff --git a/src/components/header/header.jsx b/src/components/header/header.jsx index 3cf79d4..b61c3a9 100644 --- a/src/components/header/header.jsx +++ b/src/components/header/header.jsx @@ -3,6 +3,9 @@ import Logo from "../../imgs/eng_logo.svg"; import "../../assets/font.css"; import { Link } from "react-router-dom"; +import { useEffect, useState } from "react"; +import { detailState } from "../../atom"; +import { useRecoilState } from "recoil"; const StyleContainer = styled.div` width: 100%; @@ -16,14 +19,15 @@ const StyleContainer = styled.div` display: flex; align-items: center; + justify-content: center; `; const TitleContainer = styled.div` - display: flex; - justify-content: space-around; /* display: ${({ isResult }) => (isResult ? "block" : "flex")}; */ /* margin-left: ${({ isResult }) => (isResult ? "228px" : "0")}; */ - width: 100%; + width: 80%; + display: flex; + justify-content: space-between; `; const EngLogo = styled.img` @@ -68,31 +72,10 @@ const LoginBtn = styled.button` function getTitle(isHeader) { switch (isHeader) { - case ("test", "ramentest"): + case "test": + return 맵기 레벨 검사; + case "ramentest": return 맵기 레벨 검사; - default: - return null; - } -} - -function getButton(isHeader) { - switch (isHeader) { - case ("test", "ramentest"): - return ( - // - 처음으로 - // - ); - case "main": - return ( - - (window.location.href = "http://localhost:8080/login/test") - } - > - 로그인 - - ); default: return null; } @@ -100,6 +83,53 @@ function getButton(isHeader) { export default function Header({ isHeader }) { const isResult = isHeader === "result"; + const [onLogin, setOnLogin] = useState(); + + function getButton(isHeader) { + switch (isHeader) { + case "test": + return ( + // + 처음으로 + // + ); + case "ramentest": + return ( + // + 처음으로 + // + ); + case "main": + return ( + <> + {onLogin ? ( + <> + ) : ( + + (window.location.href = "http://localhost:8080/login/test") + } + > + 로그인 + + )} + + ); + default: + return null; + } + } + + useEffect(() => { + fetch(`http://localhost:8080/auth/mypage`, { + credentials: "include", + }) + .then((response) => response.json()) + .then((data) => { + // console.log(data.email); + setOnLogin(data.email); + }); + }, []); return ( diff --git a/src/components/review/onLogin.jsx b/src/components/review/onLogin.jsx index 0d357b7..adcd563 100644 --- a/src/components/review/onLogin.jsx +++ b/src/components/review/onLogin.jsx @@ -134,7 +134,7 @@ export default function OnLogin() { }); }, [ID]); - console.log(userEmail, ID); + // console.log(userEmail, ID); const [formData, setFormData] = useState({ storeId: { ID }, diff --git a/src/routes/mainpage/Main.jsx b/src/routes/mainpage/Main.jsx index e77c510..0af615c 100644 --- a/src/routes/mainpage/Main.jsx +++ b/src/routes/mainpage/Main.jsx @@ -35,6 +35,9 @@ const Btn = styled.div` const BtnBlock = styled.div` margin-right: 72px; + &:hover { + cursor: pointer; + } `; // const Ment = styled.h1` @@ -74,7 +77,7 @@ export default function Main() { - + diff --git a/src/routes/map/MapContainer.jsx b/src/routes/map/MapContainer.jsx index 35f5dbe..20f0ae5 100644 --- a/src/routes/map/MapContainer.jsx +++ b/src/routes/map/MapContainer.jsx @@ -186,7 +186,6 @@ export default function MapContainer() { } }; // setStoreId(storeId); - useEffect(() => {}, []); // [0] - spicyLevelList, [1] - reviewCountList // const spicyReview = Object.values(review); const reviewCount = review.reviewCountList?.at(0) || 0; @@ -216,7 +215,9 @@ export default function MapContainer() { {isOpen && ( -
{storeName}
+
+ {storeName} +
{ const latlng = map.getCenter(); - console.log(latlng.getLat(), latlng.getLng()); + // console.log(latlng.getLat(), latlng.getLng()); setResult(latlng); }} > diff --git a/src/routes/test/RamenTest.jsx b/src/routes/test/RamenTest.jsx index 64f0ec0..198dcb7 100644 --- a/src/routes/test/RamenTest.jsx +++ b/src/routes/test/RamenTest.jsx @@ -26,7 +26,10 @@ const Btn = styled.button` margin-top: 70px; border: none; background-color: transparent; - cursor: pointer; + + &:hover { + cursor: pointer; + } `; const Content = styled.div` @@ -67,6 +70,9 @@ const Answer = styled.div` justify-content: center; align-items: center; font-size: 16px; + &:hover { + cursor: pointer; + } `; const ques = ["<라면>", "<마라탕>", "<불닭>", "<엽떡>"]; @@ -151,7 +157,7 @@ export default function RamenTest() { ) : ( <> -
+
{currentIndex === 0 ? (
Date: Sat, 8 Jun 2024 07:01:31 +0900 Subject: [PATCH 3/3] =?UTF-8?q?style=20:=20favicon=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/favicon.ico | Bin 3870 -> 4090 bytes public/index.html | 2 +- 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/public/favicon.ico b/public/favicon.ico index a11777cc471a4344702741ab1c8a588998b1311a..cad68f5c48dd39b2ae2aae1ef16ece368aa650ae 100644 GIT binary patch literal 4090 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 baj7?x%VD!5Cxk2YbYLNVeiXvvpMCWYo=by@ diff --git a/public/index.html b/public/index.html index feb448b..9b019f1 100644 --- a/public/index.html +++ b/public/index.html @@ -28,7 +28,7 @@ type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=bc826944272a7bea731a3ed59cfd0231" > - React App + Hot Spot