<ul class="nav metismenu"
    id="side-menu">
    <li class="nav-header">
        <div class="dropdown profile-element">
            <img src="assets/img/pb-icon-small-white.png"
                 style="width: 32px;"
                 class="img-fluid" />
            <span style="font-weight:bold; color: white">Manager | ProBuddy</span>
        </div>
        <!--
        <div class="dropdown profile-element">
            <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                <span class="block m-t-xs font-bold">Example user</span>
                <span class="text-muted text-xs block">menu <b class="caret"></b></span>
            </a>
            <ul class="dropdown-menu animated fadeInRight m-t-xs">
                <li><a class="dropdown-item" href="login.html">Logout</a></li>
            </ul>
        </div>
        -->
        <div class="logo-element">
            <img src="assets/img/pb-icon-small-white.png" style="width: 28px; max-width: 28px;" class="img-fluid" />
        </div>
    </li>
    <li class="nav-menu-section md-skin navbar-static-top">
        GRUPPE
    </li>
    <li class="active"
        f-menu-id="dashboard">
        <a href="#/dashboard/<%= user.activeGroupId %>">
            <i class="fa fa-tachometer"></i> <span class="nav-label">Dashboard</span></a>
    </li>
    <li f-menu-id="member-list">
        <a href="#/members/<%= user.activeGroupId %>">
            <i class="fa fa-users"></i> <span class="nav-label">Mitglieder</span>
        </a>
    </li>
    <li f-menu-id="appointment-list">
        <a href="#/appointments/<%= user.activeGroupId %>">
            <i class="fa fa-calendar-o"></i> <span class="nav-label">Termine</span>
        </a>
    </li>
    <li class="nav-menu-section md-skin navbar-static-top">
        ERWEITERUNGEN
    </li>
    <% if ( user && user.activeGroupId == 10 ) {    %>
    <li f-menu-type="folder">
        <a aria-expanded="true">
            <i class="fa fa-clock-o"></i> <span class="nav-label">Zeiterfassung</span>
        </a>
        <ul class="nav nav-second-level collapse" aria-expanded="true">
            <li f-menu-id="kk-special-employee-list">
                <a href="#/kkspecial/employee-list/<%= user.activeGroupId %>">
                    <span class="nav-label">Mitarbeiter</span>
                </a>
            </li>
            <li f-menu-id="specialkk-hour-allocation">
                <a href="#/kkspecial/hour-allocation/<%= user.activeGroupId %>/0/0">
                    <span class="nav-label">Stundenverrechnung</span>
                </a>
            </li>
            <li f-menu-id="specialkk-hour-reporting">
                <a href="#/kkspecial/hour-reporting/<%= user.activeGroupId %>/0/0">
                    <span class="nav-label">Auswertung</span>
                </a>
            </li>
        </ul>
    </li>
    <% }    %>
    <% if ( user && user.canAccessContractExtension() ) {   %>
    <li f-menu-type="folder">
        <a aria-expanded="true">
            <i class="fa fa-file-text-o"></i> <span class="nav-label">Vertragsverwaltung</span>
        </a>
        <ul class="nav nav-second-level collapse" aria-expanded="true">
            <li f-menu-id="contract-overview">
                <a href="#/contract/overview/<%= user.activeGroupId %>">
                    <span class="nav-label">Übersicht</span>
                </a>
            </li>
            <li f-menu-id="contract-list">
                <a href="#/contract/list/<%= user.activeGroupId %>">
                    <span class="nav-label">Verträge</span>
                </a>
            </li>
            <li f-menu-id="contract-charging">
                <a href="#/contract/charging/<%= user.activeGroupId %>">
                    <span class="nav-label">Verrechnung</span>
                </a>
            </li>
            <li f-menu-id="contract-claim">
                <a href="#/contract/claim/<%= user.activeGroupId %>">
                    <span class="nav-label">Forderungen</span>
                </a>
            </li>
            <li f-menu-id="contract-archive">
                <a href="#/contract/archive/<%= user.activeGroupId %>">
                    <span class="nav-label">Archiv</span>
                </a>
            </li>
            <li f-menu-id="contract-master-data">
                <a href="#/contract/master-data/<%= user.activeGroupId %>">
                    <span class="nav-label">Stammdaten</span>
                </a>
            </li>
            <li>
                <a href="#/contract/create/<%= user.activeGroupId %>">
                    <span class="btn btn-primary">Vertrag anlegen</span>
                </a>
            </li>
        </ul>
    </li>
    <% } else { %>
        <li f-menu-id="contract-commercial">
            <a href="#/contract/commercial/<%= user.activeGroupId %>"
               aria-expanded="true">
                <i class="fa fa-file-text-o"></i> <span class="nav-label">Vertragsverwaltung</span>
            </a>
        </li>
    <% }    %>
    <li class="nav-menu-section md-skin navbar-static-top">
        EINSTELLUNGEN
    </li>
    <li f-menu-id="settings-access">
        <a href="#/settings/access/<%= user.activeGroupId %>">
            <i class="fa fa-user-secret"></i> <span class="nav-label">Zugriffsliste</span>
        </a>
    </li>
    <li f-menu-id="corona-special">
        <a href="#/corona/special/<%= user.activeGroupId %>">
            <i class="fa fa-exclamation-triangle"></i> <span class="nav-label">Corona Spezial</span>
        </a>
    </li>

    <!--
    <li f-menu-id="">
        <a href="">
            <i class="fa fa-folder-open-o"></i> <span class="nav-label">Kategorien</span>
        </a>
    </li>
    <li f-menu-id="">
        <a href="">
            <i class="fa fa-commenting-o"></i> <span class="nav-label">Kommunikation</span>
        </a>
    </li>
    <li f-menu-id="">
        <a href="">
            <i class="fa fa-eur"></i> <span class="nav-label">Rechnungen</span>
        </a>
    </li>
    <li f-menu-id="">
        <a href="">
            <i class="fa fa-line-chart"></i> <span class="nav-label">Statistik</span>
        </a>
    </li>
    <li f-menu-id="">
        <a href="">
            <i class="fa fa-cogs"></i> <span class="nav-label">CI & Design</span>
        </a>
    </li>
    -->
    <!--
    <li class="nav-menu-section md-skin navbar-static-top">
        EINSTELLUNGEN
    </li>
    <li data-menu-id="adminUser">
        <a href="#/settings">
            <i class="fa fa-cogs"></i> <span class="nav-label">Gruppendetails</span>
        </a>
    </li>
    -->
</ul>