kcscDev/egovframe-template-simple-r.../src/pages/admin/config/MenuAuthMgt.jsx

157 lines
6.3 KiB
JavaScript

import React, {useCallback, useEffect, useState} from 'react';
import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
import {Link} from "react-router-dom";
import URL from "constants/url";
import * as EgovNet from "api/egovFetch";
import Form from "react-bootstrap/Form";
import CODE from "../../../constants/code";
function MenuAuthMgt(props) {
const [listTag, setListTag] = useState([]);
const [roleHeader, setRoleHeader] = useState([]);
const retrieveList = useCallback(() => {
EgovNet.requestFetch(
'/admin/config/menu-auth-mgt',
{
method: "GET"
},
(resp) => {
const menuList = resp.result.menuList;
const roleList = resp.result.roleList
let mutListTag = [];
let headerTag = [];
setListTag([]);
setRoleHeader([]);
// 리스트 항목 구성
menuList.forEach(function (item, index) {
const checkboxs = [];
roleList.forEach(function (role) {
checkboxs.push(
<div className={"checkboxDiv"}>
{role.itemCd === "ROLE_001"?
(<Form.Check className={role.itemCd} value={role.itemCd}
defaultChecked={item.menuAuth.includes(role.itemCd)} disabled={true} />)
:
(<Form.Check className={role.itemCd} value={role.itemCd}
onClick={(e)=>{
const checked = e.target.checked;
if(checked) {
item.menuAuth += ","+role.itemCd
}else{
item.menuAuth = item.menuAuth.replace(role.itemCd, '');
if(item.menuAuth.startsWith(",")) {
item.menuAuth.replace(",", "")
}
}
}}
defaultChecked={item.menuAuth.includes(role.itemCd)} />)
}
</div>
)
/*if(item.menuGroup){
}else{
checkboxs.push(
<div className={"checkboxDiv"}></div>
)
}*/
});
mutListTag.push(
<div className={"list_item"} key={"userListDiv_"+index}>
<div>{item.menuGroup?'└ ':''}{item.menuId}</div>
<div>{item.menuTitle}</div>
{checkboxs}
<div className={"saveBtnDiv"}>
<button className={"btn btn_blue_h31 px-1"} onClick={()=>{editMenu(item)}}>저장</button>
</div>
</div>
);
});
if(!mutListTag.length) mutListTag.push(<p className="no_data" key="0">검색된 결과가 없습니다.</p>); // 게시판 목록 초기값
roleList.forEach(function (item, index) {
headerTag.push(<span className={"checkboxDiv"}>{item.itemNm}</span>)
});
setListTag(mutListTag);
setRoleHeader(headerTag)
},
function (resp) {
console.log("err response : ", resp);
}
);
},[]);
function editMenu(menu){
EgovNet.requestFetch(
'/admin/config/menu-auth-mgt',
{
method: "PUT",
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(menu)
},
(resp) => {
if (Number(resp.resultCode) === Number(CODE.RCV_SUCCESS)) {
alert("수정되었습니다.")
} else if (Number(resp.resultCode) === Number(CODE.RCV_ERROR_AUTH)) {
console.log("토큰 갱신중.")
} else {
alert(resp.result.resultMessage)
}
}
)
}
useEffect(()=>{
retrieveList();
}, [])
return (
<div className="container">
<div className="c_wrap">
<div className="location">
<ul>
<li><Link to={URL.MAIN} className="home">Home</Link></li>
<li>사이트관리</li>
<li>환경설정</li>
<li><Link to={URL.ADMIN_MENU_AUTH}>메뉴 권한 관리</Link></li>
</ul>
</div>
<div className="layout">
{/* <!-- Navigation --> */}
<EgovLeftNav/>
<div className="contents NOTICE_LIST" id="contents">
{/* <!-- 본문 --> */}
<div className="top_tit">
<h1 className="tit_1">메뉴 권한 관리</h1>
</div>
<h2 className="tit_2"></h2>
<div className="board_list roleList">
<div className="head">
<span>메뉴 코드</span>
<span>메뉴 이름</span>
{roleHeader}
<span className={"saveBtnDiv"}></span>
</div>
<div className="result">
{listTag}
</div>
</div>
</div>
</div>
</div>
</div>
);
}
export default MenuAuthMgt;