File

feature-libs/product-configurator/common/components/configure-cart-entry/configure-cart-entry.component.ts

Metadata

changeDetection ChangeDetectionStrategy.OnPush
selector cx-configure-cart-entry
templateUrl ./configure-cart-entry.component.html

Index

Properties
Methods
Inputs

Constructor

constructor(commonConfigUtilsService: CommonConfiguratorUtilsService)
Parameters :
Name Type Optional
commonConfigUtilsService CommonConfiguratorUtilsService No

Inputs

cartEntry
Type : OrderEntry
disabled
Type : boolean
msgBanner
Type : boolean
readOnly
Type : boolean

Methods

getDisplayOnly
getDisplayOnly()

Retrieves the state of the configuration.

@returns {boolean} - 'true' if the configuration is read only, otherwise 'false'

Returns : boolean
  • 'true' if the configuration is read only, otherwise 'false'
getEntityKey
getEntityKey()

Verifies whether the cart entry has an order code, retrieves a composed owner ID and concatenates a corresponding entry number.

Returns : string
  • an entry key
getOwnerType
getOwnerType()

Verifies whether the cart entry has an order code and returns a corresponding owner type.

  • an owner type
getRoute
getRoute()

Retrieves a corresponding route depending whether the configuration is read only or not.

Returns : string
  • a route
hasIssues
hasIssues()

Verifies whether the entry has any issues.

Returns : boolean
  • whether there are any issues
isDisabled
isDisabled()

Verifies whether the link to the configuration is disabled.

@returns {boolean} - 'true' if the the configuration is not read only, otherwise 'false'

Returns : boolean
  • 'true' if the the configuration is not read only, otherwise 'false'

Properties

cartEntry
Type : OrderEntry
Decorators :
@Input()
disabled
Type : boolean
Decorators :
@Input()
msgBanner
Type : boolean
Decorators :
@Input()
readOnly
Type : boolean
Decorators :
@Input()
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { OrderEntry } from '@spartacus/core';
import { CommonConfigurator } from '../../core/model/common-configurator.model';
import { CommonConfiguratorUtilsService } from '../../shared/utils/common-configurator-utils.service';

@Component({
  selector: 'cx-configure-cart-entry',
  templateUrl: './configure-cart-entry.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ConfigureCartEntryComponent {
  @Input() cartEntry: OrderEntry;
  @Input() readOnly: boolean;
  @Input() msgBanner: boolean;
  @Input() disabled: boolean;

  /**
   * Verifies whether the entry has any issues.
   *
   * @returns {boolean} - whether there are any issues
   */
  hasIssues(): boolean {
    return this.commonConfigUtilsService.hasIssues(this.cartEntry);
  }

  /**
   * Verifies whether the cart entry has an order code and returns a corresponding owner type.
   *
   * @returns {CommonConfigurator.OwnerType} - an owner type
   */
  getOwnerType(): CommonConfigurator.OwnerType {
    return this.cartEntry.orderCode !== undefined
      ? CommonConfigurator.OwnerType.ORDER_ENTRY
      : CommonConfigurator.OwnerType.CART_ENTRY;
  }

  /**
   * Verifies whether the cart entry has an order code, retrieves a composed owner ID
   * and concatenates a corresponding entry number.
   *
   * @returns {string} - an entry key
   */
  getEntityKey(): string {
    const entryNumber = this.cartEntry.entryNumber;
    if (entryNumber === undefined) {
      throw new Error('No entryNumber present in entry');
    }

    return this.cartEntry.orderCode
      ? this.commonConfigUtilsService.getComposedOwnerId(
          this.cartEntry.orderCode,
          entryNumber
        )
      : entryNumber.toString();
  }

  /**
   * Retrieves a corresponding route depending whether the configuration is read only or not.
   *
   * @returns {string} - a route
   */
  getRoute(): string {
    const configuratorType = this.cartEntry.product?.configuratorType;
    return this.readOnly
      ? 'configureOverview' + configuratorType
      : 'configure' + configuratorType;
  }

  /**
   * Retrieves the state of the configuration.
   *
   *  @returns {boolean} - 'true' if the configuration is read only, otherwise 'false'
   */
  getDisplayOnly(): boolean {
    return this.readOnly;
  }

  /**
   * Verifies whether the link to the configuration is disabled.
   *
   *  @returns {boolean} - 'true' if the the configuration is not read only, otherwise 'false'
   */
  isDisabled() {
    return this.readOnly ? false : this.disabled;
  }

  constructor(
    protected commonConfigUtilsService: CommonConfiguratorUtilsService
  ) {}
}
<ng-container *ngIf="cartEntry">
  <label *ngIf="isDisabled()" class="disabled-link">
    <ng-container *ngIf="isDisabled(); then configureText"> </ng-container>
  </label>

  <a
    *ngIf="!isDisabled()"
    class="link cx-action-link"
    [routerLink]="
      {
        cxRoute: getRoute(),
        params: {
          ownerType: getOwnerType(),
          entityKey: getEntityKey(),
          displayOnly: getDisplayOnly()
        }
      } | cxUrl
    "
    cxModal="dismiss"
    [queryParams]="{ forceReload: true, resolveIssues: hasIssues() }"
    cxAutoFocus
  >
    <ng-container *ngIf="!isDisabled(); then configureText"> </ng-container>
  </a>
</ng-container>

<ng-template #configureText>
  <ng-container *ngIf="readOnly">
    {{ 'configurator.header.displayConfiguration' | cxTranslate }}</ng-container
  >
  <ng-container *ngIf="!readOnly && !msgBanner">
    {{ 'configurator.header.editConfiguration' | cxTranslate }}
  </ng-container>

  <ng-container *ngIf="!readOnly && msgBanner">
    {{ 'configurator.header.resolveIssues' | cxTranslate }}
  </ng-container>
</ng-template>
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""