D123

src/Components/CardModal/Activity.js

@@ -1,7 +1,8 @@
 import React, {useState, useRef} from 'react';
+
 import apis from '../../Library/Apis';
 
-function Activity({data, getCard, putActivity, deleteActivity, detail}) {
+function Activity({data, getCard, putActivity, isComment, deleteActivity, detail}) {
 
     const inputRef = useRef();
 

src/Components/CardModal/CardModal.js

@@ -45,27 +45,10 @@ function CardModal({
         setDescription({ ...description, text: response.data.description });
       })
       .catch(function (error) {
-        if (error.response) {
-          console.log(
-            "요청이 이루어졌으며 서버가 2xx의 범위를 벗어나는 상태 코드로 응답했습니다."
-          );
-          console.log(error.response.data);
-          console.log(error.response.status);
-          console.log(error.response.headers);
-        } else if (error.request) {
-          console.log("요청이 이루어 졌으나 응답을 받지 못했습니다.");
-          // `error.request`는 브라우저의 XMLHttpRequest 인스턴스 또는
-          // Node.js의 http.ClientRequest 인스턴스입니다.
-          console.log(error.request);
-        } else {
-          console.log(
-            "오류를 발생시킨 요청을 설정하는 중에 문제가 발생했습니다."
-          );
-          console.log("Error", error.message);
-        }
-        console.log(error.config);
-      });
-  }
+          console.log(error);
+        } 
+      )};
+
 
   useEffect(() => {
     getCard();
@@ -94,6 +77,8 @@ function CardModal({
   //댓글 달고 저장하기
   const saveComment = () => {
     postActivity(String(card_id), comment);
+    setButton({display: false, green: false});
+    setComment("");
   };
 
   //해당 카드 지우기
@@ -143,7 +128,8 @@ function CardModal({
   });
   const saveDescription = () => {
     setDescription({...description, edit: false});
-    putCard({ cId: card_id, description: description.content })
+    putCard({ cId: card_id, description: description['text'] });
+    console.log(description.['text']);
   }
 
   // 멤버 추가하기
@@ -186,7 +172,8 @@ function CardModal({
   };
   //"Thu Jan 14 2021 00:00:00 GMT+0900 (대한민국 표준시)00:30"
 
-  const activities = useRef();
+  const activityy = useRef();
+  console.log(description);
 
   return (
     <div
@@ -234,8 +221,7 @@ function CardModal({
               <button
                 style={{ float: "right", display: "inline-block", width: 25 }}
                 className="card-modal-x"
-                id="exit"
-              >
+                id="exit">
                 ×
               </button>
             </div>
@@ -248,7 +234,7 @@ function CardModal({
           <div id="card-modal-bottom">
             <div id="card-modal-left" style={{ maxHeight: 550, overflowY: 'auto' }}>
               <p className="title">Description</p>
-              {description.edit 
+              {description['edit'] 
 
               ? (
                 <div style={{height: 100}}><textarea
@@ -257,13 +243,13 @@ function CardModal({
                       marginLeft: 5,
                       borderRadius: 5,
                       outline: "none",
-                      cols: '4900px',
+                      width: 460,
 
                       border: "1px solid lightgray",
                       marginRight: 5,
                       padding: 5
                     }}
-                    value={description.content}
+                    value={description['text']}
                     onChange={(e) =>
                       setDescription({
                         ...description,
@@ -291,22 +277,22 @@ function CardModal({
                 </div>
                 ) 
 
-              : (!(description === undefined || description['content'] === undefined || description['content' === ""]))
+              : (!(description === undefined || description['text'] === undefined || description['text'] === "" || description['text'] === null))
 
                   ? (
                     <div onClick={() => setDescription({...description, edit: true})} style={{width: 485, marginBottom: 10, marginTop: 10, height: 'fit-content'}}>
                       <ReactMarkdown id="Markdown" style={{height: 'fit-content', background: 'pink'}}>
-                        {description['content']}
+                        {description['text']}
                       </ReactMarkdown> 
                       </div> )
                   : (
-                    <button
-                      style={{width: 485, textAlign: 'left', height: 50, paddingLeft: 10, marginLeft: 5, paddingTop: 0}}
+                    <><button
+                      style={{width: 480, textAlign: 'left', height: 50, padding: 25, alignItems: 'center', marginLeft: 5,}}
                       onClick={() => setDescription({ ...description, edit: true })}
                       id="card-modal-add-descrip"
                     >
                       Add a more detailed description...
-                    </button>
+                    </button></>
                   )}
 
               <div style={{ display: "flex", flexDirection: 'row'}}>
@@ -315,9 +301,9 @@ function CardModal({
                 </p>
                 <button id="card-modal-detail" 
                 onClick={(e) => setDetail(!detail)} 
-                style={{width: 100, position: 'relative', left: 324, top: 10}}>{detail? "Hide Details" : "Show Details"}</button>
+                style={{width: 100, position: 'relative', left: 322, top: 10}}>{detail? "Hide Details" : "Show Details"}</button>
               </div>
-              <div ref={activities} id="card-modal-activities" style={{marginTop: 20}}>              
+              <div ref={activityy} iyd="card-modal-activities" style={{marginTop: 20}}>              
               <div style={{display: 'flex', flexDirection: 'row'}}>
                   <img
                     style={{
@@ -383,9 +369,10 @@ function CardModal({
                       .reverse()
                       .map((data, index) => (
                         <Activity
-                          data={data}
+                          data={Object.assign(data)}
                           getCard={getCard}
                           key={index}
+                          isComment={data.is_comment}
                           postActivity={postActivity}
                           putActivity={putActivity}
                           deleteActivity={deleteActivity}