Merge branch 'develop' into feat/answer

Team-Coverflow · May 7, 2024 · 0af4ba4 · 0af4ba4
2 parents 8076004 + 1dcf881
commit 0af4ba4
Show file tree

Hide file tree

Showing 3 changed files with 71 additions and 24 deletions.
diff --git a/src/asset/sass/etc/header/userInfoHeader.scss b/src/asset/sass/etc/header/userInfoHeader.scss
@@ -48,10 +48,35 @@ img.loginuser {
   font-family: Pretendard-Medium;
 }
 
+.dropdown-question-detail-report-menu {
+  position: relative;
+  z-index: 500;
+  right: 6rem;
+  top: 6rem;
+  cursor: pointer;
+  ul {
+    position: absolute;
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    background: #fff;
+    border: 1px solid rgba(0, 0, 0, 0.3);
+    width: 88px;
+    height: 36px;
+    display: flex;
+    justify-content: space-evenly;
+    flex-direction: column;
+    align-items: center;
+
+    border-radius: 10px;
+    border-color: #d9d9d9;
+  }
+}
+
 .dropdown-question-detail-menu {
   position: relative;
   z-index: 500;
-  right: 5rem;
+  right: 6rem;
   top: 6rem;
 
   ul {

diff --git a/src/components/pages/postPage/questionDetailPage.tsx b/src/components/pages/postPage/questionDetailPage.tsx
@@ -119,6 +119,7 @@ function QuestionDetailPage() {
   const [totalPages, setTotalPages] = useState(0);
 
   const [questionerNickname, setQuestionerNickname] = useState('');
+  // const [answererNickname, setAnswererNickname] = useState('');
 
   const [questionerTag, setQuestionerTag] = useState('');
   const [answerCount, setAnswerCount] = useState(0);
@@ -137,6 +138,7 @@ function QuestionDetailPage() {
   const [isShowEdit, setIsShowEdit] = useState(false);
 
   const [isShowReport, setIsShowReport] = useState(false);
+  const [isShowReportModal, setIsShowReportModal] = useState(false);
   const [isAdopted, setIsAdopted] = useState(false);
   const [anyAdopted, setAnyAdopted] = useState(false);
 
@@ -151,9 +153,13 @@ function QuestionDetailPage() {
     };
 
     try {
-      const data = await fetchAPI('/api/answer', 'POST', requestData);
+      // 답변 내용이 비어있을 경우 에러 던지기
+      if (answerRef.current?.value === '') {
+        throw new Error('크기가 1에서 500 사이여야 합니다');
+      }
 
-      if (data.statusCode === 'CREATED' && answerRef.current) {
+      const answerResponse = await fetchAPI('/api/answer', 'POST', requestData);
+      if (answerResponse.statusCode === 'CREATED' && answerRef.current) {
         setPostAnswer(answerRef.current?.value);
         showSuccessToast('답변이 등록되었습니다.');
 
@@ -162,7 +168,12 @@ function QuestionDetailPage() {
         }
       }
     } catch (error) {
-      if (error instanceof Error) showErrorToast('비속어가 존재합니다.');
+      if (error instanceof Error) {
+        showErrorToast('질문 작성자는 답변 작성이 불가능합니다.');
+        if (error.message === '크기가 1에서 500 사이여야 합니다') {
+          showErrorToast(error.message);
+        }
+      }
     }
   };
 
@@ -183,15 +194,20 @@ function QuestionDetailPage() {
   };
 
   const toggleReportPopup = () => {
-    setIsShowReport((show) => !show);
+    setIsShowReport((showReport) => !showReport);
+    setIsShowReportModal((showReportModal) => !showReportModal);
   };
 
-  const handleEdit = () => {
-    console.log('click ');
-    setIsShowEdit((edit) => !edit);
-  };
+  const handleEdit = async () => {
+    const res = await fetchAPI('/api/member/me', 'GET');
 
-  console.log(isShowEdit);
+    if (res.data.nickname === questionerNickname) {
+      setIsShowEdit(true);
+      setIsShowReport(false);
+    } else if (res.data.nickname !== questionerNickname) {
+      setIsShowReport((showReport) => !showReport);
+    }
+  };
 
   const handleClickEdit = async () => {
     const editBody = {
@@ -233,8 +249,9 @@ function QuestionDetailPage() {
   };
 
   const handleCloseReportPopup = () => {
-    setIsShowReport((show) => !show);
+    setIsShowReportModal(false);
   };
+
   const fetchData = async () => {
     const response = await axios.get(
       `${BASE_URL}/api/question/${questionId}?pageNo=${currentPage}&criterion=createdAt`,
@@ -279,7 +296,6 @@ function QuestionDetailPage() {
     '스팸 혹은 홍보성 도배글이에요',
     '특정 이용자가 질문, 답변, 채택을 반복해요',
   ];
-  // console.log(questionerTag);
   return (
     <StyledPage className="main-page-container">
       <StyledHeader>
@@ -294,8 +310,11 @@ function QuestionDetailPage() {
               ? `${questionerTag}이 남긴 질문이에요`
               : `${questionerTag}가 남긴 질문이에요`}
           </span>
-
-          {!isShowEdit && (
+        </div>
+        <QuestionTitle>
+          <span>{questionTitle}</span>
+          <img onClick={handleEdit} src={Dot} alt="dot" />
+          {isShowEdit && (
             <div className="dropdown-question-detail-menu">
               <ul>
                 <li onClick={handleClickEdit} className="dropdown-item-edit">
@@ -309,19 +328,22 @@ function QuestionDetailPage() {
                   삭제
                 </li>
                 {/*
+                 */}
+              </ul>
+            </div>
+          )}
+          {isShowReport ? (
+            <div className="dropdown-question-detail-report-menu">
+              <ul>
                 <li
                   onClick={toggleReportPopup}
                   className="dropdown-item-report"
                 >
                   신고
-                </li> */}
+                </li>
               </ul>
             </div>
-          )}
-        </div>
-        <QuestionTitle>
-          <span>{questionTitle}</span>
-          <img onClick={handleEdit} src={Dot} alt="dot" />
+          ) : null}
         </QuestionTitle>
 
         <div className="questioner-info">
@@ -341,7 +363,7 @@ function QuestionDetailPage() {
           </div>
         </div>
         <FirstLine />
-        {isShowReport ? (
+        {isShowReportModal && (
           <div className="report-popup-overlay">
             <div className="report-popup">
               <div className="report-title">사용자 신고</div>
@@ -371,7 +393,7 @@ function QuestionDetailPage() {
               </div>
             </div>
           </div>
-        ) : null}
+        )}
       </div>
 
       {!isAdopted && (

diff --git a/src/components/pages/searchPage/companyInfoPage.tsx b/src/components/pages/searchPage/companyInfoPage.tsx
@@ -48,8 +48,8 @@ const CompanyName = styled.div`
 // `;
 
 const Line = styled.div`
-  height: 1px;
-  background-color: #f2f2f2;
+  height: 5px;
+  background-color: #fff9f4;
   width: 80%;
   margin: 10% 0% 5% 10%;
   stroke: 5px solid #fff9f4;