MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

34
sharedComponents/input/input.component.ts
View File

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