vacation 수정, 게시판 글쓰기 수정

public/css/custom.css

@@ -67,6 +67,25 @@ opacity: 0.6; /* 흐려 보이게 */
 cursor: not-allowed !important;
 opacity: 0.6; /* 흐려 보이게 */
 }
+/* 기본 이벤트 스타일 */
+.fc-daygrid-event {
+  border: none !important;
+  border-radius: 4px;
+}
+/* 오전 반차 (왼쪽 절반) */
+.selected-event.half-day-am {
+  width: 50% !important;
+  left: 0 !important;
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+/* 오후 반차 (오른쪽 절반) */
+.selected-event.half-day-pm {
+  width: 50% !important;
+  margin-left: auto !important;
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
 
 
 /* 본인 모달 */

src/components/button/HalfDayButtons.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="menu gap-4 justify-content-center mt-5">
-
+      <!-- 오전 반차 버튼 -->
       <button
         class="btn btn-warning"
         :class="{ active: halfDayType === 'AM' }"
@@ -8,6 +8,8 @@
       >
         <i class="bi bi-sun"></i>
       </button>
+
+      <!-- 오후 반차 버튼 -->
       <button
         class="btn btn-info"
         :class="{ active: halfDayType === 'PM' }"
@@ -15,32 +17,48 @@
       >
         <i class="bi bi-moon"></i>
       </button>
+
+      <!-- 저장 버튼 -->
       <div class="save-button-container">
         <button class="btn btn-success" @click="addVacationRequests" :disabled="isDisabled">
           ✔
         </button>
       </div>
     </div>
-  </template>
+</template>
 
 <script setup>
-import { defineEmits, ref } from "vue";
+import { defineEmits, ref, defineProps } from "vue";
 
-defineProps({
+const props = defineProps({
   isDisabled: Boolean
 });
 
-const emit = defineEmits(["toggleHalfDay", "addVacationRequests"]);
+const emit = defineEmits(["toggleHalfDay", "addVacationRequests", "resetHalfDay"]);
 const halfDayType = ref(null);
 
 const toggleHalfDay = (type) => {
-  halfDayType.value = halfDayType.value === type ? null : type;
+  halfDayType.value = type;
+
   emit("toggleHalfDay", halfDayType.value);
+
+  // ✅ 버튼 클릭 후 1초 후 자동 비활성화
+  setTimeout(() => {
+    halfDayType.value = null;
+  }, 1000);
+};
+
+// 날짜 선택 후 반차 버튼 상태 초기화
+const resetHalfDay = () => {
+  halfDayType.value = null;
+  emit("resetHalfDay");
 };
 
 const addVacationRequests = () => {
   emit("addVacationRequests");
 };
+
+defineExpose({ resetHalfDay });
 </script>
 
 <style scoped>
@@ -112,4 +130,4 @@ const addVacationRequests = () => {
   transform: scale(0.95);
   box-shadow: 0px 2px 5px rgba(25, 135, 84, 0.2);
 }
-  </style>
+</style>

src/components/modal/VacationGrantModal.vue

@@ -25,7 +25,9 @@
   <script setup>
   import { ref, defineProps, defineEmits, watch, onMounted } from "vue";
   import axios from "@api";
+  import { useToastStore } from '@s/toastStore';
 
+  const toastStore = useToastStore();
   const props = defineProps({
     isOpen: Boolean,
     targetUser: Object,
@@ -73,21 +75,18 @@
           count: grantCount.value,
         },
       ];
-      console.log(props.targetUser)
-      console.log(payload)
       const response = await axios.post("vacation", payload);
-        console.log(response)
       if (response.data && response.data.status === "OK") {
-        alert("✅ 연차가 부여되었습니다.");
+        toastStore.onToast('연차가 선물되었습니다.', 's');
         await fetchSentVacationCount();
         emit("updateVacation");
         closeModal();
       } else {
-        alert("🚨 연차 추가 중 오류가 발생했습니다.");
+       toastStore.onToast(' 연차 선물 중 오류가 발생했습니다.', 'e');
       }
     } catch (error) {
       console.error("🚨 연차 추가 실패:", error);
-      alert("연차 추가에 실패했습니다.");
+      toastStore.onToast(' 연차 선물 실패!!.', 'e');
     }
   };
 
@@ -99,7 +98,6 @@
     () => props.isOpen,
     async (newVal) => {
       if (newVal && props.targetUser && props.targetUser.MEMBERSEQ) {
-        console.log("🟢 모달이 열렸습니다. 데이터를 로드합니다.");
         await fetchSentVacationCount();
       }
     }

src/views/board/BoardWrite.vue

@@ -91,7 +91,9 @@ import router from '@/router';
 import axios from '@api';
 import SaveButton from '@c/button/SaveBtn.vue';
 import BackButton from '@c/button/BackBtn.vue'
+import { useToastStore } from '@s/toastStore';
 
+const toastStore = useToastStore();
 const categoryList = ref([]);
 const title = ref('');
 const password = ref('');
@@ -113,6 +115,11 @@ const fetchCategories = async () => {
     try {
         const response = await axios.get('board/categories');
         categoryList.value = response.data.data;
+        // "자유" 카테고리 찾기 (CMNCODNAM이 '자유'인 것 선택)
+        const freeCategory = categoryList.value.find(category => category.CMNCODNAM === '자유');
+        if (freeCategory) {
+            categoryValue.value = freeCategory.CMNCODVAL; // 기본 선택값 설정
+        }
     } catch (error) {
         console.error('카테고리 불러오기 오류:', error);
     }
@@ -167,11 +174,11 @@ const write = async () => {
             }
         }
 
-        alert('게시물이 작성되었습니다.');
+        toastStore.onToast('게시물이 작성되었습니다.', 's');
         goList();
     } catch (error) {
         console.error(error);
-        alert('게시물 작성 중 오류가 발생했습니다.');
+        toastStore.onToast('게시물 작성 중 오류가 발생했습니다.', 'e');
     }
 };
 </script>

src/views/vacation/VacationManagement.vue

@@ -79,7 +79,9 @@
   import { useUserStore } from "@s/userList";
   import { useUserInfoStore } from "@s/useUserInfoStore";
   import { fetchHolidays } from "@c/calendar/holiday.js";
+  import { useToastStore } from '@s/toastStore';
 
+  const toastStore = useToastStore();
   const userStore = useUserInfoStore();
   const userListStore = useUserStore();
   const userList = ref([]);
@@ -102,6 +104,7 @@
   const vacationCodeMap = ref({});
   const holidayDates = ref(new Set());
   const fetchedEvents = ref([]);
+  const halfDayButtonsRef = ref(null);
 
   // 데이트피커 인풋 ref
   const calendarDatepicker = ref(null);
@@ -163,6 +166,10 @@ function handleDateClick(info) {
     selectedDates.value.set(clickedDateStr, type);
     halfDayType.value = null;
     updateCalendarEvents();
+    // ✅ 날짜 선택 후 버튼 초기화
+    if (halfDayButtonsRef.value) {
+        halfDayButtonsRef.value.resetHalfDay();
+    }
   }
 
   const calendarOptions = reactive({
@@ -342,7 +349,6 @@ function handleDateClick(info) {
     const selectedEvents = Array.from(selectedDates.value)
       .filter(([date, type]) => type !== "delete")
       .map(([date, type]) => ({
-        title: getVacationType(type),
         start: date,
         backgroundColor: "rgb(113 212 243 / 76%)",
         textColor: "#fff",
@@ -435,7 +441,7 @@ function handleDateClick(info) {
         delete: vacationsToDelete
       });
       if (response.data && response.data.status === "OK") {
-        alert("✅ 휴가 변경 사항이 저장되었습니다.");
+        toastStore.onToast('휴가 변경 사항이 저장되었습니다.', 's');
         await fetchRemainingVacation();
         if (isModalOpen.value) {
           await fetchVacationHistory(lastRemainingYear.value);
@@ -445,11 +451,11 @@ function handleDateClick(info) {
         selectedDates.value.clear();
         updateCalendarEvents();
       } else {
-        alert("❌ 휴가 저장 중 오류가 발생했습니다.");
+        toastStore.onToast('휴가 저장 중 오류가 발생했습니다.', 'e');
       }
     } catch (error) {
       console.error("🚨 휴가 변경 저장 실패:", error);
-      alert("❌ 휴가 저장 요청에 실패했습니다.");
+      toastStore.onToast('휴가 저장 요청에 실패했습니다.', 'e');
     }
   }
 
@@ -531,5 +537,4 @@ watch([holidayDates, lastRemainingYear, lastRemainingMonth], () => {
 
   <style>
 
-
   </style>