@@ -27,7 +27,11 @@
class="d-none d-lg-table-cell px-1 text-right"
mat-cell
>
- {{ dataSource.data.length - i }}
+ {{
+ dataSource.data.length > pageSize
+ ? dataSource.data.length - pageSize * pageIndex - i
+ : dataSource.data.length - i
+ }}
Type
- |
+ |
|
+
+
();
@Output() import = new EventEmitter();
+ @ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
public allFilters: Filter[];
@@ -59,6 +63,7 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
public isAfter = isAfter;
public isLoading = true;
public isUUID = isUUID;
+ public pageIndex = 0;
public placeholder = '';
public routeQueryParams: Subscription;
public searchKeywords: string[] = [];
@@ -119,12 +124,20 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
}
return contains;
};
+ this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
this.updateFilters();
}
}
+ public onChangePage(page: PageEvent) {
+ this.pageIndex = page.pageIndex;
+
+ this.totalFees = this.getTotalFees();
+ this.totalValue = this.getTotalValue();
+ }
+
public onCloneActivity(aActivity: OrderWithAccount) {
this.activityToClone.emit(aActivity);
}
@@ -231,6 +244,21 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
return Object.values(fieldValueMap);
}
+ private getPaginatedData() {
+ if (this.dataSource.data.length > this.pageSize) {
+ const sortedData = this.dataSource.sortData(
+ this.dataSource.filteredData,
+ this.dataSource.sort
+ );
+
+ return sortedData.slice(
+ this.pageIndex * this.pageSize,
+ (this.pageIndex + 1) * this.pageSize
+ );
+ }
+ return this.dataSource.filteredData;
+ }
+
private getSearchableFieldValues(activities: OrderWithAccount[]): Filter[] {
const fieldValueMap: { [id: string]: Filter } = {};
@@ -243,8 +271,8 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
private getTotalFees() {
let totalFees = new Big(0);
-
- for (const activity of this.dataSource.filteredData) {
+ const paginatedData = this.getPaginatedData();
+ for (const activity of paginatedData) {
if (isNumber(activity.feeInBaseCurrency)) {
totalFees = totalFees.plus(activity.feeInBaseCurrency);
} else {
@@ -257,8 +285,8 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy {
private getTotalValue() {
let totalValue = new Big(0);
-
- for (const activity of this.dataSource.filteredData) {
+ const paginatedData = this.getPaginatedData();
+ for (const activity of paginatedData) {
if (isNumber(activity.valueInBaseCurrency)) {
if (activity.type === 'BUY' || activity.type === 'ITEM') {
totalValue = totalValue.plus(activity.valueInBaseCurrency);
diff --git a/libs/ui/src/lib/activities-table/activities-table.module.ts b/libs/ui/src/lib/activities-table/activities-table.module.ts
index 2d009fb4f..4f38bcd2a 100644
--- a/libs/ui/src/lib/activities-table/activities-table.module.ts
+++ b/libs/ui/src/lib/activities-table/activities-table.module.ts
@@ -2,6 +2,7 @@ import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatMenuModule } from '@angular/material/menu';
+import { MatPaginatorModule } from '@angular/material/paginator';
import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { RouterModule } from '@angular/router';
@@ -26,6 +27,7 @@ import { ActivitiesTableComponent } from './activities-table.component';
GfValueModule,
MatButtonModule,
MatMenuModule,
+ MatPaginatorModule,
MatSortModule,
MatTableModule,
NgxSkeletonLoaderModule,