Merged PR 1731: #4601 WA, AHF Navigation Dropdown Fix

#4601 WA, AHF Navigation Dropdown Fix

apps/page/pickup-shelf/src/lib/shared/pickup-shelf-details-header-nav-menu/pickup-shelf-details-header-nav-menu.component.html

@@ -1,6 +1,7 @@
 <button
   type="button"
-  class="px-2 py-3 bg-[#C6CBD0] rounded flex flex-row items-center open:bg-[#596470] open:text-white z-dropdown"
+  [disabled]="!(customer$ | async)"
+  class="page-pickup-shelf-details-header-nav-menu__nav-button px-2 py-3 bg-[#C6CBD0] rounded flex flex-row items-center open:bg-[#596470] open:text-white z-dropdown"
   [cdkMenuTriggerFor]="navMenu"
   #menuTrigger="cdkMenuTriggerFor"
   [class.open]="menuTrigger.isOpen()"

apps/page/pickup-shelf/src/lib/shared/pickup-shelf-details-header-nav-menu/pickup-shelf-details-header-nav-menu.component.scss

@@ -1,3 +1,7 @@
 :host {
   @apply inline-block;
 }
+
+.page-pickup-shelf-details-header-nav-menu__nav-button:disabled {
+  @apply cursor-not-allowed text-white;
+}

apps/page/pickup-shelf/src/lib/shared/pickup-shelf-details-header-nav-menu/pickup-shelf-details-header-nav-menu.component.ts

@@ -7,11 +7,12 @@ import { ComponentStore } from '@ngrx/component-store';
 import { IconComponent } from '@shared/components/icon';
 import { SharedMenuModule } from '@shared/components/menu';
 import { CustomerSearchNavigation } from '@shared/services';
+import { CustomerInfoDTO } from '@swagger/crm';
 import { combineLatest } from 'rxjs';
 import { map } from 'rxjs/operators';
 
 export interface PickUpShelfDetailsHeaderNavMenuComponentState {
-  customerId?: number;
+  customer?: CustomerInfoDTO;
   showCustomerDetails: boolean;
 }
 
@@ -25,26 +26,26 @@ export interface PickUpShelfDetailsHeaderNavMenuComponentState {
   imports: [CdkMenuModule, SharedMenuModule, IconComponent, RouterLink, NgIf, AsyncPipe],
 })
 export class PickUpShelfDetailsHeaderNavMenuComponent extends ComponentStore<PickUpShelfDetailsHeaderNavMenuComponentState> {
-  @Input() set customerId(value: NumberInput) {
-    this.patchState({ customerId: coerceNumberProperty(value) });
+  @Input() set customer(value: CustomerInfoDTO) {
+    this.patchState({ customer: value });
   }
 
   @Input() set showCustomerDetails(value: BooleanInput) {
     this.patchState({ showCustomerDetails: coerceBooleanProperty(value) });
   }
 
-  readonly customerId$ = this.select((state) => state.customerId);
+  readonly customer$ = this.select((state) => state.customer);
 
   readonly showCustomerDetails$ = this.select((state) => state.showCustomerDetails);
 
-  ordersRoute$ = this.customerId$.pipe(
-    map((customerId) => customerId && this._navigation.ordersRoute({ processId: Date.now(), customerId }))
+  ordersRoute$ = this.customer$.pipe(
+    map((customer) => !!customer && this._navigation.ordersRoute({ processId: Date.now(), customerId: customer?.id, customer }))
   );
 
-  customerDetailsRoute$ = combineLatest([this.showCustomerDetails$, this.customerId$]).pipe(
+  customerDetailsRoute$ = combineLatest([this.showCustomerDetails$, this.customer$]).pipe(
     map(
-      ([showCustomerDetails, customerId]) =>
-        showCustomerDetails && customerId && this._navigation.detailsRoute({ processId: Date.now(), customerId })
+      ([showCustomerDetails, customer]) =>
+        showCustomerDetails && !!customer && this._navigation.detailsRoute({ processId: Date.now(), customerId: customer?.id, customer })
     )
   );
 

apps/page/pickup-shelf/src/lib/shared/pickup-shelf-details-header/pickup-shelf-details-header.component.html

@@ -20,10 +20,7 @@
 
     <div class="page-pickup-shelf-details-header__details bg-white px-4 pt-4 pb-5">
       <div class="flex flex-row items-center" [class.mb-8]="!orderItem?.features?.paid && !isKulturpass">
-        <page-pickup-shelf-details-header-nav-menu
-          class="mr-2"
-          [customerId]="customerId$ | async"
-        ></page-pickup-shelf-details-header-nav-menu>
+        <page-pickup-shelf-details-header-nav-menu class="mr-2" [customer]="customer$ | async"></page-pickup-shelf-details-header-nav-menu>
         <h2 class="page-pickup-shelf-details-header__details-header items-center">
           <div class="text-h2">
             {{ orderItem?.organisation }}

apps/page/pickup-shelf/src/lib/shared/pickup-shelf-details-header/pickup-shelf-details-header.component.ts

@@ -101,9 +101,9 @@ export class PickUpShelfDetailsHeaderComponent {
 
   changeDateDisabled$ = this.changeStatusDisabled$;
 
-  customerId$ = this._store.customer$.pipe(map((customer) => customer?.id));
+  customer$ = this._store.customer$;
 
-  features$ = this._store.customer$.pipe(
+  features$ = this.customer$.pipe(
     map((customer) => customer?.features || []),
     map((features) => features.filter((f) => f.enabled && !!f.description)),
     shareReplay()

apps/shared/services/src/lib/navigation/customer-search.navigation.ts

@@ -2,7 +2,7 @@ import { NumberInput, coerceNumberProperty } from '@angular/cdk/coercion';
 import { Injectable } from '@angular/core';
 import { Router, UrlTree } from '@angular/router';
 import { Filter } from '@shared/components/filter';
-import { CustomerDTO } from '@swagger/crm';
+import { CustomerDTO, CustomerInfoDTO } from '@swagger/crm';
 import { NavigationRoute } from './defs/navigation-route';
 
 @Injectable({ providedIn: 'root' })
@@ -31,7 +31,7 @@ export class CustomerSearchNavigation {
     return this._router.navigate(route.path, { queryParams: route.queryParams });
   }
 
-  detailsRoute(params: { processId: NumberInput; customerId: NumberInput; customer?: CustomerDTO }): NavigationRoute {
+  detailsRoute(params: { processId: NumberInput; customerId: NumberInput; customer?: CustomerDTO | CustomerInfoDTO }): NavigationRoute {
     const path = [
       '/kunde',
       coerceNumberProperty(params.processId),
@@ -51,7 +51,7 @@ export class CustomerSearchNavigation {
     return {
       path,
       urlTree,
-      queryParams: {},
+      queryParams,
     };
   }
 
@@ -169,7 +169,7 @@ export class CustomerSearchNavigation {
     };
   }
 
-  ordersRoute(params: { processId: NumberInput; customerId: NumberInput }): NavigationRoute {
+  ordersRoute(params: { processId: NumberInput; customerId: NumberInput; customer?: CustomerDTO | CustomerInfoDTO }): NavigationRoute {
     const path = [
       '/kunde',
       coerceNumberProperty(params.processId),
@@ -182,12 +182,19 @@ export class CustomerSearchNavigation {
       },
     ];
 
-    const urlTree = this._router.createUrlTree(path, { queryParams: {} });
+    const queryParams: Record<string, string> = {};
+
+    if (params.customer) {
+      queryParams.main_qs = params.customer?.customerNumber;
+      queryParams.filter_customertype = '';
+    }
+
+    const urlTree = this._router.createUrlTree(path, { queryParams });
 
     return {
       path,
       urlTree,
-      queryParams: {},
+      queryParams,
     };
   }