From f91f6d3a6aa5e267b6d46dd883d428827c42f6dc Mon Sep 17 00:00:00 2001
From: zzzzzuuuuu <agu0830@naver.com>
Date: Wed, 20 Sep 2023 22:43:19 +0900
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=EA=B4=80=EB=A6=AC=EC=9E=90=20?=
 =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Admin/AdminPage.js | 15 +++++++++++++++
 1 file changed, 15 insertions(+)
 create mode 100644 src/pages/Admin/AdminPage.js

diff --git a/src/pages/Admin/AdminPage.js b/src/pages/Admin/AdminPage.js
new file mode 100644
index 0000000..9f4364f
--- /dev/null
+++ b/src/pages/Admin/AdminPage.js
@@ -0,0 +1,15 @@
+import styled from 'styled-components';
+
+const AdminPage = () => {
+  return (
+    <>
+      <AdminPageBox>여기는 어드민 페이지 입니다. . . .</AdminPageBox>
+    </>
+  );
+};
+
+export default AdminPage;
+
+const AdminPageBox = styled.div`
+  width: 100%;
+`;

From aac21f887cee260b77e3a954ce4681a52f6c5ffb Mon Sep 17 00:00:00 2001
From: zzzzzuuuuu <agu0830@naver.com>
Date: Wed, 20 Sep 2023 22:44:39 +0900
Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=EA=B4=80=EB=A6=AC=EC=9E=90=20?=
 =?UTF-8?q?=EC=95=84=EC=9D=B4=EB=94=94=EB=A1=9C=20=EB=A1=9C=EA=B7=B8?=
 =?UTF-8?q?=EC=9D=B8=EC=8B=9C=20=ED=97=A4=EB=8D=94=EC=97=90=20=EA=B4=80?=
 =?UTF-8?q?=EB=A6=AC=EC=9E=90=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=9D=B4?=
 =?UTF-8?q?=EB=8F=99=20=EB=9C=A8=EB=8F=84=EB=A1=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.js               |  2 ++
 src/components/Header.js | 22 ++++++++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/src/App.js b/src/App.js
index 6f9c325..5ee4d7c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -13,6 +13,7 @@ import MyPageAccount from './pages/MyPage/MyPageAccount';
 import Complete from './pages/Education/Complete';
 import NotFound from './pages/Error/NotFound';
 import EmailVerification from './pages/Join/EmailVerification';
+import AdminPage from './pages/Admin/AdminPage';
 function App() {
   return (
     <ThemeProvider theme={Theme}>
@@ -20,6 +21,7 @@ function App() {
       <Header />
       <Routes>
         <Route path='/' element={<Main />} />
+        <Route path='/admin' element={<AdminPage />} />
         <Route path='/education' element={<EducationSelect />} />
         <Route path='/education/basic' element={<Game type='basic' />} />
         <Route path='/education/advanced' element={<Game type='advanced' />} />
diff --git a/src/components/Header.js b/src/components/Header.js
index 53d9471..cdabb9d 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -12,6 +12,7 @@ const Header = () => {
   const loginState = JSON.parse(sessionStorage.getItem('loginState'));
   const location = useLocation();
   const [nowPath, setNowPath] = useState('');
+  const [isAdmin, setIsAdmin] = useState(false);
 
   const onClickLogout = (data) => {
     if (confirm('로그아웃 하시겠습니까?')) {
@@ -34,6 +35,7 @@ const Header = () => {
     if (loginState) {
       GetUserInfo((res) => {
         setUserName(res.data.user.nickname);
+        console.log(res);
       });
     }
   }, []);
@@ -43,7 +45,14 @@ const Header = () => {
     console.log(nowPath);
   }, [location]);
 
+  useEffect(() => {
+    GetUserInfo((res) => {
+      if (res.data.user.role === 'ADMIN') setIsAdmin(true);
+    });
+  }, []);
+
   return (
+    // 관리자 아이디로 로그인 했을시 헤더에 따로 띄우기
     <>
       {nowPath === '/' ||
       nowPath === '/education' ||
@@ -60,6 +69,9 @@ const Header = () => {
           <Learning onClick={() => navigate('/education')}>학습하기</Learning>
           {loginState ? (
             <SignBox>
+              {isAdmin && (
+                <GoAdmin onClick={() => navigate('/admin')}>admin</GoAdmin>
+              )}
               <UserPageBtn onClick={() => navigate('/mypage/education')}>
                 {userName} 님 환영합니다!
               </UserPageBtn>
@@ -100,6 +112,7 @@ const SignBox = styled.div`
   margin-left: auto;
   margin-right: 67px;
   display: flex;
+  //justify-content: center;
 `;
 const SignBtn = styled.button`
   height: 27px;
@@ -132,3 +145,12 @@ const LogoIcon = styled.img`
   margin-left: 30px;
   cursor: pointer;
 `;
+
+const GoAdmin = styled.button`
+  width: 50px;
+  background: gold;
+  font-size: 15px;
+  font-weight: 700;
+  color: ${({ theme }) => theme.colors.RED};
+  padding-right: 20px;
+`;