diff --git a/frontend/src/pages/mobile/public/Schedule.jsx b/frontend/src/pages/mobile/public/Schedule.jsx index 7b3c820..dd7fadc 100644 --- a/frontend/src/pages/mobile/public/Schedule.jsx +++ b/frontend/src/pages/mobile/public/Schedule.jsx @@ -585,59 +585,93 @@ function MobileSchedule() { ); } -// 일정 카드 컴포넌트 (검색용) +// 일정 카드 컴포넌트 (검색용) - 날짜 포함 모던 디자인 function ScheduleCard({ schedule, categoryColor, categories, delay = 0 }) { const categoryName = categories.find(c => c.id === schedule.category_id)?.name || '미분류'; const memberNames = schedule.member_names || schedule.members?.map(m => m.name).join(',') || ''; const memberList = memberNames.split(',').filter(name => name.trim()); + + // 날짜 포맷팅 + const formatDate = (dateStr) => { + if (!dateStr) return ''; + const date = new Date(dateStr); + const month = date.getMonth() + 1; + const day = date.getDate(); + const weekdays = ['일', '월', '화', '수', '목', '금', '토']; + const weekday = weekdays[date.getDay()]; + return `${month}.${day} (${weekday})`; + }; return ( -
-
-
-

{decodeHtmlEntities(schedule.title)}

-
- {schedule.time && ( - - - {schedule.time.slice(0, 5)} - - )} - - - {categoryName} - - {schedule.source_name && ( - - - {schedule.source_name} - - )} + {/* 카드 본체 */} +
+
+ + {/* 날짜 및 시간 뱃지 */} +
+ {/* 날짜 뱃지 */} +
+ {formatDate(schedule.date)}
- {memberList.length > 0 && ( -
- {memberList.length >= 5 ? ( - - 프로미스나인 - - ) : ( - memberList.map((name, i) => ( - - {name.trim()} - - )) - )} + {/* 시간 뱃지 */} + {schedule.time && ( +
+ + {schedule.time.slice(0, 5)}
)} + {/* 카테고리 뱃지 */} + + {categoryName} + +
+ + {/* 제목 */} +

+ {decodeHtmlEntities(schedule.title)} +

+ + {/* 출처 */} + {schedule.source_name && ( +
+ + {schedule.source_name} +
+ )} + + {/* 멤버 */} + {memberList.length > 0 && ( +
+ {memberList.length >= 5 ? ( + + 프로미스나인 + + ) : ( + memberList.map((name, i) => ( + + {name.trim()} + + )) + )} +
+ )}