nm-imarket-progress
src/app/shared/widgets/apps/imarket/progress/imarket-progress.component.ts
| selector | nm-imarket-progress |
| styleUrls | imarket-progress.component.scss |
| templateUrl | ./imarket-progress.component.html |
Widget inputs |
Widget outputs |
Properties |
|
Methods |
|
constructor(widgetFrameService: WidgetframeService, cdr: ChangeDetectorRef)
|
|||||||||
|
Parameters :
|
| Protected configureWidget | ||||||
configureWidget(configuration: WidgetConfig)
|
||||||
Decorators : WidgetConfigure
|
||||||
|
Parameters :
Returns :
void
|
| ngAfterViewInit |
ngAfterViewInit()
|
|
Returns :
void
|
| Public ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| Public sortNull |
sortNull()
|
|
Returns :
number
|
| Public _id |
_id:
|
Type : string
|
Decorators : WidgetId
|
| Public configuration |
configuration:
|
Type : WidgetConfig
|
Decorators : WidgetConfiguration
|
| Public current |
current:
|
Type : null
|
Default value : null
|
| Public currentTitle |
currentTitle:
|
Type : string
|
| Public emptyMessage |
emptyMessage:
|
Type : string
|
| Public infotext |
infotext:
|
Type : string
|
| Private inputChannel |
inputChannel:
|
Type : ReplaySubject<any>
|
Default value : new ReplaySubject<any>(1)
|
Decorators : WidgetInput
|
| Public last |
last:
|
Type : null
|
Default value : null
|
| Public lastTitle |
lastTitle:
|
Type : string
|
| Public title |
title:
|
Type : string
|
| unsubscribe |
unsubscribe:
|
Default value : NgUnsubscribe.create()
|
| Public wikiLink |
wikiLink:
|
Type : string
|
| Public withHeader |
withHeader:
|
Type : boolean
|
Default value : false
|
import {
AfterViewInit,
ChangeDetectorRef,
Component,
Input,
OnInit,
} from "@angular/core";
import {
WidgetComponent,
WidgetConfiguration,
WidgetConfigure,
WidgetId,
WidgetInput,
} from "../../../widget.metadata";
import { getOrDefault, WidgetConfig } from "../../../widget.configuration";
import { ReplaySubject } from "rxjs";
import { NgUnsubscribe } from "../../../../ng-unsubscribe";
import { WidgetframeService } from "../../../widgetframe/widgetframe.service";
@WidgetComponent("nm-imarket-progress")
@Component({
selector: "nm-imarket-progress",
viewProviders: [],
templateUrl: "./imarket-progress.component.html",
styleUrls: ["./imarket-progress.component.scss"],
providers: [],
})
export class IMarketProgressComponent implements AfterViewInit, OnInit {
@WidgetId()
public _id: string;
@WidgetConfiguration()
public configuration: WidgetConfig;
@WidgetInput("uri")
private inputChannel: ReplaySubject<any> = new ReplaySubject<any>(1);
public wikiLink: string;
public infotext: string;
public title: string;
public currentTitle: string;
public lastTitle: string;
public emptyMessage: string;
public withHeader: boolean = false;
public current = null;
public last = null;
unsubscribe = NgUnsubscribe.create();
constructor(
protected widgetFrameService: WidgetframeService,
private cdr: ChangeDetectorRef
) {}
@WidgetConfigure()
protected configureWidget(configuration: WidgetConfig) {
this.infotext = this.configuration.configuration["infoText"];
this.title = this.configuration.configuration["title"];
this.wikiLink = this.configuration.configuration["wikiLink"];
this.currentTitle = this.configuration.configuration["currentTitle"];
this.lastTitle = this.configuration.configuration["lastTitle"];
this.emptyMessage = this.configuration.configuration["emptyMessage"];
this.withHeader = getOrDefault(
this.configuration.configuration.withHeader,
true
);
this.inputChannel.subscribe((value) => {
this.widgetFrameService.getData(value).subscribe((data) => {
if (data && data.current) {
this.current = data.current;
} else {
this.current = null;
}
if (data && data.last) {
this.last = data.last;
} else {
this.last = null;
}
this.cdr.detectChanges();
});
});
}
public ngOnInit() {}
public sortNull() {
return 0;
}
ngAfterViewInit() {}
}
<nm-widgetframe
widgetId="{{ _id }}"
[header]="configuration.configuration['header']"
[configuration]="configuration"
[width]="configuration.configuration['width']"
[infoTitle]="title"
[infoText]="infotext"
[infoPlacement]="'bottom'"
[toolbarInvisible]="!withHeader"
[wikiLink]="wikiLink"
[isCollapsible]="false"
>
<div slot="title" class="nm-widgetframe__title" style="width: 100%">
<span style="float: left"> {{ title | translate }} </span>
</div>
<div slot="content" class="nm-widgetframe__content">
<div *ngIf="!current && !last">{{ emptyMessage | translate }}</div>
<div *ngIf="current || last">
<div id="imarket-current-run" class="ng-cloak" *ngIf="current" ng-cloak>
<div class="progress-title">{{ currentTitle | translate }}</div>
<div class="sections small row">
<span
*ngFor="let state of current | keyvalue: sortNull"
class="section {{ state.value.state }}"
>
<div class="section-content">
<span class="section-name">{{ state.key }}</span
><br />
<span class="section-time" *ngIf="state?.value?.time">{{
state.value.time
}}</span>
</div>
</span>
</div>
</div>
<br />
<div id="imarket-last-run" class="ng-cloak" *ngIf="last" ng-cloak>
<div class="progress-title">{{ lastTitle | translate }}</div>
<div class="sections small row ng-cloak" ng-cloak>
<span
*ngFor="let state of last | keyvalue: sortNull"
class="section {{ state.value.state }}"
>
<div class="section-content">
<span class="section-name">{{ state.key }}</span
><br />
<span class="section-time" *ngIf="state?.value?.time">{{
state.value.time
}}</span>
</div>
</span>
</div>
</div>
</div>
</div>
</nm-widgetframe>