From 552f6d064f9644861f7c9d0dbe74dbf7a0fe0787 Mon Sep 17 00:00:00 2001
From: jeasong <cjs5241@gmail.com>
Date: Fri, 7 May 2021 01:44:48 +0900
Subject: [PATCH] prototype

---
 src/App.js                        | 13 +++-----
 src/MainPages/main.js             |  5 ++-
 src/MyPages/MyPage.js             | 53 +++++++++++++++++++++----------
 src/MyPages/components/ExitBtn.js |  5 +--
 src/MyPages/components/Header.js  |  4 +--
 5 files changed, 50 insertions(+), 30 deletions(-)

diff --git a/src/App.js b/src/App.js
index 9f61249..9c817c5 100644
--- a/src/App.js
+++ b/src/App.js
@@ -27,7 +27,7 @@ export default function App() {
 
   //로그인 상태 관리하기--------------------------------
   useEffect(() => {
-    refreshTokenRequest()
+    //refreshTokenRequest()
     if(accessToken.accessToken!==null){
       history.push('/Waiting')
     }      
@@ -46,12 +46,7 @@ export default function App() {
     axios
         .get(
           'http://localhost:4000/user/logout',
-          {
-            headers:{
-              'Content-Type': 'application/json',
-              'Clear-Site-Data': "cookies"
-            },
-          }
+          {withCredentials: true}
         ).then((res) => {})
     setUserInfo({
       id: null,
@@ -100,12 +95,14 @@ export default function App() {
       })
       .then((res) => {
         if (res.data.message !== 'ok') {}
-        const { nickname, email, profile_image } = res.data.data.userInfo;
+        const { nickname, email, profile_image, id,comment } = res.data.data.userInfo;
         console.log(res.data.data.accessToken)
         setAccessToken({accessToken:res.data.data.accessToken})
         setUserInfo({
+          id : id,
           nickname: nickname,
           email: email,
+          comment:comment,
           profile_image: profile_image,
         });
       });
diff --git a/src/MainPages/main.js b/src/MainPages/main.js
index 8843fd1..f0ef645 100644
--- a/src/MainPages/main.js
+++ b/src/MainPages/main.js
@@ -23,7 +23,10 @@ export default function Main({ loginHandler, handleGuestLogin }) {
 
   const guestLogIn = () => {
     axios
-      .get('http://localhost:4000/guest')
+      .get('http://localhost:4000/guest',
+      {
+        withCredentials: true
+      })
       .then((res) => {
         console.log(res.data);
         loginHandler(res.data);
diff --git a/src/MyPages/MyPage.js b/src/MyPages/MyPage.js
index af2965d..79f3e25 100644
--- a/src/MyPages/MyPage.js
+++ b/src/MyPages/MyPage.js
@@ -9,21 +9,37 @@ import Character3 from '../images/Character3.png';
 import Character4 from '../images/Character4.png';
 import axios from 'axios';
 
-function MyPage({ accessToken, isLogIn, loginCheck, userInfo }) {
+function MyPage({ accessToken, refreshTokenRequest, userInfo }) {
   const PhotoData = [Character1, Character2, Character3, Character4];
-
   const [isOpen, setIsOpen] = useState(false);
   const [isPhotoBoxOpen, setIsPhotoBoxOpen] = useState(false);
   const { nickname, email, profile_image, comment, id } = userInfo;
-  const defaultImageNum = profile_image === null ? 0 : profile_image;
-  const [nowPhoto, setPhoto] = useState(PhotoData[defaultImageNum]);
+  const [PhotoNum, setPhotoNum] = useState(0);
+  const [nowPhoto, setPhoto] = useState(PhotoData[profile_image]);
+  const [text, setText] = useState(null);
+  
+  // const emailInputValue = (e) => {
+  //   setEmail(e.target.value);
+  // };
+
+  // const passwordInputValue = (e) => {
+  //   setPassword(e.target.value);
+  // };
+
+  // const nickNameInputValue = (e) => {
+  //   setNickName(e.target.value);
+  // };
+  
   const ChangeInputPhoto = function (photo) {
     // e.preventDefault();
     setPhoto(photo);
+    setPhotoNum(PhotoData.indexOf(nowPhoto))
+    console.log(PhotoNum)
     if (photo !== nowPhoto) {
       console.log('openModal');
       openModal();
     }
+    //MyPageSaveData()
   };
   const openModal = () => {
     setIsOpen(true);
@@ -40,29 +56,33 @@ function MyPage({ accessToken, isLogIn, loginCheck, userInfo }) {
     }
   };
 
+  const MyPageSaveData= async (PhotoNum) =>{
 
-  const MyPageSaveData= async () =>{
-    const PhotoNum = PhotoData.findIndex(nowPhoto)
+    await refreshTokenRequest()
     const SavePhoto = await axios.post(`http://localhost:4000/mypage/${id}/profile`,
+    {new_profile: PhotoNum},
     {
-      authorization: accessToken,
-      new_profile: PhotoNum
-    },
-    {
-      headers: { 'Content-Type': 'application/json' },
-      Credentials: 'include',
+      headers: {
+        Authorization: `Bearer ${accessToken.accessToken}`,
+        'Content-Type': 'application/json',
+      },
+      //withCredentials: true,
     })
     const SaveComment = await axios.post(`http://localhost:4000/mypage/${id}/comment`,
+    {Comment: '아니라어민어리ㅏㅁㄴ얼'},
     {
-      authorization: accessToken,
-      Comment: PhotoNum
+      headers: {
+        Authorization: `Bearer ${accessToken.accessToken}`,
+        'Content-Type': 'application/json',
+      },
+      //withCredentials: true,
     })
   }
 
 
   return (
     <div>
-      <Header isOpen={isOpen} nowPhoto={nowPhoto} nickname={nickname} />
+      <Header isOpen={isOpen} nowPhoto={nowPhoto} nickname={nickname} PhotoNum={PhotoNum}MyPageSaveData={MyPageSaveData}/>
       <content className="container">
         <div className="pro_search_box">
           <div className="introBox">
@@ -81,8 +101,7 @@ function MyPage({ accessToken, isLogIn, loginCheck, userInfo }) {
             <div className="intro">
               <h1>자기소개</h1>
               <textarea
-                placeholder={`클릭하여 자신을 소개해
-보세요!`}
+                placeholder={`클릭하여 자신을 소개해 보세요!`}
               />
             </div>
           </div>
diff --git a/src/MyPages/components/ExitBtn.js b/src/MyPages/components/ExitBtn.js
index cccf00c..34e56e1 100644
--- a/src/MyPages/components/ExitBtn.js
+++ b/src/MyPages/components/ExitBtn.js
@@ -1,12 +1,13 @@
 import React from 'react';
 import { useHistory } from 'react-router-dom';
 
-export default function ExitBtn({ MyPageSaveData }) {
+export default function ExitBtn({ MyPageSaveData,PhotoNum }) {
   const history = useHistory();
   return (
     <span className="Exit">
       <button
-        onClick={() => {
+        onClick={async () => {
+          await MyPageSaveData(PhotoNum)
           history.push('/Waiting');
         }}
       >
diff --git a/src/MyPages/components/Header.js b/src/MyPages/components/Header.js
index c100977..9e9d96a 100644
--- a/src/MyPages/components/Header.js
+++ b/src/MyPages/components/Header.js
@@ -3,14 +3,14 @@ import React, { useEffect } from 'react';
 import ExitBtn from './ExitBtn';
 import Complete from './Complete';
 
-export default function Header({ isOpen, nowPhoto, nickname, MyPageSaveData }) {
+export default function Header({ isOpen, nowPhoto, nickname, MyPageSaveData,PhotoNum }) {
   console.log(nickname);
 
   return (
     <header className="header">
       <h1>{nickname}님의 마이페이지</h1>
       <Complete isOpen={isOpen} />
-      <ExitBtn MyPageSaveData={MyPageSaveData} />
+      <ExitBtn MyPageSaveData={MyPageSaveData} PhotoNum={PhotoNum}/>
     </header>
   );
 }