Merge pull request #272 from GDSC-PKNU-Official/feat/#271

Feat/#271: 웨일비 캐러셀 클릭 시 상세 페이지로 이동하도록 추가
GDSC-PKNU-Official · Oct 16, 2023 · bbea5c8 · bbea5c8
2 parents 6d5f7f1 + 8f7e6a6
commit bbea5c8
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/src/components/Carousel/index.tsx b/src/components/Carousel/index.tsx
@@ -11,6 +11,7 @@ interface WhalebeData {
   title: string;
   date: string;
   imgUrl: string;
+  link: string;
 }
 
 const Carousel = () => {
@@ -43,16 +44,16 @@ const Carousel = () => {
           carouselData.map((data) => (
             <div
               key={data.title}
-              onClick={() =>
-                window.open('https://whalebe.pknu.ac.kr/main', '_blank')
-              }
+              onClick={() => window.open(data.link, '_blank')}
             >
               <SliderWrapper>
                 <img src={data.imgUrl} width="100%" height={200} />
               </SliderWrapper>
               <Title>{data.title}</Title>
               <Date>모집기간: ~ {data.date}</Date>
-              <Button>자세히보기</Button>
+              <DisplayCenterWrapper>
+                <Button>자세히보기</Button>
+              </DisplayCenterWrapper>
             </div>
           ))}
       </Slider>
@@ -94,7 +95,7 @@ const Button = styled.button`
   border: 1px solid ${THEME.PRIMARY};
   color: ${THEME.PRIMARY};
   background: none;
-  width: 100%;
+  width: 95%;
   height: 3rem;
   border-radius: 0.5rem;
   margin-top: 1rem;
@@ -103,3 +104,7 @@ const Button = styled.button`
     cursor: pointer;
   }
 `;
+
+const DisplayCenterWrapper = styled.div`
+  text-align: center;
+`;
diff --git a/src/mocks/handlers/announceHandlers.ts b/src/mocks/handlers/announceHandlers.ts
@@ -96,18 +96,21 @@ export const announceHandlers: RequestHandler[] = [
         date: '2023.09.17',
         imgUrl:
           'https://whalebe.pknu.ac.kr/upload/program/2023/09/13/66e59b5f-4cb9-41fc-b65a-79c2d843229a.png',
+        link: 'https://whalebe.pknu.ac.kr/main/65?action=get&yy=2023&shtm=U0003002&nonsubjcCd=N202309038&nonsubjcCrsCd=C201900053',
       },
       {
         title: '전공별 CDP(생물/생명과학, 바이오/제약)',
         date: '2023.09.17',
         imgUrl:
           'https://whalebe.pknu.ac.kr/upload/program/2023/09/13/c207c16f-a57d-4216-8e6a-4ee53fead465.png',
+        link: 'https://whalebe.pknu.ac.kr/main/65?action=get&yy=2023&shtm=U0003002&nonsubjcCd=N202310003&nonsubjcCrsCd=C202301005',
       },
       {
         title: '전공별 CDP(인문/상경계열, 마케팅, 인사, 영업, 경영기획 등)',
         date: '2023.09.17',
         imgUrl:
           'https://whalebe.pknu.ac.kr/upload/program/2023/09/13/4e4b7e74-28d4-4758-b80d-babe6ec1d286.png',
+        link: 'https://whalebe.pknu.ac.kr/main/65?action=get&yy=2023&shtm=U0003002&nonsubjcCd=N202309059&nonsubjcCrsCd=C202306003',
       },
     ];
     return res(ctx.status(200), ctx.json(mockData));