-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
cbd5623
commit 6c54228
Showing
5 changed files
with
49 additions
and
99 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
export interface BookmarkResponseType { | ||
bookmarks: BookmarkItemsType[]; | ||
} | ||
|
||
export interface BookmarkItemsType { | ||
company_name: string; | ||
recruitment_id: number; | ||
created_at: string; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,107 +1,39 @@ | ||
import { useGetBookmarks } from "@/apis/bookmarks"; | ||
import { RecruitmentsListType } from "@/apis/recruitments/type"; | ||
import { Icon } from "@team-return/design-system"; | ||
import Image from "next/image"; | ||
import { useEffect, useState } from "react"; | ||
import Link from "next/link"; | ||
import HoverPrefetchLink from "./common/HoverPrefetchLink"; | ||
|
||
//테스트 | ||
//========================= | ||
|
||
const bookmarksList: RecruitmentsListType[] = [ | ||
{ | ||
recruit_id: 88, | ||
company_name: "주식회사두잇(Doeat)", | ||
company_profile_url: "LOGO_IMAGE/companydefault.png", | ||
train_pay: 200, | ||
military: true, | ||
total_hiring: 0, | ||
job_code_list: | ||
"서버 개발자/프론트엔드/Android/iOS/임베디드 프로그래밍/인공지능 개발", | ||
bookmarked: true, | ||
}, | ||
{ | ||
recruit_id: 25, | ||
company_name: "주식회사페이히어", | ||
company_profile_url: | ||
"LOGO_IMAGE/f9621d89-2e79-4ce6-94b0-fcac24346ddb-5.png", | ||
train_pay: 0, | ||
military: true, | ||
total_hiring: 0, | ||
job_code_list: "서버 개발자", | ||
bookmarked: true, | ||
}, | ||
]; | ||
|
||
//========================= | ||
|
||
export default function BookmarkCard() { | ||
// const [bookmarksList, setBookmarksList] = useState<RecruitmentsListType[]>( | ||
// [] | ||
// ); | ||
|
||
// const bookmarks = useGetBookmarks(); | ||
|
||
// useEffect(() => { | ||
// setBookmarksList((prev) => bookmarks.recruitments || prev); | ||
// }, [bookmarks]); | ||
const { data: bookmarks } = useGetBookmarks(); | ||
|
||
return ( | ||
<div className="w-full mt-5 grid grid-cols-3 md:grid-cols-4 gap-[1.5vw]"> | ||
{bookmarksList.map( | ||
( | ||
{ | ||
company_profile_url, | ||
company_name, | ||
train_pay, | ||
job_code_list, | ||
bookmarked, | ||
recruit_id, | ||
military, | ||
}, | ||
index | ||
) => ( | ||
<HoverPrefetchLink | ||
href={`/recruitments/detail?id=${recruit_id}`} | ||
key={index} | ||
> | ||
<div className="flex flex-col w-full overflow-hidden transition duration-200 cursor-pointer shadow-elevaiton rounded-xl hover:transition hover:scale-105"> | ||
<div className="w-full h-0 pb-[70%] relative"> | ||
<Image | ||
className="absolute object-contain" | ||
fill | ||
src={`${process.env.NEXT_PUBLIC_IMAGE_URL}/${company_profile_url}`} | ||
alt="" | ||
/> | ||
</div> | ||
<div className="relative bg-[#fafafa] p-[14px] flex-1 flex flex-col"> | ||
<p className="mr-8 text-black text-b2 leading-b2 font-b"> | ||
{job_code_list} | ||
</p> | ||
<p className="text-b3 leading-b3 font-r text-[#444444] mt-1"> | ||
{company_name} | ||
</p> | ||
<div className="flex content-end mt-[10px] flex-wrap w-full overflow-x-scroll whitespace-nowrap gap-1 flex-1"> | ||
<div className="tagStyle">실습수당 {train_pay}만원</div> | ||
{military && <div className="tagStyle">병역특례</div>} | ||
</div> | ||
<button | ||
className="w-6 h-6 absolute top-[14px] right-[14px] flex items-center justify-center bg-none border-none cursor-pointer" | ||
aria-label="bookMarkBtn" | ||
onClick={(event: React.MouseEvent<HTMLElement>) => { | ||
event.stopPropagation(); | ||
}} | ||
> | ||
<Icon | ||
icon={`Bookmark${bookmarked ? "On" : "Off"}`} | ||
color={bookmarked ? "skyblue" : "gray60"} | ||
/> | ||
</button> | ||
</div> | ||
</div> | ||
</HoverPrefetchLink> | ||
) | ||
{!bookmarks?.bookmarks.length && ( | ||
<div className="col-span-3 text-b3 leading-b3 font-m text-[#7f7f7f] ml-6 flex"> | ||
<p className="mr-2">⚠ 저장한 모집의뢰서가 존재하지 않습니다.</p> | ||
<Link href={"/recruitments"} className="flex items-center underline"> | ||
모집의뢰서 보러가기 | ||
<Icon icon="Chevron" direction="right" size={16} /> | ||
</Link> | ||
</div> | ||
)} | ||
{bookmarks?.bookmarks.map(({ company_name, recruitment_id }) => ( | ||
<HoverPrefetchLink | ||
href={`/recruitments/detail?id=${recruitment_id}`} | ||
key={recruitment_id} | ||
> | ||
<div className="flex flex-col w-full overflow-hidden transition duration-200 cursor-pointer shadow-elevaiton rounded-xl hover:transition hover:scale-105"> | ||
<div className="relative bg-[#ffffff] p-[14px] flex-1 flex flex-col"> | ||
<p className="mr-8 overflow-hidden text-black text-b2 leading-b2 font-b whitespace-nowrap text-ellipsis"> | ||
{company_name} | ||
</p> | ||
<button className="w-6 h-6 absolute top-[14px] right-[14px] flex items-center justify-center bg-none border-none cursor-pointer"> | ||
<Icon icon="BookmarkOn" color="skyblue" /> | ||
</button> | ||
</div> | ||
</div> | ||
</HoverPrefetchLink> | ||
))} | ||
</div> | ||
); | ||
} |