From 323d7cefe67de481f320adaa9f16a04012942903 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Thu, 31 Oct 2024 17:37:26 +0900 Subject: [PATCH 1/8] =?UTF-8?q?feat:=20=EA=B7=BC=EB=A1=9C=EC=9E=90=20?= =?UTF-8?q?=EB=A7=88=EC=9D=B4=ED=8E=98=EC=9D=B4=EC=A7=80=20path=20?= =?UTF-8?q?=EC=97=B0=EA=B2=B0=20=EC=99=84=EB=A3=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/features/employee/myPage/CardButton.tsx | 7 ++--- .../employee/myPage/MyRecruitCard.tsx | 27 +++++++++++++------ src/pages/employee/myPage/EmployeeMyPage.tsx | 26 +++++++++++++++--- src/pages/employee/myPage/data/index.mock.ts | 8 +++--- src/routes/path.ts | 2 +- src/types/index.d.ts | 11 +++++++- 6 files changed, 60 insertions(+), 21 deletions(-) diff --git a/src/features/employee/myPage/CardButton.tsx b/src/features/employee/myPage/CardButton.tsx index fc788ba..a5cac95 100644 --- a/src/features/employee/myPage/CardButton.tsx +++ b/src/features/employee/myPage/CardButton.tsx @@ -1,12 +1,12 @@ import { Button } from '@/components/common'; -import { ReactNode } from 'react'; +import React, { ReactNode } from 'react'; type Props = { design?: 'default' | 'outlined' | 'textbutton' | 'deactivate'; children: ReactNode; -}; +} & React.ButtonHTMLAttributes; -export default function CardButton({ design, children }: Props) { +export default function CardButton({ design, children, ...rest }: Props) { return ( diff --git a/src/features/employee/myPage/MyRecruitCard.tsx b/src/features/employee/myPage/MyRecruitCard.tsx index 6f094af..2f2293a 100644 --- a/src/features/employee/myPage/MyRecruitCard.tsx +++ b/src/features/employee/myPage/MyRecruitCard.tsx @@ -1,24 +1,26 @@ import { Card, Image, Typo, Button } from '@/components/common'; import styled from '@emotion/styled'; -import { MyRecruitListProps, StateProps } from '@/types'; +import { MyRecruitListProps, StateProps, TextProps } from '@/types'; +import { useNavigate } from 'react-router-dom'; +import ROUTE_PATH from '@/routes/path'; type DesignProps = { design: 'default' | 'outlined' | 'textbutton' | 'deactivate'; - text: string; + text?: TextProps; }; function getStateStyle(state: StateProps): DesignProps { switch (state) { - case '근로계약서 서명하기': + case 'LetsSign': return { design: 'default', text: '근로계약서 서명하기' }; - case '채용 마감': + case 'Closed': return { design: 'deactivate', text: '채용 마감' }; - case '지원서 검토중': + case 'Waiting': return { design: 'outlined', text: '지원서 검토중' }; - case '채용 완료': + case 'Completed': return { design: 'deactivate', text: '채용 완료' }; default: - return { design: 'deactivate', text: '알 수 없음' }; // 상태가 정의되지 않은 경우 + return { design: 'deactivate' }; // 상태가 정의되지 않은 경우 } } @@ -29,6 +31,7 @@ type Props = { export default function MyRecruitCard({ myRecruit }: Props) { const { image, title, area, state } = myRecruit; const buttonStyle = getStateStyle(state); + const navigate = useNavigate(); return ( {area} - diff --git a/src/pages/employee/myPage/EmployeeMyPage.tsx b/src/pages/employee/myPage/EmployeeMyPage.tsx index de02c3f..e17655d 100644 --- a/src/pages/employee/myPage/EmployeeMyPage.tsx +++ b/src/pages/employee/myPage/EmployeeMyPage.tsx @@ -4,11 +4,13 @@ import styled from '@emotion/styled'; import MyRecruitList from '../../../features/employee/myPage/MyRecruitList'; import CardButton from '../../../features/employee/myPage/CardButton'; import EmployeeProfile from '../../../features/employee/myPage/EmployeeProfile'; -// import { myRecruitList } from './data/index.mock'; import { useGetMyApplication } from '@/apis/employee/hooks/useGetMyApplication'; +import { useNavigate } from 'react-router-dom'; +import ROUTE_PATH from '@/routes/path'; export default function EmployeeMyPage() { const { data: myRecruitList } = useGetMyApplication(); + const navigate = useNavigate(); return ( @@ -16,15 +18,31 @@ export default function EmployeeMyPage() {
- + { + navigate(ROUTE_PATH.RESUME); + console.log('?'); + }} + > 이력서 등록 - + { + navigate(ROUTE_PATH.REGISTERSIGN); + }} + > 사인 등록 - + { + navigate(ROUTE_PATH.REGISTER_VISA); + }} + > 외국인 번호 및 비자 발급 일자 등록 diff --git a/src/pages/employee/myPage/data/index.mock.ts b/src/pages/employee/myPage/data/index.mock.ts index 8a82202..87e394e 100644 --- a/src/pages/employee/myPage/data/index.mock.ts +++ b/src/pages/employee/myPage/data/index.mock.ts @@ -7,7 +7,7 @@ export const myRecruitList: MyRecruitListProps[] = [ 'https://img.freepik.com/free-photo/low-angle-view-of-skyscrapers_1359-1105.jpg?size=626&ext=jpg&ga=GA1.1.1297763733.1727740800&semt=ais_hybrid', title: '제목', area: '대전광역시 유성구', - state: '근로계약서 서명하기', + state: 'LetsSign', }, { id: 2, @@ -15,7 +15,7 @@ export const myRecruitList: MyRecruitListProps[] = [ 'https://img.freepik.com/free-photo/low-angle-view-of-skyscrapers_1359-1105.jpg?size=626&ext=jpg&ga=GA1.1.1297763733.1727740800&semt=ais_hybrid', title: '제목2', area: '대전광역시 유성구', - state: '채용 마감', + state: 'Closed', }, { id: 1, @@ -23,7 +23,7 @@ export const myRecruitList: MyRecruitListProps[] = [ 'https://img.freepik.com/free-photo/low-angle-view-of-skyscrapers_1359-1105.jpg?size=626&ext=jpg&ga=GA1.1.1297763733.1727740800&semt=ais_hybrid', title: '제목3', area: '대전광역시 유성구', - state: '지원서 검토중', + state: 'Waiting', }, { id: 1, @@ -31,6 +31,6 @@ export const myRecruitList: MyRecruitListProps[] = [ 'https://img.freepik.com/free-photo/low-angle-view-of-skyscrapers_1359-1105.jpg?size=626&ext=jpg&ga=GA1.1.1297763733.1727740800&semt=ais_hybrid', title: '제목4', area: '대전광역시 유성구', - state: '채용 완료', + state: 'Completed', }, ]; diff --git a/src/routes/path.ts b/src/routes/path.ts index 4d735cc..c1225bb 100644 --- a/src/routes/path.ts +++ b/src/routes/path.ts @@ -20,7 +20,7 @@ export const EMPLOYEE = { export const CONTRACT = { EMPLOYER: '/employer-contract', EMPLOYEE: '/employee-contract', -}; +} as const; const ROUTE_PATH = { HOME: '/', diff --git a/src/types/index.d.ts b/src/types/index.d.ts index 33c1bf2..255796a 100644 --- a/src/types/index.d.ts +++ b/src/types/index.d.ts @@ -27,7 +27,16 @@ export type UserData = { profileImage: string; }; -export type StateProps = '근로계약서 서명하기' | '채용 마감' | '지원서 검토중' | '채용 완료'; +// 백엔드에서 정하는 값에 따라 key 바꾸면 됨 +export const State = { + LetsSign: '근로계약서 서명하기', + Closed: '채용 마감', + Waiting: '지원서 검토중', + Completed: '채용 완료', +} as const; + +export type StateProps = keyof typeof State; +export type TextProps = (typeof State)[StateProps]; export type MyRecruitListProps = { id: number; From 5a2a46aa9ca93fa650b8c62a0d5614981d280d54 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Thu, 31 Oct 2024 17:51:07 +0900 Subject: [PATCH 2/8] =?UTF-8?q?feat:=20=EA=B5=AC=EC=9D=B8=EA=B8=80=20?= =?UTF-8?q?=EC=97=85=EB=A1=9C=EB=93=9C=20path=20=EC=97=B0=EA=B2=B0=20?= =?UTF-8?q?=EC=99=84=EB=A3=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/employer/hooks/usePostNotice.ts | 2 +- src/pages/employee/myPage/EmployeeMyPage.tsx | 1 - src/pages/employer/postNotice/PostNotice.tsx | 18 +++++++++++++++--- 3 files changed, 16 insertions(+), 5 deletions(-) diff --git a/src/apis/employer/hooks/usePostNotice.ts b/src/apis/employer/hooks/usePostNotice.ts index b54af4a..3d99f8b 100644 --- a/src/apis/employer/hooks/usePostNotice.ts +++ b/src/apis/employer/hooks/usePostNotice.ts @@ -26,7 +26,7 @@ export const postNotice = async (req: NoticeRequestData) => { return response.data; }; -export const FetchPostNotice = () => +export const useFetchPostNotice = () => useMutation({ mutationFn: postNotice, }); diff --git a/src/pages/employee/myPage/EmployeeMyPage.tsx b/src/pages/employee/myPage/EmployeeMyPage.tsx index e17655d..fd0c4ab 100644 --- a/src/pages/employee/myPage/EmployeeMyPage.tsx +++ b/src/pages/employee/myPage/EmployeeMyPage.tsx @@ -22,7 +22,6 @@ export default function EmployeeMyPage() { design="outlined" onClick={() => { navigate(ROUTE_PATH.RESUME); - console.log('?'); }} > 이력서 등록 diff --git a/src/pages/employer/postNotice/PostNotice.tsx b/src/pages/employer/postNotice/PostNotice.tsx index 3b2f6a2..37e00ef 100644 --- a/src/pages/employer/postNotice/PostNotice.tsx +++ b/src/pages/employer/postNotice/PostNotice.tsx @@ -1,11 +1,15 @@ -import { FetchPostNotice } from '@/apis/employer/hooks/usePostNotice'; +import { useFetchPostNotice } from '@/apis/employer/hooks/usePostNotice'; import { Button, Flex, Input, Typo } from '@/components/common'; import Layout from '@/features/layout'; +import ROUTE_PATH from '@/routes/path'; import styled from '@emotion/styled'; import { useState } from 'react'; +import { useNavigate } from 'react-router-dom'; export default function PostNotice() { - const mutation = FetchPostNotice(); + const mutation = useFetchPostNotice(); + const navigate = useNavigate(); + const [inputs, setInputs] = useState({ salary: '', workingDuration: '', @@ -27,7 +31,15 @@ export default function PostNotice() { }; const handlePostNotice = () => { - mutation.mutate(inputs); + mutation.mutate(inputs, { + onSuccess: () => { + navigate(ROUTE_PATH.HOME); + }, + onError: () => { + // 이부분 에러처리 결정해야함. + alert('값이 정상적으로 저장되지 않았습니다.'); + }, + }); }; return ( From 096bc5c0e7081641ec0fd783aa7bef5c9564bff4 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Thu, 31 Oct 2024 20:09:16 +0900 Subject: [PATCH 3/8] =?UTF-8?q?feat:=20=ED=9A=8C=EC=82=AC=20=EB=93=B1?= =?UTF-8?q?=EB=A1=9D=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/apiPath.ts | 11 ++-- .../registerCompany/registerCompany.mock.ts | 9 ++++ .../registerCompany/useRegisterCompany.ts | 23 +++++++++ src/mocks/handlers.ts | 2 + src/pages/registerCompany/RegisterCompany.tsx | 50 +++++++++++++++++-- 5 files changed, 85 insertions(+), 10 deletions(-) create mode 100644 src/apis/registerCompany/registerCompany.mock.ts create mode 100644 src/apis/registerCompany/useRegisterCompany.ts diff --git a/src/apis/apiPath.ts b/src/apis/apiPath.ts index b9b74e4..c115707 100644 --- a/src/apis/apiPath.ts +++ b/src/apis/apiPath.ts @@ -1,17 +1,18 @@ const BASE_URL = '/api'; export const APIPath = { - postNotice: '/api/recruitments', - allApplication: '/api/application/all', - signEmployeeContract: '/api/contract', - makeEmployerContract: '/api/categories', - downloadContract: '/api/contract/:applyId/download', + postNotice: `${BASE_URL}/recruitments`, + allApplication: `${BASE_URL}/application/all`, + signEmployeeContract: `${BASE_URL}/api/contract`, + makeEmployerContract: `${BASE_URL}/categories`, + downloadContract: `${BASE_URL}/contract/:applyId/download`, registerSign: '/api/sign', getMyCompanies: `${BASE_URL}/company`, getMyRecruitments: `${BASE_URL}/recruitments/company/:companyId`, getMyApplicants: `${BASE_URL}/application/:recruitmentId`, getForeigner: `${BASE_URL}/visa/:userId`, registerVisa: `${BASE_URL}/visa`, + registerCompany: `${BASE_URL}/company`, apply: '/api/application/', recruitmentsDetail: '/api/recruitments/:postId', }; diff --git a/src/apis/registerCompany/registerCompany.mock.ts b/src/apis/registerCompany/registerCompany.mock.ts new file mode 100644 index 0000000..8bed0c8 --- /dev/null +++ b/src/apis/registerCompany/registerCompany.mock.ts @@ -0,0 +1,9 @@ +import { http, HttpResponse } from 'msw'; +import { getPostCompanyPath } from './useRegisterCompany'; + +export const registerCompanyMockHandler = [ + http.post(getPostCompanyPath(), async ({ request }) => { + const req = await request.json(); + return HttpResponse.json(req, { status: 201 }); + }), +]; diff --git a/src/apis/registerCompany/useRegisterCompany.ts b/src/apis/registerCompany/useRegisterCompany.ts new file mode 100644 index 0000000..b8a6d43 --- /dev/null +++ b/src/apis/registerCompany/useRegisterCompany.ts @@ -0,0 +1,23 @@ +import { APIPath } from '@/apis/apiPath'; +import { clientInstance } from '@/apis/instance'; +import { useMutation } from '@tanstack/react-query'; + +export type CompanyRequestData = { + name?: string; + industryOccupation?: string; + brand?: string; + revenuePerYear?: number; + logoImage?: string; +}; + +export const getPostCompanyPath = () => `${APIPath.registerCompany}`; + +export const postCompany = async (req: CompanyRequestData) => { + const response = await clientInstance.post(getPostCompanyPath(), req); + return response.data; +}; + +export const useFetchPostCompany = () => + useMutation({ + mutationFn: postCompany, + }); diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts index 944bac2..be95d71 100644 --- a/src/mocks/handlers.ts +++ b/src/mocks/handlers.ts @@ -10,6 +10,7 @@ import { foreignerMockHandler } from '@/apis/applicants/mocks/foreignerMockHandl import { visaMockHandler } from '@/apis/applicants/mocks/visaMockHandler'; import { postApplyMockHandler } from '@apis/apply/postApply.mock'; import { recruitmentsDetailMockHandler } from '@apis/recruitmentsDetail/recruitmentsDetailMockHandler'; +import { registerCompanyMockHandler } from '@/apis/registerCompany/registerCompany.mock'; export const handlers = [ ...recruitmentsMockHandler, @@ -24,4 +25,5 @@ export const handlers = [ ...visaMockHandler, ...postApplyMockHandler, ...recruitmentsDetailMockHandler, + ...registerCompanyMockHandler, ]; diff --git a/src/pages/registerCompany/RegisterCompany.tsx b/src/pages/registerCompany/RegisterCompany.tsx index 4b501e6..f461f5b 100644 --- a/src/pages/registerCompany/RegisterCompany.tsx +++ b/src/pages/registerCompany/RegisterCompany.tsx @@ -1,8 +1,44 @@ +import { useFetchPostCompany } from '@/apis/registerCompany/useRegisterCompany'; import { Button, Flex, Input, Typo } from '@/components/common'; import Layout from '@/features/layout'; +import ROUTE_PATH from '@/routes/path'; import styled from '@emotion/styled'; +import { useState } from 'react'; +import { useNavigate } from 'react-router-dom'; export default function RegisterCompany() { + const mutation = useFetchPostCompany(); + const navigate = useNavigate(); + + const [inputs, setInputs] = useState({ + name: '', + industryOccupation: '', + brand: '', + revenuePerYear: 0, + logoImage: '', + }); + + const { name, industryOccupation, brand, revenuePerYear, logoImage } = inputs; + + const onChange = (e: React.ChangeEvent) => { + const { value, name } = e.target; + setInputs({ + ...inputs, + [name]: value, + }); + }; + + const handlePostCompany = () => { + mutation.mutate(inputs, { + onSuccess: () => { + navigate(ROUTE_PATH.HOME); + }, + onError: () => { + // 이부분 에러처리 결정해야함. + alert('값이 정상적으로 저장되지 않았습니다.'); + }, + }); + }; return (
@@ -17,24 +53,26 @@ export default function RegisterCompany() { - + - + - + - + - @@ -72,3 +110,5 @@ const ButtonWrapper = styled.div` justify-content: center; margin-top: 52px; `; + +const InputStyle = { width: '570px', height: '48px' }; From 5bd6021917d0be5f1f541e793badd6adbeaebae6 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Thu, 31 Oct 2024 20:24:20 +0900 Subject: [PATCH 4/8] =?UTF-8?q?feat:=20i18n=20=EB=B2=88=EC=97=AD=20?= =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=20-=20=EA=B5=AC=EC=9D=B8=EA=B8=80?= =?UTF-8?q?=20=EC=97=85=EB=A1=9C=EB=93=9C,=20=EA=B7=BC=EB=A1=9C=EC=9E=90?= =?UTF-8?q?=20=EB=A7=88=EC=9D=B4=ED=8E=98=EC=9D=B4=EC=A7=80,=20=ED=9A=8C?= =?UTF-8?q?=EC=82=AC=20=EB=93=B1=EB=A1=9D=20=ED=8E=98=EC=9D=B4=EC=A7=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/translator/EmployeeMyPage/ko.ts | 7 +++++++ src/assets/translator/EmployeeMyPage/ve.ts | 7 +++++++ src/assets/translator/PostNotice/ko.ts | 11 +++++++++++ src/assets/translator/PostNotice/ve.ts | 11 +++++++++++ src/assets/translator/RegisterCompany/ko.ts | 9 +++++++++ src/assets/translator/RegisterCompany/ve.ts | 9 +++++++++ 6 files changed, 54 insertions(+) create mode 100644 src/assets/translator/EmployeeMyPage/ko.ts create mode 100644 src/assets/translator/EmployeeMyPage/ve.ts create mode 100644 src/assets/translator/PostNotice/ko.ts create mode 100644 src/assets/translator/PostNotice/ve.ts create mode 100644 src/assets/translator/RegisterCompany/ko.ts create mode 100644 src/assets/translator/RegisterCompany/ve.ts diff --git a/src/assets/translator/EmployeeMyPage/ko.ts b/src/assets/translator/EmployeeMyPage/ko.ts new file mode 100644 index 0000000..bdcb94e --- /dev/null +++ b/src/assets/translator/EmployeeMyPage/ko.ts @@ -0,0 +1,7 @@ +export const EmployeeMyPage = { + UPDATE_PROFILE: '프로필 수정하기', + REGISTER_RESUME: '이력서 등록하기', + REGISTER_SIGN: '사인 등록', + REGISTER_VISA: '외국인 번호 및 비자 발급 일자 등록', + MYRECRUITLIST: '내가 지원한 공고', +}; diff --git a/src/assets/translator/EmployeeMyPage/ve.ts b/src/assets/translator/EmployeeMyPage/ve.ts new file mode 100644 index 0000000..5ddd79c --- /dev/null +++ b/src/assets/translator/EmployeeMyPage/ve.ts @@ -0,0 +1,7 @@ +export const EmployeeMyPage = { + UPDATE_PROFILE: 'Cập nhật hồ sơ', + REGISTER_RESUME: 'Đăng ký hồ sơ', + REGISTER_SIGN: 'Đăng ký chữ ký', + REGISTER_VISA: 'Đăng ký số người nước ngoài và ngày cấp visa', + MYRECRUITLIST: 'Công việc tôi đã ứng tuyển', +}; diff --git a/src/assets/translator/PostNotice/ko.ts b/src/assets/translator/PostNotice/ko.ts new file mode 100644 index 0000000..6e28f63 --- /dev/null +++ b/src/assets/translator/PostNotice/ko.ts @@ -0,0 +1,11 @@ +export const PostNotice = { + TITLE: '구인 글 등록하기', + SALARY: '급여', + WORKINGDURATION: '근무기간', + WORKDAYS: '근무요일', + WORKHOURS: '근무시간', + WORKTYPE: '고용형태', + ELIGIBILITY_CRITERIA: '비자조건', + PREFERRED_CONDITIONS: '우대사항', + SUBMIT: '등록하기', +}; diff --git a/src/assets/translator/PostNotice/ve.ts b/src/assets/translator/PostNotice/ve.ts new file mode 100644 index 0000000..d96469a --- /dev/null +++ b/src/assets/translator/PostNotice/ve.ts @@ -0,0 +1,11 @@ +export const PostNotice = { + TITLE: 'Đăng bài tuyển dụng', + SALARY: 'Lương', + WORKINGDURATION: 'Thời gian làm việc', + WORKDAYS: 'Ngày làm việc', + WORKHOURS: 'Giờ làm việc', + WORKTYPE: 'Hình thức làm việc', + ELIGIBILITY_CRITERIA: 'Điều kiện visa', + PREFERRED_CONDITIONS: 'Ưu tiên', + SUBMIT: 'Đăng', +}; diff --git a/src/assets/translator/RegisterCompany/ko.ts b/src/assets/translator/RegisterCompany/ko.ts new file mode 100644 index 0000000..0d3663c --- /dev/null +++ b/src/assets/translator/RegisterCompany/ko.ts @@ -0,0 +1,9 @@ +export const RegisterCompany = { + TITLE: '회사 등록', + LOGOIMAGE: '회사 이미지 업로드(선택)', + COMPANYNAME: '회사명', + INDUSTRY_OCCUPATION: '업직종', + BRAND: '브랜드', + REVENUE_PERYEAR: '연 평균 매출액', + SUBMIT: '등록하기', +}; diff --git a/src/assets/translator/RegisterCompany/ve.ts b/src/assets/translator/RegisterCompany/ve.ts new file mode 100644 index 0000000..d01e351 --- /dev/null +++ b/src/assets/translator/RegisterCompany/ve.ts @@ -0,0 +1,9 @@ +export const RegisterCompany = { + TITLE: 'Đăng ký công ty', + LOGOIMAGE: 'Tải lên logo công ty (tùy chọn)', + COMPANYNAME: 'Tên công ty', + INDUSTRY_OCCUPATION: 'Ngành nghề', + BRAND: 'Thương hiệu', + REVENUE_PERYEAR: 'Doanh thu hàng năm', + SUBMIT: 'Đăng ký', +}; From 139ea3eea86bb3473826cbfe4c42067f3f67a872 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Thu, 31 Oct 2024 20:25:45 +0900 Subject: [PATCH 5/8] =?UTF-8?q?refactor:=20=EA=B5=AC=EC=9D=B8=EA=B8=80=20?= =?UTF-8?q?=EC=97=85=EB=A1=9C=EB=93=9C=20=EB=B0=8F=20=EA=B7=BC=EB=A1=9C?= =?UTF-8?q?=EC=9E=90=20=EB=A7=88=EC=9D=B4=ED=8E=98=EC=9D=B4=EC=A7=80=20?= =?UTF-8?q?=ED=8F=B4=EB=8D=94=EA=B5=AC=EC=A1=B0=20=EC=A0=95=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../employee/mock/getMyApplication.mock.ts | 2 +- .../EmployerContract/EmployerContract.tsx | 104 ++---------------- .../employee}/EmployeeMyPage.stories.tsx | 0 .../employee}/EmployeeMyPage.tsx | 0 .../employee}/data/index.mock.ts | 0 .../postNotice/PostNotice.stories.tsx | 0 .../{employer => }/postNotice/PostNotice.tsx | 0 src/routes/router.tsx | 4 +- 8 files changed, 11 insertions(+), 99 deletions(-) rename src/pages/{employee/myPage => myPage/employee}/EmployeeMyPage.stories.tsx (100%) rename src/pages/{employee/myPage => myPage/employee}/EmployeeMyPage.tsx (100%) rename src/pages/{employee/myPage => myPage/employee}/data/index.mock.ts (100%) rename src/pages/{employer => }/postNotice/PostNotice.stories.tsx (100%) rename src/pages/{employer => }/postNotice/PostNotice.tsx (100%) diff --git a/src/apis/employee/mock/getMyApplication.mock.ts b/src/apis/employee/mock/getMyApplication.mock.ts index 4217cbf..b7ef811 100644 --- a/src/apis/employee/mock/getMyApplication.mock.ts +++ b/src/apis/employee/mock/getMyApplication.mock.ts @@ -1,6 +1,6 @@ import { http, HttpResponse } from 'msw'; import { getMyApplicationPath } from '../hooks/useGetMyApplication'; -import { myRecruitList } from '@/pages/employee/myPage/data/index.mock'; +import { myRecruitList } from '@/pages/myPage/employee/data/index.mock'; export const EmployeePageMockHandler = [ http.get(getMyApplicationPath(), () => { diff --git a/src/pages/contract/EmployerContract/EmployerContract.tsx b/src/pages/contract/EmployerContract/EmployerContract.tsx index a8463bd..156c0c5 100644 --- a/src/pages/contract/EmployerContract/EmployerContract.tsx +++ b/src/pages/contract/EmployerContract/EmployerContract.tsx @@ -10,117 +10,29 @@ export default function EmployerContract() { - 근로계약서 작성하기 + 근 로 계 약 서 - - 사용자 - - + - + - + - + - + - - - - 근로자 - - - - - - - - - - - - - - 근로계약기간 - - - - - - - - - - - - - - 근로장소 - - - - - - - - 업무내용 - - - - - - - - 근로시간 - - - - - - - - - - - 휴일 - - - - - - - - 임금 - - - - - - - - - - - - - - - - - 숙식제공 - - + - + diff --git a/src/pages/employee/myPage/EmployeeMyPage.stories.tsx b/src/pages/myPage/employee/EmployeeMyPage.stories.tsx similarity index 100% rename from src/pages/employee/myPage/EmployeeMyPage.stories.tsx rename to src/pages/myPage/employee/EmployeeMyPage.stories.tsx diff --git a/src/pages/employee/myPage/EmployeeMyPage.tsx b/src/pages/myPage/employee/EmployeeMyPage.tsx similarity index 100% rename from src/pages/employee/myPage/EmployeeMyPage.tsx rename to src/pages/myPage/employee/EmployeeMyPage.tsx diff --git a/src/pages/employee/myPage/data/index.mock.ts b/src/pages/myPage/employee/data/index.mock.ts similarity index 100% rename from src/pages/employee/myPage/data/index.mock.ts rename to src/pages/myPage/employee/data/index.mock.ts diff --git a/src/pages/employer/postNotice/PostNotice.stories.tsx b/src/pages/postNotice/PostNotice.stories.tsx similarity index 100% rename from src/pages/employer/postNotice/PostNotice.stories.tsx rename to src/pages/postNotice/PostNotice.stories.tsx diff --git a/src/pages/employer/postNotice/PostNotice.tsx b/src/pages/postNotice/PostNotice.tsx similarity index 100% rename from src/pages/employer/postNotice/PostNotice.tsx rename to src/pages/postNotice/PostNotice.tsx diff --git a/src/routes/router.tsx b/src/routes/router.tsx index 5d2015d..befe1d3 100644 --- a/src/routes/router.tsx +++ b/src/routes/router.tsx @@ -6,14 +6,14 @@ import LoadingPage from '@/pages/auth/Loading'; import App from '@/App'; import Recruit from '@/pages/recruit'; import RegisterVisa from '@/pages/registerVisa/RegisterVisa'; -import PostNotice from '@/pages/employer/postNotice/PostNotice'; +import PostNotice from '@/pages/postNotice/PostNotice'; import Home from '@/pages/home'; import ApplyGuide from '@/pages/apply/applyguide/ApplyGuide'; import ApplyPage from '@/pages/apply/applypage/ApplyPage'; import MyCompany from '@/pages/myCompany/MyCompany'; import Applicants from '@/pages/applicants/Applicants'; import Resume from '@/pages/resume/Resume'; -import EmployeeMyPage from '@/pages/employee/myPage/EmployeeMyPage'; +import EmployeeMyPage from '@/pages/myPage/employee/EmployeeMyPage'; import RegisterSign from '@/pages/registerSign/RegisterSign'; import RegisterCompany from '@/pages/registerCompany/RegisterCompany'; import EmployerMyPage from '@/pages/myPage/employer/EmPloyerMyPage'; From 13109ccc04c283009e68c089760e08a559842825 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Fri, 1 Nov 2024 00:30:13 +0900 Subject: [PATCH 6/8] =?UTF-8?q?feat:=20=EA=B3=A0=EC=9A=A9=EC=A3=BC=20?= =?UTF-8?q?=EA=B7=BC=EB=A1=9C=EA=B3=84=EC=95=BD=EC=84=9C=20=EC=9E=91?= =?UTF-8?q?=EC=84=B1=20API=20=EC=97=B0=EA=B2=B0=20=EB=B0=8F=20=EA=B5=AC?= =?UTF-8?q?=EC=9D=B8=EA=B8=80=20=EC=9E=91=EC=84=B1=20API=20=ED=8F=B4?= =?UTF-8?q?=EB=8D=94=EA=B5=AC=EC=A1=B0=20=EC=A0=95=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/apis/apiPath.ts | 6 +- src/apis/contract/hooks/usePostContract.tsx | 26 +++++++ src/apis/contract/mock/postContract.mock.ts | 9 +++ .../hooks/usePostNotice.ts | 0 .../mock/postNotice.mock.ts | 0 src/mocks/handlers.ts | 4 +- .../EmployerContract/EmployerContract.tsx | 70 +++++++++++++++---- src/pages/postNotice/PostNotice.tsx | 2 +- 8 files changed, 100 insertions(+), 17 deletions(-) create mode 100644 src/apis/contract/hooks/usePostContract.tsx create mode 100644 src/apis/contract/mock/postContract.mock.ts rename src/apis/{employer => postNotice}/hooks/usePostNotice.ts (100%) rename src/apis/{employer => postNotice}/mock/postNotice.mock.ts (100%) diff --git a/src/apis/apiPath.ts b/src/apis/apiPath.ts index c115707..0cd4e1c 100644 --- a/src/apis/apiPath.ts +++ b/src/apis/apiPath.ts @@ -3,8 +3,9 @@ const BASE_URL = '/api'; export const APIPath = { postNotice: `${BASE_URL}/recruitments`, allApplication: `${BASE_URL}/application/all`, - signEmployeeContract: `${BASE_URL}/api/contract`, - makeEmployerContract: `${BASE_URL}/categories`, + signEmployeeContract: `${BASE_URL}/contract/employee`, + makeContract: `${BASE_URL}/contract`, + getContract: `${BASE_URL}/contract/:applyId`, downloadContract: `${BASE_URL}/contract/:applyId/download`, registerSign: '/api/sign', getMyCompanies: `${BASE_URL}/company`, @@ -19,6 +20,7 @@ export const APIPath = { export const getDynamicAPIPath = { downloadContract: (applyId: number) => APIPath.downloadContract.replace(':applyId', applyId.toString()), + getContract: (applyId: number) => APIPath.getContract.replace(':applyId', applyId.toString()), getMyRecruitments: (companyId: number) => APIPath.getMyRecruitments.replace(':companyId', companyId.toString()), getMyApplicants: (recruitmentId: number) => APIPath.getMyApplicants.replace(':recruitmentId', recruitmentId.toString()), diff --git a/src/apis/contract/hooks/usePostContract.tsx b/src/apis/contract/hooks/usePostContract.tsx new file mode 100644 index 0000000..a828e56 --- /dev/null +++ b/src/apis/contract/hooks/usePostContract.tsx @@ -0,0 +1,26 @@ +import { APIPath } from '@/apis/apiPath'; +import { clientInstance } from '@/apis/instance'; +import { useMutation } from '@tanstack/react-query'; + +export type ContractRequestData = { + salary?: string; + workingHours?: string; + dayOff?: string; + annualPaidLeave?: string; + workingPlace?: string; + responsibilities?: string; + rule?: string; + applyId?: number; +}; + +export const getPostContractPath = () => `${APIPath.makeContract}`; + +export const postContract = async (req: ContractRequestData) => { + const response = await clientInstance.post(getPostContractPath(), req); + return response.data; +}; + +export const useFetchPostContract = () => + useMutation({ + mutationFn: postContract, + }); diff --git a/src/apis/contract/mock/postContract.mock.ts b/src/apis/contract/mock/postContract.mock.ts new file mode 100644 index 0000000..3f7d2c2 --- /dev/null +++ b/src/apis/contract/mock/postContract.mock.ts @@ -0,0 +1,9 @@ +import { http, HttpResponse } from 'msw'; +import { getPostContractPath } from '../hooks/usePostContract'; + +export const contractsMockHandler = [ + http.post(getPostContractPath(), async ({ request }) => { + const req = await request.json(); + return HttpResponse.json(req, { status: 201 }); + }), +]; diff --git a/src/apis/employer/hooks/usePostNotice.ts b/src/apis/postNotice/hooks/usePostNotice.ts similarity index 100% rename from src/apis/employer/hooks/usePostNotice.ts rename to src/apis/postNotice/hooks/usePostNotice.ts diff --git a/src/apis/employer/mock/postNotice.mock.ts b/src/apis/postNotice/mock/postNotice.mock.ts similarity index 100% rename from src/apis/employer/mock/postNotice.mock.ts rename to src/apis/postNotice/mock/postNotice.mock.ts diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts index be95d71..bd844cf 100644 --- a/src/mocks/handlers.ts +++ b/src/mocks/handlers.ts @@ -1,7 +1,7 @@ import { recruitmentsMockHandler } from '@/apis/home/mocks/recruitmentsMockHandler'; import { slidesMockHandler } from '@/apis/home/mocks/slidesMockHandler'; import { EmployeePageMockHandler } from '@/apis/employee/mock/getMyApplication.mock'; -import { noticesMockHandler } from '@/apis/employer/mock/postNotice.mock'; +import { noticesMockHandler } from '@/apis/postNotice/mock/postNotice.mock'; import { registerSignMockHandler } from '@/apis/registerSign/registerSign.mock'; import { myCompaniesMockHandler } from '@/apis/companies/mocks/myCompaniesMockHandler'; import { myRecruitmentsMockHandler } from '@/apis/recruitments/mocks/myRecruitmentsMockHandler'; @@ -11,6 +11,7 @@ import { visaMockHandler } from '@/apis/applicants/mocks/visaMockHandler'; import { postApplyMockHandler } from '@apis/apply/postApply.mock'; import { recruitmentsDetailMockHandler } from '@apis/recruitmentsDetail/recruitmentsDetailMockHandler'; import { registerCompanyMockHandler } from '@/apis/registerCompany/registerCompany.mock'; +import { contractsMockHandler } from '@/apis/contract/mock/postContract.mock'; export const handlers = [ ...recruitmentsMockHandler, @@ -26,4 +27,5 @@ export const handlers = [ ...postApplyMockHandler, ...recruitmentsDetailMockHandler, ...registerCompanyMockHandler, + ...contractsMockHandler, ]; diff --git a/src/pages/contract/EmployerContract/EmployerContract.tsx b/src/pages/contract/EmployerContract/EmployerContract.tsx index 156c0c5..bc3e0ce 100644 --- a/src/pages/contract/EmployerContract/EmployerContract.tsx +++ b/src/pages/contract/EmployerContract/EmployerContract.tsx @@ -1,8 +1,49 @@ +import { useFetchPostContract } from '@/apis/contract/hooks/usePostContract'; import { Button, Flex, Input, Typo } from '@/components/common'; import Layout from '@/features/layout'; +import ROUTE_PATH from '@/routes/path'; import styled from '@emotion/styled'; +import { useState } from 'react'; +import { useNavigate, useParams } from 'react-router-dom'; export default function EmployerContract() { + const { applyId: applicationId } = useParams(); + const mutation = useFetchPostContract(); + const navigate = useNavigate(); + + const [inputs, setInputs] = useState({ + salary: '', + workingHours: '', + dayOff: '', + annualPaidLeave: '', + workingPlace: '', + responsibilities: '', + rule: '', + applyId: Number(`${applicationId}`), + }); + + const { salary, workingHours, dayOff, annualPaidLeave, workingPlace, responsibilities, rule } = inputs; + + const onChange = (e: React.ChangeEvent) => { + const { value, name } = e.target; + setInputs({ + ...inputs, + [name]: value, + }); + }; + + const handlePostContract = () => { + mutation.mutate(inputs, { + onSuccess: () => { + navigate(ROUTE_PATH.HOME); + }, + onError: () => { + // 이부분 에러처리 결정해야함. + alert('값이 정상적으로 저장되지 않았습니다.'); + }, + }); + }; + return (
@@ -14,25 +55,30 @@ export default function EmployerContract() { - + - + - + - + - + - + - + @@ -43,19 +89,15 @@ export default function EmployerContract() {
- <>
- -
@@ -92,3 +134,5 @@ const ButtonWrapper = styled.div` justify-content: space-between; margin-top: 52px; `; + +const InputStyle = { width: '570px', height: '48px' }; diff --git a/src/pages/postNotice/PostNotice.tsx b/src/pages/postNotice/PostNotice.tsx index 37e00ef..acec63a 100644 --- a/src/pages/postNotice/PostNotice.tsx +++ b/src/pages/postNotice/PostNotice.tsx @@ -1,4 +1,4 @@ -import { useFetchPostNotice } from '@/apis/employer/hooks/usePostNotice'; +import { useFetchPostNotice } from '@/apis/postNotice/hooks/usePostNotice'; import { Button, Flex, Input, Typo } from '@/components/common'; import Layout from '@/features/layout'; import ROUTE_PATH from '@/routes/path'; From d1dd3ebf9c6083bccec94dcbd30820275fd2631b Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Fri, 1 Nov 2024 01:42:46 +0900 Subject: [PATCH 7/8] =?UTF-8?q?feat:=20=EA=B7=BC=EB=A1=9C=EC=9E=90=20?= =?UTF-8?q?=EA=B7=BC=EB=A1=9C=EA=B3=84=EC=95=BD=EC=84=9C=20=EB=B6=88?= =?UTF-8?q?=EB=9F=AC=EC=98=A4=EA=B8=B0=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/contract/hooks/useGetMyContract.tsx | 15 ++ src/apis/contract/mock/contract.mock.ts | 22 +++ src/apis/contract/mock/postContract.mock.ts | 9 -- .../employee/myPage/MyRecruitCard.tsx | 4 +- .../employee/myPage/MyRecruitList.tsx | 2 +- src/mocks/handlers.ts | 2 +- .../EmployeeContract/EmployeeContract.tsx | 149 +++++------------- src/pages/myPage/employee/data/index.mock.ts | 4 + src/routes/path.ts | 4 +- src/types/index.d.ts | 1 + 10 files changed, 86 insertions(+), 126 deletions(-) create mode 100644 src/apis/contract/hooks/useGetMyContract.tsx create mode 100644 src/apis/contract/mock/contract.mock.ts delete mode 100644 src/apis/contract/mock/postContract.mock.ts diff --git a/src/apis/contract/hooks/useGetMyContract.tsx b/src/apis/contract/hooks/useGetMyContract.tsx new file mode 100644 index 0000000..f9978f2 --- /dev/null +++ b/src/apis/contract/hooks/useGetMyContract.tsx @@ -0,0 +1,15 @@ +import { getDynamicAPIPath } from '@/apis/apiPath'; +import { clientInstance } from '@/apis/instance'; +import { useQuery } from '@tanstack/react-query'; + +export const getMyContractPath = (applyId: number) => `${getDynamicAPIPath.getContract(applyId)}`; +const getMyContract = async (applyId: number) => { + const res = await clientInstance.get(getMyContractPath(applyId)); + return res.data; +}; + +export const useGetMyContract = (applyId: number) => + useQuery({ + queryKey: [getMyContractPath], + queryFn: () => getMyContract(applyId), + }); diff --git a/src/apis/contract/mock/contract.mock.ts b/src/apis/contract/mock/contract.mock.ts new file mode 100644 index 0000000..4315f8f --- /dev/null +++ b/src/apis/contract/mock/contract.mock.ts @@ -0,0 +1,22 @@ +import { http, HttpResponse } from 'msw'; +import { getPostContractPath } from '../hooks/usePostContract'; +import { getMyContractPath } from '../hooks/useGetMyContract'; + +export const contractsMockHandler = [ + http.post(getPostContractPath(), async ({ request }) => { + const req = await request.json(); + return HttpResponse.json(req, { status: 201 }); + }), + + http.get(getMyContractPath(1), () => HttpResponse.json(CONTRACT_DATA)), +]; + +const CONTRACT_DATA = { + salary: '월 2백만원', + workingHours: '월화수 10:00 ~ 15:00, 목금 12:00 ~ 16:00', + dayOff: '매월 마지막주 화요일', + annualPaidLeave: '통상근로자의 근로시간에 비례하여 연차유급휴가를 부여한다.', + workingPlace: '대전 유성구 궁동 대학로99', + responsibilities: '개발하기', + rule: '열심히 일하기!', +}; diff --git a/src/apis/contract/mock/postContract.mock.ts b/src/apis/contract/mock/postContract.mock.ts deleted file mode 100644 index 3f7d2c2..0000000 --- a/src/apis/contract/mock/postContract.mock.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { http, HttpResponse } from 'msw'; -import { getPostContractPath } from '../hooks/usePostContract'; - -export const contractsMockHandler = [ - http.post(getPostContractPath(), async ({ request }) => { - const req = await request.json(); - return HttpResponse.json(req, { status: 201 }); - }), -]; diff --git a/src/features/employee/myPage/MyRecruitCard.tsx b/src/features/employee/myPage/MyRecruitCard.tsx index 2f2293a..0f4786e 100644 --- a/src/features/employee/myPage/MyRecruitCard.tsx +++ b/src/features/employee/myPage/MyRecruitCard.tsx @@ -29,7 +29,7 @@ type Props = { }; export default function MyRecruitCard({ myRecruit }: Props) { - const { image, title, area, state } = myRecruit; + const { image, title, area, state, applyId } = myRecruit; const buttonStyle = getStateStyle(state); const navigate = useNavigate(); @@ -65,7 +65,7 @@ export default function MyRecruitCard({ myRecruit }: Props) { style={{ width: '200px', padding: '10px 20px' }} onClick={() => { if (state == 'LetsSign') { - navigate(ROUTE_PATH.CONTRACT.EMPLOYEE); + navigate(ROUTE_PATH.CONTRACT.EMPLOYEE.replace(':applyId', applyId.toString())); } }} > diff --git a/src/features/employee/myPage/MyRecruitList.tsx b/src/features/employee/myPage/MyRecruitList.tsx index 8fad8c5..9cad734 100644 --- a/src/features/employee/myPage/MyRecruitList.tsx +++ b/src/features/employee/myPage/MyRecruitList.tsx @@ -10,7 +10,7 @@ export default function MyRecruitList({ myRecruitList }: Props) { return ( } + renderItem={(myRecruit) => } /> ); } diff --git a/src/mocks/handlers.ts b/src/mocks/handlers.ts index bd844cf..ca57b72 100644 --- a/src/mocks/handlers.ts +++ b/src/mocks/handlers.ts @@ -11,7 +11,7 @@ import { visaMockHandler } from '@/apis/applicants/mocks/visaMockHandler'; import { postApplyMockHandler } from '@apis/apply/postApply.mock'; import { recruitmentsDetailMockHandler } from '@apis/recruitmentsDetail/recruitmentsDetailMockHandler'; import { registerCompanyMockHandler } from '@/apis/registerCompany/registerCompany.mock'; -import { contractsMockHandler } from '@/apis/contract/mock/postContract.mock'; +import { contractsMockHandler } from '@/apis/contract/mock/contract.mock'; export const handlers = [ ...recruitmentsMockHandler, diff --git a/src/pages/contract/EmployeeContract/EmployeeContract.tsx b/src/pages/contract/EmployeeContract/EmployeeContract.tsx index 10a8df0..a933622 100644 --- a/src/pages/contract/EmployeeContract/EmployeeContract.tsx +++ b/src/pages/contract/EmployeeContract/EmployeeContract.tsx @@ -1,8 +1,24 @@ -import { Button, Flex, Input, Typo } from '@/components/common'; +import { useGetMyContract } from '@/apis/contract/hooks/useGetMyContract'; +import { Button, Flex, Typo } from '@/components/common'; import Layout from '@/features/layout'; import styled from '@emotion/styled'; +import { useParams } from 'react-router-dom'; + +export type ContractResponseData = { + salary: string; + workingHours: string; + dayOff: string; + annualPaidLeave: string; + workingPlace: string; + responsibilities: string; + rule: string; +}; export default function EmployeeContract() { + const { applyId: applicationId } = useParams(); + const { data: contract } = useGetMyContract(Number(applicationId)); + const contractData: ContractResponseData = contract || {}; + return (
@@ -10,117 +26,36 @@ export default function EmployeeContract() { - 근로계약서 작성하기 + 근 로 계 약 서 - - 사용자 - - - - - - - - - - - - - - - - - - - - 근로자 - - - - - - - - - - - - - - 근로계약기간 - - - - - - - - - - - - - - 근로장소 - - - - - - - - 업무내용 - - - - - - - - 근로시간 - - - - - - - - - - - 휴일 - - + 1. 근무장소 + {contractData.workingPlace} - - - - 임금 - - + 2. 업무내용 + {contractData.responsibilities} - + 3. 근로일 및 근로일별 근로시간 + {contractData.workingHours} - + 4. 주휴일 + {contractData.dayOff} - + 5. 임금 + {contractData.salary} - - - - 숙식제공 - - + 6. 연차유급휴가 + {contractData.annualPaidLeave} - + 7. 취업규칙 + {contractData.rule} @@ -130,20 +65,12 @@ export default function EmployeeContract() { 이 계약에서 정하지 않은 사항은 '근로기준법'에서 정하는 바에 따른다. -
- <> - - - -
-
- - -
+ + diff --git a/src/pages/myPage/employee/data/index.mock.ts b/src/pages/myPage/employee/data/index.mock.ts index 87e394e..c907fe9 100644 --- a/src/pages/myPage/employee/data/index.mock.ts +++ b/src/pages/myPage/employee/data/index.mock.ts @@ -8,6 +8,7 @@ export const myRecruitList: MyRecruitListProps[] = [ title: '제목', area: '대전광역시 유성구', state: 'LetsSign', + applyId: 1, }, { id: 2, @@ -16,6 +17,7 @@ export const myRecruitList: MyRecruitListProps[] = [ title: '제목2', area: '대전광역시 유성구', state: 'Closed', + applyId: 2, }, { id: 1, @@ -24,6 +26,7 @@ export const myRecruitList: MyRecruitListProps[] = [ title: '제목3', area: '대전광역시 유성구', state: 'Waiting', + applyId: 3, }, { id: 1, @@ -32,5 +35,6 @@ export const myRecruitList: MyRecruitListProps[] = [ title: '제목4', area: '대전광역시 유성구', state: 'Completed', + applyId: 4, }, ]; diff --git a/src/routes/path.ts b/src/routes/path.ts index c1225bb..66085f7 100644 --- a/src/routes/path.ts +++ b/src/routes/path.ts @@ -18,8 +18,8 @@ export const EMPLOYEE = { } as const; export const CONTRACT = { - EMPLOYER: '/employer-contract', - EMPLOYEE: '/employee-contract', + EMPLOYER: '/employer-contract/:applyId', + EMPLOYEE: '/employee-contract/:applyId', } as const; const ROUTE_PATH = { diff --git a/src/types/index.d.ts b/src/types/index.d.ts index 255796a..cc00f42 100644 --- a/src/types/index.d.ts +++ b/src/types/index.d.ts @@ -44,6 +44,7 @@ export type MyRecruitListProps = { area: string; image: string; state: StateProps; + applyId: number; }; export type RecruitmentItem = { From 17c16c9d855818e6f9faa044396d8a727a3133a1 Mon Sep 17 00:00:00 2001 From: YIMSEBIN Date: Fri, 1 Nov 2024 01:50:35 +0900 Subject: [PATCH 8/8] =?UTF-8?q?feat:=20=EA=B7=BC=EB=A1=9C=EC=9E=90=20?= =?UTF-8?q?=EA=B7=BC=EB=A1=9C=EA=B3=84=EC=95=BD=EC=84=9C=20=EC=A0=80?= =?UTF-8?q?=EC=9E=A5=ED=95=98=EA=B8=B0=20API=20=EC=97=B0=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../contract/hooks/usePostEmployeeSign.tsx | 19 +++++++++++++ src/apis/contract/mock/contract.mock.ts | 6 ++++ .../EmployeeContract/EmployeeContract.tsx | 28 ++++++++++++++++--- 3 files changed, 49 insertions(+), 4 deletions(-) create mode 100644 src/apis/contract/hooks/usePostEmployeeSign.tsx diff --git a/src/apis/contract/hooks/usePostEmployeeSign.tsx b/src/apis/contract/hooks/usePostEmployeeSign.tsx new file mode 100644 index 0000000..b1fc0f5 --- /dev/null +++ b/src/apis/contract/hooks/usePostEmployeeSign.tsx @@ -0,0 +1,19 @@ +import { APIPath } from '@/apis/apiPath'; +import { clientInstance } from '@/apis/instance'; +import { useMutation } from '@tanstack/react-query'; + +export type SignEmployeeContractRequestData = { + applyId?: number; +}; + +export const getPostSignEmployeeContractPath = () => `${APIPath.signEmployeeContract}`; + +export const postSignEmployeeContract = async (req: SignEmployeeContractRequestData) => { + const response = await clientInstance.post(getPostSignEmployeeContractPath(), req); + return response.data; +}; + +export const useFetchPostContract = () => + useMutation({ + mutationFn: postSignEmployeeContract, + }); diff --git a/src/apis/contract/mock/contract.mock.ts b/src/apis/contract/mock/contract.mock.ts index 4315f8f..8a87559 100644 --- a/src/apis/contract/mock/contract.mock.ts +++ b/src/apis/contract/mock/contract.mock.ts @@ -1,6 +1,7 @@ import { http, HttpResponse } from 'msw'; import { getPostContractPath } from '../hooks/usePostContract'; import { getMyContractPath } from '../hooks/useGetMyContract'; +import { getPostSignEmployeeContractPath } from '../hooks/usePostEmployeeSign'; export const contractsMockHandler = [ http.post(getPostContractPath(), async ({ request }) => { @@ -9,6 +10,11 @@ export const contractsMockHandler = [ }), http.get(getMyContractPath(1), () => HttpResponse.json(CONTRACT_DATA)), + + http.post(getPostSignEmployeeContractPath(), async ({ request }) => { + const req = await request.json(); + return HttpResponse.json(req, { status: 201 }); + }), ]; const CONTRACT_DATA = { diff --git a/src/pages/contract/EmployeeContract/EmployeeContract.tsx b/src/pages/contract/EmployeeContract/EmployeeContract.tsx index a933622..f72bbce 100644 --- a/src/pages/contract/EmployeeContract/EmployeeContract.tsx +++ b/src/pages/contract/EmployeeContract/EmployeeContract.tsx @@ -1,8 +1,10 @@ import { useGetMyContract } from '@/apis/contract/hooks/useGetMyContract'; +import { useFetchPostContract } from '@/apis/contract/hooks/usePostContract'; import { Button, Flex, Typo } from '@/components/common'; import Layout from '@/features/layout'; +import ROUTE_PATH from '@/routes/path'; import styled from '@emotion/styled'; -import { useParams } from 'react-router-dom'; +import { useNavigate, useParams } from 'react-router-dom'; export type ContractResponseData = { salary: string; @@ -15,10 +17,28 @@ export type ContractResponseData = { }; export default function EmployeeContract() { - const { applyId: applicationId } = useParams(); - const { data: contract } = useGetMyContract(Number(applicationId)); + const { applyId } = useParams(); + const applicationId = Number(applyId); + const { data: contract } = useGetMyContract(applicationId); + const mutation = useFetchPostContract(); + const navigate = useNavigate(); const contractData: ContractResponseData = contract || {}; + const handlePostSignEmployeeContract = () => { + mutation.mutate( + { applyId: applicationId }, + { + onSuccess: () => { + navigate(ROUTE_PATH.HOME); + }, + onError: () => { + // 이부분 에러처리 결정해야함. + alert('값이 정상적으로 저장되지 않았습니다.'); + }, + }, + ); + }; + return (
@@ -68,7 +88,7 @@ export default function EmployeeContract() { -