UI: Refactoring

This commit is contained in:
Artem Dzhereleiko 2024-06-07 14:59:09 +03:00
parent 487c0e4989
commit fd7f91d948
4 changed files with 17 additions and 15 deletions

View File

@ -162,10 +162,10 @@ export const backwardCompatibilityTicks = (ticksValue: AttributeSourceProperty[]
return ticks;
};
export const convertLevelColorsSettingsToColorProcessor = (settings: DigitalGaugeSettings, keyColor?: string) => {
export const convertLevelColorsSettingsToColorProcessor = (settings: DigitalGaugeSettings, defaultColor?: string) => {
if (settings.barColor) {
if (!settings.barColor.color) {
settings.barColor.color = keyColor;
settings.barColor.color = defaultColor;
}
if (isDefinedAndNotNull(settings.barColor.gradient)) {
settings.barColor.gradient.minValue = settings.minValue;
@ -174,7 +174,7 @@ export const convertLevelColorsSettingsToColorProcessor = (settings: DigitalGaug
settings.barColor.gradient = defaultGradient(settings.minValue, settings.maxValue);
}
} else {
settings.barColor = constantColor(keyColor);
settings.barColor = constantColor(defaultColor);
if (settings.fixedLevelColors?.length) {
settings.barColor.rangeList = {
advancedMode: settings.useFixedLevelColor,

View File

@ -14,7 +14,7 @@
/// limitations under the License.
///
import { Component, forwardRef, Input, OnDestroy, OnInit } from '@angular/core';
import { Component, forwardRef, Input, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import {
AbstractControl,
ControlValueAccessor,
@ -62,7 +62,8 @@ export function advancedRangeValidator(control: AbstractControl): ValidationErro
useExisting: forwardRef(() => ColorRangeListComponent),
multi: true
}
]
],
encapsulation: ViewEncapsulation.None
})
export class ColorRangeListComponent implements OnInit, ControlValueAccessor, OnDestroy {
@ -110,7 +111,7 @@ export class ColorRangeListComponent implements OnInit, ControlValueAccessor, On
).subscribe(() => this.updateModel());
this.colorRangeListFormGroup.get('advancedMode').valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe(() => setTimeout(() => {this.popover?.updatePosition();}, 0));
).subscribe(() => Promise.resolve().then(() => this.popover?.updatePosition()));
}
ngOnDestroy() {
@ -174,7 +175,7 @@ export class ColorRangeListComponent implements OnInit, ControlValueAccessor, On
public removeAdvancedRange(index: number) {
(this.colorRangeListFormGroup.get('rangeAdvanced') as UntypedFormArray).removeAt(index);
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
}
get advancedRangeFormArray(): UntypedFormArray {
@ -188,7 +189,7 @@ export class ColorRangeListComponent implements OnInit, ControlValueAccessor, On
removeRange(index: number) {
this.rangeListFormArray.removeAt(index);
this.colorRangeListFormGroup.markAsDirty();
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
}
rangeDrop(event: CdkDragDrop<string[]>, range: string) {
@ -211,7 +212,7 @@ export class ColorRangeListComponent implements OnInit, ControlValueAccessor, On
const advancedRangeColorsArray = this.colorRangeListFormGroup.get('rangeAdvanced') as UntypedFormArray;
const advancedRangeColorControl = this.fb.control(advancedRange, [advancedRangeValidator]);
advancedRangeColorsArray.push(advancedRangeColorControl);
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
}
addRange() {
@ -223,7 +224,7 @@ export class ColorRangeListComponent implements OnInit, ControlValueAccessor, On
};
this.rangeListFormArray.push(this.colorRangeControl(newRange));
this.colorRangeListFormGroup.markAsDirty();
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
}
}

View File

@ -20,7 +20,8 @@ import {
ColorSettings,
ColorType,
colorTypeTranslations,
defaultGradient, defaultRange
defaultGradient,
defaultRange
} from '@shared/models/widget-settings.models';
import { TbPopoverComponent } from '@shared/components/popover.component';
import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
@ -107,7 +108,7 @@ export class ColorSettingsPanelComponent extends PageComponent implements OnInit
}
);
this.colorSettingsFormGroup.get('type').valueChanges.subscribe(() => {
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
});
}

View File

@ -119,7 +119,7 @@ export class GradientComponent implements OnInit, ControlValueAccessor, OnDestro
).subscribe(() => this.updateModel());
this.gradientFormGroup.get('advancedMode').valueChanges.pipe(
takeUntil(this.destroy$)
).subscribe(() => setTimeout(() => {this.popover?.updatePosition();}, 0));
).subscribe(() => Promise.resolve().then(() => this.popover?.updatePosition()));
}
ngOnDestroy() {
@ -233,7 +233,7 @@ export class GradientComponent implements OnInit, ControlValueAccessor, OnDestro
this.gradientListFormArray.removeAt(index);
}
this.gradientFormGroup.markAsDirty();
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
}
gradientDrop(event: CdkDragDrop<string[]>, advanced = false) {
@ -252,7 +252,7 @@ export class GradientComponent implements OnInit, ControlValueAccessor, OnDestro
this.gradientListFormArray.push(this.colorGradientControl('rgba(0,0,0,0.87)'));
}
this.gradientFormGroup.markAsDirty();
setTimeout(() => {this.popover?.updatePosition();}, 0);
Promise.resolve().then(() => this.popover?.updatePosition());
}
updateModel() {