Fixed dashboard server filter #130

This commit is contained in:
Sven Heidemann 2023-02-18 12:54:56 +01:00
parent 38417bd712
commit 7193e58ba1

View File

@ -2,17 +2,16 @@ import { Component, OnInit } from "@angular/core";
import { FormBuilder, FormControl, FormGroup } from "@angular/forms";
import { Router } from "@angular/router";
import { TranslateService } from "@ngx-translate/core";
import { LazyLoadEvent } from "primeng/api";
import { debounceTime, throwError } from "rxjs";
import { ConfirmationDialogService } from "src/app/services/confirmation-dialog/confirmation-dialog.service";
import { DataService } from "src/app/services/data/data.service";
import { SpinnerService } from "src/app/services/spinner/spinner.service";
import { ToastService } from "src/app/services/toast/toast.service";
import { Server } from "../../../../../models/data/server.model";
import { Server, ServerFilter } from "../../../../../models/data/server.model";
import { catchError } from "rxjs/operators";
import { Queries } from "../../../../../models/graphql/queries.model";
import { Page } from "../../../../../models/graphql/filter/page.model";
import { Sort, SortDirection } from "../../../../../models/graphql/filter/sort.model";
import { Sort } from "../../../../../models/graphql/filter/sort.model";
import { Query } from "../../../../../models/graphql/query.model";
import { SidebarService } from "../../../../../services/sidebar/sidebar.service";
@ -27,9 +26,7 @@ export class DashboardComponent implements OnInit {
totalRecords!: number;
filter = {
name: ""
};
filter: ServerFilter = {};
page: Page = {
pageIndex: 0,
@ -50,7 +47,7 @@ export class DashboardComponent implements OnInit {
private fb: FormBuilder,
private translate: TranslateService,
private router: Router,
private sidebar: SidebarService,
private sidebar: SidebarService
) {
}
@ -63,13 +60,15 @@ export class DashboardComponent implements OnInit {
setFilterForm() {
this.filterForm = this.fb.group({
name: [""]
name: new FormControl<string | null>(null)
});
this.filterForm.valueChanges.pipe(
debounceTime(600)
).subscribe(async changes => {
if (changes.name) {
if (changes.name == "") {
this.filter.name = undefined;
} else if (changes.name) {
this.filter.name = changes.name;
}
@ -85,10 +84,10 @@ export class DashboardComponent implements OnInit {
loadNextPage() {
this.spinnerService.showSpinner();
this.data.query<Query>(Queries.serversListQuery,{
this.data.query<Query>(Queries.serversListQuery, {
filter: this.filter,
page: this.page,
sort: this.sort,
sort: this.sort
}).pipe(catchError(err => {
this.spinnerService.hideSpinner();
return throwError(() => err);
@ -99,28 +98,6 @@ export class DashboardComponent implements OnInit {
});
}
nextPage(event: LazyLoadEvent) {
this.page.pageSize = event.rows ?? 0;
if (event.first != null && event.rows != null)
this.page.pageIndex = event.first / event.rows;
this.sort = {
sortColumn: event.sortField ?? "",
sortDirection: event.sortOrder === 1 ? SortDirection.ASC : event.sortOrder === -1 ? SortDirection.DESC: SortDirection.ASC
};
if (event.filters) {
// + "" => convert to string
this.filter.name = event.filters["name"] ? event.filters["name"] + "" : "";
}
this.loadNextPage();
}
resetFilters() {
this.filterForm.reset();
}
selectServer(server: Server) {
this.sidebar.setServer(server);
this.router.navigate(["/server", server.id]);