Skip to content

Commit

Permalink
feat(datapoints-graph): alarm selector list item component
Browse files Browse the repository at this point in the history 
Alarm selector list item change active property and save

n/a
  • Loading branch information
@jdre-c8y
jdre-c8y committed Apr 24, 2024
1 parent 25b1dcb commit e13b9d7
Show file tree
Hide file tree
Showing 4 changed files with 20 additions and 119 deletions.
1 change: 1 addition & 0 deletions src/datapoints-graph/alarm-selector/alarm-selection-list/alarm-selection-list.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@
formControlName="details"
[showAddRemoveButton]="false"
[optionToRemove]="true"
[showActiveToggle]="true"
>
<c8y-li-drag-handle
cdkDragHandle
Expand Down
120 changes: 5 additions & 115 deletions ...nts-graph/alarm-selector/alarm-selector-list-item/alarm-selector-list-item.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,119 +88,9 @@
[label]="'Remove from list' | translate"
(click)="remove()"
></c8y-li-action>
<!-- <c8y-li-collapse>-->
<!-- <div class="data-point-details">-->
<!-- <ul class="list-unstyled small m-b-16">-->
<!-- <li class="p-t-4 p-b-4 flex-row separator-top-bottom">-->
<!-- <label class="small m-b-0 m-r-8 flex-item-v-start text-muted" translate>Fragment</label>-->
<!-- <span class="flex-item-right">-->
<!-- <c8y-highlight-->
<!-- [text]="formGroup.value.fragment"-->
<!-- [pattern]="highlightText"-->
<!-- [shouldTrimPattern]="true"-->
<!-- ></c8y-highlight>-->
<!-- </span>-->
<!-- </li>-->
<!-- <li class="p-t-4 p-b-4 flex-row separator-bottom">-->
<!-- <label class="small m-b-0 m-r-8 flex-item-v-start text-muted" translate>Series</label>-->
<!-- <span class="flex-item-right">-->
<!-- <c8y-highlight-->
<!-- [text]="formGroup.value.series"-->
<!-- [pattern]="highlightText"-->
<!-- [shouldTrimPattern]="true"-->
<!-- ></c8y-highlight>-->
<!-- </span>-->
<!-- </li>-->
<!-- </ul>-->
<!-- <div-->
<!-- class="form-group"-->
<!-- *ngIf="datapointLibraryEntries && datapointLibraryEntries | async as libraryEntries"-->
<!-- >-->
<!-- <label class="d-inline-block" translate>Data point template</label>-->
<!-- <button-->
<!-- class="btn btn-clean"-->
<!-- [popover]="datapointHintPopoverTemplate"-->
<!-- (click)="$event.stopPropagation()"-->
<!-- container="body"-->
<!-- [outsideClick]="true"-->
<!-- >-->
<!-- <i [c8yIcon]="'question-circle-o'" class="m-l-4 text-info"></i>-->
<!-- </button>-->

<!-- <ng-template #datapointHintPopoverTemplate>-->
<!-- {{-->
<!-- 'Using a data point template sets color, label, unit and ranges. Removing the template allows you to set the values manually.'-->
<!-- | translate-->
<!-- }}-->
<!-- </ng-template>-->
<!-- <div class="d-flex">-->
<!-- <c8y-typeahead-->
<!-- [placeholder]="'No template' | translate"-->
<!-- [ngModel]="formGroup.value.__template ? formGroup.value.details : undefined"-->
<!-- [ngModelOptions]="{ standalone: true }"-->
<!-- (onSearch)="setPipe($event)"-->
<!-- [displayProperty]="'label'"-->
<!-- [hideNew]="true"-->
<!-- *ngIf="datapointLibraryEntries"-->
<!-- [disabled]="isSelected && disableTypeaheadIfSelected"-->
<!-- class="flex-grow"-->
<!-- >-->
<!-- <c8y-li-->
<!-- *c8yFor="-->
<!-- let item of datapointLibraryEntries;-->
<!-- loadMore: 'auto';-->
<!-- pipe: filterPipe;-->
<!-- notFound: notFoundTemplate-->
<!-- "-->
<!-- class="p-l-8 p-r-8 c8y-list__item&#45;&#45;link interact"-->
<!-- (click)="dataPointTemplateSelected(item)"-->
<!-- [active]="formGroup.value.__template === item.id"-->
<!-- >-->
<!-- <c8y-highlight [text]="item.c8y_Kpi?.label" [pattern]="pattern"></c8y-highlight>-->
<!-- <c8y-li-icon icon="circle" [style.color]="item.c8y_Kpi?.color"></c8y-li-icon>-->
<!-- </c8y-li>-->
<!-- <ng-template #notFoundTemplate>-->
<!-- <c8y-li class="bg-gray-lighter p-8" *ngIf="pattern.length > 0">-->
<!-- <span>No match found.</span>-->
<!-- </c8y-li>-->
<!-- </ng-template>-->
<!-- </c8y-typeahead>-->
<!-- <button-->
<!-- *ngIf="formGroup.value.__template"-->
<!-- class="btn btn-info btn-xs btn-icon a-s-center m-l-8"-->
<!-- [popover]="datapointOverviewPopoverTemplate"-->
<!-- placement="left"-->
<!-- container="body"-->
<!-- [outsideClick]="true"-->
<!-- [title]="'Info' | translate"-->
<!-- >-->
<!-- <i c8yIcon="info" class="text-info"></i>-->
<!-- </button>-->
<!-- <button-->
<!-- *ngIf="formGroup.value.__template && hasUnlinkTemplateOption"-->
<!-- class="btn btn-danger btn-xs btn-icon a-s-center m-l-8"-->
<!-- (click)="unlinkDatapointTemplate()"-->
<!-- [title]="'Unlink data point template' | translate"-->
<!-- >-->
<!-- <i c8yIcon="unlink"></i>-->
<!-- </button>-->
<!-- </div>-->
<!-- </div>-->
<!-- <ng-template #datapointOverviewPopoverTemplate>-->
<!-- <c8y-datapoint-template-popover-->
<!-- [datapoint]="formGroup.value.details"-->
<!-- ></c8y-datapoint-template-popover>-->
<!-- </ng-template>-->
<!-- <c8y-datapoint-attributes-form-->
<!-- *ngIf="defaultFormOptions"-->
<!-- [showTarget]="defaultFormOptions.showTarget"-->
<!-- [showRange]="defaultFormOptions.showRange"-->
<!-- [showYellowRange]="defaultFormOptions.showYellowRange"-->
<!-- [showRedRange]="defaultFormOptions.showRedRange"-->
<!-- [showChart]="defaultFormOptions.showChart"-->
<!-- [showFormIfTemplateWasSelected]="defaultFormOptions.showFormIfTemplateWasSelected"-->
<!-- formControlName="details"-->
<!-- ></c8y-datapoint-attributes-form>-->
<!-- </div>-->
<!-- </c8y-li-collapse>-->
<c8y-li-collapse>
<div class="data-point-details">
<span>test</span>
</div>
</c8y-li-collapse>
</c8y-li>
3 changes: 0 additions & 3 deletions ...oints-graph/alarm-selector/alarm-selector-list-item/alarm-selector-list-item.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,9 +57,6 @@ export class AlarmSelectorListItemComponent
color: [],
__active: [],
__target: [],
// fragment: [],
// series: [],
// __template: []
});
this.isValid$ = this.formGroup.statusChanges.pipe(
map((status) => status === 'VALID'),
Expand Down
15 changes: 14 additions & 1 deletion src/datapoints-graph/datapoints-graph-config/datapoints-graph-widget-config.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ import {
DatapointSelectorModalOptions,
} from '@c8y/ngx-components/datapoint-selector';
import { ActivatedRoute } from '@angular/router';
import { omit } from 'lodash-es';

@Component({
selector: 'c8y-datapoints-graph-widget-config',
Expand Down Expand Up @@ -104,7 +105,13 @@ export class DatapointsGraphWidgetConfigComponent
config?: DatapointsGraphWidgetConfig
): boolean | Promise<boolean> | Observable<boolean> {
if (this.formGroup.valid) {
Object.assign(config, this.formGroup.value);
Object.assign(config, omit(this.formGroup.value, ['alarms', 'events']), {
alarmsEventsConfigs: [
...this.formGroup.value.alarms,
...this.formGroup.value.events,
],
});

return true;
}
return false;
Expand Down Expand Up @@ -144,6 +151,7 @@ export class DatapointsGraphWidgetConfigComponent
this.formGroup = this.formBuilder.group({
datapoints: [[], [Validators.required, Validators.minLength(1)]],
alarms: [[]],
events: [[]],
displayDateSelection: [false, []],
displayAggregationSelection: [false, []],
widgetInstanceGlobalTimeContext: [false, []],
Expand All @@ -163,6 +171,11 @@ export class DatapointsGraphWidgetConfigComponent
(ae) => ae.timelineType === 'ALARM'
)
);

// TODO: remove
this.formGroup.valueChanges.subscribe((val) => {
console.log(val);
});
}

private initDateSelection(): void {
Expand Down

0 comments on commit e13b9d7

Please sign in to comment.