@WidgetComponent
File
Description
Used in iPIM Buy.
No Widgetframe.
Implements
Metadata
selector |
nm-clear-button |
styleUrls |
clearbutton.component.scss |
templateUrl |
./clearbutton.component.html |
Index
Widget inputs
|
|
Widget outputs
|
|
|
Properties
|
|
Methods
|
|
Constructor
constructor(_widgetframeService: WidgetframeService, _appdataStore: AppdataStore, halService: HalService, notificationService: NotificationsService, translateService: TranslateService)
|
|
Parameters :
Name |
Type |
Optional |
_widgetframeService |
WidgetframeService
|
no
|
_appdataStore |
AppdataStore
|
no
|
halService |
HalService
|
no
|
notificationService |
NotificationsService
|
no
|
translateService |
TranslateService
|
no
|
|
Methods
Protected
configureWidget
|
configureWidget(configuration: WidgetConfig)
|
Decorators : WidgetConfigure
|
|
|
ngOnDestroy
|
ngOnDestroy()
|
|
|
Public
action
|
action: any
|
Type : any
|
|
Public
isResetButtonNeeded
|
isResetButtonNeeded:
|
|
Private
reloadChannel
|
reloadChannel: Subject<any>
|
Type : Subject<any>
|
Default value : new Subject<any>()
|
Decorators : WidgetOutput
|
|
Private
unsubscribe
|
unsubscribe:
|
Default value : NgUnsubscribe.create()
|
|
import { takeUntil, map, filter, mergeMap } from "rxjs/operators";
import { Component, OnDestroy } from "@angular/core";
import { Subject } from "rxjs";
import { WidgetframeService } from "../../widgetframe/widgetframe.service";
import { WidgetConfig } from "../../widget.configuration";
import {
WidgetComponent,
WidgetConfiguration,
WidgetConfigure,
WidgetOutput,
} from "../../widget.metadata";
import { AppdataStore } from "../../../components/appdata/appdata.store";
import { HalService } from "../../../components/hal/hal.service";
import { TranslateService } from "@ngx-translate/core";
import { NgUnsubscribe } from "../../../ng-unsubscribe";
import { NotificationsService } from "../../../components/notifications/services/notifications.service";
/**
* Used in iPIM Buy.
* No Widgetframe.
*
*
*/
@WidgetComponent("nm-clear-button")
@Component({
selector: "nm-clear-button",
templateUrl: "./clearbutton.component.html",
styleUrls: ["./clearbutton.component.scss"],
})
export class ClearButtonWidgetComponent implements OnDestroy {
private unsubscribe = NgUnsubscribe.create();
@WidgetConfiguration()
public configuration: WidgetConfig;
// Emits the current date, after cart has been cleared
@WidgetOutput("reload")
private reloadChannel: Subject<any> = new Subject<any>();
public action: any;
public actionName: string;
public isResetButtonNeeded;
constructor(
private _widgetframeService: WidgetframeService,
private _appdataStore: AppdataStore,
private halService: HalService,
private notificationService: NotificationsService,
private translateService: TranslateService
) {}
@WidgetConfigure()
protected configureWidget(configuration: WidgetConfig) {
this.actionName = configuration.configuration["action"];
this._appdataStore
.getAppdata()
.pipe(
map((data) => data["buy"]._links["cart"].href),
mergeMap((cartHref) => this._widgetframeService.getData(cartHref)),
takeUntil(this.unsubscribe)
)
.subscribe((data) => {
this.action = data._actions[this.actionName];
});
this.halService
.getActionEvents()
.pipe(
filter((event) => event.name === this.actionName),
map((event) => (<any>event).response),
takeUntil(this.unsubscribe)
)
.subscribe((resp) => {
if (resp.message !== undefined) {
this.notificationService.success(resp.title, resp.message);
} else {
this.notificationService.success(
this.translateService.instant("message.success.title"),
this.translateService.instant("message.success.body")
);
}
if (configuration.configuration["triggerReload"]) {
this.reloadChannel.next(new Date());
}
});
}
ngOnDestroy() {
this.unsubscribe.destroy();
}
}
<button
mat-mini-fab
color="primary"
[nm-action]="action"
[action-name]="actionName"
popover="{{ configuration.configuration['infoText'] | translate }}"
class="mat-icon-button mat-elevation-z0 nm-button__reset"
[class.nm-fadein]="isResetButtonNeeded"
>
<div class="material-icons nm-svg-icon">
<mat-icon>close</mat-icon>
</div>
</button>
Legend
Html element with directive