From 844a73b6a7bddecffdb9e377ad29f4759f5e108f Mon Sep 17 00:00:00 2001 From: bottlewook Date: Thu, 29 Feb 2024 15:43:02 +0900 Subject: [PATCH 1/5] =?UTF-8?q?feat:=20=EC=B0=A8=EB=9F=89=20=EC=A0=95?= =?UTF-8?q?=EB=B3=B4=20=EB=93=B1=EB=A1=9D=20=ED=95=A8=EC=88=98=20=EB=B0=8F?= =?UTF-8?q?=20=ED=83=80=EC=9E=85=20=EC=9E=91=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../additional-info.post.api.ts | 25 +++++++++++++++++++ src/remote/api/types/additional-info.ts | 14 +++++++++++ 2 files changed, 39 insertions(+) create mode 100644 src/remote/api/requests/additional-info/additional-info.post.api.ts diff --git a/src/remote/api/requests/additional-info/additional-info.post.api.ts b/src/remote/api/requests/additional-info/additional-info.post.api.ts new file mode 100644 index 00000000..8a329d76 --- /dev/null +++ b/src/remote/api/requests/additional-info/additional-info.post.api.ts @@ -0,0 +1,25 @@ +import { ICarDetails, ICarWashDetails } from '../../types/additional-info'; +import { ICommon } from '../../types/common'; +import { postRequest } from '../requests.api'; + +/* ----- 차량 정보 입력 api ----- */ +export const postCarDetails = async ({ + segment, carType, color, driving, parking, +}: ICarDetails) => { + const response = await postRequest, ICarDetails>('/member/car', { + segment, carType, color, driving, parking, + }); + + return response; +}; + +/* ----- 세차 용품 정보 입력 api ----- */ +export const postCarWashDetails = async ({ + frequency, cost, interest, +}: ICarWashDetails) => { + const response = await postRequest, ICarWashDetails>('/member/wash', { + frequency, cost, interest, + }); + + return response; +}; diff --git a/src/remote/api/types/additional-info.ts b/src/remote/api/types/additional-info.ts index 07523baf..e9ab5175 100644 --- a/src/remote/api/types/additional-info.ts +++ b/src/remote/api/types/additional-info.ts @@ -16,4 +16,18 @@ export interface IAdditionalInfo { modifiedBy: string | null } +export interface ICarDetails { + segment: number + carType: number + color: number + driving: number + parking: number +} + +export interface ICarWashDetails { + frequency: number + cost: number + interest: number +} + export type AdditionalInfoType = ICommon; From 229e75d1632249d0830688d6c28a02fe0d81f722 Mon Sep 17 00:00:00 2001 From: bottlewook Date: Thu, 29 Feb 2024 15:44:06 +0900 Subject: [PATCH 2/5] =?UTF-8?q?feat:=20=EC=B0=A8=EB=9F=89=20=EC=A0=95?= =?UTF-8?q?=EB=B3=B4=20=EB=93=B1=EB=A1=9D=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20no=20=EB=B3=80=EA=B2=BD=20#219?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/additional-info/car-details/CarColorPicker.tsx | 2 +- src/components/additional-info/car-details/CarDetails.tsx | 2 +- .../additional-info/car-details/color-picker/ColorPicker.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/additional-info/car-details/CarColorPicker.tsx b/src/components/additional-info/car-details/CarColorPicker.tsx index e81939d5..0d505606 100644 --- a/src/components/additional-info/car-details/CarColorPicker.tsx +++ b/src/components/additional-info/car-details/CarColorPicker.tsx @@ -43,7 +43,7 @@ function CarColorPicker({ { label: string - value: string + value: number color: ColorMapType } From 77d574d4978277fc119f7726811f617168a7bba3 Mon Sep 17 00:00:00 2001 From: bottlewook Date: Thu, 29 Feb 2024 15:44:39 +0900 Subject: [PATCH 3/5] =?UTF-8?q?feat:=20=EC=B0=A8=EB=9F=89=20=EC=A0=95?= =?UTF-8?q?=EB=B3=B4=20=EB=93=B1=EB=A1=9D=20=EC=BF=BC=EB=A6=AC=ED=9B=85=20?= =?UTF-8?q?=EC=A0=9C=EC=9E=91=20#219?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../car-details/useRegisterCarDetails.tsx | 22 +++++++++++++++++++ .../useRegisterCarWashDetails.tsx | 22 +++++++++++++++++++ 2 files changed, 44 insertions(+) create mode 100644 src/remote/queries/additional-info/car-details/useRegisterCarDetails.tsx create mode 100644 src/remote/queries/additional-info/car-wash-details/useRegisterCarWashDetails.tsx diff --git a/src/remote/queries/additional-info/car-details/useRegisterCarDetails.tsx b/src/remote/queries/additional-info/car-details/useRegisterCarDetails.tsx new file mode 100644 index 00000000..f22f3ea4 --- /dev/null +++ b/src/remote/queries/additional-info/car-details/useRegisterCarDetails.tsx @@ -0,0 +1,22 @@ +import { toast } from 'react-toastify'; + +import { useMutation } from '@tanstack/react-query'; +import { useRouter } from 'next/navigation'; + +import { postCarDetails } from '@remote/api/requests/additional-info/additional-info.post.api'; + +function useRegisterCarDetails() { + const router = useRouter(); + return useMutation({ + mutationFn: postCarDetails, + onSuccess: () => { + router.push('/'); + toast.success('등록을 완료하였습니다!'); + }, + onError: () => { + toast.error('다시 입력해주세요'); + }, + }); +} + +export default useRegisterCarDetails; diff --git a/src/remote/queries/additional-info/car-wash-details/useRegisterCarWashDetails.tsx b/src/remote/queries/additional-info/car-wash-details/useRegisterCarWashDetails.tsx new file mode 100644 index 00000000..0893a046 --- /dev/null +++ b/src/remote/queries/additional-info/car-wash-details/useRegisterCarWashDetails.tsx @@ -0,0 +1,22 @@ +import { toast } from 'react-toastify'; + +import { useMutation } from '@tanstack/react-query'; +import { useRouter } from 'next/navigation'; + +import { postCarWashDetails } from '@remote/api/requests/additional-info/additional-info.post.api'; + +function useRegisterCarWashDetails() { + const router = useRouter(); + return useMutation({ + mutationFn: postCarWashDetails, + onSuccess: () => { + router.push('/'); + toast.success('등록을 완료하였습니다!'); + }, + onError: () => { + toast.error('다시 입력해주세요'); + }, + }); +} + +export default useRegisterCarWashDetails; From 5f38babb97cdaae8b3df98e7c297013534d6ba11 Mon Sep 17 00:00:00 2001 From: bottlewook Date: Thu, 29 Feb 2024 15:45:19 +0900 Subject: [PATCH 4/5] =?UTF-8?q?feat:=20=EC=B0=A8=EB=9F=89=20=EC=A0=95?= =?UTF-8?q?=EB=B3=B4=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=93=B1=EB=A1=9D=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80=20#219?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/car-details/hydrated-page.tsx | 9 ++++----- src/app/car-wash-details/hydrated-page.tsx | 7 ++++--- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/app/car-details/hydrated-page.tsx b/src/app/car-details/hydrated-page.tsx index b3b10275..f51d94dc 100644 --- a/src/app/car-details/hydrated-page.tsx +++ b/src/app/car-details/hydrated-page.tsx @@ -8,11 +8,13 @@ import { useForm } from 'react-hook-form'; import CarColorPicker from '@components/additional-info/car-details/CarColorPicker'; import CarDetails from '@components/additional-info/car-details/CarDetails'; import DetailsLoading from '@components/additional-info/details-loading/DetailsLoading'; +import { ICarDetails } from '@remote/api/types/additional-info'; import useCarColor from '@remote/queries/additional-info/car-details/useCarColor'; import useCarDriving from '@remote/queries/additional-info/car-details/useCarDriving'; import useCarParking from '@remote/queries/additional-info/car-details/useCarParking'; import useCarSegment from '@remote/queries/additional-info/car-details/useCarSegment'; import useCarType from '@remote/queries/additional-info/car-details/useCarType'; +import useRegisterCarDetails from '@remote/queries/additional-info/car-details/useRegisterCarDetails'; import Header from '@shared/header/Header'; import Loader from '@shared/loader/Loader'; import ProgressBar from '@shared/progress-bar/ProgressBar'; @@ -24,7 +26,7 @@ function CarDetailsPage() { const { data: carColorData, isLoading: isCarColorLoading } = useCarColor(); const { data: carDrivingData, isLoading: isCarDrivingLoading } = useCarDriving(); const { data: carParkingData, isLoading: isCarParkingLoading } = useCarParking(); - + const { mutate } = useRegisterCarDetails(); const [step, setStep] = useState(1); const { @@ -38,9 +40,7 @@ function CarDetailsPage() { // eslint-disable-next-line @typescript-eslint/require-await const onSubmit = async () => { - onNext(); - // TODO: 쿼리훅 제작 및 테스트 - // console.log(getValues()); + mutate({ ...getValues() as ICarDetails }); }; // TODO: Loader 컴포넌트 제작 @@ -60,7 +60,6 @@ function CarDetailsPage() { return null; } - // TODO: 헤더 아이콘 클릭 시 뒤로가기 기능 추가 return ( <> {step <= 5 && ( diff --git a/src/app/car-wash-details/hydrated-page.tsx b/src/app/car-wash-details/hydrated-page.tsx index 5770fd9f..1f88b026 100644 --- a/src/app/car-wash-details/hydrated-page.tsx +++ b/src/app/car-wash-details/hydrated-page.tsx @@ -7,9 +7,11 @@ import { useForm } from 'react-hook-form'; import CarDetails from '@components/additional-info/car-details/CarDetails'; import DetailsLoading from '@components/additional-info/details-loading/DetailsLoading'; +import { ICarWashDetails } from '@remote/api/types/additional-info'; import useCarWashCost from '@remote/queries/additional-info/car-wash-details/useCarWashCost'; import useCarWashFrequency from '@remote/queries/additional-info/car-wash-details/useCarWashFrequency'; import useCarWashInterest from '@remote/queries/additional-info/car-wash-details/useCarWashInterest'; +import useRegisterCarWashDetails from '@remote/queries/additional-info/car-wash-details/useRegisterCarWashDetails'; import Header from '@shared/header/Header'; import Loader from '@shared/loader/Loader'; import ProgressBar from '@shared/progress-bar/ProgressBar'; @@ -19,7 +21,7 @@ function CarWashDetailsPage() { const { data: carWashFrequencyData } = useCarWashFrequency(); const { data: carWashCostData } = useCarWashCost(); const { data: carWashInterestData } = useCarWashInterest(); - + const { mutate } = useRegisterCarWashDetails(); const [step, setStep] = useState(1); const { @@ -38,8 +40,7 @@ function CarWashDetailsPage() { // eslint-disable-next-line @typescript-eslint/require-await const onSubmit = async () => { onNext(); - // TODO: 쿼리훅 제작 - // console.log(getValues()); + mutate({ ...getValues() as ICarWashDetails }); }; // TODO: Loader 컴포넌트 제작 From 6e4ddda50cb9b64f023e94ad345f537e3200e39c Mon Sep 17 00:00:00 2001 From: bottlewook Date: Thu, 29 Feb 2024 15:47:34 +0900 Subject: [PATCH 5/5] chore: resolve build error #219 --- .../car-details/color-picker/ColorPicker.stories.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/additional-info/car-details/color-picker/ColorPicker.stories.tsx b/src/components/additional-info/car-details/color-picker/ColorPicker.stories.tsx index 1a8c9719..fcaa592f 100644 --- a/src/components/additional-info/car-details/color-picker/ColorPicker.stories.tsx +++ b/src/components/additional-info/car-details/color-picker/ColorPicker.stories.tsx @@ -18,7 +18,7 @@ type Story = StoryObj; export const black: Story = { args: { label: '검은색', - value: '37383C', + value: 21, color: 'black', }, }; @@ -26,7 +26,7 @@ export const black: Story = { export const green: Story = { args: { label: '초록', - value: '2F4F4F', + value: 26, color: 'green', }, };