Merge pull request #109 from yoon-jisung/dev

done !!!
codestates · May 6, 2021 · 0f4482f · 0f4482f
2 parents a5771ea + 7d0c8eb
commit 0f4482f
Show file tree

Hide file tree

Showing 6 changed files with 117 additions and 40 deletions.
diff --git a/src/.App.js.swo b/src/.App.js.swo
diff --git a/src/App.js b/src/App.js
@@ -27,12 +27,11 @@ export default function App() {
 
   //로그인 상태 관리하기--------------------------------
   useEffect(() => {
-
     //refreshTokenRequest()
-    if(accessToken.accessToken!==null){
-      history.push('/Waiting')
-    }      
-  },[]);
+    if (accessToken.accessToken !== null) {
+      history.push('/Waiting');
+    }
+  }, []);
 
   const loginHandler = (data) => {
     issueAccessToken(data.data.accessToken);
@@ -47,10 +46,8 @@ export default function App() {
   const hendleLogout = () => {
     axios
 
-        .get(
-          'http://localhost:4000/user/logout',
-          {withCredentials: true}
-        ).then((res) => {})
+      .get('http://localhost:4000/user/logout', { withCredentials: true })
+      .then((res) => {});
     setUserInfo({
       id: null,
       nickname: null,
@@ -75,8 +72,16 @@ export default function App() {
         withCredentials: true,
       })
       .then((res) => {
+<<<<<<< HEAD
+=======
         const { nickname, email, profile_image, comment, id } = res.data.data;
+>>>>>>> a5771eaba281de9abd8e0bf97642c16df821de90
         // !
+        return res.data.data;
+      })
+      .then((data) => {
+        console.log('여기야야야야양', data);
+        const { nickname, email, profile_image, comment, id } = data;
         setUserInfo({
           id: id,
           nickname: nickname,
@@ -87,25 +92,44 @@ export default function App() {
       });
   };
 
+  useEffect(() => {
+    return () => {
+      localStorage.setItem('userInfo', JSON.stringify(userInfo));
+    };
+  }, [userInfo]);
+
   const refreshTokenRequest = () => {
     // ! 일정 주기로 함수 계속 보냄
     axios
       .get('http://localhost:4000/refreshTokenHandler', {
         withCredentials: true,
       })
       .then((res) => {
+        if (res.data.message !== 'ok') {
+        }
+        const {
+          nickname,
+          email,
+          profile_image,
+          id,
+          comment,
+        } = res.data.data.userInfo;
 
+<<<<<<< HEAD
+        setAccessToken({ accessToken: res.data.data.accessToken });
+=======
 
         if (res.data.message !== 'ok') {}
         const { nickname, email, profile_image, id,comment } = res.data.data.userInfo;
         console.log(res.data.data.accessToken)
         setAccessToken({accessToken:res.data.data.accessToken})
 
+>>>>>>> a5771eaba281de9abd8e0bf97642c16df821de90
         setUserInfo({
-          id : id,
+          id: id,
           nickname: nickname,
           email: email,
-          comment:comment,
+          comment: comment,
           profile_image: profile_image,
         });
       });
@@ -129,12 +153,21 @@ export default function App() {
         withCredentials: true,
       }
     );
+<<<<<<< HEAD
+
+=======
+>>>>>>> a5771eaba281de9abd8e0bf97642c16df821de90
     issueAccessToken(resp.data.accessToken);
   };
   //구글 로그인 코드 받기--------------------------------
   useEffect(() => {
     const url = new URL(window.location.href);
     const authorizationCode = url.searchParams.get('code');
+<<<<<<< HEAD
+
+    console.log('userInfo:', userInfo);
+=======
+>>>>>>> a5771eaba281de9abd8e0bf97642c16df821de90
     if (authorizationCode) {
       getAccessToken(authorizationCode);
     }

diff --git a/src/GamePages/InGame.js b/src/GamePages/InGame.js
@@ -24,6 +24,7 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
   const [isPresenter, setIsPresenter] = useState(false);
   const [winner, setWinner] = useState([]);
   const [userlist, setUserlist] = useState([]);
+  const [inputPresenter, setInputPresenter] = useState(false);
 
   //뒤로가기 버튼 방지
   const [locationKeys, setLocationKeys] = useState([]);
@@ -116,7 +117,26 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
     socket.emit('set answer', { answer });
   };
 
+  const endGame = () => {
+    setResultPopup(true);
+    setInputPresenter(false);
+  };
+
   //! --------------------------method--------------------------
+  useEffect(() => {
+    const localUserInfo = JSON.parse(localStorage.getItem('userInfo'));
+    console.log('정답', localUserInfo.nickname);
+    console.log('출제자', presenter, presenter.nickname);
+
+    if (presenter.nickname === localUserInfo.nickname) {
+      setInputPresenter(true);
+      console.log('너가출제자123213', localUserInfo.nickname);
+    }
+  });
+
+  useEffect(() => {
+    console.log('inputPresenter:내가발표자');
+  }, [inputPresenter]);
 
 
 
@@ -153,7 +173,6 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
 
 
     socket.on('renew userlist', (list) => {
-      console.log('d우ㅠ저소ㅓ켓');
       setUserlist([...list]);
     });
   }, []);
@@ -203,7 +222,12 @@ export default function InGame({ accessToken, isLogIn, loginCheck, userInfo }) {
             {resultPopup ? <Result winner={winner} /> : null}
           </div>
         </div>
-        <User users={userlist} userInfo={userInfo} />
+        <User
+          className="inGame"
+          users={userlist}
+          userInfo={userInfo}
+          inputPresenter={inputPresenter}
+        />
         <div className="chatBix">
           <Timer
             minutes={minutes}

diff --git a/src/GamePages/components/User.js b/src/GamePages/components/User.js
@@ -1,37 +1,23 @@
 import React from 'react';
 import UserPic from '../../images/Character1.png';
 
-export default function User({ users, userInfo }) {
+export default function User({ users, userInfo, inputPresenter }) {
   console.log('유저!!', users);
   return (
     <div className="UserTable">
       <ul className="users">
         {users.map((el) => {
-          <li className="inGameUserProfile">
-            <div className="inGameUserNickName">{el.nickname}</div>
-          </li>;
+          return (
+            <li className="inGameUserProfile">
+              {inputPresenter ? <h3>출제자</h3> : null}
+              <img className="inGameImg" src={el.UserPic} alt="user_profile" />
+              <div>
+                <div className="inGameUserNickName">닉네임 : {el.nickname}</div>
+                <div className="comment">자기소개</div>
+              </div>
+            </li>
+          );
         })}
-        {/* <li className="inGameUserProfile">
-          <img className="inGameImg" src={UserPic} alt="user_profile" />
-          <div>
-            <div className="inGameUserNickName">
-              닉네임 : {userInfo.nickname}
-            </div>
-            <div className="comment">자기소개</div>
-          </div>
-        </li>
-        <li className="inGameUserProfile">
-          <img className="inGameImg" src={UserPic} alt="user_profile" />
-          <div className="inGameUserNickName">닉네임 : {userInfo.nickname}</div>
-        </li>
-        <li className="inGameUserProfile">
-          <img className="inGameImg" src={UserPic} alt="user_profile" />
-          <div className="inGameUserNickName">닉네임 : {userInfo.nickname}</div>
-        </li>
-        <li className="inGameUserProfile">
-          <img className="inGameImg" src={UserPic} alt="user_profile" />
-          <div className="inGameUserNickName">닉네임 : {userInfo.nickname}</div>
-        </li> */}
       </ul>
     </div>
   );

diff --git a/src/MyPages/MyPage.js b/src/MyPages/MyPage.js
@@ -57,6 +57,33 @@ function MyPage({ accessToken, refreshTokenRequest, userInfo }) {
     console.log('photobox', isPhotoBoxOpen);
   };
 
+<<<<<<< HEAD
+  const MyPageSaveData = async (PhotoNum) => {
+    refreshTokenRequest();
+    const SavePhoto = await axios.post(
+      `http://localhost:4000/mypage/${id}/profile`,
+      { new_profile: PhotoNum },
+      {
+        headers: {
+          Authorization: `Bearer ${accessToken.accessToken}`,
+          'Content-Type': 'application/json',
+        },
+        withCredentials: true,
+      }
+    );
+    const SaveComment = await axios.post(
+      `http://localhost:4000/mypage/${id}/comment`,
+      { Comment: '아니라어민어리ㅏㅁㄴ얼' },
+      {
+        headers: {
+          Authorization: `Bearer ${accessToken.accessToken}`,
+          'Content-Type': 'application/json',
+        },
+        withCredentials: true,
+      }
+    );
+  };
+=======
   // const MyPageSaveData = async (PhotoNum) => {
   //   await refreshTokenRequest();
   //   const SavePhoto = await axios.post(
@@ -82,6 +109,7 @@ function MyPage({ accessToken, refreshTokenRequest, userInfo }) {
   //     }
   //   );
   // };
+>>>>>>> a5771eaba281de9abd8e0bf97642c16df821de90
 
   return (
     <div>
@@ -90,7 +118,11 @@ function MyPage({ accessToken, refreshTokenRequest, userInfo }) {
         nowPhoto={nowPhoto}
         nickname={nickname}
         PhotoNum={PhotoNum}
+<<<<<<< HEAD
+        MyPageSaveData={MyPageSaveData}
+=======
         // MyPageSaveData={MyPageSaveData}
+>>>>>>> a5771eaba281de9abd8e0bf97642c16df821de90
       />
       <content className="container">
         <div className="pro_search_box">

diff --git a/src/main.css b/src/main.css
@@ -850,7 +850,7 @@ $button-active-blue: #1669f2; */
 
 .inGameUserProfile {
   display: flex;
-  border: 3px solid #0f4d86;
+  border: 3px solid #e71a1a;
   border-radius: 15px;
   list-style: none;
   width: 300px;
@@ -1053,7 +1053,6 @@ canvas {
 }
 
 .result {
-  border: 2px solid black;
   border-radius: 15px;
   width: 600px;
   height: 500px;
@@ -1192,6 +1191,9 @@ canvas {
   top: 10%;
 }
 
+.inGame_user {
+  border: 2px solid red;
+}
 .Back {
   position: absolute;
   top: 0;