import React, {useRef} from 'react';
import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
import {Link} from "react-router-dom";
import URL from "../../../constants/url";
import ParentCodeDiv from "./baseCode/ParentCodeDiv";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import ChildCodeDiv from "./baseCode/ChildCodeDiv";


function BaseCodeMgt(props) {

    // ParentCodeDiv에서 ChildCodeDiv로 함수 호출 참고자료
    // https://velog.io/@hssarah/React%EC%97%90%EC%84%9C-%EB%8B%A4%EB%A5%B8-Function-Component%EC%97%90-%EC%9E%88%EB%8A%94-%ED%95%A8%EC%88%98-%ED%98%B8%EC%B6%9C-React-Calling-Function-From-Another-Function-Component

    const childRef = useRef(null);
    function getCodeItem(grpCd){
        childRef.current.getCodeItemList(grpCd);
    }
    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_BASE_CODE}>기본 코드 관리</Link></li>
                    </ul>
                </div>
                <div className="layout">
                    {/* <!-- Navigation --> */}
                    <EgovLeftNav activeKey={"0"}></EgovLeftNav>
                    <div className="contents NOTICE_LIST" id="contents">
                        {/* <!-- 본문 --> */}

                        <div className="top_tit">
                            <h1 className="tit_1">기본 코드 관리</h1>
                        </div>

                        <Row>
                            <Col xs={"6"}>
                                <ParentCodeDiv getCodeItem={getCodeItem}/>
                            </Col>
                            <Col xs={"6"}>
                                <ChildCodeDiv ref={childRef}/>
                            </Col>
                        </Row>
                    </div>
                </div>
            </div>
        </div>
    );
}

export default BaseCodeMgt;