diff --git a/src/components/button/HalfDayButtons.vue b/src/components/button/HalfDayButtons.vue new file mode 100644 index 0000000..2dc31e0 --- /dev/null +++ b/src/components/button/HalfDayButtons.vue @@ -0,0 +1,43 @@ + + + + + diff --git a/src/components/vacation/ProfileList.vue b/src/components/vacation/ProfileList.vue new file mode 100644 index 0000000..32e7ce0 --- /dev/null +++ b/src/components/vacation/ProfileList.vue @@ -0,0 +1,187 @@ + + + + + diff --git a/src/stores/userList.js b/src/stores/userList.js index 767e711..b32d0b3 100644 --- a/src/stores/userList.js +++ b/src/stores/userList.js @@ -16,7 +16,6 @@ export const useUserStore = defineStore("userStore", { actions: { async fetchUserList() { const response = await axios.get('user/allUserList'); - console.log('response',response) this.userList = response.data.data.allUserList; this.userInfo = response.data.data.user; diff --git a/src/views/vacation/AddEventModal.vue b/src/views/vacation/AddEventModal.vue deleted file mode 100644 index 321c9e7..0000000 --- a/src/views/vacation/AddEventModal.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - - - diff --git a/src/views/vacation/ProfileList.vue b/src/views/vacation/ProfileList.vue deleted file mode 100644 index 9f729d4..0000000 --- a/src/views/vacation/ProfileList.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - - - diff --git a/src/views/vacation/VacationManagement.vue b/src/views/vacation/VacationManagement.vue index ec7db60..47cc56c 100644 --- a/src/views/vacation/VacationManagement.vue +++ b/src/views/vacation/VacationManagement.vue @@ -1,301 +1,298 @@ + - +/** + * 공휴일 데이터 요청 및 이벤트 변환 + */ +async function fetchHolidays(year, month) { +try { + const response = await axios.get(`vacation/${year}/${month}`); + const holidayEvents = response.data.map((holiday) => ({ + title: holiday.name, + start: holiday.date, // "YYYY-MM-DD" 형식 + backgroundColor: "#ff6666", + classNames: ["holiday-event"], + })); + return holidayEvents; +} catch (error) { + console.error("공휴일 정보를 불러오지 못했습니다.", error); + return []; +} +} + +/** + * 달력 월 변경 시 호출 (FullCalendar의 datesSet 옵션) + */ +function handleMonthChange(viewInfo) { +const currentDate = viewInfo.view.currentStart; +const year = currentDate.getFullYear(); +const month = String(currentDate.getMonth() + 1).padStart(2, "0"); +loadCalendarData(year, month); +} + +/** + * 지정한 월의 데이터를 로드 (휴가, 공휴일 데이터를 병렬 요청) + */ +async function loadCalendarData(year, month) { +fetchedEvents.value = []; +const [vacationEvents, holidayEvents] = await Promise.all([ + fetchVacationData(year, month), + fetchHolidays(year, month), +]); +// 클릭 불가 처리를 위해 공휴일 날짜 Set 업데이트 +holidayDates.value = new Set(holidayEvents.map((event) => event.start)); +fetchedEvents.value = [...vacationEvents, ...holidayEvents]; +updateCalendarEvents(); +await nextTick(); +fullCalendarRef.value.getApi().refetchEvents(); +} + +// 컴포넌트 마운트 시 현재 달의 데이터 로드 +onMounted(async () => { +await fetchUserList(); // 사용자 목록 먼저 불러오기 +const today = new Date(); +const year = today.getFullYear(); +const month = String(today.getMonth() + 1).padStart(2, "0"); +await loadCalendarData(year, month); +}); +