Merge pull request #64 from URECA-PODONG/feat/#5

Feat/#5
URECA-PODONG · Nov 5, 2024 · 3a498fe · 3a498fe
2 parents 6708378 + 87a743a
commit 3a498fe
Show file tree

Hide file tree

Showing 10 changed files with 141 additions and 38 deletions.
diff --git a/src/Router.jsx b/src/Router.jsx
@@ -44,6 +44,7 @@ import OrderCancel from './pages/OrderPage/OrderCancel.jsx';
 function Router() {
   return (
     <BrowserRouter>
+
       <CartProvider>
         <ScrollTop />
         <NavSelector />

diff --git a/src/pages/CommunityPage/CommunityDetail.jsx b/src/pages/CommunityPage/CommunityDetail.jsx
@@ -55,8 +55,8 @@ const CommunityDetail = () => {
     e.preventDefault(); // 새로고침 방지
     const formData = new FormData(e.target);
     const data = Object.fromEntries(formData.entries()); //객체로 변환
-    const now = new Date().toISOString();
-    data.createdAt = now; // 현재 시간 추가
+    // const now = new Date().toISOString();
+    // data.createdAt = now; // 현재 시간 추가
     data.post = no;
     //글 등록     
       axios.post('http://localhost:8080/api/communityComments',data)
@@ -72,7 +72,7 @@ const CommunityDetail = () => {
 
 
   return (
-  <>
+  <Container>
     <ItemTitle>
       <ListImg src={`http://localhost:8080/uploads/${postDetail.imageUrl}`}
       alt={postDetail.imageUrl}
@@ -97,9 +97,9 @@ const CommunityDetail = () => {
       {comments
       .filter((item)=>item.post === postDetail.postId)
       .map((item)=>(
-      <div  key={item.commentId}>
+      <div  key={item.communityCommentId}>
       <User2><VscAccount1/>작성자: {item.length > 0 && item[0].user}
-        <ListDate key={item.commentId}>
+        <ListDate key={item.communityCommentId}>
           {new Date(item.createdAt).toLocaleDateString('ko-KR', {
             timeZone: 'Asia/Seoul' 
           })}
@@ -120,7 +120,7 @@ const CommunityDetail = () => {
         />
       <CommentSubmit type="submit">등록</CommentSubmit>
     </CommentFrom>
-    </>
+    </Container>
   );
 };
 
@@ -244,11 +244,14 @@ const CommentST = styled.div`
 const CommentFrom = styled.form`
   width: 100%;
   display: flex;
-  align-items: flex-end;
-  justify-content:center ;
-  margin-top: auto; 
-  margin-bottom: 70px;
   justify-content: flex-end;
+  margin-top: auto;
+  margin-bottom: 64px;
+  `;
+  const Container = styled.div`
+  height: 100dvh;
+  display: flex;
+  flex-direction: column;
   `;
   const CommentCC = styled.input`
     height: 40px;

diff --git a/src/pages/CommunityPage/CommunityWrite.jsx b/src/pages/CommunityPage/CommunityWrite.jsx
@@ -27,8 +27,8 @@ const CommunityWrite = () => {
 
     // FormData 객체 생성
     const formData = new FormData();
-    const createdAt = new Date().toISOString();
-    formData.append('createdAt', createdAt); // 현재 시간 추가
+    // const createdAt = new Date().toISOString();
+    // formData.append('createdAt', createdAt); // 현재 시간 추가
     formData.append('title',title)
     formData.append('contents',contents)
     formData.append('user',user)

diff --git a/src/pages/HealthCare/HealthCare.jsx b/src/pages/HealthCare/HealthCare.jsx
@@ -1,21 +1,62 @@
-import React, { useState } from 'react';
+import axios from 'axios';
+import React, { useEffect, useState } from 'react';
 import Calendar from 'react-calendar';
 import 'react-calendar/dist/Calendar.css';
 import styled from 'styled-components';
 
 const HealthCare = () => {
   const [selectedDate, setSelectedDate] = useState(new Date());
   const [appointments, setAppointments] = useState([]);
-  const [showInput, setShowInput] = useState({ hospital: false, nextVisit: false, healthCare: false });
+  const [showInput, setShowInput] = useState({ hospital: true, nextVisit: false, healthCare: false });
   const [memo, setMemo] = useState('');
 
+
+  // useEffect(()=>{
+
+  //   axios.get(`http://localhost:8080/api/healths`)
+  //   .then((response) => {
+  //     setAppointments(response.data.map(item => ({ ...item, date: new Date(item.date) })));
+  //     console.log('댓글 목록 :', response.data);
+  //   })
+  //   .catch((error) => {
+  //     console.error("Error fetching data:", error);
+  //   });
+  // },[]);
+
   const handleDateChange = date => {
     setSelectedDate(date);
   };
 
-  const addAppointment = type => {
+  const addAppointment = async (type, e) => {
     setAppointments([...appointments, { date: selectedDate, type, memo }]);
-    setMemo('');
+    // e.preventDefault(); // 새로고침 방지
+    const formData = new FormData();
+    const formattedDate = formatDate(selectedDate);
+    formData.append('pet', 1);
+
+  if (type === '병원 방문일') {
+    formData.append('visitedDate', formattedDate);
+  } else if (type === '다음 방문일') {
+    formData.append('nextCheckupDate', formattedDate);
+  } else if (type === '건강 관리') {
+    formData.append('healthDate', formattedDate);
+    formData.append('notes',memo); // 메모 추가
+  }console.log("건강 :" ,formData)
+
+  try {
+    const response = await axios.post('http://localhost:8080/api/healths', formData, {
+      // headers: {
+      //   'Content-Type': 'application/json'
+      // },
+    });
+      console.log("등록 data : ", response.data);
+      alert("등록 성공")
+      setMemo('');
+    }
+    catch(error) {
+      console.error("오류 발생:",error);
+      alert("오류 발생:")
+    }
   };
 
   const toggleInput = type => {
@@ -96,7 +137,7 @@ const HealthCare = () => {
         {showInput.hospital && (
           <InputWrapper>
             <DateInput type="date" onChange={e => handleDateChange(new Date(e.target.value))} />
-            <RegisterButton onClick={() => addAppointment('병원 방문일')}>등록</RegisterButton>
+            <RegisterButton onClick={(e) => addAppointment('병원 방문일',e)}>등록</RegisterButton>
           </InputWrapper>
         )}
         <AppointmentInput>
@@ -106,7 +147,7 @@ const HealthCare = () => {
         {showInput.nextVisit && (
           <InputWrapper>
             <DateInput type="date" onChange={e => handleDateChange(new Date(e.target.value))} />
-            <RegisterButton onClick={() => addAppointment('다음 방문일')}>등록</RegisterButton>
+            <RegisterButton onClick={(e) => addAppointment('다음 방문일',e)}>등록</RegisterButton>
           </InputWrapper>
         )}
         <AppointmentInput>
@@ -122,7 +163,7 @@ const HealthCare = () => {
               value={memo}
               onChange={e => setMemo(e.target.value)}
             />
-            <RegisterButton onClick={() => addAppointment('건강 관리')}>등록</RegisterButton>
+            <RegisterButton onClick={(e) => addAppointment('건강 관리',e)}>등록</RegisterButton>
           </InputWrapper>
         )}
       </AppointmentSection>
@@ -241,6 +282,8 @@ const MemoInput = styled.input`
   padding: 5px;
   border: 1px solid #ccc;
   border-radius: 5px;
+  height: auto;
+  width: 100%;
 `;
 
 const Button = styled.button`

diff --git a/src/pages/MainPage/MainPage.jsx b/src/pages/MainPage/MainPage.jsx
@@ -7,6 +7,7 @@ import { Link } from 'react-router-dom';
 import { useParams } from 'react-router-dom';
 import { images } from '../../components/Images';
 
+
 const MainPage = () => {
   const [activeTab, setActiveTab] = useState('댕댕이');
   const [activeCategory, setActiveCategory] = useState('전체');
@@ -34,6 +35,32 @@ const MainPage = () => {
     }
   };
 
+  const { userId } = useParams();
+  if (typeof userId === 'string' && !isNaN(userId)){
+    localStorage.setItem('userId', userId); 
+  }
+  console.log(userId); 
+
+  const shoppingData = async () => {
+    if (useDummyData) {
+      const filteredData = dummyData.items.filter(item => item.title.includes(searchQuery));
+    } else {
+      // 실제 fetchData를 사용할 때 필요한 로직이 있다면 여기에 추가
+    }
+  };
+
+
+  const { userId } = useParams();
+  localStorage.setItem('userId', userId); 
+  console.log(userId); 
+
+  const shoppingData = async () => {
+    if (useDummyData) {
+      const filteredData = dummyData.items.filter(item => item.title.includes(searchQuery));
+    } else {
+      // 실제 fetchData를 사용할 때 필요한 로직이 있다면 여기에 추가
+    }
+  };
   const carouselImages = [
     images.carouselImage1,
     images.carouselImage2,

diff --git a/src/pages/MyPage/MyPage.jsx b/src/pages/MyPage/MyPage.jsx
@@ -451,6 +451,7 @@ function MyPage() {
       <Container>
         <MainContainer>
           <StyledAvatar />
+
               <UserInfo>
                 {userData ? userData.nickname : '불러오는 중...'}
                 <EditButton onClick={() => navigate(`/myPage/${userId}/editUserRegister/${userId}`)}>

diff --git a/src/pages/NanumPage/NanumDetail.jsx b/src/pages/NanumPage/NanumDetail.jsx
@@ -11,6 +11,15 @@ const PetItemDetailPage = () => {
   const [itemDetail, setItemDetail] = useState([]);
   const [comments, setComments] = useState([]);
 
+  // useEffect(() => {
+  //   const fetchUserData = async () => {
+  //     const userId = localStorage.getItem('userId'); 
+  //     if (!userId) {
+  //       console.error('User ID not found in local storage');
+  //       return;
+  //     }
+  //   );
+
   useEffect(()=>{  // 상세정보 불러오기
 
     axios.get(`http://localhost:8080/api/petItems/${no}`)
@@ -56,8 +65,8 @@ const PetItemDetailPage = () => {
     e.preventDefault(); // 새로고침 방지
     const formData = new FormData(e.target);
     const data = Object.fromEntries(formData.entries()); //객체로 변환
-    const now = new Date().toISOString();
-    data.createdAt = now; // 현재 시간 추가
+    // const now = new Date().toISOString();
+    // data.createdAt = now; // 현재 시간 추가
     data.petItem = no;
     //글 등록     
       axios.post('http://localhost:8080/api/petItemComments',data)
@@ -72,7 +81,7 @@ const PetItemDetailPage = () => {
   }
 
   return (
-  <>
+  <Container >
     <ItemTitle>
       <ListImg src={`http://localhost:8080/uploads/${itemDetail.imageUrl}`}
       alt={itemDetail.imageUrl}/>
@@ -96,9 +105,9 @@ const PetItemDetailPage = () => {
         {comments
         .filter((item)=>item.petItem === itemDetail.petItemId)
         .map((item)=>(
-          <div  key={item.commentId}>
+          <div  key={item.petItemCommentId}>
         <User2><VscAccount1/>작성자: {item.length > 0 && item[0].user}
-          <ListDate key={item.commentId}>
+          <ListDate key={item.petItemCommentId}>
             {new Date(item.createdAt).toLocaleDateString('ko-KR', {
               timeZone: 'Asia/Seoul' 
             })}
@@ -109,6 +118,7 @@ const PetItemDetailPage = () => {
         ))}
       </CommentST>
     </ItemTitle>
+
       <CommentFrom onSubmit={handleSubmit}>
         <input type="number" name="user"placeholder="유저번호" required/>
         <CommentCC 
@@ -119,15 +129,15 @@ const PetItemDetailPage = () => {
           />
         <CommentSubmit type="submit">등록</CommentSubmit>
       </CommentFrom>
-      </>
+
+      </Container>
   );
 };
 
 export default PetItemDetailPage;
 const ItemTitle = styled.div`
   display: flex;
   flex-direction: column;
-  height:100% ;
   width: 100%;
   padding: 64px 25px 0px 25px;
 `;
@@ -240,11 +250,14 @@ const CommentST = styled.div`
 const CommentFrom = styled.form`
   width: 100%;
   display: flex;
-  align-items: flex-end;
-  justify-content:center ;
-  margin-top: auto; 
-  margin-bottom: 70px;
   justify-content: flex-end;
+  margin-top: auto;
+  margin-bottom: 64px;
+  `;
+  const Container  = styled.div`
+  height: 100dvh;
+  display: flex;
+  flex-direction: column;
   `;
   const CommentCC = styled.input`
     height: 40px;

diff --git a/src/pages/NanumPage/NanumWrite.jsx b/src/pages/NanumPage/NanumWrite.jsx
@@ -22,15 +22,15 @@ const PetItemPage = () => {
 
  // FormData 객체 생성
     const formData = new FormData();
-    const createdAt = new Date().toISOString();
-    formData.append('createdAt', createdAt); // 현재 시간 추가
+    // const createdAt = new Date().toISOString();
+    // formData.append('createdAt', createdAt); // 현재 시간 추가
     formData.append('name',name)
     formData.append('description',description)
     formData.append('price',price)
     formData.append('user',user)
     formData.append('sharing',sharing)
     if (imageUrl){
-      formData.append('imageUrl', imageUrl);// 'imageUrl'는 Spring Boot에서 받을 필드 이름과 일치해야 합니다
+      formData.append('imageUrl', imageUrl);
     }
 
     try {

diff --git a/src/pages/PaymentPage/Payment.jsx b/src/pages/PaymentPage/Payment.jsx
@@ -108,7 +108,6 @@ const Payment = () => {
             return;
         }
         IMP.init("imp02101050"); // 포트원 가맹점 식별코드
-
         const response = await axios.get(`http://localhost:8080/api/user/${userId}`);
         const userData = response.data;
         console.log("User Data:", userData);