1- import { Component , Input , OnInit } from '@angular/core' ;
1+ import { AfterViewInit , Component , ElementRef , Input , OnDestroy , OnInit } from '@angular/core' ;
2+ import { NavigationEnd , Router } from '@angular/router' ;
23import { cloneDeep } from 'lodash-es' ;
4+ import { Subject } from 'rxjs' ;
5+ import { filter , takeUntil } from 'rxjs/operators' ;
36import { DevuiCommonsService } from '../devui-commons.service' ;
47
58@Component ( {
69 selector : 'd-sidebar' ,
710 templateUrl : './sidebar.component.html' ,
811 styleUrls : [ './sidebar.component.scss' ]
912} )
10- export class SidebarComponent implements OnInit {
13+ export class SidebarComponent implements OnInit , AfterViewInit , OnDestroy {
1114 @Input ( ) sideMenuList ;
1215 @Input ( ) linkType = 'routerLink' ;
1316 @Input ( ) text = {
1417 new : 'New' ,
1518 sunset : 'Sunset'
1619 } ;
1720 _navData ;
21+ private _currentUrl : string = '' ;
22+ private destroy$ : Subject < void > = new Subject ( ) ;
1823 componentsDataDisplay ;
1924
2025 @Input ( ) set navData ( data ) {
@@ -26,14 +31,40 @@ export class SidebarComponent implements OnInit {
2631 return this . _navData ;
2732 }
2833
29- constructor ( private commonsService : DevuiCommonsService ) { }
34+ constructor ( private commonsService : DevuiCommonsService , private router : Router , private ele : ElementRef ) { }
3035
3136 ngOnInit ( ) : void {
37+ this . _currentUrl = this . router . url ;
3238 this . commonsService . on < any > ( 'searchEvent' ) . subscribe ( term => {
3339 this . filterData ( term ) ;
3440 } ) ;
3541 }
3642
43+ ngAfterViewInit ( ) : void {
44+ this . router . events
45+ . pipe (
46+ filter ( ( event ) => event instanceof NavigationEnd ) ,
47+ takeUntil ( this . destroy$ )
48+ )
49+ . subscribe ( ( event ) => {
50+ const destUrl = ( event as NavigationEnd ) . urlAfterRedirects ;
51+ if ( this . _currentUrl . endsWith ( 'overview' ) ) {
52+ setTimeout ( ( ) => {
53+ const activeItem : HTMLElement = this . ele . nativeElement . querySelector ( '.devui-router-active' ) ;
54+ if ( activeItem ) {
55+ activeItem . scrollIntoView ( { block : 'center' } ) ;
56+ }
57+ } ) ;
58+ }
59+ this . _currentUrl = destUrl ;
60+ } ) ;
61+ }
62+
63+ ngOnDestroy ( ) : void {
64+ this . destroy$ . next ( ) ;
65+ this . destroy$ . complete ( ) ;
66+ }
67+
3768 filterData ( event ) : void {
3869 this . componentsDataDisplay = cloneDeep ( this . navData ) . filter ( catalog => {
3970 catalog . children = catalog . children . filter ( item => {
0 commit comments