File name
Commit message
Commit date
2023-05-06
2023-04-18
File name
Commit message
Commit date
File name
Commit message
Commit date
import React from "react";
import { useNavigate } from "react-router";
import { useSelector } from "react-redux";
import SidebarItem from "./SidebarItem.jsx";
import logo from "../../resources/files/images/logo.png";
import MenuIcon from "@mui/icons-material/Menu";
import CloseIcon from '@mui/icons-material/Close';
export default function Sidebar({items}) {
//전역 변수 저장 객체
const state = useSelector((state) => {return state});
const [menuToggle, setMenuToggle] = React.useState(false);
const onClickshow=()=>{
setMenuToggle(!menuToggle)
}
const navigate = useNavigate();
//로그아웃
const logout = () => {
fetch("/user/logout.json", {
method: "POST",
headers: {
'Content-Type': 'application/json; charset=UTF-8'
},
/* body: JSON.stringify({}), */
}).then((response) => response.json()).then((data) => {
console.log("로그아웃 결과 : ", data);
if (data == true) {
navigate('/');
} else {
alert('로그아웃 실패, 관리자에게 문의바랍니다.');
}
}).catch((error) => {
console.log('logout() /user/logout.json error : ', error);
});
};
const [iconIndex, setIconIndex] = React.useState(0);
const icons = [<MenuIcon sx={{ fontSize: 40, }}/>, <CloseIcon sx={{ fontSize: 40, }}/>];
const handleClick = () => {
setIconIndex((iconIndex + 1) % icons.length);
};
return (
<>
<nav className={menuToggle? "nav on" : "nav"}>
<div className="menuicon" onClick={() => {onClickshow(); handleClick();}}>
{icons[iconIndex]}
</div>
<h1 className="logo"><img src={logo} alt="" /></h1>
<div className="flex-align-column" style={{ marginTop: `3rem` }}>
<ul >
{
items != null ? (
items.map((item, index) => (
<SidebarItem key={index} item={item} />
))
) : null
}
</ul>
</div>
<div className="bottom-section flex-center" style={{width: '100%'}}>
{state.loginUser['authority'] == 'ROLE_ADMIN'
|| state.loginUser['authority'] == 'ROLE_GOVERNMENT'
|| state.loginUser['authority'] == 'ROLE_AGENCYADMIN'
|| state.loginUser['authority'] == 'ROLE_AGENCY' ?
<div className="info-id" >
<span onClick={() => {
navigate("/Join");
}}>계정추가</span>
</div>
: null}
<div className="logout" onClick={logout}><span>로그아웃</span></div>
</div>
</nav>
</>
);
}