Merge pull request #226 from paperless-ngx/fix-issue-225-management-page-filtering

Fix issue #225 management page filtering, add esc clearing of filter field
This commit is contained in:
shamoon 2022-03-07 10:50:52 -08:00 committed by GitHub
commit 01c1b42319
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 8 additions and 3 deletions

View File

@ -6,7 +6,7 @@
<div class="col-md mb-2 mb-xl-0"> <div class="col-md mb-2 mb-xl-0">
<div class="form-inline d-flex align-items-center"> <div class="form-inline d-flex align-items-center">
<label class="text-muted me-2 mb-0" i18n>Filter by:</label> <label class="text-muted me-2 mb-0" i18n>Filter by:</label>
<input class="form-control form-control-sm flex-fill w-auto" type="text" [(ngModel)]="nameFilter" placeholder="Name" i18n-placeholder> <input class="form-control form-control-sm flex-fill w-auto" type="text" autofocus [(ngModel)]="nameFilter" (keyup)="onNameFilterKeyUp($event)" placeholder="Name" i18n-placeholder>
</div> </div>
</div> </div>

View File

@ -6,7 +6,7 @@
<div class="col-md mb-2 mb-xl-0"> <div class="col-md mb-2 mb-xl-0">
<div class="form-inline d-flex align-items-center"> <div class="form-inline d-flex align-items-center">
<label class="text-muted me-2 mb-0" i18n>Filter by:</label> <label class="text-muted me-2 mb-0" i18n>Filter by:</label>
<input class="form-control form-control-sm flex-fill w-auto" type="text" [(ngModel)]="nameFilter" placeholder="Name" i18n-placeholder> <input class="form-control form-control-sm flex-fill w-auto" type="text" autofocus [(ngModel)]="nameFilter" (keyup)="onNameFilterKeyUp($event)" placeholder="Name" i18n-placeholder>
</div> </div>
</div> </div>

View File

@ -61,6 +61,7 @@ export abstract class GenericListComponent<T extends ObjectWithId> implements On
distinctUntilChanged() distinctUntilChanged()
).subscribe(title => { ).subscribe(title => {
this._nameFilter = title this._nameFilter = title
this.page = 1
this.reloadData() this.reloadData()
}) })
} }
@ -124,4 +125,8 @@ export abstract class GenericListComponent<T extends ObjectWithId> implements On
set nameFilter(nameFilter: string) { set nameFilter(nameFilter: string) {
this.nameFilterDebounce.next(nameFilter) this.nameFilterDebounce.next(nameFilter)
} }
onNameFilterKeyUp(event: KeyboardEvent) {
if (event.code == 'Escape') this.nameFilterDebounce.next(null)
}
} }

View File

@ -6,7 +6,7 @@
<div class="col-md mb-2 mb-xl-0"> <div class="col-md mb-2 mb-xl-0">
<div class="form-inline d-flex align-items-center"> <div class="form-inline d-flex align-items-center">
<label class="text-muted me-2 mb-0" i18n>Filter by:</label> <label class="text-muted me-2 mb-0" i18n>Filter by:</label>
<input class="form-control form-control-sm flex-fill w-auto" type="text" [(ngModel)]="nameFilter" placeholder="Name" i18n-placeholder> <input class="form-control form-control-sm flex-fill w-auto" type="text" autofocus [(ngModel)]="nameFilter" (keyup)="onNameFilterKeyUp($event)" placeholder="Name" i18n-placeholder>
</div> </div>
</div> </div>