From 8e026ea8b409fbf8d6d6b64fd7c7a6a57e01c4cb Mon Sep 17 00:00:00 2001 From: kr-nius Date: Fri, 29 Mar 2024 13:42:13 +0900 Subject: [PATCH] =?UTF-8?q?[fix]=20#36=20=EC=BD=94=EB=93=9C=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- weatherfit_refactoring/@types/feed/index.d.ts | 29 ++-- .../public/dummy_data/comment.json | 2 +- .../public/dummy_data/post.json | 54 +++++++ .../public/dummy_data/userprofile.json | 11 ++ .../src/Components/Molecules/Comment.tsx | 2 +- .../src/Components/Molecules/MainHeader.tsx | 4 +- .../Components/Molecules/ProfileImageEdit.tsx | 4 +- .../Components/Organisms/ProfileEditModal.tsx | 8 +- .../src/Components/molecules/ProfileInfo.tsx | 42 +++-- .../src/Components/molecules/ProfilePost.tsx | 2 +- .../src/app/mypage/page.tsx | 144 ++++++++++-------- 11 files changed, 203 insertions(+), 99 deletions(-) create mode 100644 weatherfit_refactoring/public/dummy_data/post.json create mode 100644 weatherfit_refactoring/public/dummy_data/userprofile.json diff --git a/weatherfit_refactoring/@types/feed/index.d.ts b/weatherfit_refactoring/@types/feed/index.d.ts index 5b06870..824a00a 100644 --- a/weatherfit_refactoring/@types/feed/index.d.ts +++ b/weatherfit_refactoring/@types/feed/index.d.ts @@ -44,20 +44,19 @@ interface FEEDDATA_detail { } interface SelecList { - list_id : number; - selectList : string; + list_id: number + selectList: string } - interface TabMenu { - id: number; - title?: string; - value: string; - selectLists : SelecList[]; + id: number + title?: string + value: string + selectLists: SelecList[] } interface CategoryStore { - categoryData : TabMenu[]; + categoryData: TabMenu[] } interface CommentType { @@ -71,8 +70,14 @@ interface CommentType { status: number } - interface LIKE { - likeId : number; - nickName: string; -} \ No newline at end of file + likeId: number + nickName: string +} + +interface UserData { + nickname: string + name: string + email: string + pw: string +} diff --git a/weatherfit_refactoring/public/dummy_data/comment.json b/weatherfit_refactoring/public/dummy_data/comment.json index 9a1edd2..b92b3ac 100644 --- a/weatherfit_refactoring/public/dummy_data/comment.json +++ b/weatherfit_refactoring/public/dummy_data/comment.json @@ -94,7 +94,7 @@ { "id": 10, "boardId": 1, - "nickname": "도로롱", + "nickname": "황동준", "content": "날씨랑 잘 어울려요!", "createdDate": "2024-03-14", "createdTime": "23:15", diff --git a/weatherfit_refactoring/public/dummy_data/post.json b/weatherfit_refactoring/public/dummy_data/post.json new file mode 100644 index 0000000..0c63455 --- /dev/null +++ b/weatherfit_refactoring/public/dummy_data/post.json @@ -0,0 +1,54 @@ +{ + "mypost_data": [ + { + "boardId": 1, + "nickName": "hae_hae", + "likeCount": 2, + "temperature": -6, + "images": "", + "category": ["후드 집업", "가죽자켓", "컨버스", "운동화", "베레모"], + "hashTag": ["hi", "하이", "안녕"], + "weatherIcon": "01d", + "likelist": [ + { "likeId": 1, "nickName": "user1" }, + { "likeId": 2, "nickName": "user2" } + ], + "createDate": "2023-08-31 04:29:55", + "modifiedDate": "2023-08-31 04:29:55" + } + ], + "mylikepost_data": [ + { + "boardId": 1, + "nickName": "hae_hae", + "likeCount": 2, + "temperature": -6, + "images": "", + "category": ["후드 집업", "가죽자켓", "컨버스", "운동화", "베레모"], + "hashTag": ["hi", "하이", "안녕"], + "weatherIcon": "01d", + "likelist": [ + { "likeId": 1, "nickName": "user1" }, + { "likeId": 2, "nickName": "user2" } + ], + "createDate": "2023-08-31 04:29:55", + "modifiedDate": "2023-08-31 04:29:55" + }, + { + "boardId": 1, + "nickName": "hae_hae", + "likeCount": 2, + "temperature": -6, + "images": "", + "category": ["후드 집업", "가죽자켓", "컨버스", "운동화", "베레모"], + "hashTag": ["hi", "하이", "안녕"], + "weatherIcon": "01d", + "likelist": [ + { "likeId": 1, "nickName": "user1" }, + { "likeId": 2, "nickName": "user2" } + ], + "createDate": "2023-08-31 04:29:55", + "modifiedDate": "2023-08-31 04:29:55" + } + ] +} diff --git a/weatherfit_refactoring/public/dummy_data/userprofile.json b/weatherfit_refactoring/public/dummy_data/userprofile.json new file mode 100644 index 0000000..a0df865 --- /dev/null +++ b/weatherfit_refactoring/public/dummy_data/userprofile.json @@ -0,0 +1,11 @@ +{ + "userprofile_data": { + "nickname": "황동준", + "email": "user1@test.com", + "name": "황동준", + "pw": "1234" + }, + "profileimage_data": { + "profileImage": "https://cdnimg.melon.co.kr/cm2/artistcrop/images/002/61/143/261143_20210325180240_500.jpg?61e575e8653e5920470a38d1482d7312/melon/optimize/90" + } +} diff --git a/weatherfit_refactoring/src/Components/Molecules/Comment.tsx b/weatherfit_refactoring/src/Components/Molecules/Comment.tsx index 4b979cc..ba3b9a3 100644 --- a/weatherfit_refactoring/src/Components/Molecules/Comment.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/Comment.tsx @@ -23,7 +23,7 @@ export default function Comment({ const [isEditing, setIsEditing] = useState(false) const [editContent, setEditContent] = useState('') const { accesstoken, setAccessToken } = AuthTokenStore() - const decoded_nickname = 'cute_ssu' + const decoded_nickname = '황동준' useEffect(() => { setAccessToken() diff --git a/weatherfit_refactoring/src/Components/Molecules/MainHeader.tsx b/weatherfit_refactoring/src/Components/Molecules/MainHeader.tsx index 48ec205..66e571a 100644 --- a/weatherfit_refactoring/src/Components/Molecules/MainHeader.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/MainHeader.tsx @@ -42,14 +42,14 @@ export default function MainHeader({ title }: Props) { {check ? ( 로그아웃 ) : ( + className="absolute right-[19px] font-gmarketsans text-black mt-[7px]"> 로그인 )} diff --git a/weatherfit_refactoring/src/Components/Molecules/ProfileImageEdit.tsx b/weatherfit_refactoring/src/Components/Molecules/ProfileImageEdit.tsx index 9c3bb55..c34847e 100644 --- a/weatherfit_refactoring/src/Components/Molecules/ProfileImageEdit.tsx +++ b/weatherfit_refactoring/src/Components/Molecules/ProfileImageEdit.tsx @@ -7,7 +7,9 @@ import { AuthTokenStore } from '@/Store/AuthToken' export default function ProfileImageEdit() { // const [selectedImage, setSelectedImage] = useState(userProfileImage) - const [selectedImage, setSelectedImage] = useState(null) + const [selectedImage, setSelectedImage] = useState( + 'https://cdnimg.melon.co.kr/cm2/artistcrop/images/002/61/143/261143_20210325180240_500.jpg?61e575e8653e5920470a38d1482d7312/melon/optimize/90', + ) const { userEmail } = AuthUserStore() const { accesstoken } = AuthTokenStore() diff --git a/weatherfit_refactoring/src/Components/Organisms/ProfileEditModal.tsx b/weatherfit_refactoring/src/Components/Organisms/ProfileEditModal.tsx index f4537f9..5268286 100644 --- a/weatherfit_refactoring/src/Components/Organisms/ProfileEditModal.tsx +++ b/weatherfit_refactoring/src/Components/Organisms/ProfileEditModal.tsx @@ -17,7 +17,7 @@ interface Props { export default function ProfileEditModal({ onClickFunction }: Props) { return (
-
+
{/* 헤더 부분 */}
{/* 이메일, 이름, 닉네임 부분 */}
- - - + + +
{/* 비밀번호 부분 */} diff --git a/weatherfit_refactoring/src/Components/molecules/ProfileInfo.tsx b/weatherfit_refactoring/src/Components/molecules/ProfileInfo.tsx index 43624e4..9277641 100644 --- a/weatherfit_refactoring/src/Components/molecules/ProfileInfo.tsx +++ b/weatherfit_refactoring/src/Components/molecules/ProfileInfo.tsx @@ -1,11 +1,7 @@ +import { useState } from 'react' import PostCount from './PostCount' - -interface UserData { - nickname: string - name: string - email: string - pw: string -} +import Image from 'next/image' +import IconStore, { IconStyle } from '../Atoms/Icon/IconStore' interface Props { profileImage: string | null @@ -20,26 +16,42 @@ export default function ProfileInfo({ myPost, myLikePost, }: Props) { + console.log('userInfo: ', userInfo) + console.log('userImage: ', profileImage) return (
-
-

깜찍이

- {/*
-

{userInfo.nickname}

*/} +
+ {profileImage == null ? ( + + ) : ( + 프로필 이미지 + )} +
+

{userInfo.nickname}

{/* -------------------------------지우기 */} -
+ {/*

내 게시물

{myPost.length}

좋아요 한 게시물

{myLikePost.length}

-
+
*/} {/* -------------------------------------- */} - {/* - */} + +
) } diff --git a/weatherfit_refactoring/src/Components/molecules/ProfilePost.tsx b/weatherfit_refactoring/src/Components/molecules/ProfilePost.tsx index cf2f933..92534b8 100644 --- a/weatherfit_refactoring/src/Components/molecules/ProfilePost.tsx +++ b/weatherfit_refactoring/src/Components/molecules/ProfilePost.tsx @@ -43,7 +43,7 @@ export default function ProfilePost({ postData }: Props) { )) ) : ( <> -

게시물을 등록해주세요.

+

게시물이 없습니다.

)} */}
diff --git a/weatherfit_refactoring/src/app/mypage/page.tsx b/weatherfit_refactoring/src/app/mypage/page.tsx index 31c5ecd..023b0bd 100644 --- a/weatherfit_refactoring/src/app/mypage/page.tsx +++ b/weatherfit_refactoring/src/app/mypage/page.tsx @@ -25,12 +25,35 @@ export default function Mypage() { }, [accesstoken]) // 회원 정보 - // const [userPofile, setUserProfile] = useState(null) - // const [userImage, setUserImage] = useState('') // 프로필 이미지 + const [userInfo, setUserInfo] = useState() + const [profileImage, setProfileImage] = useState('') // 프로필 이미지 const [refreshProfile, setRefreshProfile] = useState(false) // 회원 정보 변경했을 때 - // const [myPostData, setMyPostData] = useState([]) - // const [myLikePostData, setMyLikePostData] = useState([]) + const [myPostData, setMyPostData] = useState([]) + const [myLikePostData, setMyLikePostData] = useState([]) + useEffect(() => { + const fetchData = async () => { + try { + // 프로필 더미 데이터 가져오기 + const res = await fetch('/dummy_data/userprofile.json') + const profileRes = await res.json() + console.log('회원정보: ', profileRes.userprofile_data) + setUserInfo(profileRes.userprofile_data) + setProfileImage(profileRes.profileimage_data.profileImage) + + const postres = await fetch('dummy_data/post.json') + const postdata = await postres.json() + setMyPostData(postdata.mypost_data) + setMyLikePostData(postdata.mylikepost_data) + } catch (err) { + console.log('회원정보 에러: ', err) + } + } + + fetchData() + }, []) + + // 회원 정보 불러오기 // useEffect(() => { // const fetchData = async () => { // try { @@ -47,73 +70,70 @@ export default function Mypage() { // }) // const profileRes = await res.json() - // console.log('회원정보: ', profileRes) - // } catch (err) { - // console.log('회원정보 에러: ', err) - // } - // } - // fetchData() - // }, [refreshProfile]) - // 회원 정보 불러오기 - useEffect(() => { - const fetchData = async () => { - try { - // 프로필 데이터 가져오기 - const res = await fetch(`https://www.jerneithe.site/user/api/profile`, { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - Authorization: 'Bearer' + accesstoken, - }, - body: JSON.stringify({ - email: userEmail, - }), - }) - - const profileRes = await res.json() - - // setUserProfile(profileRes) - // setUserImage(profileRes.image) + // // setUserProfile(profileRes) + // // setUserImage(profileRes.image) - console.log('회원정보 data: ', profileRes) + // console.log('회원정보 data: ', profileRes) - // ----------------------------------------- + // // ----------------------------------------- - // 게시물 데이터 가져오기 - // const boardListRes = await fetch( - // 'https://www.jerneithe.site/board/list', - // ) - // const boardListdata: FEEDDATA[] = await boardListRes.json() + // // 게시물 데이터 가져오기 + // // const boardListRes = await fetch( + // // 'https://www.jerneithe.site/board/list', + // // ) + // // const boardListdata: FEEDDATA[] = await boardListRes.json() - // const filteredData = boardListdata.filter( - // item => item.nickName === userPofile.nickname, - // ) - // setMyPostData(filteredData) + // // const filteredData = boardListdata.filter( + // // item => item.nickName === userPofile.nickname, + // // ) + // // setMyPostData(filteredData) - // const filteredLikeData = boardListdata.filter(item => - // item.likelist.some(like => like.nickName === userPofile.nickname), - // ) - // setMyLikePostData(filteredLikeData) - } catch (error) { - console.error('데이터 로딩 에러: ', error) - } - } - fetchData() - }, [refreshProfile]) + // // const filteredLikeData = boardListdata.filter(item => + // // item.likelist.some(like => like.nickName === userPofile.nickname), + // // ) + // // setMyLikePostData(filteredLikeData) + // } catch (error) { + // console.error('데이터 로딩 에러: ', error) + // } + // } + // fetchData() + // }, [refreshProfile]) return ( <> - {/* 사용법 참고 */} - {loading ? : <>{check ? : } } - {/* - - */} + + {userInfo && ( + + )} + + {/* {loading ? ( + + ) : ( + <> + {check ? ( + <> + + {userInfo && ( + + )} + + + ) : ( + + )} + + )} */} ) }