From cc051fe76456ad5fd939b52bf28b905d32a89815 Mon Sep 17 00:00:00 2001 From: hamo-o Date: Sat, 16 Sep 2023 16:42:43 +0900 Subject: [PATCH 01/11] design: change input UI --- src/components/inputs/input-fill.tsx | 2 +- src/components/inputs/input-line.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/inputs/input-fill.tsx b/src/components/inputs/input-fill.tsx index 59101a9..e2636c4 100644 --- a/src/components/inputs/input-fill.tsx +++ b/src/components/inputs/input-fill.tsx @@ -44,7 +44,7 @@ const Input = styled.input` width: 80vw; color: ${colors.light_qwhite}; - transform: scale(0.75); + transform: scale(0.85); transform-origin: left; `; diff --git a/src/components/inputs/input-line.tsx b/src/components/inputs/input-line.tsx index 2c34cb1..f7481b5 100644 --- a/src/components/inputs/input-line.tsx +++ b/src/components/inputs/input-line.tsx @@ -57,7 +57,7 @@ const Input = styled.input` width: 80vw; color: ${colors.light_qwhite}; - transform: scale(0.75); + transform: scale(0.85); transform-origin: left; `; From 2f3c8b3ca64d6a24a8c20649beeadeb7146dcfa9 Mon Sep 17 00:00:00 2001 From: hamo-o Date: Sat, 16 Sep 2023 16:45:55 +0900 Subject: [PATCH 02/11] design: change inputLine padding UI --- src/components/inputs/input-line.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/inputs/input-line.tsx b/src/components/inputs/input-line.tsx index f7481b5..47efa0c 100644 --- a/src/components/inputs/input-line.tsx +++ b/src/components/inputs/input-line.tsx @@ -43,7 +43,7 @@ const InputLine = ({ ...props }: InputProps) => { const InputWrapper = styled.div` width: 100%; - padding: 1rem 0; + padding: 1rem 0 0.5rem; margin-bottom: 0.5rem; display: flex; From 2bb734c9a7fc5110e0752dbbbae1b099c8a4c4e1 Mon Sep 17 00:00:00 2001 From: hamo-o Date: Sat, 16 Sep 2023 18:11:53 +0900 Subject: [PATCH 03/11] =?UTF-8?q?feat:=20=EC=A4=91/=EA=B3=A0=EB=93=B1?= =?UTF-8?q?=ED=95=99=EC=83=9D=20=ED=95=99=EA=B5=90=20=EA=B2=80=EC=83=89=20?= =?UTF-8?q?api?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/school/index.ts | 29 ++++++++++ src/components/selectbox/Options.tsx | 56 +++++++++++++++++++ src/components/sign-up/middle-high-school.tsx | 45 ++++++++++++--- src/hooks/common/useInput.ts | 2 +- src/hooks/school/useGetSchoolQuery.ts | 31 ++++++++++ 5 files changed, 155 insertions(+), 8 deletions(-) create mode 100644 src/apis/school/index.ts create mode 100644 src/components/selectbox/Options.tsx create mode 100644 src/hooks/school/useGetSchoolQuery.ts diff --git a/src/apis/school/index.ts b/src/apis/school/index.ts new file mode 100644 index 0000000..0f1ac26 --- /dev/null +++ b/src/apis/school/index.ts @@ -0,0 +1,29 @@ +import axios from "axios"; + +const schoolAPI = { + async getSchoolName(word: string) { + const response = await axios.get( + "https://open.neis.go.kr/hub/schoolInfo", + { + params: { + KEY: process.env.SCHOOL_API_KEY, + Type: "json", + pIndex: 1, + pSize: 20, + SCHUL_NM: word + } + } + ); + return response.data; + } + // async getUnivName(word: string) { + // const response = await defaultAxios.get("/account/apple/login", { + // params: { + // idToken: id_token + // } + // }); + // return response.data; + // } +}; + +export default schoolAPI; diff --git a/src/components/selectbox/Options.tsx b/src/components/selectbox/Options.tsx new file mode 100644 index 0000000..1058672 --- /dev/null +++ b/src/components/selectbox/Options.tsx @@ -0,0 +1,56 @@ +"use client"; + +import styled from "styled-components"; +import { useState } from "react"; +import Flex from "../common/Flex"; +import Text from "../common/Text"; +import { colors } from "styles/theme"; +import { motion } from "framer-motion"; +import { dropdown } from "src/constants/animation"; + +export interface OptionProps { + options: any; + value?: string; + setState?: any; + defaultValue?: string; +} + +const Option = (props: OptionProps) => { + const [open, setOpen] = useState(true); + return ( + + + {props.options.map((option: any) => ( + { + props.setState(option.name); + setOpen(!open); + }} + > + {option.name} + + ))} + + + ); +}; + +const Options = styled(motion.ul)` + width: 100%; + max-height: 212px; + border-radius: 0 0 10px 10px; + overflow: scroll; +`; + +const OptionItem = styled.li` + width: 100%; + padding: 1rem; + background: ${colors.light_gray3}; +`; + +export default Option; diff --git a/src/components/sign-up/middle-high-school.tsx b/src/components/sign-up/middle-high-school.tsx index 8a64a1b..625093b 100644 --- a/src/components/sign-up/middle-high-school.tsx +++ b/src/components/sign-up/middle-high-school.tsx @@ -1,20 +1,43 @@ +"use client"; + import { useRouter } from "next/navigation"; +import { useEffect, useState, useCallback } from "react"; import { useInput } from "src/hooks/common/useInput"; import { useAppSelector } from "src/hooks/useReduxHooks"; import { useUserMutation } from "src/hooks/account/useUserMutation"; import InputLine from "../inputs/input-line"; import ButtonFillLarge from "../buttons/button-fill-large"; +import Option from "../selectbox/Options"; +import Flex from "../common/Flex"; import { Route } from "src/constants/Route"; +import useGetSchoolQuery from "src/hooks/school/useGetSchoolQuery"; const MidHighSchool = () => { const router = useRouter(); const school = useInput(); + const filteredSchool = useGetSchoolQuery(school.value); const selected = useAppSelector((state) => state.organization.selected); - const { userMutation } = useUserMutation(); + useEffect(() => { + filteredSchool.refetch(); + }, [school.value]); + + const searchSchool = useCallback(() => { + const filteredSchoolInfo = filteredSchool.data?.schoolInfo + ? filteredSchool.data?.schoolInfo[1].row.map((schoolInfo: any) => { + return { + name: schoolInfo.SCHUL_NM, + value: schoolInfo.SD_SCHUL_CODE + }; + }) + : null; + + return filteredSchoolInfo; + }, [filteredSchool]); + const handleClickNext = () => { userMutation.mutate({ schoolType: selected, @@ -25,12 +48,20 @@ const MidHighSchool = () => { return ( <> - + + + {filteredSchool.data?.schoolInfo && searchSchool() && ( + { setValue(event.target.value); } }; - return { value, handleChangeInput, reset }; + return { value, handleChangeInput, setValue, reset }; }; diff --git a/src/hooks/school/useGetSchoolQuery.ts b/src/hooks/school/useGetSchoolQuery.ts new file mode 100644 index 0000000..b96474c --- /dev/null +++ b/src/hooks/school/useGetSchoolQuery.ts @@ -0,0 +1,31 @@ +import { useInfiniteQuery, useQuery } from "@tanstack/react-query"; +import schoolAPI from "src/apis/school"; + +const useGetSchoolQuery = (word: string) => { + // const { data, fetchNextPage, hasNextPage, isFetched } = useInfiniteQuery( + // ["school"], + // ({ pageParam = 0 }) => getUserQuestions(id, qtype, pageParam, 10), + // { + // getNextPageParam: (lastPage) => { + // return lastPage.data.count > lastPage.idx + 10 + // ? lastPage.idx + 10 + // : undefined; + // } + // } + // ); + + // return { data, fetchNextPage, hasNextPage, isFetched }; + const { data, isLoading, refetch } = useQuery( + ["school"], + () => schoolAPI.getSchoolName(word), + { + onError: (error: any) => { + alert(error); + } + } + ); + + return { data, isLoading, refetch }; +}; + +export default useGetSchoolQuery; From 925a7c40e5d7acb492b65a01e7e36a48ce8d5589 Mon Sep 17 00:00:00 2001 From: hamo-o Date: Sat, 16 Sep 2023 18:13:27 +0900 Subject: [PATCH 04/11] =?UTF-8?q?fix:=20=EA=B2=80=EC=83=89=20=EB=82=B4?= =?UTF-8?q?=EC=9A=A9=EC=9D=B4=20=EC=9E=88=EC=9D=84=20=EB=95=8C=EB=A7=8C=20?= =?UTF-8?q?=EB=93=9C=EB=A1=AD=EB=8B=A4=EC=9A=B4=20show?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/sign-up/middle-high-school.tsx | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/src/components/sign-up/middle-high-school.tsx b/src/components/sign-up/middle-high-school.tsx index 625093b..33c0cac 100644 --- a/src/components/sign-up/middle-high-school.tsx +++ b/src/components/sign-up/middle-high-school.tsx @@ -26,14 +26,17 @@ const MidHighSchool = () => { }, [school.value]); const searchSchool = useCallback(() => { - const filteredSchoolInfo = filteredSchool.data?.schoolInfo - ? filteredSchool.data?.schoolInfo[1].row.map((schoolInfo: any) => { - return { - name: schoolInfo.SCHUL_NM, - value: schoolInfo.SD_SCHUL_CODE - }; - }) - : null; + const filteredSchoolInfo = + filteredSchool.data?.schoolInfo && school.value + ? filteredSchool.data?.schoolInfo[1].row.map( + (schoolInfo: any) => { + return { + name: schoolInfo.SCHUL_NM, + value: schoolInfo.SD_SCHUL_CODE + }; + } + ) + : null; return filteredSchoolInfo; }, [filteredSchool]); From 5eff4f720352efed89fb8d97cc52978f4fefc6fd Mon Sep 17 00:00:00 2001 From: hamo-o Date: Sat, 16 Sep 2023 18:21:15 +0900 Subject: [PATCH 05/11] =?UTF-8?q?feat:=20=EC=B4=88=EB=93=B1=ED=95=99?= =?UTF-8?q?=EC=83=9D=20=ED=95=99=EA=B5=90=20=EA=B2=80=EC=83=89=20api?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/sign-up/elementary-school.tsx | 51 ++++++++++++++++--- src/components/sign-up/middle-high-school.tsx | 14 +++-- 2 files changed, 53 insertions(+), 12 deletions(-) diff --git a/src/components/sign-up/elementary-school.tsx b/src/components/sign-up/elementary-school.tsx index 9628afa..df68ab6 100644 --- a/src/components/sign-up/elementary-school.tsx +++ b/src/components/sign-up/elementary-school.tsx @@ -1,20 +1,49 @@ import { useRouter } from "next/navigation"; +import { useEffect, useState, useCallback } from "react"; import { useInput } from "src/hooks/common/useInput"; import InputLine from "../inputs/input-line"; import ButtonFillLarge from "../buttons/button-fill-large"; -import { Route } from "src/constants/Route"; +import Option from "../selectbox/Options"; +import Flex from "../common/Flex"; import { useUserMutation } from "src/hooks/account/useUserMutation"; import { useAppSelector } from "src/hooks/useReduxHooks"; +import useGetSchoolQuery from "src/hooks/school/useGetSchoolQuery"; + +import { Route } from "src/constants/Route"; const ElementarySchool = () => { const router = useRouter(); const school = useInput(); + const filteredSchool = useGetSchoolQuery(school.value); const selected = useAppSelector((state) => state.organization.selected); const { userMutation } = useUserMutation(); + useEffect(() => { + filteredSchool.refetch(); + }, [school.value]); + + const searchSchool = useCallback(() => { + const filteredSchoolInfo = + filteredSchool.data?.schoolInfo && school.value + ? filteredSchool.data?.schoolInfo[1].row + .filter( + (schoolInfo: any) => + schoolInfo.SCHUL_KND_SC_NM === "초등학교" + ) + .map((schoolInfo: any) => { + return { + name: schoolInfo.SCHUL_NM, + value: schoolInfo.SD_SCHUL_CODE + }; + }) + : null; + + return filteredSchoolInfo; + }, [filteredSchool]); + const handleClickNext = () => { userMutation.mutate({ schoolType: selected, @@ -25,12 +54,20 @@ const ElementarySchool = () => { return ( <> - + + + {filteredSchool.data?.schoolInfo && searchSchool() && ( + { const router = useRouter(); @@ -28,14 +28,18 @@ const MidHighSchool = () => { const searchSchool = useCallback(() => { const filteredSchoolInfo = filteredSchool.data?.schoolInfo && school.value - ? filteredSchool.data?.schoolInfo[1].row.map( - (schoolInfo: any) => { + ? filteredSchool.data?.schoolInfo[1].row + .filter( + (schoolInfo: any) => + schoolInfo.SCHUL_KND_SC_NM === "고등학교" || + schoolInfo.SCHUL_KND_SC_NM === "중학교" + ) + .map((schoolInfo: any) => { return { name: schoolInfo.SCHUL_NM, value: schoolInfo.SD_SCHUL_CODE }; - } - ) + }) : null; return filteredSchoolInfo; From 43846f0359ba91b2e40700fc1f1d5179b01553ed Mon Sep 17 00:00:00 2001 From: hamo-o Date: Sat, 16 Sep 2023 18:50:50 +0900 Subject: [PATCH 06/11] =?UTF-8?q?fix:=20=ED=9A=8C=EC=9B=90=EA=B0=80?= =?UTF-8?q?=EC=9E=85=20=EB=92=A4=EB=A1=9C=EA=B0=80=EA=B8=B0=20=EB=A1=9C?= =?UTF-8?q?=EC=A7=81=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/auth/checkSignUp.ts | 5 ++++- src/middleware.ts | 2 +- src/pages-edit/sign-up/organization.tsx | 7 ++++++- 3 files changed, 11 insertions(+), 3 deletions(-) diff --git a/src/apis/auth/checkSignUp.ts b/src/apis/auth/checkSignUp.ts index cf900a5..14b601c 100644 --- a/src/apis/auth/checkSignUp.ts +++ b/src/apis/auth/checkSignUp.ts @@ -10,7 +10,10 @@ export async function checkSignUp(request: NextRequest) { url.pathname = "/"; return NextResponse.redirect(url); } else if (user.name) { - if (url.pathname !== "/auth/organization") { + if ( + url.pathname !== "/auth/organization" && + url.pathname !== "/auth/default" + ) { url.pathname = "/auth/organization"; return NextResponse.redirect(url); } else return NextResponse.next(); diff --git a/src/middleware.ts b/src/middleware.ts index 4bb8f38..9c1001b 100644 --- a/src/middleware.ts +++ b/src/middleware.ts @@ -11,7 +11,7 @@ export async function middleware(request: NextRequest) { const requestHeaders = new Headers(request.headers); requestHeaders.set("Authorization", `Bearer ${token}`); - if (pathname.match("/(auth.*)")) { + if (pathname.match("/((?!auth).*)")) { return await checkSignUp(request); } else if (pathname.match("/((?!account|auth).*)")) { return await checkSignIn(request); diff --git a/src/pages-edit/sign-up/organization.tsx b/src/pages-edit/sign-up/organization.tsx index 200c707..d5f6c45 100644 --- a/src/pages-edit/sign-up/organization.tsx +++ b/src/pages-edit/sign-up/organization.tsx @@ -19,7 +19,12 @@ const Organization = () => { return ( } + leftIcon={ + router.push("/auth/default")} + /> + } title="회원 가입" /> Date: Sat, 16 Sep 2023 19:03:46 +0900 Subject: [PATCH 07/11] =?UTF-8?q?fix:=20auth/default=20readOnly=20?= =?UTF-8?q?=ED=94=84=EB=A1=9C=ED=8D=BC=ED=8B=B0=20=EC=82=AD=EC=A0=9C,=20?= =?UTF-8?q?=EC=88=98=EC=A0=95=20=EA=B0=80=EB=8A=A5=ED=95=98=EB=8F=84?= =?UTF-8?q?=EB=A1=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/middleware.ts | 2 +- src/pages-edit/sign-up/default.tsx | 17 ++++++----------- 2 files changed, 7 insertions(+), 12 deletions(-) diff --git a/src/middleware.ts b/src/middleware.ts index 9c1001b..1cd4e28 100644 --- a/src/middleware.ts +++ b/src/middleware.ts @@ -11,7 +11,7 @@ export async function middleware(request: NextRequest) { const requestHeaders = new Headers(request.headers); requestHeaders.set("Authorization", `Bearer ${token}`); - if (pathname.match("/((?!auth).*)")) { + if (pathname.match("/((auth).*)")) { return await checkSignUp(request); } else if (pathname.match("/((?!account|auth).*)")) { return await checkSignIn(request); diff --git a/src/pages-edit/sign-up/default.tsx b/src/pages-edit/sign-up/default.tsx index 974dd7e..6ebd2b2 100644 --- a/src/pages-edit/sign-up/default.tsx +++ b/src/pages-edit/sign-up/default.tsx @@ -73,19 +73,18 @@ const SignIn = () => { /> { : birthMsg.WRONG } isError={!validBirth(birthday.value)} - readonly={Boolean(user?.birthday)} /> { : phoneMsg.WRONG } isError={!validPhone(phone.value)} - readonly={Boolean(user?.phone)} /> { : emailMsg.WRONG } isError={!validEmail(email.value)} - readonly={Boolean(user?.email)} /> { : isDupNickname.data?.message } isError={!isDupNickname.data?.available} - readonly={Boolean(user?.nickname)} /> Date: Thu, 28 Sep 2023 16:40:34 +0900 Subject: [PATCH 08/11] =?UTF-8?q?fix:=20=ED=9A=8C=EC=9B=90=EA=B0=80?= =?UTF-8?q?=EC=9E=85=20flow=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/auth/checkSignUp.ts | 8 ++-- .../Icon/icons/images/CheckImage.tsx | 27 ++++++++++++ src/components/Icon/icons/index.ts | 1 + src/middleware.ts | 6 +-- src/pages-edit/sign-up/complete.tsx | 41 +++++++++++++------ .../components}/button-gender-select.tsx | 4 +- .../sign-up/components}/elementary-school.tsx | 8 ++-- .../sign-up/components}/graduate.tsx | 2 +- .../components}/middle-high-school.tsx | 11 ++--- .../sign-up/components}/university.tsx | 9 ++-- src/pages-edit/sign-up/default.tsx | 2 +- src/pages-edit/sign-up/organization.tsx | 8 ++-- 12 files changed, 87 insertions(+), 40 deletions(-) create mode 100644 src/components/Icon/icons/images/CheckImage.tsx rename src/{components/sign-up => pages-edit/sign-up/components}/button-gender-select.tsx (94%) rename src/{components/sign-up => pages-edit/sign-up/components}/elementary-school.tsx (91%) rename src/{components/sign-up => pages-edit/sign-up/components}/graduate.tsx (91%) rename src/{components/sign-up => pages-edit/sign-up/components}/middle-high-school.tsx (87%) rename src/{components/sign-up => pages-edit/sign-up/components}/university.tsx (85%) diff --git a/src/apis/auth/checkSignUp.ts b/src/apis/auth/checkSignUp.ts index 14b601c..7a97547 100644 --- a/src/apis/auth/checkSignUp.ts +++ b/src/apis/auth/checkSignUp.ts @@ -7,8 +7,7 @@ export async function checkSignUp(request: NextRequest) { const url = request.nextUrl.clone(); if (user.name && user.schoolType) { - url.pathname = "/"; - return NextResponse.redirect(url); + return NextResponse.next(); } else if (user.name) { if ( url.pathname !== "/auth/organization" && @@ -18,6 +17,9 @@ export async function checkSignUp(request: NextRequest) { return NextResponse.redirect(url); } else return NextResponse.next(); } else { - return NextResponse.next(); + if (url.pathname !== "/auth/default") { + url.pathname = "/auth/default"; + return NextResponse.redirect(url); + } else return NextResponse.next(); } } diff --git a/src/components/Icon/icons/images/CheckImage.tsx b/src/components/Icon/icons/images/CheckImage.tsx new file mode 100644 index 0000000..ced93af --- /dev/null +++ b/src/components/Icon/icons/images/CheckImage.tsx @@ -0,0 +1,27 @@ +const CheckImage = () => { + return ( + + + + + ); +}; + +export default CheckImage; diff --git a/src/components/Icon/icons/index.ts b/src/components/Icon/icons/index.ts index acfa96a..5ef45b3 100644 --- a/src/components/Icon/icons/index.ts +++ b/src/components/Icon/icons/index.ts @@ -31,6 +31,7 @@ export { default as QFeedImage } from "./images/QFeedImage"; export { default as QFeedImage2 } from "./images/QFeedImage2"; export { default as WaveImage } from "./images/WaveImage"; export { default as FriendImage } from "./images/FriendImage"; +export { default as CheckImage } from "./images/CheckImage"; // bottom navigation export { default as BHome } from "./bottomNavigation/Home"; diff --git a/src/middleware.ts b/src/middleware.ts index 1cd4e28..ad01756 100644 --- a/src/middleware.ts +++ b/src/middleware.ts @@ -11,10 +11,10 @@ export async function middleware(request: NextRequest) { const requestHeaders = new Headers(request.headers); requestHeaders.set("Authorization", `Bearer ${token}`); - if (pathname.match("/((auth).*)")) { - return await checkSignUp(request); - } else if (pathname.match("/((?!account|auth).*)")) { + if (pathname.match("/((?!account|auth).*)")) { return await checkSignIn(request); + } else if (pathname.match("/((?!account).*)")) { + return await checkSignUp(request); } return NextResponse.next(); diff --git a/src/pages-edit/sign-up/complete.tsx b/src/pages-edit/sign-up/complete.tsx index ad7b08a..70a7468 100644 --- a/src/pages-edit/sign-up/complete.tsx +++ b/src/pages-edit/sign-up/complete.tsx @@ -1,4 +1,5 @@ "use client"; +import styled from "styled-components"; import { useRouter } from "next/navigation"; import ButtonFillLarge from "src/components/buttons/button-fill-large"; import NavigationTop from "src/components/navigations/NavigationTopBack"; @@ -6,18 +7,17 @@ import NavigationTop from "src/components/navigations/NavigationTopBack"; import Text from "src/components/common/Text"; import Flex from "src/components/common/Flex"; import Icon from "src/components/Icon/Icon"; +import { useUserQuery } from "src/hooks/account/useUserQuery"; +import Loading from "src/components/common/Loading"; const Complete = () => { const router = useRouter(); + const user = useUserQuery(); - return ( - + return user.isLoading ? ( + + ) : ( + } title="회원 가입" @@ -28,11 +28,22 @@ const Complete = () => { justify="space-between" align="start" > - - 채린님의 회원가입이 - 완료되었습니다. - 나만의 큐피드를 만들어보세요! - + + + + + {user.user?.name}님의 회원가입이 + + 완료되었습니다. + + 나만의 큐피드를 만들어보세요! + + + { ); }; +const ContentWrapper = styled(Flex)` + padding-top: 66px; +`; + export default Complete; diff --git a/src/components/sign-up/button-gender-select.tsx b/src/pages-edit/sign-up/components/button-gender-select.tsx similarity index 94% rename from src/components/sign-up/button-gender-select.tsx rename to src/pages-edit/sign-up/components/button-gender-select.tsx index cf1bde9..ef49e4a 100644 --- a/src/components/sign-up/button-gender-select.tsx +++ b/src/pages-edit/sign-up/components/button-gender-select.tsx @@ -1,8 +1,8 @@ "use client"; import styled from "styled-components"; -import Text from "../common/Text"; -import Flex from "../common/Flex"; +import Text from "../../../components/common/Text"; +import Flex from "../../../components/common/Flex"; import { colors, theme } from "styles/theme"; export type ButtonState = "active" | "disabled"; diff --git a/src/components/sign-up/elementary-school.tsx b/src/pages-edit/sign-up/components/elementary-school.tsx similarity index 91% rename from src/components/sign-up/elementary-school.tsx rename to src/pages-edit/sign-up/components/elementary-school.tsx index df68ab6..089f688 100644 --- a/src/components/sign-up/elementary-school.tsx +++ b/src/pages-edit/sign-up/components/elementary-school.tsx @@ -2,10 +2,10 @@ import { useRouter } from "next/navigation"; import { useEffect, useState, useCallback } from "react"; import { useInput } from "src/hooks/common/useInput"; -import InputLine from "../inputs/input-line"; -import ButtonFillLarge from "../buttons/button-fill-large"; -import Option from "../selectbox/Options"; -import Flex from "../common/Flex"; +import InputLine from "src/components/inputs/input-line"; +import ButtonFillLarge from "src/components/buttons/button-fill-large"; +import Option from "src/components/selectbox/Options"; +import Flex from "src/components/common/Flex"; import { useUserMutation } from "src/hooks/account/useUserMutation"; import { useAppSelector } from "src/hooks/useReduxHooks"; diff --git a/src/components/sign-up/graduate.tsx b/src/pages-edit/sign-up/components/graduate.tsx similarity index 91% rename from src/components/sign-up/graduate.tsx rename to src/pages-edit/sign-up/components/graduate.tsx index c92ca28..ded038d 100644 --- a/src/components/sign-up/graduate.tsx +++ b/src/pages-edit/sign-up/components/graduate.tsx @@ -1,4 +1,4 @@ -import SelectBox from "../selectbox/selectbox"; +import SelectBox from "src/components/selectbox/selectbox"; import { GRADUATE_OPTIONS } from "src/constants/options"; import University from "./university"; import MidHighSchool from "./middle-high-school"; diff --git a/src/components/sign-up/middle-high-school.tsx b/src/pages-edit/sign-up/components/middle-high-school.tsx similarity index 87% rename from src/components/sign-up/middle-high-school.tsx rename to src/pages-edit/sign-up/components/middle-high-school.tsx index 9df4010..39b18d7 100644 --- a/src/components/sign-up/middle-high-school.tsx +++ b/src/pages-edit/sign-up/components/middle-high-school.tsx @@ -7,10 +7,10 @@ import { useAppSelector } from "src/hooks/useReduxHooks"; import { useUserMutation } from "src/hooks/account/useUserMutation"; import useGetSchoolQuery from "src/hooks/school/useGetSchoolQuery"; -import InputLine from "../inputs/input-line"; -import ButtonFillLarge from "../buttons/button-fill-large"; -import Option from "../selectbox/Options"; -import Flex from "../common/Flex"; +import InputLine from "src/components/inputs/input-line"; +import ButtonFillLarge from "src/components/buttons/button-fill-large"; +import Option from "src/components/selectbox/Options"; +import Flex from "src/components/common/Flex"; import { Route } from "src/constants/Route"; @@ -50,7 +50,8 @@ const MidHighSchool = () => { schoolType: selected, schoolName: school.value }); - router.push(selected === "졸업생" ? Route.COMPLETE : Route.MIDHIGH); + // router.push(selected === "졸업생" ? Route.COMPLETE : Route.MIDHIGH); + router.push(Route.COMPLETE); }; return ( diff --git a/src/components/sign-up/university.tsx b/src/pages-edit/sign-up/components/university.tsx similarity index 85% rename from src/components/sign-up/university.tsx rename to src/pages-edit/sign-up/components/university.tsx index c1530d1..e4cbf33 100644 --- a/src/components/sign-up/university.tsx +++ b/src/pages-edit/sign-up/components/university.tsx @@ -4,9 +4,9 @@ import { useSelect } from "src/hooks/common/useSelect"; import { useAppSelector } from "src/hooks/useReduxHooks"; import { useUserMutation } from "src/hooks/account/useUserMutation"; -import InputLine from "../inputs/input-line"; -import SelectBox from "../selectbox/selectbox"; -import ButtonFillLarge from "../buttons/button-fill-large"; +import InputLine from "src/components/inputs/input-line"; +import SelectBox from "src/components/selectbox/selectbox"; +import ButtonFillLarge from "src/components/buttons/button-fill-large"; import { SCHOOL_YEAR_OPTIONS } from "src/constants/options"; import { Route } from "src/constants/Route"; @@ -27,7 +27,8 @@ const University = () => { class: department.value, grade: grade.value }); - router.push(selected === "졸업생" ? Route.COMPLETE : Route.UNIVERSITY); + // router.push(selected === "졸업생" ? Route.COMPLETE : Route.UNIVERSITY); + router.push(Route.COMPLETE); }; return ( diff --git a/src/pages-edit/sign-up/default.tsx b/src/pages-edit/sign-up/default.tsx index 6ebd2b2..c48f1be 100644 --- a/src/pages-edit/sign-up/default.tsx +++ b/src/pages-edit/sign-up/default.tsx @@ -5,7 +5,7 @@ import ButtonFillLarge from "src/components/buttons/button-fill-large"; import Flex from "src/components/common/Flex"; import InputLine from "src/components/inputs/input-line"; import NavigationTop from "src/components/navigations/NavigationTop"; -import ButtonGenderSelect from "src/components/sign-up/button-gender-select"; +import ButtonGenderSelect from "src/pages-edit/sign-up/components/button-gender-select"; import { birthMsg, emailMsg, nameMsg, phoneMsg } from "src/constants/messages"; import { useCheckNicknameQuery } from "src/hooks/account/useCheckNicknameQuery"; import { useInput } from "src/hooks/common/useInput"; diff --git a/src/pages-edit/sign-up/organization.tsx b/src/pages-edit/sign-up/organization.tsx index d5f6c45..21f9b8b 100644 --- a/src/pages-edit/sign-up/organization.tsx +++ b/src/pages-edit/sign-up/organization.tsx @@ -4,10 +4,10 @@ import NavigationTop from "src/components/navigations/NavigationTopBack"; import Flex from "src/components/common/Flex"; import SelectBox from "src/components/selectbox/selectbox"; import { ORGANIZATION_OPTIONS } from "src/constants/options"; -import ElementarySchool from "src/components/sign-up/elementary-school"; -import MidHighSchool from "src/components/sign-up/middle-high-school"; -import University from "src/components/sign-up/university"; -import Graduate from "src/components/sign-up/graduate"; +import ElementarySchool from "./components/elementary-school"; +import MidHighSchool from "./components/middle-high-school"; +import University from "./components/university"; +import Graduate from "./components/graduate"; import { useAppSelector } from "src/hooks/useReduxHooks"; import Icon from "src/components/Icon/Icon"; From f658dc1617284a72376501ea1fe47bdd0c465d9e Mon Sep 17 00:00:00 2001 From: hamo-o Date: Thu, 28 Sep 2023 17:11:43 +0900 Subject: [PATCH 09/11] =?UTF-8?q?feat:=20=EB=8C=80=ED=95=99=EA=B5=90=20?= =?UTF-8?q?=EA=B2=80=EC=83=89=20api=20=EC=97=B0=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/school/index.ts | 26 ++++++---- src/hooks/school/useGetUnivQuery.ts | 31 ++++++++++++ .../sign-up/components/university.tsx | 47 ++++++++++++++++--- 3 files changed, 89 insertions(+), 15 deletions(-) create mode 100644 src/hooks/school/useGetUnivQuery.ts diff --git a/src/apis/school/index.ts b/src/apis/school/index.ts index 0f1ac26..1eef951 100644 --- a/src/apis/school/index.ts +++ b/src/apis/school/index.ts @@ -6,7 +6,7 @@ const schoolAPI = { "https://open.neis.go.kr/hub/schoolInfo", { params: { - KEY: process.env.SCHOOL_API_KEY, + KEY: process.env.NEXT_PUBLIC_SCHOOL_API_KEY, Type: "json", pIndex: 1, pSize: 20, @@ -15,15 +15,23 @@ const schoolAPI = { } ); return response.data; + }, + async getUnivName(word: string) { + const response = await axios.get( + "https://www.career.go.kr/cnet/openapi/getOpenApi", + { + params: { + apiKey: process.env.NEXT_PUBLIC_UNIV_API_KEY, + svcType: "api", + svcCode: "SCHOOL", + contentType: "json", + gubun: "univ_list", + searchSchulNm: word + } + } + ); + return response.data; } - // async getUnivName(word: string) { - // const response = await defaultAxios.get("/account/apple/login", { - // params: { - // idToken: id_token - // } - // }); - // return response.data; - // } }; export default schoolAPI; diff --git a/src/hooks/school/useGetUnivQuery.ts b/src/hooks/school/useGetUnivQuery.ts new file mode 100644 index 0000000..59378ea --- /dev/null +++ b/src/hooks/school/useGetUnivQuery.ts @@ -0,0 +1,31 @@ +import { useInfiniteQuery, useQuery } from "@tanstack/react-query"; +import schoolAPI from "src/apis/school"; + +const useGetUnivQuery = (word: string) => { + // const { data, fetchNextPage, hasNextPage, isFetched } = useInfiniteQuery( + // ["school"], + // ({ pageParam = 0 }) => getUserQuestions(id, qtype, pageParam, 10), + // { + // getNextPageParam: (lastPage) => { + // return lastPage.data.count > lastPage.idx + 10 + // ? lastPage.idx + 10 + // : undefined; + // } + // } + // ); + + // return { data, fetchNextPage, hasNextPage, isFetched }; + const { data, isLoading, refetch } = useQuery( + ["univ"], + () => schoolAPI.getUnivName(word), + { + onError: (error: any) => { + alert(error); + } + } + ); + + return { data, isLoading, refetch }; +}; + +export default useGetUnivQuery; diff --git a/src/pages-edit/sign-up/components/university.tsx b/src/pages-edit/sign-up/components/university.tsx index e4cbf33..552d904 100644 --- a/src/pages-edit/sign-up/components/university.tsx +++ b/src/pages-edit/sign-up/components/university.tsx @@ -1,12 +1,16 @@ +import { useEffect, useCallback } from "react"; import { useRouter } from "next/navigation"; import { useInput } from "src/hooks/common/useInput"; import { useSelect } from "src/hooks/common/useSelect"; import { useAppSelector } from "src/hooks/useReduxHooks"; import { useUserMutation } from "src/hooks/account/useUserMutation"; +import useGetUnivQuery from "src/hooks/school/useGetUnivQuery"; +import Flex from "src/components/common/Flex"; import InputLine from "src/components/inputs/input-line"; import SelectBox from "src/components/selectbox/selectbox"; import ButtonFillLarge from "src/components/buttons/button-fill-large"; +import Option from "src/components/selectbox/Options"; import { SCHOOL_YEAR_OPTIONS } from "src/constants/options"; import { Route } from "src/constants/Route"; @@ -19,6 +23,28 @@ const University = () => { const selected = useAppSelector((state) => state.organization.selected); const { userMutation } = useUserMutation(); + const filteredSchool = useGetUnivQuery(school.value); + + useEffect(() => { + filteredSchool.refetch(); + console.log(filteredSchool.data); + }, [school.value]); + + const searchSchool = useCallback(() => { + const filteredSchoolInfo = + filteredSchool.data?.dataSearch.content && school.value + ? filteredSchool.data?.dataSearch.content.map( + (schoolInfo: any) => { + return { + name: schoolInfo.schoolName, + value: schoolInfo.schoolName + }; + } + ) + : null; + + return filteredSchoolInfo; + }, [filteredSchool]); const handleClickNext = () => { userMutation.mutate({ @@ -33,12 +59,20 @@ const University = () => { return ( <> - + + + {filteredSchool.data?.dataSearch.content && searchSchool() && ( + { setState={grade.handleSelect} options={SCHOOL_YEAR_OPTIONS} /> + Date: Thu, 28 Sep 2023 17:41:03 +0900 Subject: [PATCH 10/11] =?UTF-8?q?feat:=20=ED=95=99=EA=B3=BC=20=EA=B2=80?= =?UTF-8?q?=EC=83=89=20api=20=EC=97=B0=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/school/index.ts | 17 +++++++ src/hooks/school/useGetMajorQuery.ts | 31 ++++++++++++ .../sign-up/components/university.tsx | 47 +++++++++++++++---- 3 files changed, 87 insertions(+), 8 deletions(-) create mode 100644 src/hooks/school/useGetMajorQuery.ts diff --git a/src/apis/school/index.ts b/src/apis/school/index.ts index 1eef951..ffbfae4 100644 --- a/src/apis/school/index.ts +++ b/src/apis/school/index.ts @@ -31,6 +31,23 @@ const schoolAPI = { } ); return response.data; + }, + async getMajorName(word: string) { + const response = await axios.get( + "https://www.career.go.kr/cnet/openapi/getOpenApi", + { + params: { + apiKey: process.env.NEXT_PUBLIC_UNIV_API_KEY, + svcType: "api", + svcCode: "MAJOR", + contentType: "json", + gubun: "univ_list", + univSe: "univ", + searchTitle: word + } + } + ); + return response.data; } }; diff --git a/src/hooks/school/useGetMajorQuery.ts b/src/hooks/school/useGetMajorQuery.ts new file mode 100644 index 0000000..00bd898 --- /dev/null +++ b/src/hooks/school/useGetMajorQuery.ts @@ -0,0 +1,31 @@ +import { useInfiniteQuery, useQuery } from "@tanstack/react-query"; +import schoolAPI from "src/apis/school"; + +const useGetMajorQuery = (word: string) => { + // const { data, fetchNextPage, hasNextPage, isFetched } = useInfiniteQuery( + // ["school"], + // ({ pageParam = 0 }) => getUserQuestions(id, qtype, pageParam, 10), + // { + // getNextPageParam: (lastPage) => { + // return lastPage.data.count > lastPage.idx + 10 + // ? lastPage.idx + 10 + // : undefined; + // } + // } + // ); + + // return { data, fetchNextPage, hasNextPage, isFetched }; + const { data, isLoading, refetch } = useQuery( + ["major"], + () => schoolAPI.getMajorName(word), + { + onError: (error: any) => { + alert(error); + } + } + ); + + return { data, isLoading, refetch }; +}; + +export default useGetMajorQuery; diff --git a/src/pages-edit/sign-up/components/university.tsx b/src/pages-edit/sign-up/components/university.tsx index 552d904..efe6a40 100644 --- a/src/pages-edit/sign-up/components/university.tsx +++ b/src/pages-edit/sign-up/components/university.tsx @@ -5,6 +5,7 @@ import { useSelect } from "src/hooks/common/useSelect"; import { useAppSelector } from "src/hooks/useReduxHooks"; import { useUserMutation } from "src/hooks/account/useUserMutation"; import useGetUnivQuery from "src/hooks/school/useGetUnivQuery"; +import useGetMajorQuery from "src/hooks/school/useGetMajorQuery"; import Flex from "src/components/common/Flex"; import InputLine from "src/components/inputs/input-line"; @@ -24,12 +25,16 @@ const University = () => { const { userMutation } = useUserMutation(); const filteredSchool = useGetUnivQuery(school.value); + const filteredMajor = useGetMajorQuery(department.value); useEffect(() => { filteredSchool.refetch(); - console.log(filteredSchool.data); }, [school.value]); + useEffect(() => { + filteredMajor.refetch(); + }, [department.value]); + const searchSchool = useCallback(() => { const filteredSchoolInfo = filteredSchool.data?.dataSearch.content && school.value @@ -37,7 +42,8 @@ const University = () => { (schoolInfo: any) => { return { name: schoolInfo.schoolName, - value: schoolInfo.schoolName + value: + schoolInfo.schoolName + schoolInfo.campusName }; } ) @@ -46,6 +52,22 @@ const University = () => { return filteredSchoolInfo; }, [filteredSchool]); + const searchMajor = useCallback(() => { + const filteredMajorInfo = + filteredMajor.data?.dataSearch.content && department.value + ? filteredMajor.data?.dataSearch.content.map( + (schoolInfo: any) => { + return { + name: schoolInfo.mClass, + value: schoolInfo.majorSeq + }; + } + ) + : null; + + return filteredMajorInfo; + }, [filteredMajor]); + const handleClickNext = () => { userMutation.mutate({ schoolType: selected, @@ -73,12 +95,21 @@ const University = () => { /> )} - + + + {filteredMajor.data?.dataSearch.content && searchMajor() && ( + + Date: Thu, 28 Sep 2023 17:46:03 +0900 Subject: [PATCH 11/11] =?UTF-8?q?feat:=20=EC=A1=B8=EC=97=85=EC=83=9D?= =?UTF-8?q?=EC=9D=98=20=EA=B2=BD=EC=9A=B0=20=EC=98=B5=EC=85=98=EC=97=90=20?= =?UTF-8?q?=20=EC=B4=88=EB=93=B1=ED=95=99=EA=B5=90=20=ED=8F=AC=ED=95=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages-edit/sign-up/components/graduate.tsx | 6 +++++- src/pages-edit/sign-up/components/middle-high-school.tsx | 4 +++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/pages-edit/sign-up/components/graduate.tsx b/src/pages-edit/sign-up/components/graduate.tsx index ded038d..0298c81 100644 --- a/src/pages-edit/sign-up/components/graduate.tsx +++ b/src/pages-edit/sign-up/components/graduate.tsx @@ -14,7 +14,11 @@ const Graduate = () => { options={GRADUATE_OPTIONS} value={selected} /> - {selected === "대학교" ? : } + {selected === "대학교" ? ( + + ) : ( + + )} ); }; diff --git a/src/pages-edit/sign-up/components/middle-high-school.tsx b/src/pages-edit/sign-up/components/middle-high-school.tsx index 39b18d7..4945df2 100644 --- a/src/pages-edit/sign-up/components/middle-high-school.tsx +++ b/src/pages-edit/sign-up/components/middle-high-school.tsx @@ -14,7 +14,7 @@ import Flex from "src/components/common/Flex"; import { Route } from "src/constants/Route"; -const MidHighSchool = () => { +const MidHighSchool = ({ isGraduate = false }: { isGraduate?: boolean }) => { const router = useRouter(); const school = useInput(); const filteredSchool = useGetSchoolQuery(school.value); @@ -31,6 +31,8 @@ const MidHighSchool = () => { ? filteredSchool.data?.schoolInfo[1].row .filter( (schoolInfo: any) => + (isGraduate && + schoolInfo.SCHUL_KND_SC_NM === "초등학교") || schoolInfo.SCHUL_KND_SC_NM === "고등학교" || schoolInfo.SCHUL_KND_SC_NM === "중학교" )