From 27a90bc616a104c007257bf6620d45213c70d094 Mon Sep 17 00:00:00 2001 From: HyunWoo Choi <116826162+chhw130@users.noreply.github.com> Date: Sun, 17 Dec 2023 03:53:45 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat(apicall)=20:=20api=20=EB=B6=84?= =?UTF-8?q?=EA=B8=B0=20=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- component/card/ChattingRoom.tsx | 2 -- component/card/DietChattingMsgCard.tsx | 2 +- component/form/UserPhysicForm.tsx | 27 +++++++------- component/section/DietStateSection.tsx | 11 ++++-- component/template/MyPageTemplate.tsx | 8 ++--- component/template/SignupTemplate.tsx | 4 +-- src/app/main/page.tsx | 49 +++++++++++++++++++------- src/app/mypage/page.tsx | 18 +++++----- src/app/page.tsx | 2 +- utils/api/AxiosSetting.ts | 13 +++---- utils/hooks/usePostUserDiet.ts | 20 ++++++----- 11 files changed, 90 insertions(+), 66 deletions(-) diff --git a/component/card/ChattingRoom.tsx b/component/card/ChattingRoom.tsx index 21fb7f4..2abb7e0 100644 --- a/component/card/ChattingRoom.tsx +++ b/component/card/ChattingRoom.tsx @@ -11,7 +11,6 @@ import { UseFormRegister, } from "react-hook-form"; import { DietResponse } from "../../utils/api/AxiosSetting"; -import { useState } from "react"; export interface DietMsgType { msg: string; @@ -97,7 +96,6 @@ const ChattingRoom = ({ {"ex) 아침은 00 점심은 00 저녁은 00을 먹었어"} - {chattingData && ( {chattingData} )} diff --git a/component/card/DietChattingMsgCard.tsx b/component/card/DietChattingMsgCard.tsx index 59c4af9..0c55307 100644 --- a/component/card/DietChattingMsgCard.tsx +++ b/component/card/DietChattingMsgCard.tsx @@ -34,7 +34,7 @@ const DietChattingMsgCart = ({ return ( <> { @@ -44,18 +44,17 @@ const UserPhysicForm = ({ userInfo }: UserPhysicsFormPropsType) => { const newUserInfo: UserInfoType = { name: userInfo.name, gender: userInfo.gender, - age: data.age, - height: data.height, - weight: data.weight, - targetweight: parseInt(data.targetweight), + age: parseInt(data.age), + height: parseInt(data.height), + weight: parseInt(data.weight), + targetWeight: parseInt(data.targetWeight), }; - await postUserInfoMutation(newUserInfo); - - console.log(userId); - - localStorage.setItem("userId", userId.user_id); + // await postUserInfoMutation(newUserInfo); + // console.log(userId); + // localStorage.setItem("userId", userId.user_id); + localStorage.setItem("userInfo", JSON.stringify(newUserInfo)); router.push("/main"); }; @@ -145,7 +144,7 @@ const UserPhysicForm = ({ userInfo }: UserPhysicsFormPropsType) => { { +const DietStateSection = ({ + dietResponseData, +}: { + dietResponseData: DietResponse; +}) => { const dietNickName = { stage1: "열정가득 다이어터", stage2: "기세등등 유지어터", @@ -38,12 +43,12 @@ const DietStateSection = () => { > - 200Kcal 초과 + {dietResponseData.초과칼로리} 오늘{" "} - 30분 이상 달려야 + {dietResponseData.운동필요시간}
현재 몸무게 안정권 유지 diff --git a/component/template/MyPageTemplate.tsx b/component/template/MyPageTemplate.tsx index 666ca36..64421df 100644 --- a/component/template/MyPageTemplate.tsx +++ b/component/template/MyPageTemplate.tsx @@ -12,9 +12,9 @@ import { useUser } from "../../utils/hooks/useUser"; const MyPageTemplate = () => { const router = useRouter(); - const [userData, setUserData] = useState(); - const {} = useUser(); + let userInfo: any = localStorage.getItem("userInfo"); + const userData: UserInfoType = JSON.parse(userInfo); return ( <> @@ -110,7 +110,7 @@ const MyPageTemplate = () => { 목표 체중 - {userData?.targetweight} + {userData?.targetWeight} @@ -131,7 +131,7 @@ const MyPageTemplate = () => { marginLeft={"15px"} cursor={"pointer"} onClick={() => { - localStorage.removeItem(`userId`); + localStorage.removeItem(`userInfo`); router.push("/"); }} > diff --git a/component/template/SignupTemplate.tsx b/component/template/SignupTemplate.tsx index f110eaa..afeb123 100644 --- a/component/template/SignupTemplate.tsx +++ b/component/template/SignupTemplate.tsx @@ -14,7 +14,7 @@ export interface UserInfoType { age: number; height: number; weight: number; - targetweight: number; + targetWeight: number; } const SignupTemplate = ({ jwtToken }: { jwtToken?: JwtToken }) => { @@ -25,7 +25,7 @@ const SignupTemplate = ({ jwtToken }: { jwtToken?: JwtToken }) => { age: 0, height: 0, weight: 0, - targetweight: 0, + targetWeight: 0, }); const { funnel, setFunnel } = useFunnel("userAgreement"); diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx index eee3cdf..fa5695a 100644 --- a/src/app/main/page.tsx +++ b/src/app/main/page.tsx @@ -13,12 +13,23 @@ import DietStateSection from "../../../component/section/DietStateSection"; import { usePostUserDiet } from "../../../utils/hooks/usePostUserDiet"; import { SubmitHandler, useForm } from "react-hook-form"; import { useState } from "react"; +import { UserInfoType } from "../../../component/template/SignupTemplate"; -export interface UserPostDietData { - msg: string; - userId: string | null; +export interface UserPostDietData extends UserInfoType { + query: string; + userId?: string | null; } +// { +// "name": "서경원", +// "height": 123, +// "weight": 432, +// "age": 12, +// "gender": "남성", +// "targetWeight": 321, +// "query": "오늘 아침은 우유 1컵, 점심은 된장찌개랑 갈비조림, 저녁은 마라탕" +// } + const Page = () => { const router = useRouter(); const [chattingData, setChattingData] = useState(""); @@ -37,14 +48,28 @@ const Page = () => { } = useForm(); const onSubmit: SubmitHandler = async (data) => { - const userId = localStorage.getItem("userId"); - const userInfoData: UserPostDietData = { - msg: data.msg, - userId, - }; - setChattingData(data.msg); + // const userId = localStorage.getItem("userId"); + reset(); - await postUserDietMutation(userInfoData); + + const userInfoString: string | null = localStorage.getItem("userInfo"); + + if (userInfoString !== null) { + const userInfo: UserInfoType = JSON.parse(userInfoString); + const userInfoData: UserPostDietData = { + query: data.msg, + name: userInfo.name, + age: userInfo.age, + weight: userInfo.weight, + height: userInfo.height, + targetWeight: userInfo.targetWeight, + gender: userInfo.gender, + }; + setChattingData(data.msg); + await postUserDietMutation(userInfoData); + + localStorage.setItem("userDiet", JSON.stringify(dietResponseData)); + } }; return ( @@ -68,7 +93,7 @@ const Page = () => { - {false ? ( + {!dietResponseData ? ( { ) : ( - + )} diff --git a/src/app/mypage/page.tsx b/src/app/mypage/page.tsx index 44bb7f5..28a2e80 100644 --- a/src/app/mypage/page.tsx +++ b/src/app/mypage/page.tsx @@ -12,17 +12,15 @@ import { UserInfoType } from "../../../component/template/SignupTemplate"; import MyPageTemplate from "../../../component/template/MyPageTemplate"; const Page = () => { - const { data } = useUser(); + const [userData, setUserData] = useState(); - // const [userData, setUserData] = useState(); - - // useEffect(() => { - // let userInfo = localStorage.getItem("userInfo"); - // if (userInfo !== null) { - // const userParsing: UserInfoType = JSON.parse(userInfo); - // setUserData(userParsing); - // } - // }, [setUserData]); + useEffect(() => { + let userInfo = localStorage.getItem("userInfo"); + if (userInfo !== null) { + const userParsing: UserInfoType = JSON.parse(userInfo); + setUserData(userParsing); + } + }, [setUserData]); return ; }; diff --git a/src/app/page.tsx b/src/app/page.tsx index 3d558bb..876e755 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -15,7 +15,7 @@ export default function Home() { if (colorMode === "dark") { setColorMode("light"); } - const userId = localStorage.getItem("userId"); + const userId = localStorage.getItem("userInfo"); if (userId) return router.push("/main"); }, [colorMode, setColorMode, router]); diff --git a/utils/api/AxiosSetting.ts b/utils/api/AxiosSetting.ts index df50b41..6d3f0d3 100644 --- a/utils/api/AxiosSetting.ts +++ b/utils/api/AxiosSetting.ts @@ -51,13 +51,8 @@ export const postUserInfo = async (userInfo: UserInfoType) => { }; export const postUserDiet = async (postDietData: UserPostDietData) => { - const query = { - ["query"]: postDietData.msg, - }; - const res = await instacne.post( - `/users/${postDietData.userId}/diet-exercise-advice`, - query - ); - const data: DietResponse = res.data; - return data; + const res = await instacne.post(`/users/diet-exercise-advice`, postDietData); + + const data: DietResponse = await res.data; + return res.data; }; diff --git a/utils/hooks/usePostUserDiet.ts b/utils/hooks/usePostUserDiet.ts index de38caa..1a7bad4 100644 --- a/utils/hooks/usePostUserDiet.ts +++ b/utils/hooks/usePostUserDiet.ts @@ -12,14 +12,18 @@ export const usePostUserDiet = () => { } = useMutation({ mutationFn: (data: UserPostDietData) => postUserDiet(data), onError: () => { - toast({ - title: "Sever Error", - description: "다시 한번 입력해주세요.", - status: "error", - duration: 5000, - position: "top", - isClosable: true, - }); + const toastId = "chattingErr"; + if (!toast.isActive(toastId)) { + toast({ + id: "chattingErr", + title: "Sever Error", + description: "다시 한번 입력해주세요.", + status: "error", + duration: 5000, + position: "top", + isClosable: true, + }); + } }, onSuccess: () => {}, }); From e5cef0086e84938ef645c64dab647e68a5263174 Mon Sep 17 00:00:00 2001 From: HyunWoo Choi <116826162+chhw130@users.noreply.github.com> Date: Sun, 17 Dec 2023 04:35:00 +0900 Subject: [PATCH 2/3] =?UTF-8?q?feat(mainpage)=20:=20mainpage=20=EB=B6=84?= =?UTF-8?q?=EA=B8=B0=EC=B2=98=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- component/card/ChattingRoom.tsx | 18 ++++++++++++++++++ component/card/DietChattingMsgCard.tsx | 13 +++++++------ component/section/DietStateSection.tsx | 22 ++++++++++++++++++++-- src/app/main/page.tsx | 4 +--- utils/api/AxiosSetting.ts | 8 ++++---- 5 files changed, 50 insertions(+), 15 deletions(-) diff --git a/component/card/ChattingRoom.tsx b/component/card/ChattingRoom.tsx index 2abb7e0..1d45a9a 100644 --- a/component/card/ChattingRoom.tsx +++ b/component/card/ChattingRoom.tsx @@ -11,6 +11,7 @@ import { UseFormRegister, } from "react-hook-form"; import { DietResponse } from "../../utils/api/AxiosSetting"; +import RunningIcon from "../icon/RunningIcon"; export interface DietMsgType { msg: string; @@ -104,6 +105,23 @@ const ChattingRoom = ({ isLoading={isLoading} dietResponseData={dietResponseData} /> + + {dietResponseData && ( + <> + + + + + + {dietResponseData.운동필요시간} + + 이상 꼭 하셔야해요. + + + + {dietResponseData.잔소리} + + )} - + 식선생이 오늘의
식사를 분석하고 있어요 @@ -68,7 +67,7 @@ const DietChattingMsgCart = ({ fontSize={"18px"} fontWeight={"regular"} > - {dietResponseData?.아침} + {` ${dietResponseData?.아침} Kcal`} @@ -81,7 +80,7 @@ const DietChattingMsgCart = ({ fontSize={"18px"} fontWeight={"regular"} > - {dietResponseData?.점심} + {` ${dietResponseData?.점심} Kcal`} @@ -94,7 +93,7 @@ const DietChattingMsgCart = ({ fontSize={"18px"} fontWeight={"regular"} > - {dietResponseData?.저녁} + {`${dietResponseData?.저녁} Kcal`} @@ -113,7 +112,9 @@ const DietChattingMsgCart = ({ fontWeight={"semibold"} fontSize={"17px"} > - {dietResponseData?.초과칼로리}를 초과하셨습니다. + {dietResponseData?.초과칼로리 > 0 + ? `${dietResponseData?.초과칼로리} Kcal를 초과하셨습니다.` + : `${-dietResponseData?.초과칼로리} Kcal 더 드셔도 됩니다.`} diff --git a/component/section/DietStateSection.tsx b/component/section/DietStateSection.tsx index 10e0ea3..e0dda2f 100644 --- a/component/section/DietStateSection.tsx +++ b/component/section/DietStateSection.tsx @@ -31,6 +31,22 @@ const DietStateSection = ({ stage5: "위기의 다이어터", }; + function getStageName(step: number) { + if (step >= 800) { + return dietNickName.stage5; + } else if (step >= 400) { + return dietNickName.stage4; + } else if (step >= 200) { + return dietNickName.stage3; + } else if (step >= 100) { + return dietNickName.stage2; + } else { + return dietNickName.stage1; + } + } + + const nickName = getStageName(dietResponseData.초과칼로리); + const router = useRouter(); return ( - {dietResponseData.초과칼로리} + {dietResponseData?.초과칼로리 > 0 + ? `${dietResponseData?.초과칼로리} Kcal 초과` + : `${-dietResponseData?.초과칼로리} Kcal`} 오늘{" "} @@ -58,7 +76,7 @@ const DietStateSection = ({ - 열정가득 다이어터 + {nickName} diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx index fa5695a..6b975bc 100644 --- a/src/app/main/page.tsx +++ b/src/app/main/page.tsx @@ -48,10 +48,8 @@ const Page = () => { } = useForm(); const onSubmit: SubmitHandler = async (data) => { - // const userId = localStorage.getItem("userId"); - + localStorage.removeItem("userDiet"); reset(); - const userInfoString: string | null = localStorage.getItem("userInfo"); if (userInfoString !== null) { diff --git a/utils/api/AxiosSetting.ts b/utils/api/AxiosSetting.ts index 6d3f0d3..98b08c1 100644 --- a/utils/api/AxiosSetting.ts +++ b/utils/api/AxiosSetting.ts @@ -12,10 +12,10 @@ const instacne = axios.create({ }); export interface DietResponse { - 아침: string; - 점심: string; - 저녁: string; - 초과칼로리: string; + 아침: number; + 점심: number; + 저녁: number; + 초과칼로리: number; 운동필요시간: string; 잔소리: string; } From 69bc3f4527ed841d441d5e81ae9fbc2f475fae93 Mon Sep 17 00:00:00 2001 From: HyunWoo Choi <116826162+chhw130@users.noreply.github.com> Date: Sun, 17 Dec 2023 04:40:15 +0900 Subject: [PATCH 3/3] fix : localstorage err --- component/form/UserInfoForm.tsx | 2 +- component/template/MyPageTemplate.tsx | 8 ++++++-- src/app/mypage/page.tsx | 25 +++++++++---------------- 3 files changed, 16 insertions(+), 19 deletions(-) diff --git a/component/form/UserInfoForm.tsx b/component/form/UserInfoForm.tsx index 902b2ac..577d1cf 100644 --- a/component/form/UserInfoForm.tsx +++ b/component/form/UserInfoForm.tsx @@ -81,7 +81,7 @@ const UserInfoForm = ({ age: 0, height: 0, weight: 0, - targetweight: 0, + targetWeight: 0, }; setUserInfo(newUserInfo); diff --git a/component/template/MyPageTemplate.tsx b/component/template/MyPageTemplate.tsx index 64421df..a0673ba 100644 --- a/component/template/MyPageTemplate.tsx +++ b/component/template/MyPageTemplate.tsx @@ -12,9 +12,13 @@ import { useUser } from "../../utils/hooks/useUser"; const MyPageTemplate = () => { const router = useRouter(); + const [userData, setUserData] = useState(); - let userInfo: any = localStorage.getItem("userInfo"); - const userData: UserInfoType = JSON.parse(userInfo); + useEffect(() => { + let userInfo: any = localStorage.getItem("userInfo"); + const userInfoData: UserInfoType = JSON.parse(userInfo); + setUserData(userInfoData); + }, []); return ( <> diff --git a/src/app/mypage/page.tsx b/src/app/mypage/page.tsx index 28a2e80..f0b8666 100644 --- a/src/app/mypage/page.tsx +++ b/src/app/mypage/page.tsx @@ -1,26 +1,19 @@ "use client"; -import { Box, Flex, HStack, Text, VStack } from "@chakra-ui/react"; -import { useRouter } from "next/navigation"; -import TodayReportCard from "../../../component/card/TodayReportCard"; -import TheHeader from "../../../component/header/TheHeader"; -import { useUser } from "../../../utils/hooks/useUser"; -import CloseIcon from "../../../component/icon/CloseIcon"; -import Image from "next/image"; -import MyPageCharacter from "../../../utils/img/MypageCharacter.png"; + import { useEffect, useState } from "react"; import { UserInfoType } from "../../../component/template/SignupTemplate"; import MyPageTemplate from "../../../component/template/MyPageTemplate"; const Page = () => { - const [userData, setUserData] = useState(); + // const [userData, setUserData] = useState(); - useEffect(() => { - let userInfo = localStorage.getItem("userInfo"); - if (userInfo !== null) { - const userParsing: UserInfoType = JSON.parse(userInfo); - setUserData(userParsing); - } - }, [setUserData]); + // useEffect(() => { + // let userInfo = localStorage.getItem("userInfo"); + // if (userInfo !== null) { + // const userParsing: UserInfoType = JSON.parse(userInfo); + // setUserData(userParsing); + // } + // }, [setUserData]); return ; };