hai-oil-web/src/app/pages/body/index/index.component.html

81 lines
2.6 KiB

11 months ago
<nz-layout>
<nz-header>
<div nz-row>
<!-- logo-->
<div class="logo" nz-col nzSpan="4">
<h2>普惠GO管理平台</h2>
</div>
<!-- 一级菜单-->
<div class="menu" nz-col nzSpan="16">
<ul>
<li *ngFor="let item of firstMenuData" [ngClass]="{'li-selected' : item.selected}" (click)="isSelected(item)">{{item.title}}</li>
</ul>
</div>
<div nz-col nzSpan="4">col-8</div>
</div>
</nz-header>
<nz-content class="inner-content">
<!-- 侧边导航栏-->
<div [@openClose]="isCollapse ? 'open' : 'closed'" class="side_menu">
<div class="side_menu_top" (click)="isCollapse = false">
<div class="side_menu_top_icon">
<span nz-icon nzType="menu-fold" nzTheme="outline"></span>
</div>
<span style="font-size: 14px;">收起</span>
</div>
<!-- 菜单内容-->
<div class="side_menu_content">
<ul nz-menu nzMode="inline">
<li nz-submenu nzTitle="Navigation One" nzIcon="mail" nzOpen>
<ul>
<li nz-menu-group nzTitle="Item 1">
<ul>
<li nz-menu-item nzSelected>Option 1</li>
<li nz-menu-item>Option 2</li>
</ul>
</li>
<li nz-menu-group nzTitle="Item 2">
<ul>
<li nz-menu-item>Option 3</li>
<li nz-menu-item>Option 4</li>
</ul>
</li>
</ul>
</li>
<li nz-submenu nzTitle="Navigation Two" nzIcon="appstore">
<ul>
<li nz-menu-item>Option 5</li>
<li nz-menu-item>Option 6</li>
<li nz-submenu nzTitle="Submenu">
<ul>
<li nz-menu-item>Option 7</li>
<li nz-menu-item>Option 8</li>
<li nz-submenu nzTitle="Submenu">
<ul>
<li nz-menu-item>Option 9</li>
<li nz-menu-item>Option 10</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li nz-submenu nzTitle="Navigation Three" nzIcon="setting">
<ul>
<li nz-menu-item>Option 11</li>
<li nz-menu-item>Option 12</li>
<li nz-menu-item>Option 13</li>
</ul>
</li>
</ul>
</div>
</div>
<!-- 主体内容-->
<div class="content" [ngClass]="{'content-width' : isCollapse}">
<app-tab></app-tab>
</div>
</nz-content>
</nz-layout>