UI: Added in device profile alarm rule condition to dynamic mode checkbox inherit from owner

This commit is contained in:
Vladyslav_Prykhodko 2021-02-11 13:38:18 +02:00 committed by Andrew Shvayka
parent d5b28222a3
commit ada0af2a41
8 changed files with 43 additions and 11 deletions

View File

@ -16,7 +16,7 @@
--> -->
<div fxFlex fxLayout="row" fxLayoutAlign="start start" fxLayoutGap="8px" [formGroup]="booleanFilterPredicateFormGroup"> <div fxFlex fxLayout="row" fxLayoutAlign="start start" fxLayoutGap="8px" [formGroup]="booleanFilterPredicateFormGroup">
<mat-form-field floatLabel="always" hideRequiredMarker fxFlex="40" class="mat-block"> <mat-form-field floatLabel="always" hideRequiredMarker fxFlex="30" class="mat-block">
<mat-label></mat-label> <mat-label></mat-label>
<mat-select required formControlName="operation" placeholder="{{'filter.operation.operation' | translate}}"> <mat-select required formControlName="operation" placeholder="{{'filter.operation.operation' | translate}}">
<mat-option *ngFor="let operation of booleanOperations" [value]="operation"> <mat-option *ngFor="let operation of booleanOperations" [value]="operation">
@ -25,7 +25,7 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource" <tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource"
fxFlex="60" fxFlex="70"
[valueType]="valueTypeEnum.BOOLEAN" [valueType]="valueTypeEnum.BOOLEAN"
formControlName="value"> formControlName="value">
</tb-filter-predicate-value> </tb-filter-predicate-value>

View File

@ -26,12 +26,12 @@
<span fxFlex="8"></span> <span fxFlex="8"></span>
<div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" fxFlex="92"> <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" fxFlex="92">
<div fxFlex fxLayout="row" fxLayoutGap="8px"> <div fxFlex fxLayout="row" fxLayoutGap="8px">
<div fxFlex="40" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px"> <div fxFlex="30" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
<label fxFlex translate class="tb-title no-padding">filter.operation.operation</label> <label fxFlex translate class="tb-title no-padding">filter.operation.operation</label>
<label *ngIf="valueType === valueTypeEnum.STRING" <label *ngIf="valueType === valueTypeEnum.STRING"
translate class="tb-title no-padding" style="min-width: 70px;">filter.ignore-case</label> translate class="tb-title no-padding" style="min-width: 70px;">filter.ignore-case</label>
</div> </div>
<label fxFlex="60" translate class="tb-title no-padding">filter.value</label> <label fxFlex="70" translate class="tb-title no-padding">filter.value</label>
</div> </div>
<label *ngIf="displayUserParameters" <label *ngIf="displayUserParameters"
translate class="tb-title no-padding" style="width: 60px;">filter.user-parameters</label> translate class="tb-title no-padding" style="width: 60px;">filter.user-parameters</label>

View File

@ -61,6 +61,15 @@
</mat-form-field> </mat-form-field>
<div class="tb-hint" translate>filter.dynamic-source-type</div> <div class="tb-hint" translate>filter.dynamic-source-type</div>
</div> </div>
<div *ngIf="!allow"
[ngClass]="{invisible: !inheritMode}"
fxLayout="column"
fxLayoutAlign="center center">
<mat-checkbox formControlName="inherit"
style="min-width: 35px;"
></mat-checkbox>
<div class="tb-hint">Inherit from owner</div>
</div>
<div fxFlex fxLayout="column"> <div fxFlex fxLayout="column">
<mat-form-field floatLabel="always" hideRequiredMarker class="mat-block"> <mat-form-field floatLabel="always" hideRequiredMarker class="mat-block">
<mat-label></mat-label> <mat-label></mat-label>

View File

@ -44,6 +44,9 @@ import {
}) })
export class FilterPredicateValueComponent implements ControlValueAccessor, OnInit { export class FilterPredicateValueComponent implements ControlValueAccessor, OnInit {
private readonly inheritFromSources: DynamicValueSourceType[] = [DynamicValueSourceType.CURRENT_CUSTOMER,
DynamicValueSourceType.CURRENT_DEVICE];
@Input() disabled: boolean; @Input() disabled: boolean;
@Input() @Input()
@ -72,6 +75,8 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
dynamicMode = false; dynamicMode = false;
inheritMode = false;
allow = true; allow = true;
private propagateChange = null; private propagateChange = null;
@ -105,7 +110,8 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
dynamicValue: this.fb.group( dynamicValue: this.fb.group(
{ {
sourceType: [null], sourceType: [null],
sourceAttribute: [null] sourceAttribute: [null],
inherit: [false]
} }
) )
}); });
@ -114,6 +120,7 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
if (!sourceType) { if (!sourceType) {
this.filterPredicateValueFormGroup.get('dynamicValue').get('sourceAttribute').patchValue(null, {emitEvent: false}); this.filterPredicateValueFormGroup.get('dynamicValue').get('sourceAttribute').patchValue(null, {emitEvent: false});
} }
this.updateInheritValue(sourceType);
} }
); );
this.filterPredicateValueFormGroup.valueChanges.subscribe(() => { this.filterPredicateValueFormGroup.valueChanges.subscribe(() => {
@ -139,10 +146,13 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
writeValue(predicateValue: FilterPredicateValue<string | number | boolean>): void { writeValue(predicateValue: FilterPredicateValue<string | number | boolean>): void {
this.filterPredicateValueFormGroup.get('defaultValue').patchValue(predicateValue.defaultValue, {emitEvent: false}); this.filterPredicateValueFormGroup.get('defaultValue').patchValue(predicateValue.defaultValue, {emitEvent: false});
this.filterPredicateValueFormGroup.get('dynamicValue').get('sourceType').patchValue(predicateValue.dynamicValue ? this.filterPredicateValueFormGroup.get('dynamicValue.sourceType').patchValue(predicateValue.dynamicValue ?
predicateValue.dynamicValue.sourceType : null, {emitEvent: false}); predicateValue.dynamicValue.sourceType : null, {emitEvent: false});
this.filterPredicateValueFormGroup.get('dynamicValue').get('sourceAttribute').patchValue(predicateValue.dynamicValue ? this.filterPredicateValueFormGroup.get('dynamicValue.inherit').patchValue(predicateValue.dynamicValue ?
predicateValue.dynamicValue.inherit : false, {emitEvent: false});
this.filterPredicateValueFormGroup.get('dynamicValue.sourceAttribute').patchValue(predicateValue.dynamicValue ?
predicateValue.dynamicValue.sourceAttribute : null, {emitEvent: false}); predicateValue.dynamicValue.sourceAttribute : null, {emitEvent: false});
this.updateInheritValue(predicateValue?.dynamicValue?.sourceType);
} }
private updateModel() { private updateModel() {
@ -158,4 +168,12 @@ export class FilterPredicateValueComponent implements ControlValueAccessor, OnIn
this.propagateChange(predicateValue); this.propagateChange(predicateValue);
} }
private updateInheritValue(sourceType: DynamicValueSourceType) {
if (this.inheritFromSources.includes(sourceType)) {
this.inheritMode = true;
} else {
this.filterPredicateValueFormGroup.get('dynamicValue.inherit').patchValue(false, {emitEvent: false});
this.inheritMode = false;
}
}
} }

View File

@ -17,6 +17,10 @@
.tb-hint { .tb-hint {
padding-bottom: 0; padding-bottom: 0;
} }
.invisible{
visibility: hidden;
}
} }
:host ::ng-deep { :host ::ng-deep {

View File

@ -16,7 +16,7 @@
--> -->
<div fxFlex fxLayout="row" fxLayoutAlign="start start" fxLayoutGap="8px" [formGroup]="numericFilterPredicateFormGroup"> <div fxFlex fxLayout="row" fxLayoutAlign="start start" fxLayoutGap="8px" [formGroup]="numericFilterPredicateFormGroup">
<mat-form-field floatLabel="always" hideRequiredMarker fxFlex="40" class="mat-block"> <mat-form-field floatLabel="always" hideRequiredMarker fxFlex="30" class="mat-block">
<mat-label></mat-label> <mat-label></mat-label>
<mat-select required formControlName="operation" placeholder="{{'filter.operation.operation' | translate}}"> <mat-select required formControlName="operation" placeholder="{{'filter.operation.operation' | translate}}">
<mat-option *ngFor="let operation of numericOperations" [value]="operation"> <mat-option *ngFor="let operation of numericOperations" [value]="operation">
@ -25,7 +25,7 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource" <tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource"
fxFlex="60" fxFlex="70"
[valueType]="valueType" [valueType]="valueType"
formControlName="value"> formControlName="value">
</tb-filter-predicate-value> </tb-filter-predicate-value>

View File

@ -16,7 +16,7 @@
--> -->
<div fxFlex fxLayout="row" fxLayoutAlign="start start" fxLayoutGap="8px" [formGroup]="stringFilterPredicateFormGroup"> <div fxFlex fxLayout="row" fxLayoutAlign="start start" fxLayoutGap="8px" [formGroup]="stringFilterPredicateFormGroup">
<div fxFlex="40" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px"> <div fxFlex="30" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
<mat-form-field floatLabel="always" hideRequiredMarker fxFlex class="mat-block"> <mat-form-field floatLabel="always" hideRequiredMarker fxFlex class="mat-block">
<mat-label></mat-label> <mat-label></mat-label>
<mat-select required formControlName="operation" placeholder="{{'filter.operation.operation' | translate}}"> <mat-select required formControlName="operation" placeholder="{{'filter.operation.operation' | translate}}">
@ -29,7 +29,7 @@
</mat-checkbox> </mat-checkbox>
</div> </div>
<tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource" <tb-filter-predicate-value [allowUserDynamicSource]="allowUserDynamicSource"
fxFlex="60" fxFlex="70"
[valueType]="valueTypeEnum.STRING" [valueType]="valueTypeEnum.STRING"
formControlName="value"> formControlName="value">
</tb-filter-predicate-value> </tb-filter-predicate-value>

View File

@ -285,6 +285,7 @@ export const dynamicValueSourceTypeTranslationMap = new Map<DynamicValueSourceTy
export interface DynamicValue<T> { export interface DynamicValue<T> {
sourceType: DynamicValueSourceType; sourceType: DynamicValueSourceType;
sourceAttribute: string; sourceAttribute: string;
inherit?: boolean;
} }
export interface FilterPredicateValue<T> { export interface FilterPredicateValue<T> {