<div class="menu">
    <div class="logo"></div>
    <ul>
        <li id="monitoring">
            <div style="position: relative;" onmouseover="openMenu(this)">
                <img class="bi bi-tv-fill" src="/static/image/tv-fill.svg">Monitoring
            </div>
            <ul class="sub-menu">
                <li onclick="linkEvent('processStatusMonitoring', this)">프로세스 상태모니터링</li>
            </ul>
        </li>
        <li id="report">
            <div onmouseover="openMenu(this)">
                <img class="bi bi-tv-fill" src="/static/image/report.png">보고서
            </div>
            <ul class="sub-menu">
                <li onclick="linkEvent('centerStat', this)">지역센터 제공/수집정보 이력</li>
                <li onclick="linkEvent('centerSendRcvCountStat', this)" style="border-bottom: 1px solid #eeeeee;">지역센터 일별 제공/수집 전송 이력</li>
<!--                <li onclick="linkEvent('sndMoctStat', this)" style="border-bottom: 1px solid #eeeeee;">민간 정보 제공이력</li>-->
                <li onclick="linkEvent('policeMoctTrafStat', this)" style="border-bottom: 1px solid #eeeeee;">국토부 민간교통정보 수집이력</li>
            </ul>
        </li>
        <li id="preference" style="margin-left: auto; margin-right: 10px;">
            <div onmouseover="openMenu(this)">
                <img class="bi bi-tv-fill" src="/static/image/gear-fill.svg">
            </div>
            <ul class="sub-menu right">
                <li onclick="linkEvent('confTrafficWeight', this)">수집원별 가중치값 설정</li>
            </ul>
        </li>
    </ul>
</div>
<script th:inline="javascript">

    function linkEvent(url, el) {
        url += '.do';
        const name = $(el).text();
        const option = "width = 1200, height = 900, top = 240, left = 340, location = no"
        window.open(url, name, option);
    }

    function openMenu() {

    }
</script>