Can change issue img, issue date

KEA-ACCELER · Aug 16, 2023 · 68edf8a · 68edf8a
1 parent 950fdfd
commit 68edf8a
Show file tree

Hide file tree

Showing 3 changed files with 106 additions and 6 deletions.
diff --git a/src/components/Modal/IssueModal.js b/src/components/Modal/IssueModal.js
@@ -6,7 +6,7 @@ import "react-calendar/dist/Calendar.css";
 import "react-clock/dist/Clock.css";
 import "./IssueModal.css";
 import { AuthenticationContext } from "../../service/authentication/authentication.context";
-import { PostCreateIssue } from "../../service/issues/issues.service";
+import { PostCreateIssue, UpdateIssueImage, UpdateIssueDate } from "../../service/issues/issues.service";
 
 const IssueModal = ({ issue, show, handleClose, handleAddIssue, isEditing, column, teamPk, projectPk }) => {
   const { userToken } = useContext(AuthenticationContext);
@@ -20,6 +20,18 @@ const IssueModal = ({ issue, show, handleClose, handleAddIssue, isEditing, colum
   const [startDate, setStartDate] = useState(new Date());
   const [endDate, setEndDate] = useState(new Date());
 
+  const handleUpdateIssueImage = async () => {
+    try {
+      // 이미지 수정 API 호출
+      await UpdateIssueImage(issue.issuePk, selectedFile, userToken);
+
+      // 성공적으로 완료된 후 처리
+      handleClose();
+    } catch (err) {
+      console.error("이미지 수정에 실패했습니다:", err);
+    }
+  };
+
   useEffect(() => {
     if (isEditing && issue) {
       setIssueContent(issue.content);
@@ -40,10 +52,39 @@ const IssueModal = ({ issue, show, handleClose, handleAddIssue, isEditing, colum
     }
   }, [isEditing, issue]);
 
-  const handleFileChange = (e) => {
+  useEffect(() => {
+    if (isEditing && issue) {
+      // startDate나 endDate가 변경될 때마다 UpdateIssueDate API를 호출
+      console.log("issuePk:", issue.issuePk);
+      console.log("StartDate:", startDate);
+      console.log("endDate: ", endDate);
+      console.log("userToken: ", userToken);
+
+      const updateDate = async () => {
+        try {
+          await UpdateIssueDate(issue.issuePk, startDate, endDate, userToken);
+          console.log("날짜가 성공적으로 업데이트되었습니다.");
+        } catch (error) {
+          console.error("이슈 날짜 업데이트 중 오류 발생:", error);
+        }
+      };
+
+      updateDate();
+    }
+  }, [startDate, endDate, isEditing, issue, userToken]); // startDate, endDate의 변화를 감지
+
+  const handleFileChange = async (e) => {
     const file = e.target.files[0];
     previewFile(file);
     setSelectedFile(file);
+
+    try {
+      // 이미지 수정 API 호출
+      await UpdateIssueImage(issue.issuePk, file, userToken);
+      console.log("이미지가 성공적으로 수정되었습니다.");
+    } catch (err) {
+      console.error("이미지 수정에 실패했습니다:", err);
+    }
   };
 
   const previewFile = (file) => {
@@ -156,9 +197,11 @@ const IssueModal = ({ issue, show, handleClose, handleAddIssue, isEditing, colum
         <Button variant="secondary" onClick={handleClose}>
           Close
         </Button>
-        <Button variant="primary" onClick={() => handleSubmit(issueContent, issueStatus)}>
-          Create Issue
-        </Button>
+        {isEditing ? null : (
+          <Button variant="primary" onClick={() => handleSubmit(issueContent, issueStatus)}>
+            Create Issue
+          </Button>
+        )}
       </Modal.Footer>
     </Modal>
   );

diff --git a/src/service/issues/issues.context.js b/src/service/issues/issues.context.js
@@ -1,5 +1,5 @@
 import React, { useState, createContext, useEffect } from "react";
-import { PostCreateIssue, GetOneIssue, UpdateIssueStatus, GetAllIssues } from "./issues.service";
+import { PostCreateIssue, GetOneIssue, UpdateIssueStatus, GetAllIssues, UpdateIssueImage, UpdateIssueDate } from "./issues.service";
 
 export const IssuesContext = createContext();
 
@@ -11,6 +11,8 @@ export const ProjectsContextProvider = ({ children }) => {
         GetOneIssue,
         UpdateIssueStatus,
         GetAllIssues,
+        UpdateIssueImage,
+        UpdateIssueDate,
       }}
     >
       {children}

diff --git a/src/service/issues/issues.service.js b/src/service/issues/issues.service.js
@@ -92,3 +92,58 @@ export const UpdateIssueStatus = async (issuePk, issueStatus, userToken) => {
     throw error;
   }
 };
+
+export const UpdateIssueImage = async (issuePk, imgs, userToken) => {
+  const formData = new FormData();
+  formData.append("issuePk", issuePk.toString());
+  formData.append("imgs", imgs);
+
+  const options = {
+    headers: {
+      Authorization: `Bearer ${userToken}`,
+      "Content-Type": "multipart/form-data",
+    },
+  };
+
+  try {
+    console.log("issuePk in api:", issuePk);
+    console.log("imgs in api:", imgs);
+    console.log("token in api:", userToken);
+    const response = await axios.post(`${API_URL}/api/aggr/issue/image`, formData, options);
+
+    return response;
+  } catch (error) {
+    console.error("이슈 이미지 업데이트 중 오류 발생:", error);
+    throw error;
+  }
+};
+
+export const UpdateIssueDate = async (issuePk, startDate, endDate, userToken) => {
+  const options = {
+    headers: {
+      Authorization: `Bearer ${userToken}`,
+    },
+  };
+
+  const formatDateTime = (dateString) => {
+    const date = new Date(dateString);
+    return date.toISOString().slice(0, 19);
+  };
+
+  const formattedStartDate = formatDateTime(startDate);
+  const formattedEndDate = formatDateTime(endDate);
+
+  try {
+    console.log("issuePk in api:", issuePk);
+    console.log("startDate in api:", formattedStartDate);
+    console.log("endDate in api:", formattedEndDate);
+    console.log("token in api:", userToken);
+
+    const response = await axios.patch(`${API_URL}/api/issue/date?issuePk=${issuePk}&startDate=${formattedStartDate}&endDate=${formattedEndDate}`, [], options);
+
+    return response;
+  } catch (err) {
+    console.error("이슈 받아오기 중 오류 발생:", err.response ? err.response.data : err.message);
+    throw new Error("이슈 받아오기 중 오류가 발생했습니다.");
+  }
+};