File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/**
* @author : 최정우
* @since : 2022.09.20
* @dscription : React를 활용한 Client단 구현 대상인 Application의 시작점(Index) Component 입니다.
*/
import React from "react";
import { useSelector, useDispatch } from "react-redux";
import { useLocation, /* useNavigate */ } from "react-router";
//Application의 전역 상태값(변수) 저장소(Store) 관리 Component
import { setLoginUser } from "./AppStore.jsx";
//Application의 Route 정보를 관리하는 Component
import {AdminApp, GovernmentApp, AgencyApp, GuardianApp} from "./AppRoute.jsx";
//Test Layout
import Header from "../layout/Header.jsx";
import Menu from "../layout/Menu.jsx";
import Login from "./login/Login.jsx";
import Weather from "./main/Weather.jsx";
function App() {
const location = useLocation();
//const navigate = useNavigate();
//전역 변수 저장 객체
const state = useSelector((state) => {return state});
const dispatch = useDispatch();
//로그인 여부
const [isLogin, setIsLogin] = React.useState(false);
//로그인에 따라 각기 다른 App 주입 대상 변수(AdminApp, GovernmentApp, AgencyApp, GuardianApp)
const [appRoute, setAppRoute] = React.useState(null);
const [menuItems, setMenuItems] = React.useState(null);
//로그인 사용자 조회
const loginUserSelectOne = (clientLoginCheck) => {
fetch("/user/loginUserSelectOne.json", {
method: "POST",
headers: {
'Content-Type': 'application/json; charset=UTF-8'
},
body: JSON.stringify({}),
}).then((response) => response.json()).then((data) => {
console.log("로그인 결과 : ", data);
//로그인 사용자 정보 전역 변수에 저장
dispatch(setLoginUser(data));
//클라이언트 로그인 체크 (콜백)
clientLoginCheck(data);
}).catch((error) => {
console.log('login() /user/loginUserSelectOne.json error : ', error);
});
};
//URL 변경 시, 발생 이벤트(hook)
React.useEffect(() => {
loginUserSelectOne((loginResultData) => {
//console.log('loginResultData : ', loginResultData);
//console.log('isLogin : ', isLogin, ', authority : ', loginResultData['authority']);
//로그인 유무(로그인 정보가 있으면 True, 없으면 False)
let isLogin = (loginResultData != null && loginResultData['user_id'] != null);
setIsLogin(isLogin);
//로그인 -> 권한에 따른 App 주입
if (isLogin == true) {
if (loginResultData['authority'] == 'ROLE_ADMIN') {
setMenuItems(AdminApp.menuItems);
setAppRoute(<AdminApp.AppRoute/>);
} else if (loginResultData['authority'] == 'ROLE_GOVERNMENT') {
setMenuItems(GovernmentApp.menuItems);
setAppRoute(<GovernmentApp.AppRoute/>);
} else if (loginResultData['authority'] == 'ROLE_AGENCY') {
setMenuItems(AgencyApp.menuItems);
setAppRoute(<AgencyApp.AppRoute/>);
} else if (loginResultData['authority'] == 'ROLE_GUARDIAN') {
setMenuItems(GuardianApp.menuItems);
setAppRoute(<GuardianApp.AppRoute/>);
} else {
alert('권한 관련 에러 - 관리자에게 문의바랍니다.');
console.log('권한 관련 에러 - 관리자에게 문의바랍니다 : ', loginResultData);
}
}
});
}, [location]);
return (
<div id="App">
{isLogin == true ? (
<div id="layout">
<Header/>
<Menu items={menuItems != null ? menuItems : null}/>
<div id="pages">
{appRoute != null ? appRoute : null}
</div>
</div>
) : (<Login/>)}
</div>
);
}
export default App;