bookshelfplus/bookshelfplus-frontend/views/dashboard/component/navbar.html

<div class="navbar">
    <div class="navbar-grid">
        <div class="grid-item"></div>
        <div class="grid-item" style="grid-column-start: span 2;">
            <h1 style="display: inline; vertical-align: middle; margin-right: 20px; cursor: pointer;"
                onclick="location.href='/';">
                书栖网
            </h1>
            <% Object.keys(dashboardPage).forEach(item => { %>
                <a href="./<%= item %>" style="vertical-align: middle;"><%= dashboardPage[item].title %></a>
            <% }); %>
            <a href="javascript:logout();" style="color: grey; vertical-align: middle; float: right;">退出登录</a>
        </div>
        <div class="grid-item"></div>
    </div>
</div>
<script>
    function logout() {
        postRequest("/user/logout", { token: localStorageUtils.getToken() })
            .then(function (response) {
                var axiosData = response.data;
                var status = axiosData.status;
                var data = axiosData.data;

                if (status === "success") {
                    console.log(data);
                    if (data) {
                        localStorageUtils.userLogout();
                        location.href = "/login";
                    } else {
                        alert("退出登录失败");
                    }
                } else {
                    alert(`出错啦！${data.errMsg} (错误码: ${data.errCode}) `);
                }
            })
            .catch(function (error) {
                console.log(error);
                var choice = confirm("服务器连接失败，无法正常退出登录，是否要强行退出登录？");
                if(choice) {
                    localStorageUtils.userLogout();
                    location.href = "/login";
                }
            });
    }
</script>
<script>
    // 导航栏中突出当前页面
    var group = '<%= group %>';
    var page = '<%= page %>';
    console.log(group, page);
    // document.getElementsByTagName("a").asArray().forEach(element => {
    $("a").toArray().forEach(element => {
        var linkRoute = element.href.split('/').filter(s=>!!s);
        if(linkRoute.length > 2) {
            var linkGroup = linkRoute[linkRoute.length-2];
            var linkPage = linkRoute[linkRoute.length-1];
            // console.log(element, linkGroup, linkPage);
            if(page == linkPage) {
                $(element).addClass("active");
            }
        }
    });
</script>