File
Metadata
| changeDetection |
ChangeDetectionStrategy.OnPush |
| selector |
cx-configure-cart-entry |
| templateUrl |
./configure-cart-entry.component.html |
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
Methods
|
getDisplayOnly
|
getDisplayOnly()
|
|
|
Retrieves the state of the configuration.
@returns {boolean} - 'true' if the configuration is read only, otherwise 'false'
- '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.
|
|
getOwnerType
|
getOwnerType()
|
|
|
Verifies whether the cart entry has an order code and returns a corresponding owner type.
|
|
getRoute
|
getRoute()
|
|
|
Retrieves a corresponding route depending whether the configuration is read only or not.
|
|
hasIssues
|
hasIssues()
|
|
|
Verifies whether the entry has any issues.
- 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'
- 'true' if the the configuration is not read only, otherwise 'false'
|
|
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 with directive