Marmelator/common-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Pull request #5: VM/DeactivateEmptyFilters

Browse Source 
Merge in SL/common-ui from VM/DeactivateEmptyFilters2 to master

* commit 'e620d66ba9cc4aac8b9414a6968adff678246619':
  deactivated empty filters
This commit is contained in:
Valentin-Gabriel Mihai 2021-10-13 21:38:14 +02:00
commit f7a13a4234
4 changed files with 43 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/buttons/chevron-button/chevron-button.component.html
View File

@ -1,4 +1,4 @@
<button [class.overlay]="showDot" [class.primary]="primary" mat-button>
<button [class.overlay]="showDot" [class.primary]="primary" [disabled]="disabled" mat-button>
<span>{{ label }}</span>
<mat-icon class="chevron-icon" svgIcon="iqser:arrow-down"></mat-icon>
</button>

1
src/lib/buttons/chevron-button/chevron-button.component.ts
View File

@ -11,4 +11,5 @@ export class ChevronButtonComponent {
@Input() @Required() label!: string;
@Input() showDot = false;
@Input() primary = false;
@Input() disabled = false;
}

7
src/lib/buttons/icon-button/icon-button.component.scss
View File

@ -14,6 +14,13 @@ button {
}
}
&.mat-button-disabled {
cursor: not-allowed;
::ng-deep .mat-button-wrapper {
opacity: 1;
}
}
mat-icon {
width: 14px;
}

49
src/lib/filtering/popup-filter/popup-filter.component.html
View File

@ -1,20 +1,39 @@
<ng-container *ngIf="primaryFilterGroup$ | async as primaryGroup">
<iqser-icon-button
*ngIf="primaryGroup.icon"
[attr.aria-expanded]="expanded$ | async"
[icon]="primaryGroup.icon"
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
[matMenuTriggerFor]="filterMenu"
[showDot]="hasActiveFilters$ | async"
></iqser-icon-button>
<ng-container *ngIf="primaryGroup.icon" [ngSwitch]="(primaryFilters$ | async)?.length > 0">
<iqser-icon-button
*ngSwitchCase="false"
[icon]="primaryGroup.icon"
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
[disabled]="true"
></iqser-icon-button>
<iqser-chevron-button
*ngIf="!primaryGroup.icon"
[attr.aria-expanded]="expanded$ | async"
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
[matMenuTriggerFor]="filterMenu"
[showDot]="hasActiveFilters$ | async"
></iqser-chevron-button>
<iqser-icon-button
*ngSwitchCase="true"
[attr.aria-expanded]="expanded$ | async"
[icon]="primaryGroup.icon"
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
[matMenuTriggerFor]="filterMenu"
[showDot]="hasActiveFilters$ | async"
></iqser-icon-button>
</ng-container>
<ng-container *ngIf="!primaryGroup.icon" [ngSwitch]="(primaryFilters$ | async)?.length > 0">
<iqser-chevron-button
*ngSwitchCase="false"
[attr.aria-expanded]="expanded$ | async"
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
[showDot]="hasActiveFilters$ | async"
[disabled]="true"
></iqser-chevron-button>
<iqser-chevron-button
*ngSwitchCase="true"
[attr.aria-expanded]="expanded$ | async"
[label]="primaryGroup.label || ('filter-menu.label' | translate)"
[matMenuTriggerFor]="filterMenu"
[showDot]="hasActiveFilters$ | async"
></iqser-chevron-button>
</ng-container>
<mat-menu
#filterMenu="matMenu"