refactor: 전체보기 기능 제거 및 날짜 선택 기본값 개선

- 전체보기 버튼 제거
- 월 이동 시 이번달이면 오늘, 다른 달이면 1일 자동 선택
- 같은 날짜 클릭 시 토글 제거 (항상 선택 유지)
- 필터링 대상 줄여서 성능 개선
This commit is contained in:
caadiq 2026-01-09 17:35:15 +09:00
parent 578ab25568
commit 4619d101f0
2 changed files with 68 additions and 46 deletions

View file

@ -158,19 +158,36 @@ function Schedule() {
const prevMonth = () => { const prevMonth = () => {
setSlideDirection(-1); setSlideDirection(-1);
setCurrentDate(new Date(year, month - 1, 1)); const newDate = new Date(year, month - 1, 1);
setSelectedDate(null); // setCurrentDate(newDate);
// , 1
const today = new Date();
if (newDate.getFullYear() === today.getFullYear() && newDate.getMonth() === today.getMonth()) {
setSelectedDate(getTodayKST());
} else {
const firstDay = `${newDate.getFullYear()}-${String(newDate.getMonth() + 1).padStart(2, '0')}-01`;
setSelectedDate(firstDay);
}
}; };
const nextMonth = () => { const nextMonth = () => {
setSlideDirection(1); setSlideDirection(1);
setCurrentDate(new Date(year, month + 1, 1)); const newDate = new Date(year, month + 1, 1);
setSelectedDate(null); // setCurrentDate(newDate);
// , 1
const today = new Date();
if (newDate.getFullYear() === today.getFullYear() && newDate.getMonth() === today.getMonth()) {
setSelectedDate(getTodayKST());
} else {
const firstDay = `${newDate.getFullYear()}-${String(newDate.getMonth() + 1).padStart(2, '0')}-01`;
setSelectedDate(firstDay);
}
}; };
// ( )
const selectDate = (day) => { const selectDate = (day) => {
const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`; const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
setSelectedDate(selectedDate === dateStr ? null : dateStr); setSelectedDate(dateStr);
}; };
const selectYear = (newYear) => { const selectYear = (newYear) => {
@ -179,7 +196,16 @@ function Schedule() {
}; };
const selectMonth = (newMonth) => { const selectMonth = (newMonth) => {
setCurrentDate(new Date(year, newMonth, 1)); const newDate = new Date(year, newMonth, 1);
setCurrentDate(newDate);
// , 1
const today = new Date();
if (newDate.getFullYear() === today.getFullYear() && newDate.getMonth() === today.getMonth()) {
setSelectedDate(getTodayKST());
} else {
const firstDay = `${year}-${String(newMonth + 1).padStart(2, '0')}-01`;
setSelectedDate(firstDay);
}
setShowYearMonthPicker(false); setShowYearMonthPicker(false);
setViewMode('yearMonth'); setViewMode('yearMonth');
}; };
@ -537,23 +563,12 @@ function Schedule() {
</motion.div> </motion.div>
</AnimatePresence> </AnimatePresence>
{/* 범례 및 전체보기 */} {/* 범례 */}
<div className="mt-6 pt-4 border-t border-gray-100 flex items-center justify-between text-sm"> <div className="mt-6 pt-4 border-t border-gray-100 flex items-center text-sm">
<div className="flex items-center gap-1.5 text-gray-500"> <div className="flex items-center gap-1.5 text-gray-500">
<span className="w-2 h-2 rounded-full bg-primary flex-shrink-0" /> <span className="w-2 h-2 rounded-full bg-primary flex-shrink-0" />
<span className="leading-none">일정 있음</span> <span className="leading-none">일정 있음</span>
</div> </div>
<button
onClick={() => setSelectedDate(null)}
className={`px-4 py-2 rounded-lg transition-colors ${
selectedDate
? 'bg-primary text-white hover:bg-primary-dark'
: 'bg-gray-100 text-gray-400 cursor-default'
}`}
disabled={!selectedDate}
>
전체 보기
</button>
</div> </div>
</div> </div>
</motion.div> </motion.div>

View file

@ -302,15 +302,31 @@ function AdminSchedule() {
// //
const prevMonth = () => { const prevMonth = () => {
setSlideDirection(-1); setSlideDirection(-1);
setCurrentDate(new Date(year, month - 1, 1)); const newDate = new Date(year, month - 1, 1);
setSelectedDate(null); setCurrentDate(newDate);
// , 1
const today = new Date();
if (newDate.getFullYear() === today.getFullYear() && newDate.getMonth() === today.getMonth()) {
setSelectedDate(getTodayKST());
} else {
const firstDay = `${newDate.getFullYear()}-${String(newDate.getMonth() + 1).padStart(2, '0')}-01`;
setSelectedDate(firstDay);
}
setSchedules([]); // setSchedules([]); //
}; };
const nextMonth = () => { const nextMonth = () => {
setSlideDirection(1); setSlideDirection(1);
setCurrentDate(new Date(year, month + 1, 1)); const newDate = new Date(year, month + 1, 1);
setSelectedDate(null); setCurrentDate(newDate);
// , 1
const today = new Date();
if (newDate.getFullYear() === today.getFullYear() && newDate.getMonth() === today.getMonth()) {
setSelectedDate(getTodayKST());
} else {
const firstDay = `${newDate.getFullYear()}-${String(newDate.getMonth() + 1).padStart(2, '0')}-01`;
setSelectedDate(firstDay);
}
setSchedules([]); // setSchedules([]); //
}; };
@ -326,20 +342,24 @@ function AdminSchedule() {
// //
const selectMonth = (newMonth) => { const selectMonth = (newMonth) => {
setCurrentDate(new Date(year, newMonth, 1)); const newDate = new Date(year, newMonth, 1);
setCurrentDate(newDate);
// , 1
const today = new Date();
if (newDate.getFullYear() === today.getFullYear() && newDate.getMonth() === today.getMonth()) {
setSelectedDate(getTodayKST());
} else {
const firstDay = `${year}-${String(newMonth + 1).padStart(2, '0')}-01`;
setSelectedDate(firstDay);
}
setShowYearMonthPicker(false); setShowYearMonthPicker(false);
setViewMode('yearMonth'); setViewMode('yearMonth');
}; };
// // ( )
const selectDate = (day) => { const selectDate = (day) => {
const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`; const dateStr = `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
setSelectedDate(selectedDate === dateStr ? null : dateStr); setSelectedDate(dateStr);
};
//
const showAll = () => {
setSelectedDate(null);
}; };
// //
@ -814,25 +834,12 @@ function AdminSchedule() {
</div> </div>
</motion.div> </motion.div>
</AnimatePresence> </AnimatePresence>
{/* 범례 및 전체보기 */} {/* 범례 */}
<div className="mt-6 pt-4 border-t border-gray-100 flex items-center justify-between text-sm"> <div className="mt-6 pt-4 border-t border-gray-100 flex items-center text-sm">
<div className="flex items-center gap-1.5 text-gray-500"> <div className="flex items-center gap-1.5 text-gray-500">
<span className="w-2 h-2 rounded-full bg-primary flex-shrink-0" /> <span className="w-2 h-2 rounded-full bg-primary flex-shrink-0" />
<span className="leading-none">일정 있음</span> <span className="leading-none">일정 있음</span>
</div> </div>
<button
onClick={showAll}
className={`px-4 py-2 rounded-lg transition-colors ${
isSearchMode
? 'bg-gray-100 text-gray-400 cursor-not-allowed opacity-50'
: selectedDate
? 'bg-primary text-white hover:bg-primary-dark'
: 'bg-gray-100 text-gray-400 cursor-default'
}`}
disabled={!selectedDate || isSearchMode}
>
전체 보기
</button>
</div> </div>
</motion.div> </motion.div>