diff --git a/frontend/src/app/_components/table/table.component.html b/frontend/src/app/_components/table/table.component.html
index 0972ef6..652c2c2 100644
--- a/frontend/src/app/_components/table/table.component.html
+++ b/frontend/src/app/_components/table/table.component.html
@@ -1,3 +1,11 @@
+
+
+
+
diff --git a/frontend/src/app/_components/table/table.component.ts b/frontend/src/app/_components/table/table.component.ts
index 74c5a6c..9bde8fe 100644
--- a/frontend/src/app/_components/table/table.component.ts
+++ b/frontend/src/app/_components/table/table.component.ts
@@ -18,6 +18,22 @@ export class TableComponent implements OnInit, OnDestroy {
@Input() refreshInterval?: number;
enablePaginationTypes: string[] = ['logs', 'services', 'trainings'];
+ searchPropertiesBlacklist: string[] = [
+ "chief_id",
+ "type_id",
+ "pivot",
+ "place_id",
+ "display_name",
+ "licence",
+ "lat",
+ "lon",
+ "id",
+ "updated_at",
+ "added_by_id",
+ "updated_by_id",
+ "changed_id",
+ "editor_id"
+ ]
_maxPaginationSize: number = 10;
_rowsPerPage: number = 20;
@@ -43,12 +59,16 @@ export class TableComponent implements OnInit, OnDestroy {
public data: any = [];
public displayedData: any = [];
+ public originalData: any = [];
public loadDataInterval: NodeJS.Timer | undefined = undefined;
public currentPage: number = 1;
public totalElements: number = 1;
+ public searchText: string = "";
+ public searchData: any = [];
+
constructor(
private api: ApiClientService,
public auth: AuthService,
@@ -69,11 +89,13 @@ export class TableComponent implements OnInit, OnDestroy {
if(!this.sourceType) this.sourceType = "list";
this.api.get(this.sourceType).then((data: any) => {
this.data = data.filter((row: any) => typeof row.hidden !== 'undefined' ? !row.hidden : true);
+ this.originalData = this.data;
this.totalElements = this.data.length;
if(this.currentPage == 1) this.displayedData = this.data.slice(0, this.rowsPerPage);
if(this.sourceType === 'list') {
this.api.availableUsers = this.data.filter((row: any) => row.available).length;
}
+ this.initializeSearchData();
});
}
@@ -83,6 +105,42 @@ export class TableComponent implements OnInit, OnDestroy {
this.displayedData = this.data.slice(startItem, endItem);
}
+ initializeSearchData() {
+ const searchPropertiesBlacklist = this.searchPropertiesBlacklist;
+ function flattenObj(obj: any, parent: any, res: any = {}){
+ //Based on https://stackoverflow.com/a/56253298
+ for(let key in obj){
+ if(typeof obj[key] == 'undefined' || obj[key] == null) continue;
+ if(searchPropertiesBlacklist.includes(key)) continue;
+ let propName = parent ? parent + '_' + key : key;
+ if(typeof obj[key] == 'object'){
+ flattenObj(obj[key], propName, res);
+ } else {
+ res[propName] = obj[key];
+ }
+ }
+ return res;
+ }
+
+ this.searchData = this.data.map((row: any) => flattenObj(row, null));
+ }
+
+ onSearchTextChange(search: string) {
+ if(search.length == 0) {
+ this.data = this.originalData;
+ this.displayedData = this.data.slice(0, this.rowsPerPage);
+ this.totalElements = this.data.length;
+ return;
+ }
+ this.data = this.originalData.filter((row: any, index: number) => {
+ return Object.values(this.searchData[index]).some((value: any) => {
+ return value.toString().toLowerCase().includes(search.toLowerCase());
+ });
+ });
+ this.displayedData = this.data.slice(0, this.rowsPerPage);
+ this.totalElements = this.data.length;
+ }
+
ngOnInit(): void {
console.log(this.sourceType);
this.loadTableData();