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); } } |