diff options
2 files changed, 20 insertions, 6 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html index c65d08e77..494256eea 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.html @@ -9,10 +9,10 @@ </li> <li *ngFor="let tag of viewedTags"> <div class="custom-control custom-checkbox"> - <input type="checkbox" (click)="reloadPackages($event)" class="custom-control-input" id={{tag}}> + <input type="checkbox" (click)="reloadPackages($event)" class="custom-control-input" id={{tag}} #checkboxes> <label class="custom-control-label" for={{tag}}>{{tag}}</label> </div> </li> - <li class="reset-filter"><a href="">Reset filter</a></li> + <li class="reset-filter"><a (click)="resetFilter()">Reset filter</a></li> </ul> </div> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts index 228b6d6ab..0555fd5ab 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/filter-by-tags/filter-by-tags.component.ts @@ -19,9 +19,9 @@ limitations under the License. ============LICENSE_END============================================ */ -import { Component, OnDestroy, OnInit } from '@angular/core'; -import { PackagesStore } from '../../packages.store'; -import { BlueprintModel, BluePrintPage } from '../../model/BluePrint.model'; +import {Component, ElementRef, OnInit, QueryList, ViewChildren} from '@angular/core'; +import {PackagesStore} from '../../packages.store'; +import {BlueprintModel, BluePrintPage} from '../../model/BluePrint.model'; @Component({ selector: 'app-filter-by-tags', @@ -38,9 +38,14 @@ export class TagsFilteringComponent implements OnInit { viewedPackages: BlueprintModel[] = []; checkBoxTages = ''; currentPage = 0; + @ViewChildren('checkboxes') checkboxes: QueryList<ElementRef>; constructor(private packagesStore: PackagesStore, ) { + this.refreshTags(); + } + + private refreshTags() { this.packagesStore.state$.subscribe(state => { console.log(state); if (state.page) { @@ -55,7 +60,7 @@ export class TagsFilteringComponent implements OnInit { this.tags.push(tag.trim()); }); this.tags.push('All'); - this.tags = this.tags.filter((value, index, self) => self.indexOf(value) === index); + this.tags = this.tags.filter((value, index, self) => self.indexOf(value) === index && value); this.assignTags(); }); } @@ -82,6 +87,8 @@ export class TagsFilteringComponent implements OnInit { this.viewedTags = this.tags.filter( item => item.toLowerCase().indexOf(value.toLowerCase()) > -1 ); + + } reloadPackages(event: any) { @@ -98,8 +105,15 @@ export class TagsFilteringComponent implements OnInit { }).map((item) => { return item.trim(); }); + this.packagesStore.filterByTags(tagsSelected); } + resetFilter() { + this.checkBoxTages = ''; + this.checkboxes.forEach((element) => { + element.nativeElement.checked = false; + }); + } } |