sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-31 09:37:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merged PR 701: #1850 Default Filter Active Button Styling

Browse Source 
#1850 Default Filter Active Button Styling
This commit is contained in:
Nino Righi
2021-06-09 12:31:01 +00:00
committed by Lorenz Hilpert
parent 7dcb279a6b
commit d7c65efdc4
3 changed files with 14 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/page/task-calendar/src/lib/page-task-calendar.component.html
View File

@@ -1,6 +1,6 @@
<shell-breadcrumb key="task-calendar"></shell-breadcrumb>
<button class="filter" (click)="filterActive$.next(true)">
<button class="filter" [class.active]="hasFilter$ | async" (click)="filterActive$.next(true)">
<ui-icon size="20px" icon="filter_alit"></ui-icon>
<span class="label">Filter</span>
</button>

2
apps/page/task-calendar/src/lib/page-task-calendar.component.scss
View File

@@ -15,7 +15,7 @@ shell-breadcrumb {
}
&.active {
@apply bg-dark-cerulean text-white ml-px-5;
@apply bg-active-branch text-white ml-px-5;
}
}

13
apps/page/task-calendar/src/lib/page-task-calendar.component.ts
View File

@@ -1,7 +1,8 @@
import { Component, OnInit } from '@angular/core';
import { BreadcrumbService } from '@core/breadcrumb';
import { isSelectFilter } from 'apps/ui/filter/src/lib/type-guards';
import { BehaviorSubject, Observable, of } from 'rxjs';
import { delay, switchMap } from 'rxjs/operators';
import { delay, map, switchMap } from 'rxjs/operators';
import { TaskCalendarStore } from './task-calendar.store';
@Component({
@@ -14,6 +15,16 @@ export class PageTaskCalendarComponent implements OnInit {
filterActive$ = new BehaviorSubject<boolean>(false);
showMainContent$ = this.getShowMainContent();
hasFilter$: Observable<boolean> = this.taskCalendarStore.selectFilter.pipe(
map((filter) => {
for (const f of filter) {
if (isSelectFilter(f)) {
return !!f.options.find((filterOption) => filterOption.selected);
}
}
})
);
constructor(private breadcrumb: BreadcrumbService, private taskCalendarStore: TaskCalendarStore) {
this.taskCalendarStore.loadFilter();
}