<div class="sidebar-nav navbar-collapse" id="sidebar-area" style="height:100%;">
    <div class="login-user">
        <div class="profile-image">
            <i class="material-icons menu-icons ng-binding" ng-bind-template="person">person</i>
        </div>
        <div class="profile-name">
            <span>{{::loginUser | limitString:10}}</span>
            <span class="logout">
                <i class="material-icons logout-arrow">arrow_drop_down</i>
                <div style="width:100px;margin:5px auto;display: none; cursor: pointer; background-color: rgba(238, 238, 238, 0.38) !important; border-radius:5px;padding:3px;" ng-click="showChangePassword()">修改密码</div>
                <div translate="Logout" style="display: none; cursor: pointer; width: 100px; margin: 0 auto; background-color: rgba(238, 238, 238, 0.38) !important; border-radius: 5px; padding: 3px; " ng-click="logout()"></div>
            </span>
        </div>
    </div>
    <div class="login-user-below" style="height: 100%">
        <perfect-scrollbar class="scroller"
                           wheel-propagation="true"
                           wheel-speed="1"
                           min-scrollbar-length="20"
                           style="position: relative;height: calc(100% - 250px)!important;margin-top:15px;">
            <ul class="nav" id="sidebar">
                <li ng-repeat="menuItem in menuData" ng-include="'menuTree'">
                </li>
            </ul>
        </perfect-scrollbar>
    </div>

    <script type="text/ng-template" id="menuTree">
        <a class="dropdown-collapse" href="{{::menuItem.navigationUrl}}" title="{{::menuItem.name}}" ng-if="menuItem.isVisible">
            <div class="menu-number number-toggler">
                <i class="material-icons menu-icons" ng-if="isMenuClosed" ng-bind-template="{{::menuItem.iconClassName || menu}}"></i>
                <i class="material-icons menu-icons" ng-if="!isMenuClosed && !menuItem.parentID" ng-bind-template="{{::menuItem.iconClassName || menu}}"></i>
                <span ng-if="menuItem.parentID" style="visibility:hidden">{{::convertTo2BitNumber($index + 1)}}</span>
            </div>
            <span class="side-menu-title">{{::menuItem.name}}</span>
            <span class="fa arrow custom-arrow" ng-hide="menuItem.parentID||menuItem.navigationUrl!==''"></span>
        </a>
        <ul class="nav collapse" ng-if="menuItem.subMenus">
            <li ng-repeat="menuItem in menuItem.subMenus" ng-include="'menuTree'"></li>
        </ul>
    </script>
</div>