[develop]: Fix options in input component. Add error handler in cache-indicators.

This commit is contained in:
Konstantinos Triantafyllou 2024-09-23 16:43:31 +03:00
parent 2279420241
commit c762858427
2 changed files with 55 additions and 33 deletions

View File

@ -1,18 +1,33 @@
import {Component, Inject, Input, OnChanges, OnDestroy, OnInit, PLATFORM_ID, SimpleChanges} from "@angular/core";
import {
Component,
Inject,
InjectionToken,
Input,
OnChanges,
OnDestroy,
OnInit,
PLATFORM_ID,
SimpleChanges
} from "@angular/core";
import {Report} from "./cache-indicators";
import {CacheIndicatorsService} from "./cache-indicators.service";
import {interval, Subject, Subscription} from "rxjs";
import {map, switchMap, takeUntil} from "rxjs/operators";
import {isPlatformBrowser} from "@angular/common";
@Component({
selector: 'cache-indicators',
template: `
<div *ngIf="report" class="cache-progress">
<div class="uk-position-relative" [attr.uk-tooltip]="'Caching indicators process for ' + alias">
<div class="uk-progress-circle" [attr.percentage]="report.percentage?report.percentage:0" [style]="'--percentage: ' + (report.percentage?report.percentage:0)"></div>
<button *ngIf="report.percentage === 100" (click)="clear()" class="uk-icon-button uk-icon-button-xsmall uk-button-default uk-position-top-right"><icon name="close" [flex]="true" ratio="0.8"></icon></button>
</div>
</div>
<div *ngIf="report" class="cache-progress">
<div class="uk-position-relative" [attr.uk-tooltip]="'Caching indicators process for ' + alias">
<div class="uk-progress-circle" [attr.percentage]="report.percentage?report.percentage:0"
[style]="'--percentage: ' + (report.percentage?report.percentage:0)"></div>
<button *ngIf="report.percentage === 100" (click)="clear()"
class="uk-icon-button uk-icon-button-xsmall uk-button-default uk-position-top-right">
<icon name="close" [flex]="true" ratio="0.8"></icon>
</button>
</div>
</div>
`,
styleUrls: ['cache-indicators.component.less']
})
@ -24,7 +39,7 @@ export class CacheIndicatorsComponent implements OnInit, OnChanges, OnDestroy {
@Input() alias: string;
constructor(private cacheIndicatorsService: CacheIndicatorsService,
@Inject(PLATFORM_ID) private platformId) {
@Inject(PLATFORM_ID) private platformId: any) {
}
ngOnInit() {
@ -32,28 +47,30 @@ export class CacheIndicatorsComponent implements OnInit, OnChanges, OnDestroy {
}
ngOnChanges(changes: SimpleChanges) {
if(changes.alias) {
if (changes.alias) {
this.clear();
this.getReport();
}
}
getReport() {
this.clear();
this.subscriptions.push(this.cacheIndicatorsService.getReport(this.alias).subscribe(report => {
this.getReportInterval(report);
}, error => {
this.report = null;
}));
}
getReportInterval(report: Report) {
if(this.isBrowser && (this.report || !report?.completed)) {
if (this.isBrowser && (this.report || !report?.completed)) {
this.report = report;
this.subscriptions.push(interval(this.interval).pipe(
map(() => this.cacheIndicatorsService.getReport(this.alias)),
switchMap(report => report),
takeUntil(this.destroy$)).subscribe(report => {
console.log(this.alias);
takeUntil(this.destroy$)).
subscribe(report => {
this.report = report;
if(this.report.completed) {
if (this.report.completed) {
this.destroy$.next();
}
}));
@ -62,14 +79,15 @@ export class CacheIndicatorsComponent implements OnInit, OnChanges, OnDestroy {
clear() {
this.subscriptions.forEach(subscription => {
subscription.unsubscribe();
})
if (subscription instanceof Subscription) {
subscription.unsubscribe();
}
});
this.report = null;
}
get isBrowser() {
return this.platformId === 'browser';
return isPlatformBrowser(this.platformId);
}
ngOnDestroy() {

View File

@ -374,21 +374,25 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
@Input()
set options(options: (Option | string | number) []) {
this.optionsArray = options.map(option => {
if (option === null) {
return {
label: this.noValueSelected,
value: ''
};
} else if (typeof option === 'string' || typeof option === 'number') {
return {
label: option.toString(),
value: option
};
} else {
return option;
}
});
if(options) {
this.optionsArray = options.map(option => {
if (option === null) {
return {
label: this.noValueSelected,
value: ''
};
} else if (typeof option === 'string' || typeof option === 'number') {
return {
label: option.toString(),
value: option
};
} else {
return option;
}
});
} else {
this.optionsArray = [];
}
if (!this.tooltip) {
this.tooltip = this.optionsArray.length > 0;
}