71 lines
2.2 KiB
HTML
71 lines
2.2 KiB
HTML
<nz-layout class="app-layout">
|
|
<nz-sider
|
|
class="menu-sidebar"
|
|
nzCollapsible
|
|
nzBreakpoint="md"
|
|
[nzCollapsed]="isCollapsed()"
|
|
(nzCollapsedChange)="isCollapsed.set($event)"
|
|
[nzWidth]="240"
|
|
[nzCollapsedWidth]="80"
|
|
>
|
|
<div class="sidebar-logo">
|
|
<img src="/logo.png" alt="SCN" class="sidebar-logo-img" />
|
|
@if (!isCollapsed()) {
|
|
<span>SimpleCloudNotifier</span>
|
|
}
|
|
</div>
|
|
<ul nz-menu nzTheme="dark" nzMode="inline" [nzInlineCollapsed]="isCollapsed()">
|
|
<li nz-menu-item nzMatchRouter routerLink="/messages">
|
|
<span nz-icon nzType="mail"></span>
|
|
<span>Messages</span>
|
|
</li>
|
|
<li nz-menu-item nzMatchRouter routerLink="/channels">
|
|
<span nz-icon nzType="send"></span>
|
|
<span>Channels</span>
|
|
</li>
|
|
<li nz-menu-item nzMatchRouter routerLink="/subscriptions">
|
|
<span nz-icon nzType="link"></span>
|
|
<span>Subscriptions</span>
|
|
</li>
|
|
<li nz-menu-item nzMatchRouter routerLink="/keys">
|
|
<span nz-icon nzType="key"></span>
|
|
<span>Keys</span>
|
|
</li>
|
|
<li nz-menu-item nzMatchRouter routerLink="/clients">
|
|
<span nz-icon nzType="desktop"></span>
|
|
<span>Clients</span>
|
|
</li>
|
|
<li nz-menu-item nzMatchRouter routerLink="/senders">
|
|
<span nz-icon nzType="team"></span>
|
|
<span>Senders</span>
|
|
</li>
|
|
<li nz-menu-item nzMatchRouter routerLink="/account">
|
|
<span nz-icon nzType="user"></span>
|
|
<span>Account</span>
|
|
</li>
|
|
</ul>
|
|
</nz-sider>
|
|
<nz-layout>
|
|
<nz-header class="app-header">
|
|
<div class="header-left">
|
|
<span
|
|
class="header-trigger"
|
|
(click)="toggleCollapsed()"
|
|
>
|
|
<span nz-icon [nzType]="isCollapsed() ? 'menu-unfold' : 'menu-fold'"></span>
|
|
</span>
|
|
</div>
|
|
<div class="header-right">
|
|
<span class="user-id mono">{{ userId }}</span>
|
|
<button nz-button nzType="text" nzDanger (click)="logout()">
|
|
<span nz-icon nzType="logout"></span>
|
|
Logout
|
|
</button>
|
|
</div>
|
|
</nz-header>
|
|
<nz-content class="content-area">
|
|
<router-outlet></router-outlet>
|
|
</nz-content>
|
|
</nz-layout>
|
|
</nz-layout>
|