43 lines
1.6 KiB
TypeScript
43 lines
1.6 KiB
TypeScript
import {Component, OnDestroy, OnInit} from "@angular/core";
|
|
import {LayoutService, SidebarItem} from "../layout.service";
|
|
import {Subscription} from "rxjs";
|
|
|
|
@Component({
|
|
selector: 'sidebar-mobile-toggle',
|
|
template: `
|
|
<a *ngIf="activeSidebarItem" href="#sidebar_offcanvas" class="sidebar_mobile_toggle uk-link-reset uk-width-2-3 uk-flex uk-flex-middle" uk-toggle>
|
|
<div *ngIf="activeSidebarItem.icon && (activeSidebarItem.icon.svg || activeSidebarItem.icon.name)" class="uk-width-auto">
|
|
<icon class="menu-icon" [customClass]="activeSidebarItem.icon.class" [name]="activeSidebarItem.icon.name" ratio="0.9" [svg]="activeSidebarItem.icon.svg" [flex]="true"></icon>
|
|
</div>
|
|
<span class="uk-width-expand uk-text-truncate uk-margin-small-left uk-text-bolder">
|
|
{{activeSidebarItem.name}}
|
|
<span *ngIf="activeSidebarItem.subItem">- {{activeSidebarItem.subItem.name}}</span>
|
|
</span>
|
|
<div class="uk-width-auto uk-margin-small-left">
|
|
<icon name="arrow_drop_down" ratio="1.5" [flex]="true"></icon>
|
|
</div>
|
|
</a>
|
|
`
|
|
})
|
|
export class SidebarMobileToggleComponent implements OnInit, OnDestroy {
|
|
public activeSidebarItem: SidebarItem;
|
|
private subscriptions: any[] = [];
|
|
|
|
constructor(private layoutService: LayoutService) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
this.subscriptions.push(this.layoutService.activeSidebarItem.subscribe(activeSidebarItem => {
|
|
this.activeSidebarItem = activeSidebarItem;
|
|
}));
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
this.subscriptions.forEach(subscription => {
|
|
if(subscription instanceof Subscription) {
|
|
subscription.unsubscribe();
|
|
}
|
|
});
|
|
}
|
|
}
|