fix :: 출석체크 반 안 바뀌는 오류 수정

DSM-PICK · Aug 22, 2024 · 34dbee8 · 34dbee8
2 parents 4c18ef4 + 117b558
commit 34dbee8
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 53 deletions.
diff --git a/src/apis/selfStudy/index.ts b/src/apis/selfStudy/index.ts
@@ -1,4 +1,4 @@
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 import { instance } from "..";
 import apiError from "@/hook/apiError";
 
@@ -33,15 +33,16 @@ export const CheckStatus = () => {
   });
 };
 
-export const ClassStudentCheck = () => {
+export const ClassStudentCheck = (grade: number, class_num: number) => {
   const { handleError } = apiError();
-  return useMutation<ClassCheck[], Error, { grade: number; class: number }>({
-    mutationFn: async (param) => {
+  return useQuery({
+    queryKey: ["ClassStudentCheck", grade, class_num],
+    queryFn: async () => {
       try {
-        const response = await instance.get(
-          `/attendance/alltime/grade?grade=${param.grade}&class_num=${param.class}`
+        const { data } = await instance.get<ClassCheck[]>(
+          `/attendance/alltime/grade?grade=${grade}&class_num=${class_num}`
         );
-        return response.data;
+        return data;
       } catch (error) {
         handleError(error);
       }

diff --git a/src/app/selfStudyCheck/page.tsx b/src/app/selfStudyCheck/page.tsx
@@ -8,6 +8,7 @@ import { BackGround } from "../components/common/background";
 import Dropdown from "../components/common/dropdown";
 import CheckList from "../components/common/list/after/check/page";
 import Modal from "../components/common/modal/page";
+import useAttendanceStore from "@/stores/useChangeStatus";
 
 interface ClassCheck {
   id: string;
@@ -31,16 +32,17 @@ const SelfStudyCheck = () => {
   const [selectedGrade, setSelectedGrade] = useState<number>(1);
   const [selectedClass, setSelectedClass] = useState<number>(1);
   const [edit, setEdit] = useState<boolean>(false);
-  const [data, setData] = useState<ClassCheck[]>([]);
   const [saveModal, setSaveModal] = useState<boolean>(false);
   const { mutate: ChangeMutate } = CheckStatus();
-  const { mutate: CheckMutate } = ClassStudentCheck();
+  const { data: CheckMutate } = ClassStudentCheck(selectedGrade, selectedClass);
   const { selectedStudentName, handleAcceptListClick } =
     useAcceptListSelection();
+  const { addStudent, updateStatus, getStatus, students } =
+    useAttendanceStore();
 
   const handleSaveModalConfirm = async () => {
     const updatedData: ChangeStatus[] = [];
-    data?.forEach((item) => {
+    CheckMutate?.forEach((item) => {
       const localData = localStorage.getItem(item.id);
       if (localData) {
         const parsedData = JSON.parse(localData);
@@ -86,52 +88,15 @@ const SelfStudyCheck = () => {
     setSaveModal(false);
   };
 
-  const Check = async () => {
-    try {
-      await CheckMutate(
-        {
-          grade: selectedGrade,
-          class: selectedClass,
-        },
-        {
-          onSuccess: (data) => {
-            setData(data);
-          },
-        }
-      );
-    } catch (error) {
-      console.log(error);
-    }
-  };
-
   const onClickEdit = () => {
     setEdit(true);
   };
 
-  useEffect(() => {
-    const keys = Object.keys(localStorage);
-    keys.forEach((key) => {
-      if (key.includes("-")) {
-        localStorage.removeItem(key);
-      }
-    });
-    Check();
-  }, []);
-
   const onClickSave = () => {
     setSaveModal(true);
     setEdit(false);
   };
 
-  useEffect(() => {
-    const keys = Object.keys(localStorage);
-    keys.forEach((key) => {
-      if (key.includes("-")) {
-        localStorage.removeItem(key);
-      }
-    });
-  }, [selectedClass, selectedGrade]);
-
   const handleGradeChange = (selectedOption: number) => {
     setSelectedGrade(selectedOption);
   };
@@ -179,7 +144,7 @@ const SelfStudyCheck = () => {
         </div>
         <div className=" flex gap-20">
           <div className=" flex flex-col gap-6">
-            {data?.map((item, index) => (
+            {CheckMutate?.map((item, index) => (
               <div
                 className="flex w-32 bg-white justify-center items-center h-14 rounded-lg text-label1"
                 key={index}
@@ -191,7 +156,7 @@ const SelfStudyCheck = () => {
           <div className=" w-full flex gap-x-11 gap-y-6 flex-wrap content-start">
             {edit ? (
               <>
-                {data?.map((item, index) => {
+                {CheckMutate?.map((item, index) => {
                   return (
                     <CheckList
                       key={index}
@@ -201,16 +166,13 @@ const SelfStudyCheck = () => {
                       state3={item.status8}
                       state4={item.status9}
                       state5={item.status10}
-                      onClick={() =>
-                        handleAcceptListClick(item.id, item.username)
-                      }
                     />
                   );
                 })}
               </>
             ) : (
               <>
-                {data?.map((item, index) => {
+                {CheckMutate?.map((item, index) => {
                   return (
                     <CheckList
                       key={index}