fix: 근로자 마이페이지 버튼 status 최종 수정

kakao-tech-campus-2nd-step3 · Nov 12, 2024 · dcc6e87 · dcc6e87
1 parent e3d8ad7
commit dcc6e87
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 27 deletions.
diff --git a/src/apis/employee/mock/myApplicationList.mock.ts b/src/apis/employee/mock/myApplicationList.mock.ts
@@ -7,7 +7,7 @@ export const myApplicationList: 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: 'SIGNING_EMPLOYMENT_CONTRACT',
+    status: '근로계약서 서명하기',
     applyId: 1,
   },
   {
@@ -16,7 +16,7 @@ export const myApplicationList: 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: 'HIRING_CLOSED',
+    status: '채용마감',
     applyId: 2,
   },
   {
@@ -25,7 +25,7 @@ export const myApplicationList: 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: 'REVIEWING_APPLICATION',
+    status: '지원서 검토중',
     applyId: 3,
   },
   {
@@ -34,7 +34,7 @@ export const myApplicationList: 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: 'HIRED',
+    status: '채용완료',
     applyId: 4,
   },
 ];
diff --git a/src/features/employee/myPage/MyRecruitCard.tsx b/src/features/employee/myPage/MyRecruitCard.tsx
@@ -1,30 +1,30 @@
 import { Card, Image, Typo, Button } from '@/components/common';
 import styled from '@emotion/styled';
-import { MyRecruitListProps, StateProps, TextProps } from '@/types';
+import { MyRecruitListProps, StateProps } from '@/types';
 import { useNavigate } from 'react-router-dom';
 import ROUTE_PATH from '@/routes/path';
 import { useGetContractImg } from '@/apis/contract/hooks/useGetContractImg';
 import React from 'react';
 
 type DesignProps = {
   design: 'default' | 'outlined' | 'textbutton' | 'deactivate';
-  text?: TextProps;
+  text?: string;
   style?: React.CSSProperties;
 };
 
-function getStateStyle(state: StateProps): DesignProps {
-  switch (state) {
-    case 'SIGNING_EMPLOYMENT_CONTRACT':
+function getStateStyle(status: StateProps): DesignProps {
+  switch (status) {
+    case '근로계약서 서명하기':
       return { design: 'default', text: '근로계약서 서명하기' };
-    case 'HIRING_CLOSED':
+    case '채용마감':
       return { design: 'deactivate', text: '채용 마감' };
-    case 'REVIEWING_APPLICATION':
+    case '지원서 검토중':
       return {
         design: 'deactivate',
         text: '지원서 검토중',
         style: { backgroundColor: '#fff', border: '3px solid #9A9A9A' },
       };
-    case 'HIRED':
+    case '채용완료':
       return { design: 'outlined', text: '근로계약서 다운로드' };
     default:
       return { design: 'deactivate' }; // 상태가 정의되지 않은 경우
@@ -41,9 +41,10 @@ type DownloadContractProps = {
 };
 
 export default function MyRecruitCard({ myRecruit }: Props) {
-  const { image, title, area, state, applyId } = myRecruit;
-  const buttonStyle = getStateStyle(state);
+  const { image, title, area, status, applyId } = myRecruit;
+  const buttonStyle = getStateStyle(status);
   const navigate = useNavigate();
+
   // 근로계약서 이미지 다운로드
   const downloadContract = () => {
     const { data: imgURLs } = useGetContractImg(applyId);
@@ -87,9 +88,9 @@ export default function MyRecruitCard({ myRecruit }: Props) {
         design={buttonStyle.design}
         style={{ width: '200px', padding: '10px 20px', ...buttonStyle.style }}
         onClick={() => {
-          if (state == 'SIGNING_EMPLOYMENT_CONTRACT') {
+          if (status == '근로계약서 서명하기') {
             navigate(ROUTE_PATH.CONTRACT.EMPLOYEE.replace(':applyId', applyId.toString()));
-          } else if (state == 'HIRED') {
+          } else if (status == '채용완료') {
             downloadContract();
           }
         }}

diff --git a/src/types/index.d.ts b/src/types/index.d.ts
@@ -28,23 +28,14 @@ export type UserData = {
   name: string;
 };
 
-// 백엔드에서 정하는 값에 따라 key 바꾸면 됨
-export const State = {
-  SIGNING_EMPLOYMENT_CONTRACT: '근로계약서 서명하기',
-  HIRING_CLOSED: '채용 마감',
-  REVIEWING_APPLICATION: '지원서 검토중',
-  HIRED: '근로계약서 다운로드',
-} as const;
-
-export type StateProps = keyof typeof State;
-export type TextProps = (typeof State)[StateProps];
+export type StateProps = '근로계약서 서명하기' | '채용마감' | '지원서 검토중' | '채용완료';
 
 export type MyRecruitListProps = {
   id: number;
   title: string;
   area: string;
   image: string;
-  state: StateProps;
+  status: StateProps;
   applyId: number;
 };