Skip to content

Commit a9984f8

Browse files
committed
feat: 데이터가 없을 때 안내 문구 표시 추가
1 parent 6a846d1 commit a9984f8

File tree

3 files changed

+71
-59
lines changed

3 files changed

+71
-59
lines changed

src/pages/bookmark/ui/BookmarkPage.tsx

Lines changed: 19 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -20,21 +20,26 @@ const BookmarkPage = () => {
2020
}
2121
/>
2222
<div className="grid grid-cols-2 gap-4 mx-5 mt-3 md:grid-cols-2 lg:grid-cols-2 z-50">
23-
{data?.map(event => (
24-
<EventCard
25-
id={event.id}
26-
key={event.id}
27-
img={event.bannerImageUrl}
28-
eventTitle={event.title}
29-
dDay={event.remainDays}
30-
host={event.hostChannelName}
31-
eventDate={event.startDate}
32-
location={event.onlineType}
33-
hashtags={event.hashtags}
34-
onClick={() => navigate(`/event-details/${event.id}`)}
35-
/>
36-
))}
23+
{data?.length ? (
24+
data.map(event => (
25+
<EventCard
26+
id={event.id}
27+
key={event.id}
28+
img={event.bannerImageUrl}
29+
eventTitle={event.title}
30+
dDay={event.remainDays}
31+
host={event.hostChannelName}
32+
eventDate={event.startDate}
33+
location={event.onlineType}
34+
hashtags={event.hashtags}
35+
onClick={() => navigate(`/event-details/${event.id}`)}
36+
/>
37+
))
38+
) : (
39+
<p className="col-span-2 text-center text-sm md:text-base">관심 있는 이벤트가 없습니다.</p>
40+
)}
3741
</div>
42+
3843
<BottomBar />
3944
</div>
4045
);

src/pages/menu/ui/MyTicketPage.tsx

Lines changed: 37 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,12 @@ type Ticket = {
1919
startDate: string;
2020
remainDays: string;
2121
hashtags: string[];
22-
onlineType: "ONLINE" | "OFFLINE"; // onlineType 추가
22+
onlineType: 'ONLINE' | 'OFFLINE'; // onlineType 추가
2323
};
2424
ticketQrCode: string;
2525
ticketName: string;
2626
ticketPrice: number;
27-
orderStatus: "COMPLETED" | "PENDING" | "CANCELED";
27+
orderStatus: 'COMPLETED' | 'PENDING' | 'CANCELED';
2828
checkIn: boolean;
2929
};
3030

@@ -39,7 +39,7 @@ const MyTicketPage = () => {
3939
const response = await readTicket.getAll(0, 10);
4040
setMyTickets(response.result || []);
4141
} catch (error) {
42-
console.error("티켓 목록 불러오기 실패:", error);
42+
console.error('티켓 목록 불러오기 실패:', error);
4343
}
4444
};
4545
fetchMyTickets();
@@ -49,37 +49,40 @@ const MyTicketPage = () => {
4949
<TicketHostLayout image={TicketLogo} centerContent="내 티켓" showText={true}>
5050
{/* 이벤트 카드 목록 */}
5151
<div className="grid grid-cols-2 gap-4 mx-6 mt-28 md:grid-cols-2 lg:grid-cols-2 pb-4">
52-
{myTickets.map((ticket) => (
53-
<EventCard
54-
key={ticket.id}
55-
id={ticket.id}
56-
img={ticket.event.bannerImageUrl}
57-
eventTitle={ticket.event.title}
58-
dDay={ticket.event.remainDays}
59-
host={ticket.event.hostChannelName}
60-
eventDate={ticket.event.startDate}
61-
location={ticket.event.address}
62-
hashtags={ticket.event.hashtags}
63-
onClick={() => {
64-
setSelectedTicket(ticket);
65-
setIsModalOpen(true);
66-
}}
67-
>
68-
<div className="flex items-center text-xs text-gray-500">
69-
<img src={ticketImg} alt="날짜" className="w-3 h-3 mr-1" />
70-
{ticket.ticketName}
71-
</div>
72-
<div className="flex items-center text-xs text-gray-500">
73-
<img
74-
src={ticket.orderStatus === 'COMPLETED' ? completedImg : pendingImg}
75-
alt={ticket.orderStatus === 'COMPLETED' ? '승인됨' : '대기 중'}
76-
className="w-3 h-3 mr-1"
77-
/>
78-
{ticket.orderStatus === 'COMPLETED' ? '승인됨' : '대기 중'}
79-
</div>
80-
81-
</EventCard>
82-
))}
52+
{myTickets.length > 0 ? (
53+
myTickets.map(ticket => (
54+
<EventCard
55+
key={ticket.id}
56+
id={ticket.id}
57+
img={ticket.event.bannerImageUrl}
58+
eventTitle={ticket.event.title}
59+
dDay={ticket.event.remainDays}
60+
host={ticket.event.hostChannelName}
61+
eventDate={ticket.event.startDate}
62+
location={ticket.event.address}
63+
hashtags={ticket.event.hashtags}
64+
onClick={() => {
65+
setSelectedTicket(ticket);
66+
setIsModalOpen(true);
67+
}}
68+
>
69+
<div className="flex items-center text-xs text-gray-500">
70+
<img src={ticketImg} alt="날짜" className="w-3 h-3 mr-1" />
71+
{ticket.ticketName}
72+
</div>
73+
<div className="flex items-center text-xs text-gray-500">
74+
<img
75+
src={ticket.orderStatus === 'COMPLETED' ? completedImg : pendingImg}
76+
alt={ticket.orderStatus === 'COMPLETED' ? '승인됨' : '대기 중'}
77+
className="w-3 h-3 mr-1"
78+
/>
79+
{ticket.orderStatus === 'COMPLETED' ? '승인됨' : '대기 중'}
80+
</div>
81+
</EventCard>
82+
))
83+
) : (
84+
<p className="col-span-2 text-center text-sm md:text-base">구매하신 티켓 정보가 없습니다.</p>
85+
)}
8386
</div>
8487

8588
{isModalOpen && selectedTicket && (

src/pages/menu/ui/myHost/MyHostPage.tsx

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -18,17 +18,21 @@ const MyHostPage = () => {
1818
return (
1919
<TicketHostLayout image={HostLogo} centerContent="내 호스트">
2020
<div className="flex space-x-5 mt-24 mx-5 overflow-x-auto scrollbar-hide">
21-
{data?.result.map(profile => (
22-
<ProfileCircle
23-
key={profile.id}
24-
id={profile.id}
25-
name={profile.hostChannelName}
26-
profileImageUrl={profile.profileImageUrl}
27-
profile="hostProfile"
28-
onClick={() => handleProfileClick(profile.id)}
29-
className="md:w-20 md:h-20 w-16 h-16 hover:border hover:border-main"
30-
/>
31-
))}
21+
{data?.result.length ? (
22+
data.result.map(profile => (
23+
<ProfileCircle
24+
key={profile.id}
25+
id={profile.id}
26+
name={profile.hostChannelName}
27+
profileImageUrl={profile.profileImageUrl}
28+
profile="hostProfile"
29+
onClick={() => handleProfileClick(profile.id)}
30+
className="md:w-20 md:h-20 w-16 h-16 hover:border hover:border-main"
31+
/>
32+
))
33+
) : (
34+
<p className="col-span-2 text-center text-sm md:text-base">호스트 정보가 없습니다.</p>
35+
)}
3236
</div>
3337

3438
{/* 이벤트 카드 목록 */}

0 commit comments

Comments
 (0)