#3385 HFI Gutschein Anzeige Kaufoptionen

apps/shared/modals/purchase-options-modal/src/lib/constants.ts

@@ -20,3 +20,5 @@ export const DEFAULT_PRICE_DTO: PriceDTO = { value: { value: undefined }, vat: {
 export const DEFAULT_PRICE_VALUE: PriceValueDTO = { value: 0, currency: 'EUR' };
 
 export const DEFAULT_VAT_VALUE: VATValueDTO = { value: 0 };
+
+export const GIFT_CARD_MAX_PRICE = 200;

apps/shared/modals/purchase-options-modal/src/lib/purchase-options-list-item/purchase-options-list-item.component.html

@@ -77,17 +77,13 @@
           <shared-input-control-suffix>EUR</shared-input-control-suffix>
           <shared-input-control-error error="required">Preis ist ungültig</shared-input-control-error>
           <shared-input-control-error error="pattern">Preis ist ungültig</shared-input-control-error>
+          <shared-input-control-error error="min">Preis ist ungültig</shared-input-control-error>
+          <shared-input-control-error error="max">Preis ist ungültig</shared-input-control-error>
         </shared-input-control>
       </div>
     </div>
     <ui-quantity-dropdown class="mt-2" [formControl]="quantityFormControl" [range]="maxSelectableQuantity$ | async"> </ui-quantity-dropdown>
-    <input
-      *ngIf="(canAddResult$ | async)?.canAdd"
-      [class.hidden]="hideCheckbox$ | async"
-      class="fancy-checkbox mt-7"
-      [formControl]="selectedFormControl"
-      type="checkbox"
-    />
+    <input *ngIf="(canAddResult$ | async)?.canAdd" class="fancy-checkbox mt-7" [formControl]="selectedFormControl" type="checkbox" />
   </div>
 </div>
 <div class="flex flex-row">

apps/shared/modals/purchase-options-modal/src/lib/purchase-options-list-item/purchase-options-list-item.component.ts

@@ -9,6 +9,7 @@ import { UiQuantityDropdownModule } from '@ui/quantity-dropdown';
 import { UiSpinnerModule } from '@ui/spinner';
 import { combineLatest, Observable, ReplaySubject, Subscription } from 'rxjs';
 import { map, startWith, switchMap } from 'rxjs/operators';
+import { GIFT_CARD_MAX_PRICE } from '../constants';
 import { Item, mapToItemData, PurchaseOptionsService, PurchaseOptionsStore } from '../store';
 
 @Component({
@@ -46,7 +47,12 @@ export class PurchaseOptionsListItemComponent implements OnInit, OnDestroy, OnCh
 
   quantityFormControl = new FormControl<number>(null);
 
-  priceFormControl = new FormControl<number>(null, [Validators.required, Validators.pattern(/^\d+(,\d{1,2})?$/)]);
+  priceFormControl = new FormControl<number>(null, [
+    Validators.required,
+    Validators.pattern(/^\d+(,\d{1,2})?$/),
+    Validators.min(1),
+    Validators.max(GIFT_CARD_MAX_PRICE),
+  ]);
 
   selectedFormControl = new FormControl<boolean>(false);
 
@@ -64,10 +70,6 @@ export class PurchaseOptionsListItemComponent implements OnInit, OnDestroy, OnCh
 
   canEditPrice$ = this.item$.pipe(switchMap((item) => this._store.getCanEditPrice$(item.id)));
 
-  hideCheckbox$ = combineLatest([this._store.items$, this._store.purchaseOption$]).pipe(
-    map(([items, purchaseOption]) => purchaseOption == undefined || items?.length === 1)
-  );
-
   canAddResult$ = this.item$.pipe(switchMap((item) => this._store.getCanAddResultForItemAndCurrentPurchaseOption$(item.id)));
 
   constructor(private _store: PurchaseOptionsStore, private _service: PurchaseOptionsService) {}

apps/shared/modals/purchase-options-modal/src/lib/purchase-options-modal.component.html

@@ -13,8 +13,10 @@
   </ng-container> -->
 
   <ng-container *ngIf="!(isDownloadOnly$ | async)">
-    <app-in-store-purchase-options-tile> </app-in-store-purchase-options-tile>
-    <app-pickup-purchase-options-tile> </app-pickup-purchase-options-tile>
+    <ng-container *ngIf="!(isGiftCardOnly$ | async)">
+      <app-in-store-purchase-options-tile> </app-in-store-purchase-options-tile>
+      <app-pickup-purchase-options-tile> </app-pickup-purchase-options-tile>
+    </ng-container>
     <app-delivery-purchase-options-tile> </app-delivery-purchase-options-tile>
   </ng-container>
 

apps/shared/modals/purchase-options-modal/src/lib/purchase-options-modal.component.ts

@@ -13,7 +13,7 @@ import {
   PickupPurchaseOptionTileComponent,
 } from './purchase-options-tile';
 import { AddToShoppingCartDTO } from '@swagger/checkout';
-import { Item, PurchaseOptionsStore } from './store';
+import { isGiftCard, Item, PurchaseOptionsStore } from './store';
 import { map, shareReplay } from 'rxjs/operators';
 
 @Component({
@@ -46,6 +46,8 @@ export class PurchaseOptionsModalComponent implements OnInit, OnDestroy {
     map((purchasingOptions) => purchasingOptions.length === 1 && purchasingOptions[0] === 'download')
   );
 
+  isGiftCardOnly$ = this.store.items$.pipe(map((items) => items.every((item) => isGiftCard(item, this.store.type))));
+
   hasDownload$ = this.purchasingOptions$.pipe(map((purchasingOptions) => purchasingOptions.includes('download')));
 
   canContinue$ = this.store.canContinue$.pipe(shareReplay(1));

apps/shared/modals/purchase-options-modal/src/lib/store/purchase-options.selectors.ts

@@ -1,5 +1,5 @@
 import { PriceDTO, PriceValueDTO } from '@swagger/checkout';
-import { DEFAULT_PRICE_DTO, DEFAULT_PRICE_VALUE, GIFT_CARD_TYPE, PURCHASE_OPTIONS } from '../constants';
+import { DEFAULT_PRICE_DTO, DEFAULT_PRICE_VALUE, GIFT_CARD_MAX_PRICE, GIFT_CARD_TYPE, PURCHASE_OPTIONS } from '../constants';
 import { isGiftCard, isItemDTO } from './purchase-options.helpers';
 import { PurchaseOptionsState } from './purchase-options.state';
 import { ActionType, Availability, Branch, CanAdd, Item, PurchaseOption } from './purchase-options.types';
@@ -210,7 +210,7 @@ export function getPriceForPurchaseOption(itemId: number, purchaseOption: Purcha
     }
 
     if (availability) {
-      return availability.data.price;
+      return availability.data.price ?? DEFAULT_PRICE_DTO;
     }
 
     if (availability === undefined) {
@@ -284,6 +284,15 @@ export function canContinue(state: PurchaseOptionsState): boolean {
     return false;
   }
 
+  for (let item of items) {
+    if (isGiftCard(item, getType(state))) {
+      const price = getPriceForPurchaseOption(item.id, purchaseOption)(state);
+      if (!(price?.value?.value > 0 && price?.value?.value <= GIFT_CARD_MAX_PRICE)) {
+        return false;
+      }
+    }
+  }
+
   const selectedItemIds = getSelectedItemIds(state);
 
   if (selectedItemIds.length === 0) {

apps/shared/modals/purchase-options-modal/src/lib/store/purchase-options.store.ts

@@ -511,6 +511,10 @@ export class PurchaseOptionsStore extends ComponentStore<PurchaseOptionsState> {
     }
   }
 
+  isGiftcard(itemId: number) {
+    return this._service;
+  }
+
   getPrice(itemId: number) {
     return this.getPriceForPurchaseOption(itemId, this.purchaseOption);
   }
@@ -601,7 +605,7 @@ export class PurchaseOptionsStore extends ComponentStore<PurchaseOptionsState> {
 
     return {
       quantity: item.quantity,
-      availability: availability.data,
+      availability: { ...availability.data, price },
       destination,
       itemType: item.type,
       product: item.product,
@@ -637,13 +641,13 @@ export class PurchaseOptionsStore extends ComponentStore<PurchaseOptionsState> {
 
     return {
       quantity: item.quantity,
-      availability: availability.data,
+      availability: { ...availability.data, price },
       destination,
-      retailPrice: {
-        value: price.value.value,
-        currency: price.value.currency,
-        vatType: price.vat.vatType,
-      },
+      // retailPrice: {
+      //   value: price.value.value,
+      //   currency: price.value.currency,
+      //   vatType: price.vat.vatType,
+      // },
     };
   }