feat(layouts): layouts + theme settings panel preview

This commit is contained in:
Dmitry Nehaychik 2017-07-28 14:54:29 +03:00
parent 6fe593295d
commit eef4d0633c
20 changed files with 636 additions and 19 deletions

View file

@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
import { NgaSidebarService, NgaMenuService } from '@akveo/nga-theme';
import { NgaMenuService, NgaSidebarService } from '@akveo/nga-theme';
import { NgaThemeService } from '@akveo/nga-theme/services/theme.service';
import { UserService } from '../../../@core/data/users.service';
@ -8,7 +8,7 @@ import { UserService } from '../../../@core/data/users.service';
selector: 'ngx-header',
styleUrls: ['./header.component.scss'],
template: `
<div class="left-container">
<div class="header-container" [class.left]="position === 'normal'" [class.right]="position === 'inverse'">
<a (click)="toggleSidebar()" href="#" class="navigation"><i class="ion-navicon"></i></a>
<div class="logo" (click)="goToHome()">NgX&nbsp;<span>Admin</span></div>
<div class="theme-buttons">
@ -18,19 +18,28 @@ import { UserService } from '../../../@core/data/users.service';
</div>
</div>
<nga-actions size="medium" class="right">
<nga-action><nga-search type="rotate-layout"></nga-search></nga-action>
<nga-action icon="ion-ios-email-outline"></nga-action>
<nga-action disabled icon="ion-ios-bell-outline"></nga-action>
<nga-actions
size="medium"
class="header-container"
[class.right]="position === 'normal'"
[class.left]="position === 'inverse'">
<nga-action icon="ion-ios-gear-outline" (click)="toggleSettings()"></nga-action>
<nga-action>
<nga-user [menu]="userMenu" [name]="user?.name" [picture]="user?.picture"></nga-user>
</nga-action>
<nga-action icon="ion-ios-gear-outline"></nga-action>
<nga-action disabled icon="ion-ios-bell-outline"></nga-action>
<nga-action icon="ion-ios-email-outline"></nga-action>
<nga-action>
<nga-search type="rotate-layout"></nga-search>
</nga-action>
</nga-actions>
`,
})
export class HeaderComponent implements OnInit {
@Input() position: string = 'normal';
user: any;
userMenu = [
@ -54,7 +63,12 @@ export class HeaderComponent implements OnInit {
}
toggleSidebar(): boolean {
this.sidebarService.toggle(true);
this.sidebarService.toggle(true, 'menu-sidebar');
return false;
}
toggleSettings(): boolean {
this.sidebarService.toggle(false, 'settings-sidebar');
return false;
}