diff --git a/sharedComponents/tabs/slider-tab.component.ts b/sharedComponents/tabs/slider-tab.component.ts index 2060ccf2..bea2540b 100644 --- a/sharedComponents/tabs/slider-tab.component.ts +++ b/sharedComponents/tabs/slider-tab.component.ts @@ -13,4 +13,6 @@ export class SliderTabComponent { public active: boolean = false; @Input() public disabled: boolean = false; + @Input() + public align: 'left' | 'right' = 'left'; } diff --git a/sharedComponents/tabs/slider-tabs.component.ts b/sharedComponents/tabs/slider-tabs.component.ts index 63257c9b..318d5802 100644 --- a/sharedComponents/tabs/slider-tabs.component.ts +++ b/sharedComponents/tabs/slider-tabs.component.ts @@ -27,13 +27,23 @@ declare var UIkit; [attr.uk-tab]="type === 'static'?('connect:' + connect):null" [ngClass]="'uk-flex-' + flexPosition"> -
  • +
  • + {{tab.title}} +
  • +
  • {{tab.title}}
  • -
  • - {{tab.title}} +
  • + {{tab.title}} +
  • +
  • + {{tab.title}}
  • @@ -126,7 +136,7 @@ export class SliderTabsComponent implements AfterViewInit, OnDestroy { let index = event.detail[0].index(); if (index !== this.activeIndex) { this.activeIndex = index; - this.router.navigate(['./'], {relativeTo: this.route, fragment: this.connect.replace('#', '')}); + this.router.navigate(['./'], {relativeTo: this.route, fragment: this.connect.replace('#', ''), queryParamsHandling: "merge"}); } })); } @@ -153,7 +163,8 @@ export class SliderTabsComponent implements AfterViewInit, OnDestroy { this.router.navigate(['./'], { fragment: entry.target.id, relativeTo: this.route, - state: {disableScroll: true} + state: {disableScroll: true}, + queryParamsHandling: 'merge' }); }, 200); } @@ -186,6 +197,14 @@ export class SliderTabsComponent implements AfterViewInit, OnDestroy { this.cdr.detectChanges(); } + get leftTabs(): SliderTabComponent[] { + return this.tabs.toArray().filter(tab => tab.align === 'left'); + } + + get rightTabs(): SliderTabComponent[] { + return this.tabs.toArray().filter(tab => tab.align === 'right'); + } + ngOnDestroy() { this.subscriptions.forEach(subscription => { if (subscription instanceof Subscription) {