diff --git a/packages/desktop-ui/src/components/list/list.component.ts b/packages/desktop-ui/src/components/list/list.component.ts index 0a4b941a2..025154db8 100644 --- a/packages/desktop-ui/src/components/list/list.component.ts +++ b/packages/desktop-ui/src/components/list/list.component.ts @@ -23,7 +23,7 @@ import { Optional, Output, SimpleChanges, - SkipSelf + SkipSelf, } from '@angular/core'; import { ActivatedRoute, NavigationEnd, Router, UrlTree } from '@angular/router'; import { ngValueAccessor, ValueAccessorBase } from '../../core/form'; @@ -35,7 +35,7 @@ import { isRouteActive } from '../../core/utils'; selector: 'dui-list-title', template: ` `, - styleUrls: ['./list-title.component.scss'] + styleUrls: ['./list-title.component.scss'], }) export class ListTitleComponent { constructor() { @@ -54,7 +54,7 @@ export class ListTitleComponent { '[class.focusable]': 'focusable', '[class.delimiter-line]': 'delimiterLine !== false', }, - providers: [ngValueAccessor(ListComponent)] + providers: [ngValueAccessor(ListComponent)], }) @Injectable() export class ListComponent extends ValueAccessorBase { @@ -114,7 +114,7 @@ export class ListComponent extends ValueAccessorBase { if (event.key === 'ArrowUp') { event.preventDefault(); - const selectedItem = this.getSelectedItem() + const selectedItem = this.getSelectedItem(); if (selectedItem) { const items = this.getSortedList(); const position = items.indexOf(selectedItem); @@ -147,7 +147,7 @@ export class ListComponent extends ValueAccessorBase { '[attr.list-id]': 'list.id', '[attr.list-item-id]': 'id', }, - styleUrls: ['./list-item.component.scss'] + styleUrls: ['./list-item.component.scss'], }) export class ListItemComponent implements OnChanges, OnDestroy { static ids: number = 0; @@ -156,6 +156,7 @@ export class ListItemComponent implements OnChanges, OnDestroy { @Input() value: any; @Input() routerLink?: string | UrlTree | any[]; @Input() routerLinkExact?: boolean; + @Input() queryParams?: { [name: string]: any }; @Input() active?: boolean; /** @@ -173,7 +174,7 @@ export class ListItemComponent implements OnChanges, OnDestroy { public element: ElementRef, @SkipSelf() public cd: ChangeDetectorRef, @Optional() public router?: Router, - @Optional() activatedRoute?: ActivatedRoute + @Optional() activatedRoute?: ActivatedRoute, ) { this.element.nativeElement.removeAttribute('tabindex'); list.register(this); @@ -205,7 +206,7 @@ export class ListItemComponent implements OnChanges, OnDestroy { if ('string' === typeof this.routerLink) { await this.router.navigateByUrl(this.routerLink); } else if (Array.isArray(this.routerLink)) { - await this.router.navigate(this.routerLink); + await this.router.navigate(this.routerLink, { queryParams: this.queryParams }); } else { await this.router.navigateByUrl(this.router.serializeUrl(this.routerLink!)); } diff --git a/packages/desktop-ui/src/core/utils.ts b/packages/desktop-ui/src/core/utils.ts index 6781b7c78..a16fce3f4 100644 --- a/packages/desktop-ui/src/core/utils.ts +++ b/packages/desktop-ui/src/core/utils.ts @@ -211,13 +211,24 @@ export function focusWatcher(target: HTMLElement, allowedFocuses: HTMLElement[] }); } -export function isRouteActive(route: { routerLink?: string | UrlTree | any[]; routerLinkExact?: boolean; router?: Router, activatedRoute?: ActivatedRoute }): boolean { +interface RouteLike { + routerLink?: string | UrlTree | any[]; + routerLinkExact?: boolean; + router?: Router, + activatedRoute?: ActivatedRoute; + queryParams?: { [name: string]: any }; +} + +export function isRouteActive(route: RouteLike): boolean { if (!route.router) return false; if ('string' === typeof route.routerLink) { return route.router.isActive(route.routerLink, route.routerLinkExact === true); } else if (Array.isArray(route.routerLink)) { - return route.router.isActive(route.router.createUrlTree(route.routerLink, { relativeTo: route.activatedRoute }), route.routerLinkExact === true); + return route.router.isActive(route.router.createUrlTree(route.routerLink, { + queryParams: route.queryParams, + relativeTo: route.activatedRoute, + }), route.routerLinkExact === true); } else { return route.router.isActive(route.routerLink!, route.routerLinkExact === true); }