fix: 오류 수정 및 코드 정리

SPARCS-Service-Hackathon-2024 · Feb 16, 2024 · 593716d · 593716d
1 parent 80f585c
commit 593716d
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 11 deletions.
diff --git a/src/components/Header.js b/src/components/Header.js
@@ -8,7 +8,8 @@ function Header() {
         <header className="header">
             <a href="/chat"><img src={MessageIcon} alt="채팅"/></a>
             <span>추천</span>
-            <a href="/mypage"><img src={PersonIcon} alt="마이페이지"/></a>
+            <img src={PersonIcon} alt="마이페이지"/>
+            {/*<a href="/mypage"><img src={PersonIcon} alt="마이페이지"/></a>*/}
         </header>
     );
 }

diff --git a/src/components/SecondModal.js b/src/components/SecondModal.js
@@ -16,7 +16,7 @@ const FirstModal = ({ isOpen, onRequestClose, onSelectNumberOfWeek }) => {
                     <button onClick={() => onSelectNumberOfWeek('1주')} className="modal-button">1주</button>
                     <button onClick={() => onSelectNumberOfWeek('2주')} className="modal-button">2주</button>
                     <button onClick={() => onSelectNumberOfWeek('3주')} className="modal-button">3주</button>
-                    <button onClick={() => onSelectNumberOfWeek('4주')} className="modal-button">4주</button>
+                    <button onClick={() => onSelectNumberOfWeek('4주 이상')} className="modal-button">4주</button>
                 </div>
             </div>
         </Modal>

diff --git a/src/css/detail.css b/src/css/detail.css
@@ -0,0 +1,9 @@
+
+
+.loading {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    width: 100%;
+}
diff --git a/src/pages/DetailPage.js b/src/pages/DetailPage.js
@@ -3,8 +3,24 @@ import { useNavigate } from 'react-router-dom';
 import { useParams } from 'react-router-dom';
 import { detail } from '../services/detail';
 import map from '../assets/map-pin.svg';
-import schoolIcon from '../assets/schoolBuilding.svg'; 
+import schoolIcon from '../assets/schoolBuilding.svg';
+import backButtonSvg from '../assets/chevron.svg';
 import styled from 'styled-components';
+import '../css/detail.css';
+
+const ImageContainer = styled.div`
+  position: relative;
+`;
+
+const BackButton = styled.img`
+  position: absolute;
+  top: 10px; // 상단에서부터의 거리
+  left: 10px; // 왼쪽에서부터의 거리
+  width: 40px; // 버튼 크기 조정
+  height: 40px; // 버튼 크기 조정
+`;
+
+
 
 const Container = styled.div`
     width: 100%;
@@ -142,7 +158,7 @@ function DetailPage() {
     }, [house_id]);
 
     if (!houseDetail) {
-        return <div>Loading...</div>;
+        return <div className="loading">Loading...</div>;
     }
 
     const renderRow = (label, value) => (
@@ -152,13 +168,20 @@ function DetailPage() {
         </TableRow>
     );
 
+    const handleBackClick = () => {
+        navigator('/list');
+    }
+
     const handleRegisterClick = () => {
         navigator('/registerHome');
     };
 
     return (
         <>
-            <AptImage src={houseDetail.image_url} alt="아파트 이미지" />
+            <ImageContainer>
+                <AptImage src={houseDetail.image_url} alt="아파트 이미지" />
+                <BackButton src={backButtonSvg} alt="뒤로가기" onClick={handleBackClick}/>
+            </ImageContainer>
             <Container>
                 <SemiContainer>
                     <AptName>{houseDetail.aptName}</AptName>
@@ -170,7 +193,7 @@ function DetailPage() {
                         {renderRow('면적', `57.96m²`)}
                         {renderRow('특징', houseDetail.tagList.join(', '))}
                         {renderRow('보증금', `${houseDetail.aptHouseholdCount}만원`)}
-                        {renderRow('월세', `72만원`)}
+                        {renderRow('월세', `35만원`)}
                         {renderRow('난방', `${houseDetail.aptHeatMethodTypeName}`)}
                         {renderRow('가스', `${houseDetail.aptHeatFuelTypeName}`)}
                     </Table>
@@ -181,6 +204,7 @@ function DetailPage() {
                         {renderRow('근처학교', `${houseDetail.schoolName}`)}
                         {renderRow('학교 종류', `${houseDetail.organizationType}`)}
                         {renderRow('학교까지 걸어서', `${houseDetail.walkTime}분`)}
+                        {renderRow('선생님당 학생 수', `${houseDetail.studentCountPerTeacher}`)}
                     </Table>
                 </SemiContainer>
                 <ButtonContainer>

diff --git a/src/pages/ListPage.js b/src/pages/ListPage.js
@@ -89,11 +89,11 @@ const ListPage = () => {
                     {items.map((item, index) => (
                         <div key={index} className="item">
                             <div className="content-space">
-                                <img className="content-image" src={item.image_url} alt={item.aptName}/>
+                                <img className="content-image" src={item.image_url} onClick={() => handleItemClick(item.house_id)}/>
                                 <div className="content-body">
                                     <div className="content-info">
-                                        <span className="span-title">{item.aptName}</span>
-                                        <span className="span-content"><LocationIcon
+                                        <span className="span-title" onClick={() => handleItemClick(item.house_id)}>{item.aptName}</span>
+                                        <span className="span-content" onClick={() => handleItemClick(item.house_id)}><LocationIcon
                                             className="location-icon"/>{item.exposureAddress}</span>
                                     </div>
                                     <img
@@ -117,7 +117,7 @@ const ListPage = () => {
                     {items2.map((item, index) => (
                         <div key={index} className="item">
                             <div className="content-space">
-                                <img className="content-image2" src={item.image_url} alt={item.aptName}/>
+                                <img className="content-image2" src={item.image_url} onClick={() => handleItemClick(item.house_id)}/>
                                 <div className="content-body">
                                     <div key={index} className="item" onClick={() => handleItemClick(item.house_id)}>
                                         <div className="content-info">

diff --git a/src/pages/Register.js b/src/pages/Register.js
@@ -114,7 +114,12 @@ const Register = () => {
       if (response.success) {
         localStorage.setItem('token', response.data.access_token);
         localStorage.setItem('nickname', nickname);
-        goChat();
+        if (response.data.is_signup){
+          navigator('/chat');
+        }
+        else{
+          goChat();
+        }
       } else {
         alert(response.message);
       }