Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | 1x 1x 1x 1x 1x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x | import { ChangeDetectionStrategy, Component, DestroyRef, OnInit, inject } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { BehaviorSubject, Observable, combineLatest, map, shareReplay, take, tap } from 'rxjs';
import { AccountFacade } from 'ish-core/facades/account.facade';
import { HttpError } from 'ish-core/models/http-error/http-error.model';
import { OrderListQuery } from 'ish-core/models/order-list-query/order-list-query.model';
import { Order } from 'ish-core/models/order/order.model';
import { PagingInfo } from 'ish-core/models/paging-info/paging-info.model';
import { OrderColumnsType } from 'ish-shared/components/order/order-list/order-list.component';
/**
* The Order History Page Component renders the account history page of a logged in user.
*
* If search results have no order, filters should be rendered
* If no order placed yet, filters should not be rendered
*/
@Component({
templateUrl: './account-order-history-page.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class AccountOrderHistoryPageComponent implements OnInit {
orders$: Observable<Order[]>;
ordersLoading$: Observable<boolean>;
ordersError$: Observable<HttpError>;
ordersForPage$: Observable<Order[]>;
pagingInfo$: Observable<PagingInfo>;
columnsToDisplay$: Observable<OrderColumnsType[]>;
filtersActive: boolean;
pageSize = 25;
private isOrderManager = false;
private destroyRef = inject(DestroyRef);
private pageNumberSubject = new BehaviorSubject<number>(1);
pageNumber$ = this.pageNumberSubject.asObservable();
constructor(private accountFacade: AccountFacade) {}
ngOnInit(): void {
this.orders$ = this.accountFacade.orders$.pipe(shareReplay(1));
this.ordersLoading$ = this.accountFacade.ordersLoading$;
this.ordersError$ = this.accountFacade.ordersError$;
this.pagingInfo$ = this.accountFacade.ordersPagingInfo$;
this.columnsToDisplay$ = this.accountFacade.isOrderManager$.pipe(
tap(isOrderManager => (this.isOrderManager = isOrderManager)),
map(isOrderManager =>
isOrderManager
? ['creationDate', 'orderNoWithLink', 'lineItems', 'status', 'buyer', 'orderTotal']
: ['creationDate', 'orderNoWithLink', 'lineItems', 'status', 'destination', 'orderTotal']
)
);
this.getOrdersForPage();
}
private getOrdersForPage() {
this.ordersForPage$ = combineLatest([this.orders$, this.pageNumber$]).pipe(
map(([orders, pageNumber]) => {
const start = (pageNumber - 1) * this.pageSize;
const end = start + this.pageSize;
return orders.filter(order => order.paginationPosition >= start && order.paginationPosition < end);
})
);
}
loadFilteredOrders(filters: Partial<OrderListQuery>) {
this.pageNumberSubject.next(1);
this.filtersActive = Object.keys(filters).length > 0;
this.accountFacade.loadOrders({
...filters,
limit: this.pageSize,
include: ['commonShipToAddress'],
buyer: filters.buyer || (this.isOrderManager ? 'all' : undefined),
});
}
loadMoreOrders(pageNumber: number): void {
this.pageNumberSubject.next(pageNumber);
this.orders$.pipe(take(1), takeUntilDestroyed(this.destroyRef)).subscribe(orders => {
Iif (!orders.find(order => order.paginationPosition === (pageNumber - 1) * this.pageSize)) {
this.accountFacade.loadMoreOrders((pageNumber - 1) * this.pageSize, this.pageSize);
}
});
}
getTotalPages(totalOrders: number) {
return Math.ceil(totalOrders / this.pageSize);
}
}
|