sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-31 09:37:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

#1360 Loading Progress, Styling

Browse Source
This commit is contained in:
Andreas Schickinger
2021-01-27 12:29:14 +01:00
parent 3753c9aff5
commit 9caccb652d
4 changed files with 20 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/domain/oms/src/lib/oms.service.ts
View File

@@ -11,7 +11,7 @@ export class OmsService {
getOrderItemsByCustomerNumber(customerNumber: string, skip: number): Observable<OrderListItemDTO[]> {
return this.orderService
.OrderGetOrdersByBuyerNumber({ buyerNumber: customerNumber, take: 10, skip })
.OrderGetOrdersByBuyerNumber({ buyerNumber: customerNumber, take: 20, skip })
.pipe(map((orders) => orders.result));
}

7
apps/page/customer/src/lib/customer-details/customer-orders/customer-orders.component.html
View File

@@ -14,7 +14,8 @@
<p class="desc-empty" *ngIf="orders.length === 0">Es sind keine Bestellungen vorhanden</p>
</div>
<div class="orders" uiScrollContainer (reachStart)="reachStart()" (reachEnd)="reachEnd()">
<div class="orders" uiScrollContainer (reachEnd)="reachEnd()">
<div></div>
<div *ngFor="let order of orders" class="order-row">
<div class="order-col bold">
{{ order.orderDate | date: 'dd.MM.yy' }}
@@ -27,8 +28,8 @@
<div class="order-col details">Details</div>
</div>
</div>
<!-- <div class="footer"></div> -->
</div>
<ui-icon class="spin" *ngIf="isLoading" icon="spinner" size="32px"></ui-icon>
</ng-container>
</ng-container>

10
apps/page/customer/src/lib/customer-details/customer-orders/customer-orders.component.scss
View File

@@ -1,6 +1,5 @@
:host {
@apply flex flex-col box-border;
// height: calc(100vh - 300px);
}
.title {
@@ -43,8 +42,7 @@ h1 {
.orders {
@apply flex flex-col gap-px-2;
margin-top: 2px;
max-height: 500px;
max-height: 680px;
}
.order-row {
@@ -68,3 +66,9 @@ h1 {
flex-grow: 1;
margin-top: 2px;
}
.spin {
@apply animate-spin fixed;
top: 65%;
left: 50%;
}

14
apps/page/customer/src/lib/customer-details/customer-orders/customer-orders.component.ts
View File

@@ -21,7 +21,9 @@ export class CustomerOrdersComponent implements OnInit, OnDestroy {
customer$: Observable<CustomerDTO>;
skip$ = new BehaviorSubject<number>(0);
orders$ = new BehaviorSubject<OrderItemDTO[]>([]);
orders$ = new BehaviorSubject<OrderListItemDTO[]>([]);
isLoading: boolean;
constructor(private activatedRoute: ActivatedRoute, private customerDetailsService: CrmCustomerService, private omsService: OmsService) {}
@@ -39,7 +41,10 @@ export class CustomerOrdersComponent implements OnInit, OnDestroy {
shareReplay(),
withLatestFrom(this.orders$)
)
.subscribe(([newOrders, orders]) => this.orders$.next([...orders, ...newOrders]))
.subscribe(([newOrders, orders]) => {
this.orders$.next([...orders, ...newOrders]);
setTimeout(() => (this.isLoading = false), 50);
})
);
}
@@ -52,11 +57,8 @@ export class CustomerOrdersComponent implements OnInit, OnDestroy {
this.skip$.next(orders.length);
}
reachStart() {
console.log('reach start');
}
reachEnd() {
this.isLoading = true;
this.fetchOrders();
}
}