Merge pull request #153 from YIMSEBIN/Weekly

Fix: 근로자 마이페이지 버튼 비활성화 및 폴더구조 정리

src/assets/translator/EmployeeMyPage/employeeMyPageData.ts

@@ -5,18 +5,18 @@ export const employeeMyPageData = {
     REGISTER_RESUME: '이력서 등록',
     REGISTER_SIGN: '사인 등록',
     REGISTER_VISA: '외국인 번호 및 비자 등록',
-    UPDATE_RESUME: '이력서 수정',
-    UPDATE_SIGN: '사인 수정',
-    UPDATE_VISA: '외국인 번호 및 비자 수정',
+    COMPLETE_RESUME: '이력서 등록 완료',
+    COMPLETE_SIGN: '사인 등록 완료',
+    COMPLETE_VISA: '외국인 번호 및 비자 등록 완료',
     MYRECRUITLIST: '내가 지원한 공고',
   },
   [Languages.VE]: {
     REGISTER_RESUME: 'Đăng ký hồ sơ',
     REGISTER_SIGN: 'Đăng ký chữ ký',
-    REGISTER_VISA: 'Đăng ký số người nước ngoài và visa',
-    UPDATE_RESUME: 'Cập nhật hồ sơ',
-    UPDATE_SIGN: 'Cập nhật chữ ký',
-    UPDATE_VISA: 'Cập nhật số người nước ngoài và visa',
+    REGISTER_VISA: 'Đăng ký số nước ngoài và visa',
+    COMPLETE_RESUME: 'Hoàn thành đăng ký hồ sơ',
+    COMPLETE_SIGN: 'Hoàn thành đăng ký chữ ký',
+    COMPLETE_VISA: 'Hoàn thành đăng ký số nước ngoài và visa',
     MYRECRUITLIST: 'Công việc tôi đã ứng tuyển',
   },
 };

src/features/employee/myPage/ButtonGroup.tsx → src/features/myPage/employee/components/ButtonGroup.tsx

@@ -5,6 +5,7 @@ import { Button, Icon, Typo } from '@/components/common';
 import { useTranslation } from 'react-i18next';
 import { useGetRequiredFieldCheck } from '@/apis/recruitmentsDetail/useRequiredFieldCheck';
 import { type RequiredFieldCheckProps } from '@/pages/recruit/RecruitType';
+import { css } from '@emotion/react';
 
 export default function ButtonGroup() {
   const { t } = useTranslation();
@@ -21,34 +22,40 @@ export default function ButtonGroup() {
   return (
     <ColumnSection>
       <ActiveButton
-        design="outlined"
+        design={resumeExistence ? 'deactivate' : 'outlined'}
+        css={resumeExistence ? deactiveButtonStyle : activateButtonStyle}
         style={{ borderRight: '3px solid #0a65cc' }}
         onClick={() => {
           navigate(ROUTE_PATH.RESUME);
         }}
+        disabled={resumeExistence}
       >
-        <Typo bold>{resumeExistence ? t('employeeMyPage.UPDATE_RESUME') : t('employeeMyPage.REGISTER_RESUME')}</Typo>
+        <Typo bold>{resumeExistence ? t('employeeMyPage.COMPLETE_RESUME') : t('employeeMyPage.REGISTER_RESUME')}</Typo>
         {resumeExistence ? <Icon.EmployeePage.Check /> : <Icon.EmployeePage.Bag />}
       </ActiveButton>
       <ActiveButton
-        design="outlined"
+        design={signExistence ? 'deactivate' : 'outlined'}
+        css={signExistence ? deactiveButtonStyle : activateButtonStyle}
         style={{ borderRight: '3px solid #0a65cc' }}
         onClick={() => {
           navigate(ROUTE_PATH.REGISTERSIGN);
         }}
+        disabled={signExistence}
       >
-        <Typo bold>{signExistence ? t('employeeMyPage.UPDATE_SIGN') : t('employeeMyPage.REGISTER_SIGN')}</Typo>
+        <Typo bold>{signExistence ? t('employeeMyPage.COMPLETE_SIGN') : t('employeeMyPage.REGISTER_SIGN')}</Typo>
         {signExistence ? <Icon.EmployeePage.Check /> : <Icon.EmployeePage.Pen />}
       </ActiveButton>
       <ActiveButton
-        design="outlined"
+        design={visaExistence ? 'deactivate' : 'outlined'}
+        css={visaExistence ? deactiveButtonStyle : activateButtonStyle}
         onClick={() => {
           navigate(ROUTE_PATH.REGISTER_VISA);
         }}
+        disabled={visaExistence}
       >
         <Typo bold>
           {visaExistence && foreignerIdNumberExistence
-            ? t('employeeMyPage.UPDATE_VISA')
+            ? t('employeeMyPage.COMPLETE_VISA')
             : t('employeeMyPage.REGISTER_VISA')}
         </Typo>
         {visaExistence && foreignerIdNumberExistence ? <Icon.EmployeePage.Check /> : <Icon.EmployeePage.Card />}
@@ -71,10 +78,15 @@ const ActiveButton = styled(Button)`
   border-radius: 0;
   border: 0;
   color: #000;
+`;
+
+export const deactiveButtonStyle = css``;
+
+export const activateButtonStyle = css`
+  ${deactiveButtonStyle};
   transition:
     background-color 0.3s,
-    background-image 0.3s; // 배경 색상과 이미지 애니메이션
-
+    background-image 0.3s;
   &:hover {
     * {
       color: #fff;

src/features/employee/myPage/MyRecruitCard.tsx → src/features/myPage/employee/components/MyRecruitCard.tsx

@@ -36,30 +36,30 @@ type Props = {
 };
 
 type DownloadContractProps = {
-  imageUrl: string;
-  imageUrlV: string;
+  url: string;
+  urlV: string;
 };
 
 export default function MyRecruitCard({ myRecruit }: Props) {
   const { image, title, area, status, applyId } = myRecruit;
   const buttonStyle = getStateStyle(status);
   const navigate = useNavigate();
+  const { data: imgURLs } = useGetContractImg(applyId);
 
   // 근로계약서 이미지 다운로드
   const downloadContract = () => {
-    const { data: imgURLs } = useGetContractImg(applyId);
     const imgData: DownloadContractProps = imgURLs;
     const link = document.createElement('a');
-    link.href = imgData.imageUrlV;
+    link.href = imgData.urlV;
     link.download = 'downloaded_image';
+    console.log(imgData);
     document.body.appendChild(link);
     link.click();
     document.body.removeChild(link);
   };
 
   return (
     <Card
-      borderColor="blue"
       borderRadius="4px"
       css={{
         width: '100%',
@@ -69,6 +69,7 @@ export default function MyRecruitCard({ myRecruit }: Props) {
         display: 'flex',
         justifyContent: 'space-between',
         alignItems: 'center',
+        border: '1px solid #0A65CC',
       }}
     >
       <Image

src/pages/myPage/employee/EmployeeMyPage.tsx

@@ -1,10 +1,10 @@
 import { Flex, InnerContainer, Spinner, Typo } from '@/components/common';
 import Layout from '@/features/layout';
 import styled from '@emotion/styled';
-import MyRecruitList from '../../../features/employee/myPage/MyRecruitList';
+import MyRecruitList from '../../../features/myPage/employee/components/MyRecruitList';
 import { useGetMyApplication } from '@/apis/employee/hooks/useGetMyApplication';
 import { useTranslation } from 'react-i18next';
-import ProfileSection from '@/features/employee/myPage/ProfileSection';
+import ProfileSection from '@/features/myPage/employee/components/ProfileSection';
 import { css } from '@emotion/react';
 export default function EmployeeMyPage() {
   const { t } = useTranslation();