Merge pull request #79 from LikeLionHGU/#78/ConnectReadMemoContiModal…

…-최예라 feat: 콘티 보관함 악보에 ReadContiModalMemo 연결, 콘티 클릭 API 연결 필요
LikeLionHGU · Jun 7, 2024 · 54dd963 · 54dd963
2 parents a203671 + 4edab75
commit 54dd963
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 53 deletions.
diff --git a/src/atom.js b/src/atom.js
@@ -40,6 +40,11 @@ export const musicIdState = atom({
   default: null,
 });
 
+export const setListIdState = atom({
+  key: "setListIdState",
+  default: null,
+});
+
 export const musicIdListState = atom({
   key: "musicIdListState",
   default: [],
@@ -53,4 +58,4 @@ export const contiStepModalState = atom({
 export const contiIdState = atom({
   key: "contiIdState",
   default: null,
-})
+});
diff --git a/src/components/MainPage/ContiSheetStorage.jsx b/src/components/MainPage/ContiSheetStorage.jsx
@@ -3,10 +3,16 @@ import styled from "styled-components";
 import SelectMonthDropdown from "./SelectMonthDropDown";
 import SelectYearDropdown from "./SelectYearDropDown";
 import { useSetRecoilState } from "recoil";
-import { contiIdState, musicIdState, readMusicModalState } from "../../atom";
+import {
+  contiIdState,
+  musicIdState,
+  readMusicModalMemoState,
+  readMusicModalState,
+} from "../../atom";
 import { useRecoilValue } from "recoil";
 import getContiMusicList from "../../apis/getcontiMusicList";
 import ModifyContiModal from "../Modal/ModifyContiModal";
+import ReadContiModalMemo from "../Modal/ReadContiModalMemo";
 
 const DateContainer = styled.div`
   /* border: 1px solid blue; */
@@ -81,19 +87,16 @@ const SheetInfoOverlay = styled.div`
   }
 `;
 
-
-
 export default function ContiSheetStorage() {
-  const readMusicModal = useSetRecoilState(readMusicModalState);
-  const [sheetMusic,setSheetMusic] = useState([]);
+  const readMusicModal = useSetRecoilState(readMusicModalMemoState);
+  const [sheetMusic, setSheetMusic] = useState([]);
 
   const toggleReadMusicModal = () => {
     readMusicModal((prevState) => !prevState);
   };
   const setMusicId = useSetRecoilState(musicIdState);
   const setListId = useRecoilValue(contiIdState);
-  console.log("setListId",setListId)
-
+  console.log("setListId", setListId);
 
   useEffect(() => {
     const fetchMusicList = async () => {
@@ -102,14 +105,12 @@ export default function ContiSheetStorage() {
     };
     fetchMusicList();
   }, [setListId]);
-console.log("sheetMusicData:",sheetMusic);
-
-
+  console.log("sheetMusicData:", sheetMusic);
 
   return (
     <>
       <DateContainer>
-        <ModifyContiModal/>
+        <ReadContiModalMemo />
         <SelectYearDropdown />
         <SelectMonthDropdown />
       </DateContainer>

diff --git a/src/components/Modal/ReadContiModalMemo.jsx b/src/components/Modal/ReadContiModalMemo.jsx
@@ -168,9 +168,9 @@ export default function ReadContiModalMemo() {
     setIsEditable(false);
   };
 
-  const toggleEditMode = () => {
-    setIsEditable((prevState) => !prevState);
-  };
+  // const toggleEditMode = () => {
+  //   setIsEditable((prevState) => !prevState);
+  // };
 
   const handleChange = (e) => {
     const { name, value } = e.target;
@@ -213,42 +213,42 @@ export default function ReadContiModalMemo() {
     };
   }, [isModalOpen]);
 
-  const handleSubmit = async () => {
-    console.log("Form Data Submitted: ", formData);
-    try {
-      const { musicName, code, link, description, version } = formData;
-      const groupId = localStorage.getItem("groupId");
-      console.log("Group ID:", groupId);
-
-      const formDataToSend = new FormData();
-      formDataToSend.append("musicName", musicName);
-      formDataToSend.append("code", code);
-      formDataToSend.append("link", link);
-      formDataToSend.append("description", description);
-      formDataToSend.append("groupId", groupId);
-      formDataToSend.append("version", version);
-
-      await updateMusic(formDataToSend, musicId);
-      setIsEditable(false);
-    } catch (error) {
-      console.error("악보 수정 실패:", error);
-    }
-  };
-
-  const handleDelete = async () => {
-    if (window.confirm("삭제하시겠습니까?")) {
-      try {
-        await deleteMusic(musicId);
-        window.location.reload();
-      } catch (error) {
-        console.error("악보 삭제 실패:", error);
-      }
-    } else {
-      alert("취소");
-    }
-  };
-
-  console.log({ isModalOpen });
+  // const handleSubmit = async () => {
+  //   console.log("Form Data Submitted: ", formData);
+  //   try {
+  //     const { musicName, code, link, description, version } = formData;
+  //     const groupId = localStorage.getItem("groupId");
+  //     console.log("Group ID:", groupId);
+
+  //     const formDataToSend = new FormData();
+  //     formDataToSend.append("musicName", musicName);
+  //     formDataToSend.append("code", code);
+  //     formDataToSend.append("link", link);
+  //     formDataToSend.append("description", description);
+  //     formDataToSend.append("groupId", groupId);
+  //     formDataToSend.append("version", version);
+
+  //     await updateMusic(formDataToSend, musicId);
+  //     setIsEditable(false);
+  //   } catch (error) {
+  //     console.error("악보 수정 실패:", error);
+  //   }
+  // };
+
+  // const handleDelete = async () => {
+  //   if (window.confirm("삭제하시겠습니까?")) {
+  //     try {
+  //       await deleteMusic(musicId);
+  //       window.location.reload();
+  //     } catch (error) {
+  //       console.error("악보 삭제 실패:", error);
+  //     }
+  //   } else {
+  //     alert("취소");
+  //   }
+  // };
+
+  // console.log({ isModalOpen });
 
   return (
     <>
@@ -276,11 +276,11 @@ export default function ReadContiModalMemo() {
                   </ContiImage>
                   <ContiInfo>
                     <Icon2>
-                      <Img
+                      {/* <Img
                         src={binIcon}
                         alt="쓰레기통 아이콘"
                         onClick={handleDelete}
-                      />
+                      /> */}
                       <Img src={shareIcon} alt="공유 아이콘" />
                       <Img src={printIcon} alt="프린트 아이콘" />
                     </Icon2>