
File name
Commit message
Commit date
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>
</>
);
}