Skip to content
Snippets Groups Projects
Commit e6ba741d authored by Alex ORLUC's avatar Alex ORLUC
Browse files

FEAT #14454 TIME 0:20 simplify set filter

parent d887b56a
No related branches found
No related tags found
No related merge requests found
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
</mat-paginator> </mat-paginator>
</div> </div>
</div> </div>
<mat-table #table [dataSource]="adminService.getDataSource()" matSort [matSortActive]="adminService.getFilter('admin_actions', 'sort')" [matSortDirection]="adminService.getFilter('admin_actions', 'sortDirection')"> <mat-table #table [dataSource]="adminService.getDataSource()" [matSortActive]="adminService.getFilter('sort')" [matSortDirection]="adminService.getFilter('sortDirection')" matSort>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef mat-sort-header <mat-header-cell *matHeaderCellDef mat-sort-header
[class.hide-for-mobile]="appService.getViewMode()">{{lang.id}}</mat-header-cell> [class.hide-for-mobile]="appService.getViewMode()">{{lang.id}}</mat-header-cell>
......
...@@ -34,6 +34,7 @@ export class AdministrationService { ...@@ -34,6 +34,7 @@ export class AdministrationService {
dataSource: MatTableDataSource<any>; dataSource: MatTableDataSource<any>;
filterColumns: string[]; filterColumns: string[];
searchTerm: FormControl = new FormControl(''); searchTerm: FormControl = new FormControl('');
currentAdminId: string = '';
constructor( constructor(
private notify: NotificationService, private notify: NotificationService,
...@@ -46,20 +47,8 @@ export class AdministrationService { ...@@ -46,20 +47,8 @@ export class AdministrationService {
} }
} }
setFilter(id: string, filter: any) {
this.filters[id] = filter;
this.localStorage.save(`filtersAdmin_${this.headerService.user.id}`, JSON.stringify(this.filters));
}
getFilterField() {
return this.searchTerm;
}
getDataSource() {
return this.dataSource;
}
setDataSource(adminId: string, data: any, sort: MatSort, paginator: MatPaginator, filterColumns: string[]) { setDataSource(adminId: string, data: any, sort: MatSort, paginator: MatPaginator, filterColumns: string[]) {
this.currentAdminId = adminId;
this.searchTerm = new FormControl(''); this.searchTerm = new FormControl('');
this.searchTerm.valueChanges this.searchTerm.valueChanges
...@@ -67,8 +56,8 @@ export class AdministrationService { ...@@ -67,8 +56,8 @@ export class AdministrationService {
// debounceTime(300), // debounceTime(300),
// filter(value => value.length > 2), // filter(value => value.length > 2),
tap((filterValue: any) => { tap((filterValue: any) => {
this.filters[adminId]['field'] = filterValue; this.filters[this.currentAdminId]['field'] = filterValue;
this.setFilter(adminId, this.filters[adminId]); this.setFilter(this.filters[this.currentAdminId]);
filterValue = filterValue.trim(); // Remove whitespace filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
setTimeout(() => { setTimeout(() => {
...@@ -85,32 +74,31 @@ export class AdministrationService { ...@@ -85,32 +74,31 @@ export class AdministrationService {
this.dataSource.paginator = paginator; this.dataSource.paginator = paginator;
this.dataSource.sortingDataAccessor = this.functionsService.listSortingDataAccessor; this.dataSource.sortingDataAccessor = this.functionsService.listSortingDataAccessor;
if (this.functionsService.empty(this.getFilter(adminId))) { if (this.functionsService.empty(this.getFilter())) {
this.setFilter( this.setFilter(
adminId, this.defaultFilters[this.currentAdminId]
this.defaultFilters[adminId]
); );
} }
sort.active = this.getFilter(adminId, 'sort'); sort.active = this.getFilter('sort');
sort.direction = this.getFilter(adminId, 'sortDirection'); sort.direction = this.getFilter('sortDirection');
paginator.pageIndex = this.getFilter(adminId, 'page'); paginator.pageIndex = this.getFilter('page');
this.dataSource.sort = sort; this.dataSource.sort = sort;
this.searchTerm.setValue(this.getFilter(adminId, 'field')); this.searchTerm.setValue(this.getFilter('field'));
merge(sort.sortChange, paginator.page) merge(sort.sortChange, paginator.page)
.pipe( .pipe(
startWith({}), startWith({}),
tap(() => { tap(() => {
this.setFilter( this.setFilter(
adminId,
{ {
sort: sort.active, sort: sort.active,
sortDirection: sort.direction, sortDirection: sort.direction,
page: paginator.pageIndex, page: paginator.pageIndex,
field: this.getFilter(adminId, 'field') field: this.getFilter('field')
} }
); );
}), }),
...@@ -121,12 +109,25 @@ export class AdministrationService { ...@@ -121,12 +109,25 @@ export class AdministrationService {
).subscribe(); ).subscribe();
} }
getFilter(id: string, idFilter: string = null) { setFilter(filter: any) {
if (!this.functionsService.empty(this.filters[id])) { this.filters[this.currentAdminId] = filter;
this.localStorage.save(`filtersAdmin_${this.headerService.user.id}`, JSON.stringify(this.filters));
}
getFilterField() {
return this.searchTerm;
}
getDataSource() {
return this.dataSource;
}
getFilter(idFilter: string = null) {
if (!this.functionsService.empty(this.filters[this.currentAdminId])) {
if (!this.functionsService.empty(idFilter)) { if (!this.functionsService.empty(idFilter)) {
return !this.functionsService.empty(this.filters[id][idFilter]) ? this.filters[id][idFilter] : ''; return !this.functionsService.empty(this.filters[this.currentAdminId][idFilter]) ? this.filters[this.currentAdminId][idFilter] : '';
} else { } else {
return !this.functionsService.empty(this.filters[id]) ? this.filters[id] : ''; return !this.functionsService.empty(this.filters[this.currentAdminId]) ? this.filters[this.currentAdminId] : '';
} }
} else { } else {
return null; return null;
......
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
</div> </div>
<div class="col-md-6 col-xs-6"> <div class="col-md-6 col-xs-6">
<mat-form-field> <mat-form-field>
<input matInput (keyup)="applyFilter($event.target.value)" <input matInput [formControl]="adminService.getFilterField()"
placeholder="{{lang.filterBy}}"> placeholder="{{lang.filterBy}}">
</mat-form-field> </mat-form-field>
</div> </div>
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</mat-paginator> </mat-paginator>
</div> </div>
</div> </div>
<mat-table #table [dataSource]="dataSource" matSort matSortActive="id" matSortDirection="asc"> <mat-table #table [dataSource]="adminService.getDataSource()" matSort [matSortActive]="adminService.getFilter('admin_alfresco', 'sort')" [matSortDirection]="adminService.getFilter('admin_alfresco', 'sortDirection')">
<ng-container matColumnDef="label"> <ng-container matColumnDef="label">
<mat-header-cell *matHeaderCellDef mat-sort-header <mat-header-cell *matHeaderCellDef mat-sort-header
[class.hide-for-mobile]="appService.getViewMode()">{{lang.label}}</mat-header-cell> [class.hide-for-mobile]="appService.getViewMode()">{{lang.label}}</mat-header-cell>
......
...@@ -16,6 +16,7 @@ import { MatDialogRef } from '@angular/material/dialog/dialog-ref'; ...@@ -16,6 +16,7 @@ import { MatDialogRef } from '@angular/material/dialog/dialog-ref';
import { filter } from 'rxjs/internal/operators/filter'; import { filter } from 'rxjs/internal/operators/filter';
import { exhaustMap } from 'rxjs/internal/operators/exhaustMap'; import { exhaustMap } from 'rxjs/internal/operators/exhaustMap';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { AdministrationService } from '../administration.service';
@Component({ @Component({
templateUrl: 'alfresco-list-administration.component.html', templateUrl: 'alfresco-list-administration.component.html',
...@@ -34,7 +35,8 @@ export class AlfrescoListAdministrationComponent implements OnInit { ...@@ -34,7 +35,8 @@ export class AlfrescoListAdministrationComponent implements OnInit {
loading: boolean = false; loading: boolean = false;
displayedColumns = ['label', 'entitiesLabel', 'actions']; displayedColumns = ['label', 'entitiesLabel', 'actions'];
dataSource: any; filterColumns = ['label', 'entitiesLabel'];
dialogRef: MatDialogRef<any>; dialogRef: MatDialogRef<any>;
@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator; @ViewChild(MatPaginator, { static: false }) paginator: MatPaginator;
...@@ -48,18 +50,10 @@ export class AlfrescoListAdministrationComponent implements OnInit { ...@@ -48,18 +50,10 @@ export class AlfrescoListAdministrationComponent implements OnInit {
public appService: AppService, public appService: AppService,
private dialog: MatDialog, private dialog: MatDialog,
public functions: FunctionsService, public functions: FunctionsService,
public adminService: AdministrationService,
private viewContainerRef: ViewContainerRef private viewContainerRef: ViewContainerRef
) { } ) { }
applyFilter(filterValue: string) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
this.dataSource.filter = filterValue;
this.dataSource.filterPredicate = (template: any, filter: string) => {
return this.functions.filterUnSensitive(template, filter, ['label', 'entitiesLabel']);
};
}
ngOnInit(): void { ngOnInit(): void {
this.headerService.setHeader(this.lang.administration + ' ' + this.lang.alfresco); this.headerService.setHeader(this.lang.administration + ' ' + this.lang.alfresco);
...@@ -77,13 +71,10 @@ export class AlfrescoListAdministrationComponent implements OnInit { ...@@ -77,13 +71,10 @@ export class AlfrescoListAdministrationComponent implements OnInit {
this.http.get('../rest/alfresco/accounts') this.http.get('../rest/alfresco/accounts')
.subscribe((data: any) => { .subscribe((data: any) => {
this.accounts = data.accounts; this.accounts = data.accounts;
this.loading = false;
setTimeout(() => { setTimeout(() => {
this.dataSource = new MatTableDataSource(this.accounts); this.adminService.setDataSource('admin_alfresco', this.accounts, this.sort, this.paginator, this.filterColumns);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
}, 0); }, 0);
this.loading = false;
}); });
} }
...@@ -96,9 +87,9 @@ export class AlfrescoListAdministrationComponent implements OnInit { ...@@ -96,9 +87,9 @@ export class AlfrescoListAdministrationComponent implements OnInit {
exhaustMap(() => this.http.delete('../rest/alfresco/accounts/' + id)), exhaustMap(() => this.http.delete('../rest/alfresco/accounts/' + id)),
tap(() => { tap(() => {
this.accounts = this.accounts.filter((account: any) => account.id !== id); this.accounts = this.accounts.filter((account: any) => account.id !== id);
this.dataSource = new MatTableDataSource(this.accounts); setTimeout(() => {
this.dataSource.paginator = this.paginator; this.adminService.setDataSource('admin_alfresco', this.accounts, this.sort, this.paginator, this.filterColumns);
this.dataSource.sort = this.sort; }, 0);
this.notify.success(this.lang.accountDeleted); this.notify.success(this.lang.accountDeleted);
}), }),
catchError((err: any) => { catchError((err: any) => {
......
...@@ -66,7 +66,7 @@ ...@@ -66,7 +66,7 @@
</mat-paginator> </mat-paginator>
</div> </div>
</div> </div>
<mat-table #table [dataSource]="adminService.getDataSource()" matSort [matSortActive]="adminService.getFilter('admin_users', 'sort')" [matSortDirection]="adminService.getFilter('admin_users', 'sortDirection')"> <mat-table #table [dataSource]="adminService.getDataSource()" [matSortActive]="adminService.getFilter('sort')" [matSortDirection]="adminService.getFilter('sortDirection')" matSort>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef mat-sort-header <mat-header-cell *matHeaderCellDef mat-sort-header
[class.hide-for-mobile]="appService.getViewMode()">{{lang.technicalId}} [class.hide-for-mobile]="appService.getViewMode()">{{lang.technicalId}}
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment