Merge pull request #303 from JayJayleee/feat/#285-ui-check-list

UI check list 수정 및 삭제 로직 추가
Team-Coverflow · May 8, 2024 · 831d389 · 831d389
2 parents b99a923 + 4164b5e
commit 831d389
Show file tree

Hide file tree

Showing 9 changed files with 60 additions and 26 deletions.
diff --git a/src/asset/sass/etc/noContentsComponent/noContentsComponents.scss b/src/asset/sass/etc/noContentsComponent/noContentsComponents.scss
@@ -1,5 +1,5 @@
 .no-contents-wrapper {
-  width: 700px;
+  width: 550px;
   height: 25rem;
   display: flex;
   flex-direction: column;
@@ -18,7 +18,6 @@
   width: 11px;
   height: 11px;
   margin-right: 1rem;
-  overflow: scroll;
 }
 
 .no-component-plus-container {
@@ -37,6 +36,7 @@
   color: #808080;
   font-family: Pretendard-Medium;
   letter-spacing: -1px;
+
 }
 
 .no-component-title {
@@ -46,3 +46,7 @@
   font-family: Pretendard-Bold;
   letter-spacing: -1px;
 }
+
+.my-component-css{
+  margin-bottom:6rem;
+}
diff --git a/src/asset/sass/pages/notificationPage/notificationPage.scss b/src/asset/sass/pages/notificationPage/notificationPage.scss
@@ -29,6 +29,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
+  cursor : pointer;
 }
 
 .notification-controls {

diff --git a/src/asset/sass/pages/searchPage/companyInfoPage.scss b/src/asset/sass/pages/searchPage/companyInfoPage.scss
@@ -20,7 +20,7 @@
   display: flex;
   position: relative;
   letter-spacing: -1px;
-  margin: 10% 0% 0% 13%;
+  margin: -3% 0% 2% 13% ;
   font-size: 18px;
   color: var(--color-primary);
   font-family: 'Pretendard-Bold';
@@ -89,6 +89,7 @@
 }
 
 .selected-category-item {
+  letter-spacing : -1px;
   position: relative;
   cursor: pointer;
   border-radius: 50%;
@@ -130,3 +131,7 @@
   height: 20px;
   border-radius: 10px;
 }
+
+.companyInfo-css{
+  margin: 5rem  0 10rem 7rem;
+}
diff --git a/src/components/pages/postPage/questionDetailPage.tsx b/src/components/pages/postPage/questionDetailPage.tsx
@@ -84,7 +84,7 @@ const AnswerList = styled.div`
   flex-direction: column;
   align-items: center;
   width: 80%;
-  margin: 0px 0px 10rem 7.8rem;
+  margin: 0px 0px 2rem 7.8rem;
 `;
 
 export interface AnswerProps {
@@ -216,7 +216,7 @@ function QuestionDetailPage() {
       content: questionContent,
       questionStatus: false,
     };
-    // console.log('edit');
+    console.log(questionId);
     try {
       await fetchAPI(`/api/question/${questionId}`, 'PATCH', editBody);
     } catch (error) {
@@ -225,18 +225,28 @@ function QuestionDetailPage() {
   };
 
   const handleClickDelete = async () => {
-    // console.log('delete');
+
     const deleteBody = {
       title: questionTitle,
       content: questionContent,
       questionStatus: false,
     };
+    console.log(questionId);
     try {
-      await fetchAPI(`/api/question/${questionId}`, 'DELETE', deleteBody);
-      if (confirm('삭제하시겠습니까?'))
+        fetchAPI(`/api/question/${questionId}`, 'DELETE', deleteBody);
+       if (confirm('삭제하시겠습니까?')){
         showSuccessToast('질문이 삭제되었습니다.');
+        const pathSegments = window.location.pathname.split('/');
+        const companyId = pathSegments[2];
+
+        navigate(`/company-info/${companyId}`);
+
+      }
     } catch (error) {
-      if (error instanceof Error) showErrorToast(error.message);
+      if (error instanceof Error) 
+
+      showErrorToast(error.message);
+      console.log(error)
     }
   };
 

diff --git a/src/components/pages/searchPage/companyInfoPage.tsx b/src/components/pages/searchPage/companyInfoPage.tsx
@@ -50,7 +50,7 @@ const Line = styled.div`
   height: 5px;
   background-color: #fff9f4;
   width: 100%;
-  margin: 10% 0%;
+  margin : 5% 0% 8% 0%;
   stroke: 5px solid #fff9f4;
 `;
 
@@ -331,7 +331,8 @@ function CompanyInfoPage() {
               onClick={handleQuestionClick}
               content1="해당 기업에 대한 질문이"
               content2="존재하지 않습니다"
-              theme="질문"
+              theme="질문을 남기고, 답변을 확인해 보세요!"
+              className='companyInfo-css'
             />
           )}
 

diff --git a/src/components/pages/searchPage/searchResultPage.tsx b/src/components/pages/searchPage/searchResultPage.tsx
@@ -177,7 +177,7 @@ function SearchResultPage() {
         const data = await response.json();
         setSearchData(data.data.companyList);
 
-        // console.log('페이지 내 결과', data.data);
+        console.log('페이지 내 결과', data.data);
       } catch (error) {
         showErrorToast(`오류 발생: ${error}`);
         setSearchData([]);

diff --git a/src/components/ui/myPageSelection/myAnswer.tsx b/src/components/ui/myPageSelection/myAnswer.tsx
@@ -80,7 +80,7 @@ export default function MyAnswer({
             className="question-item"
             key={q.answerId}
             onClick={() =>
-              navigate(`/company-info/${q.companyId}/${q.questionId}`)
+              navigate(`/company-info/${q.companyId}/${q.questionId}`,{state:{questionId: q.questionId}})
             }
           >
             <div className="question-text">
@@ -93,9 +93,11 @@ export default function MyAnswer({
       ) : (
         <NoContentsComponent
           onClick={goToSearch}
-          content1="내가 남긴 답변"
+          content1="내가 남긴 답변이"
           content2="존재하지 않습니다"
-          theme="답변"
+          theme="답변을 남기고 확인해보세요."
+          noBtn={true}
+          className="my-component-css"
         />
       )}
 

diff --git a/src/components/ui/myPageSelection/myQuestion.tsx b/src/components/ui/myPageSelection/myQuestion.tsx
@@ -66,6 +66,7 @@ export default function MyQuestion({
         `/api/question/me?pageNo=${pageNo}&criterion=createdAt`,
         'GET',
       );
+      // console.log(data)
       setQuestion(data.data.questions);
       setTotalPages(data.data.totalPages);
       setQuestionCnt(data.data.totalElements);
@@ -84,7 +85,7 @@ export default function MyQuestion({
             className="answer-item"
             key={q.questionId}
             onClick={() =>
-              navigate(`/company-info/${q.companyId}/${q.questionId}`)
+              navigate(`/company-info/${q.companyId}/${q.questionId}`, {state:{questionId: q.questionId}})
             }
           >
             <div className="answer-item-title">{q.companyName}</div>
@@ -98,7 +99,9 @@ export default function MyQuestion({
           onClick={goToSearch}
           content1="내가 남긴 질문이"
           content2="존재하지 않습니다"
-          theme="질문"
+          theme="질문을 남기고, 답변을 확인해보세요!"
+          extraMessage="기업 검색 후 "
+          className="my-component-css"
         />
       )}
 

diff --git a/src/components/ui/noContentsComponent/noContentsComponent.tsx b/src/components/ui/noContentsComponent/noContentsComponent.tsx
@@ -8,27 +8,35 @@ interface NoContentsComponentProps {
   content1: string;
   content2: string;
   theme: string;
+  noBtn?:boolean;
+  extraMessage?:string;
+  className?:string;
 }
 export default function NoContentsComponent({
   onClick,
   content1,
   content2,
   theme,
+  noBtn,
+  extraMessage,
+  className
 }: NoContentsComponentProps) {
   return (
     <div>
-      <div className="no-contents-wrapper">
+      <div className={`no-contents-wrapper ${className}`}>
         <img src={Icon} alt="icon" />
-        <div className="no-component-title">{content1}</div>
-        <div className="no-component-title">{content2}</div>
+        <div>
+          <div className="no-component-title">{content1}</div>
+          <div className="no-component-title">{content2}</div>
+        </div>
         <span className="no-component-diclaimer">
-          {theme}을 남기고, 답변을 확인해 보세요!
+          {theme}
         </span>
-        <div className="no-component-plus-container" onClick={onClick}>
+       {noBtn ?(<div style={{height:"3rem"}}></div>): (<div className="no-component-plus-container" onClick={onClick}>
           <img className="no-component-plus" src={plus} alt="icon" />
-          <span className="ask-question">질문 하러가기</span>
-        </div>
+          <span className="ask-question">{extraMessage}질문 하러가기</span>
+        </div>)}
       </div>
-    </div>
-  );
+    </div>)
+
 }