import { Component , OnDestroy , OnInit , ViewChild , ViewEncapsulation , Input } from '@angular/core' ; import { NavigationEnd , Router } from '@angular/router' ; import { Subject } from 'rxjs' ; import { delay , filter , take , takeUntil } from 'rxjs/operators' ; import { FuseConfigService } from '@fuse/services/config.service' ; import { FuseNavigationService } from '@fuse/components/navigation/navigation.service' ; import { FusePerfectScrollbarDirective } from '@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.directive' ; import { FuseSidebarService } from '@fuse/components/sidebar/sidebar.service' ; @ Component ( { selector : 'navbar-vertical-style-2' , templateUrl : './style-2.component.html' , styleUrls : [ './style-2.component.scss' ] , encapsulation : ViewEncapsulation . None } ) export class NavbarVerticalStyle2Component implements OnInit , OnDestroy { fuseConfig : any ; navigation : any ; @ Input ( 'selectedAccount' ) selectedAccount : Account ; private _fusePerfectScrollbar : FusePerfectScrollbarDirective ; private _unsubscribeAll : Subject < any > ; param { FuseConfigService } _fuseConfigService param { FuseNavigationService } _fuseNavigationService param { FuseSidebarService } _fuseSidebarService param { Router } _router constructor ( private _fuseConfigService , private _fuseNavigationService , private _fuseSidebarService , private _router ) { this . _unsubscribeAll = new Subject ( ) ; } @ ViewChild ( FusePerfectScrollbarDirective , { static : true } ) set directive ( theDirective ) { if ( ! theDirective ) { return ; } this . _fusePerfectScrollbar = theDirective ; this . _fuseNavigationService . onItemCollapseToggled . pipe ( delay ( 500 ) , takeUntil ( this . _unsubscribeAll ) ) . subscribe ( ( ) => { this . _fusePerfectScrollbar . update ( ) ; } ) ; this . _router . events . pipe ( filter ( ( event ) => event instanceof NavigationEnd ) , take ( 1 ) ) . subscribe ( ( ) => { setTimeout ( ( ) => { const activeNavItem = document . querySelector ( 'navbar .nav-link.active' ) ; if ( activeNavItem ) { const activeItemOffsetTop = activeNavItem . offsetTop , activeItemOffsetParentTop = activeNavItem . offsetParent . offsetTop , scrollDistance = activeItemOffsetTop - activeItemOffsetParentTop - ( 48 * 3 ) ; this . _fusePerfectScrollbar . scrollToTop ( scrollDistance ) ; } } ) ; } ) ; } /**
     * On init
     */ ngOnInit ( ) { this . _router . events . pipe ( filter ( ( event ) => event instanceof NavigationEnd ) , takeUntil ( this . _unsubscribeAll ) ) . subscribe ( ( ) => { if ( this . _fuseSidebarService . getSidebar ( 'navbar' ) ) { this . _fuseSidebarService . getSidebar ( 'navbar' ) . close ( ) ; } } ) ; this . _fuseNavigationService . onNavigationChanged . pipe ( filter ( value => value !== null ) , takeUntil ( this . _unsubscribeAll ) ) . subscribe ( ( ) => { this . navigation = this . _fuseNavigationService . getCurrentNavigation ( ) ; } ) ; this . _fuseConfigService . config . pipe ( takeUntil ( this . _unsubscribeAll ) ) . subscribe ( ( config ) => { this . fuseConfig = config ; } ) ; } /**
     * On destroy
     */ ngOnDestroy ( ) { this . _unsubscribeAll . next ( ) ; this . _unsubscribeAll . complete ( ) ; } /**
     * Toggle sidebar opened status
     */ toggleSidebarOpened ( ) { this . _fuseSidebarService . getSidebar ( 'navbar' ) . toggleOpen ( ) ; } /**
     * Toggle sidebar folded status
     */ toggleSidebarFolded ( ) { this . _fuseSidebarService . getSidebar ( 'navbar' ) . toggleFold ( ) ; } }