Merge pull request #14 from HappyScrolls/feature/#11_dayCalendar

Feature/#11 day calendar

src/Router.tsx

@@ -5,6 +5,9 @@ import Redirect from "./pages/login/components/Redirect";
 import SchedulePage from "./pages/schedule/SchedulePage";
 import SignUpPage from "./pages/signup/SignUpPage";
 import MainPage from "./pages/main/MainPage";
+import CalendarPage from "./pages/calendar/CalendarPage";
+
+import AddMySchedulePage from "./pages/schedule/AddMySchedulePage";
 
 const router = createBrowserRouter([
   {
@@ -31,6 +34,14 @@ const router = createBrowserRouter([
         path: "/schedule/detail",
         element: <SchedulePage />,
       },
+      {
+        path: "/calendar/:date",
+        element: <CalendarPage />,
+      },
+      {
+        path: "calendar/:date/add",
+        element: <AddMySchedulePage />,
+      },
     ],
   },
 ]);

src/api/ApiResponse.ts

@@ -0,0 +1,5 @@
+export interface ApiResponse<T = any> {
+  data: T;
+  message: string;
+  statusCode: number;
+}

src/api/axios.ts

@@ -1,26 +1,25 @@
 import axios from "axios";
 
-export const axiosInstance = axios.create({
-  baseURL: "http://localhost:8084",
+export const scheduleAxiosInstance = axios.create({
+  baseURL: "http://158.247.198.100:32000",
   withCredentials: true,
+  timeout: 5000,
 });
 
 export const refreshInstance = axios.create({
-  baseURL: "http://localhost:8084",
+  baseURL: "http://158.247.198.100:32002",
   withCredentials: true,
 });
 
 // 요청
-axiosInstance.interceptors.request.use(
+scheduleAxiosInstance.interceptors.request.use(
   (config) => {
-    const token = localStorage.getItem("authToken");
-    if (token) {
-      config.headers.Authorization = `Bearer ${token}`;
-    }
+    const memberCode =
+      localStorage.getItem("memberCode") ||
+      "eyJubyI6NSwibmFtZSI6Im5hbWUiLCJhY2NvdW50IjoiYWNjb3VudCJ9";
 
-    // 임시 Member-Code 작성
-    config.headers["Member-Code"] =
-      "eyJubyI6MSwibmFtZSI6Im5hbWUiLCJhY2NvdW50IjoiYWNjb3VudCJ9";
+    config.headers["Member-Code"] = memberCode;
+    // config.headers["Content-Type"] = "application/json";
 
     return config;
   },
@@ -30,7 +29,7 @@ axiosInstance.interceptors.request.use(
 );
 
 // 응답
-axiosInstance.interceptors.response.use(
+scheduleAxiosInstance.interceptors.response.use(
   (response) => response,
   (error) => {
     if (error.response && error.response.status === 401) {
@@ -40,8 +39,7 @@ axiosInstance.interceptors.response.use(
   }
 );
 
-
 export const memberAxiosInstance = axios.create({
-    baseURL: "http://158.247.198.100:32002",
-    withCredentials: true,
+  baseURL: "http://158.247.198.100:32002",
+  withCredentials: true,
 });

src/api/query/get/useGetScheduleDetail.ts

@@ -1,17 +1,17 @@
 import { useSuspenseQuery } from "@tanstack/react-query";
-import { axiosInstance } from "../../axios";
-import { ISchedule } from "../../../types/ISchedule";
+import { scheduleAxiosInstance } from "../../axios";
+import { ScheduleData } from "../../../types/ISchedule";
 
 interface useGetScheduleDetailProps {
   scheduleNo: number;
 }
 
 function useGetScheduleDetail({
   scheduleNo,
-}: useGetScheduleDetailProps): ISchedule | undefined {
+}: useGetScheduleDetailProps): ScheduleData | undefined {
   // 데이터 가져오기
-  const fetchSchedule = async (scheduleNo: number): Promise<ISchedule> => {
-    const response = await axiosInstance.get(`/schedule/${scheduleNo}`);
+  const fetchSchedule = async (scheduleNo: number): Promise<ScheduleData> => {
+    const response = await scheduleAxiosInstance.get(`/schedule/${scheduleNo}`);
 
     return response.data;
   };

src/api/schedule/scheduleAPI.ts

@@ -0,0 +1,43 @@
+import { ScheduleData } from "../../types/ISchedule";
+import { ApiResponse } from "../ApiResponse";
+import { scheduleAxiosInstance } from "../axios";
+
+// 일정 생성
+export const createSchedule = async (
+  scheduleData: ScheduleData
+): Promise<ApiResponse> => {
+  try {
+    const response = await scheduleAxiosInstance.post<ApiResponse>(
+      "/schedule",
+      scheduleData
+    );
+    return response.data;
+  } catch (error) {
+    console.error("일정 생성 중 오류 발생:", error);
+    throw error;
+  }
+};
+
+// 일정 삭제
+export const deleteSchedule = async (scheduleNo: number) => {
+  try {
+    const response = await scheduleAxiosInstance.delete(
+      `/schedule/${scheduleNo}`
+    );
+    return response.data;
+  } catch (error) {
+    console.error("일정 삭제 중 오류 발생:", error);
+    throw error;
+  }
+};
+
+// 일정 조회
+export const fetchSchedulesByDate = async (date: string) => {
+  try {
+    const response = await scheduleAxiosInstance.get(`/schedule?date=${date}`);
+    return response.data;
+  } catch (error) {
+    console.error("일정 조회 중 오류 발생:", error);
+    throw error;
+  }
+};

src/pages/calendar/CalendarPage.tsx

@@ -0,0 +1,34 @@
+import React, { useState } from "react";
+import { Container } from "../../components/layout/Layout";
+import ViewChangeHeader from "./components/ViewChangeHeader";
+import { useParams } from "react-router-dom";
+import ListView from "./components/ListView";
+import TimeTable from "./components/TimeTableView";
+import { styled } from "styled-components";
+
+const CalendarPage = () => {
+  const { date } = useParams<{ date: string }>();
+  console.log(date);
+
+  const [isTimetableView, setIsTimetableView] = useState(true);
+
+  const toggleView = () => {
+    setIsTimetableView(!isTimetableView);
+  };
+
+  return (
+    <>
+      <CalendarContainer>
+        <ViewChangeHeader
+          isTimetableView={isTimetableView}
+          toggleView={toggleView}
+        />
+        {isTimetableView ? <TimeTable /> : <ListView />}
+      </CalendarContainer>
+    </>
+  );
+};
+
+export default CalendarPage;
+
+const CalendarContainer = styled(Container)``;