[PDW-86] fix: 사이드바 관리 버튼 추가

PLADI-ALM · Nov 12, 2023 · ca3cdb4 · ca3cdb4
1 parent 10fc9c5
commit ca3cdb4
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 16 deletions.
diff --git a/src/App.css b/src/App.css
@@ -2,6 +2,6 @@
   text-align: center;
   height: 100vh;
   width: 100vw;
-  min-height: 700px;
+  min-height: 680px;
   display: flex;
 }
diff --git a/src/components/sidebar/MenuLineStyle.js b/src/components/sidebar/MenuLineStyle.js
@@ -3,7 +3,7 @@ import {Link} from "react-router-dom";
 
 export const InactiveMenuLine = styled(Link)`
   padding: 3px 20px;
-  margin-bottom: 13px;
+  margin-bottom: 10px;
   cursor: pointer;
   display: flex;
   align-items: center;

diff --git a/src/components/sidebar/Sidebar.js b/src/components/sidebar/Sidebar.js
@@ -45,13 +45,9 @@ const SubMenus = styled.div`
     display: ${props => props.active ? 'block' : 'none'}
 `
 
-const MyBox = styled.div`
-    margin-bottom: 20px;
-`
-
 const MyInfo = styled.div`
     padding: 3px 0;
-    margin: 0 20px 18px 20px;
+    margin: 0 0 10px 20px;
     width: fit-content;
     display: flex;
     align-items: center;
@@ -60,15 +56,21 @@ const MyInfo = styled.div`
     border-left: 5px solid white;
 `
 
+const ManageBtn = styled.div`
+  text-decoration: underline;
+  cursor: pointer;
+  margin-left: 10px;
+`
+
 const Logout = styled(MyInfo)`
     color: #A65959;
     cursor: pointer;
 `
 
 // 해당 상위 메뉴의 하위 메뉴 활성화 여부
 function useIsSubMenuActive(subMenuList) {
-    var currentPath = useLocation().pathname
-    for (var i = 0; i < subMenuList.length; i++) {
+    const currentPath = useLocation().pathname;
+    for (let i = 0; i < subMenuList.length; i++) {
         if (currentPath.startsWith(subMenuList[i].path))
             return true
     }
@@ -101,9 +103,8 @@ function Sidebar() {
     navigateToLogin()
 
     const [userName, setUserName] = useState("")
-    const [info, setInfo] = useState("")
 
-    // 이름, 직급
+    // 이름
     const getUserInfo = () => {
         UsersAxios.get("/position", {
             headers: {
@@ -112,7 +113,6 @@ function Sidebar() {
         })
             .then((response) => {
                 setUserName(response.data.data.name)
-                setInfo(response.data.data.position)
             })
             .catch((error) => {
                 basicError(error)
@@ -157,13 +157,13 @@ function Sidebar() {
 
             </div>
 
-            <MyBox>
+            <div>
                 {/* 사원 정보 */}
-                <MyInfo><Icon src={MyInfoIcon} />{userName} {info}</MyInfo>
+                <MyInfo><Icon src={MyInfoIcon} />{userName}<ManageBtn>관리</ManageBtn></MyInfo>
                 {/* 로그아웃 */}
                 <Logout onClick={logout}><Icon src={LogoutIcon} />로그아웃</Logout>
-            </MyBox>
-        </Container >
+            </div>
+        </Container>
     )
 }