Toggling of items

This commit is contained in:
Michael Shamoon
2020-12-08 23:39:38 -08:00
parent f3fd0fcf72
commit 23ba3be68f
2 changed files with 70 additions and 9 deletions

View File

@@ -77,7 +77,10 @@
<div class="list-group list-group-flush">
<input class="list-group-item form-control" type="text" [(ngModel)]="searchText" placeholder="Filter tags">
<ng-container *ngIf="(tags | filter: searchText).length > 0">
<button class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" role="menuitem" *ngFor="let tag of tags | filter: searchText; let i = index" (click)="filterByTag(tag.id, true)">
<button class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" role="menuitem" *ngFor="let tag of tags | filter: searchText; let i = index" (click)="toggleFilterByTag(tag.id)">
<svg *ngIf="currentViewIncludesTag(tag.id)" width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-check" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.236.236 0 0 1 .02-.022z"/>
</svg>
{{tag.name}}
<span class="badge bg-primary text-light rounded-pill">{{tag.document_count}}</span>
</button>
@@ -92,7 +95,10 @@
<div class="list-group list-group-flush">
<input class="list-group-item form-control" type="text" [(ngModel)]="searchText" placeholder="Filter correspondents">
<ng-container *ngIf="(correspondents | filter: searchText).length > 0">
<button class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" role="menuitem" *ngFor="let correspondent of correspondents | filter: searchText; let i = index" (click)="filterByCorrespondent(correspondent.id, true)">
<button class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" role="menuitem" *ngFor="let correspondent of correspondents | filter: searchText; let i = index" (click)="toggleFilterByCorrespondent(correspondent.id)">
<svg *ngIf="currentViewIncludesCorrespondent(correspondent.id)" width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-check" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.236.236 0 0 1 .02-.022z"/>
</svg>
{{correspondent.name}}
<span class="badge bg-primary text-light rounded-pill">{{correspondent.document_count}}</span>
</button>
@@ -107,7 +113,10 @@
<div class="list-group list-group-flush">
<input class="list-group-item form-control" type="text" [(ngModel)]="searchText" placeholder="Filter tags">
<ng-container *ngIf="(documentTypes | filter: searchText).length > 0">
<button class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" role="menuitem" *ngFor="let documentType of documentTypes | filter: searchText; let i = index" (click)="filterByDocumentType(documentType.id, true)">
<button class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" role="menuitem" *ngFor="let documentType of documentTypes | filter: searchText; let i = index" (click)="toggleFilterByDocumentType(documentType.id)">
<svg *ngIf="currentViewIncludesDocumentType(documentType.id)" width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-check" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10.97 4.97a.75.75 0 0 1 1.071 1.05l-3.992 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.236.236 0 0 1 .02-.022z"/>
</svg>
{{documentType.name}}
<span class="badge bg-primary text-light rounded-pill">{{documentType.document_count}}</span>
</button>