Merge pull request #60 from collie-jun/main

Fix: 일정 삭제 로직
100-hours-a-week · Aug 27, 2024 · cccdf75 · cccdf75
2 parents f445667 + 921d7c9
commit cccdf75
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 14 deletions.
diff --git a/travelday-fe/src/components/schedulePage/scheduleList.js b/travelday-fe/src/components/schedulePage/scheduleList.js
@@ -38,7 +38,6 @@ const ScheduleList = ({ schedules, onItemClick, onDeleteClick }) => {
     setSelectedScheduleId(id);
     setIsModalOpen(true);
   };
-
   const confirmDelete = async () => {
     if (!selectedScheduleId) {
         console.error("selectedScheduleId가 설정되지 않았습니다.");
@@ -47,15 +46,20 @@ const ScheduleList = ({ schedules, onItemClick, onDeleteClick }) => {
 
     try {
         // 삭제 요청
-        await axios.delete(`https://api.thetravelday.co.kr/api/rooms/${selectedScheduleId}`);
-
-        // 삭제 후 상태 업데이트
-        setSortedSchedules(prevSchedules => 
-            prevSchedules.filter(schedule => schedule.id !== selectedScheduleId)
-        );
-        onDeleteClick(selectedScheduleId);
-        setIsModalOpen(false);
-        window.alert('삭제되었습니다!');
+        const response = await axios.delete(`https://api.thetravelday.co.kr/api/rooms/${selectedScheduleId}`);
+
+        // 삭제 요청이 성공적인지 확인
+        if (response.status === 200) {
+            // 삭제 후 상태 업데이트
+            setSortedSchedules(prevSchedules => 
+                prevSchedules.filter(schedule => schedule.id !== selectedScheduleId)
+            );
+            onDeleteClick(selectedScheduleId);
+            setIsModalOpen(false);
+            window.alert('삭제되었습니다!');
+        } else {
+            console.error('삭제 요청 실패:', response.status, response.statusText);
+        }
     } catch (error) {
         console.error("일정 삭제 중 오류 발생:", error);
 

diff --git a/travelday-fe/src/pages/schedulePage/createSchedulePage.jsx b/travelday-fe/src/pages/schedulePage/createSchedulePage.jsx
@@ -11,6 +11,7 @@ const CreateSchedulePage = () => {
   const [endDate, setEndDate] = useState('');
   const [isButtonEnabled, setIsButtonEnabled] = useState(false);
   const [showSuccessPopup, setShowSuccessPopup] = useState(false);
+  const [countdown, setCountdown] = useState(3); 
   const navigate = useNavigate();
 
   const today = new Date().toISOString().split('T')[0];
@@ -53,10 +54,16 @@ const CreateSchedulePage = () => {
       );
 
       if (response.status === 200) { 
-        setShowSuccessPopup(true); // 성공 팝업 표시
-        setTimeout(() => {
-          navigate('/schedule'); 
-        }, 3000); // 3초 후 리다이렉트
+        setShowSuccessPopup(true);
+        const interval = setInterval(() => {
+          setCountdown(prev => {
+            if (prev === 1) {
+              clearInterval(interval);
+              navigate('/schedule');
+            }
+            return prev - 1;
+          });
+        }, 1000);
       }
     } catch (error) {
       console.error('일정 생성 중 오류 발생:', error);
@@ -107,6 +114,7 @@ const CreateSchedulePage = () => {
             <PopupContent>
               <p>일정이 성공적으로 생성되었습니다!</p>
               <CountdownBar />
+              <CountdownText>{countdown}초 후에 페이지가 이동합니다.</CountdownText>
             </PopupContent>
           </SuccessPopup>
         )}
@@ -169,6 +177,12 @@ const countdown = keyframes`
   }
 `;
 
+const CountdownText = styled.p`
+  font-size: 14px;
+  color: #333;
+  margin-top: 10px;
+`;
+
 const Container = styled.div`
   display: flex;
   flex-direction: column;
@@ -251,3 +265,4 @@ const CreateButton = styled.button`
     background-color: ${({ enabled }) => (enabled ? '#d11a45' : '#ccc')};
   }
 `;
+