@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
92 lines (88 loc) • 8.28 kB
JavaScript
import * as i0 from '@angular/core';
import { inject, Input, Component } from '@angular/core';
import * as i3 from '@angular/forms';
import { FormBuilder, NgForm, Validators, ControlContainer, ReactiveFormsModule } from '@angular/forms';
import * as i1 from '@c8y/ngx-components';
import { CoreModule, CommonModule, C8yTranslatePipe } from '@c8y/ngx-components';
import * as i3$1 from '@c8y/ngx-components/datapoint-selector';
import { DatapointSelectorModule } from '@c8y/ngx-components/datapoint-selector';
import { gettext } from '@c8y/ngx-components/gettext';
import * as i2 from '@angular/common';
const RESULT_TYPES = {
VALUE: { name: 'VALUE', value: 1, label: gettext('Only value') },
VALUE_UNIT: { name: 'VALUE_UNIT', value: 2, label: gettext('Value and unit') },
VALUE_UNIT_TIME: { name: 'VALUE_UNIT_TIME', value: 3, label: gettext('Value, unit and time') },
OBJECT: { name: 'OBJECT', value: 4, label: gettext('Complete object') }
};
function exactlyASingleDatapointActive() {
return (control) => {
const datapoints = control.value;
if (!datapoints || !datapoints.length) {
return null;
}
const activeDatapoints = datapoints.filter(datapoint => datapoint.__active);
if (activeDatapoints.length === 1) {
return null;
}
return { exactlyOneDatapointNeedsToBeActive: true };
};
}
class ComputedPropertyLastMeasurementConfigComponent {
constructor() {
this.datapointSelectionConfig = {};
this.formBuilder = inject(FormBuilder);
this.form = inject(NgForm);
this.selectedProperty = [];
this.minSelectCount = 1;
this.maxSelectCount = 1;
this.resultTypes = RESULT_TYPES;
}
ngOnInit() {
if (this.asset) {
this.datapointSelectionConfig.contextAsset = this.asset;
}
this.initForm();
}
onBeforeSave(config) {
if (this.formGroup.valid) {
Object.assign(config, this.formGroup.value);
config.dp = config.dp.filter(d => d.__active);
config.dp[0].__target = { id: config.dp[0].__target.id, name: config.dp[0].__target.name };
return true;
}
return false;
}
initForm() {
this.formGroup = this.createForm();
this.form.form.addControl('config', this.formGroup);
this.formGroup.patchValue(this.config);
}
createForm() {
return this.formBuilder.group({
resultType: [this.resultTypes.VALUE.value, [Validators.required]],
dp: this.formBuilder.control(new Array(), [
Validators.required,
Validators.minLength(1),
exactlyASingleDatapointActive()
])
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ComputedPropertyLastMeasurementConfigComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: ComputedPropertyLastMeasurementConfigComponent, isStandalone: true, selector: "c8y-last-measurement-config", inputs: { config: "config", asset: "asset" }, ngImport: i0, template: "\n<form [formGroup]=\"formGroup\">\n <div class=\"d-flex-md row\">\n <div class=\"col-md-6\">\n <div class=\"form-group\" style=\"padding-top: var(--c8y-font-size-base)\">\n <label for=\"resultType\">{{ 'Result type' | translate }}</label>\n <div class=\"c8y-select-wrapper\">\n <select\n class=\"form-control\"\n id=\"resultType\"\n formControlName=\"resultType\"\n >\n <option\n *ngFor=\"let type of resultTypes | keyvalue\"\n [ngValue]=\"type.value.value\"\n >\n {{ type.value.label | translate }}\n </option>\n </select>\n </div>\n </div>\n </div>\n <div class=\"col-md-6 no-card-context\">\n <c8y-datapoint-selection-list\n class=\"bg-inherit\"\n name=\"dp\"\n [config]=\"datapointSelectionConfig\"\n [minActiveCount]=\"minSelectCount\"\n [maxActiveCount]=\"maxSelectCount\"\n formControlName=\"dp\"\n ></c8y-datapoint-selection-list>\n </div>\n </div>\n</form>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: DatapointSelectorModule }, { kind: "component", type: i3$1.DatapointSelectionListComponent, selector: "c8y-datapoint-selection-list", inputs: ["actions", "allowDragAndDrop", "config", "defaultFormOptions", "maxActiveCount", "minActiveCount", "resolveContext", "listTitle"], outputs: ["isValid", "change"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "pipe", type: i1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i2.KeyValuePipe, name: "keyvalue" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ComputedPropertyLastMeasurementConfigComponent, decorators: [{
type: Component,
args: [{ selector: 'c8y-last-measurement-config', imports: [
CoreModule,
DatapointSelectorModule,
CommonModule,
C8yTranslatePipe,
ReactiveFormsModule
], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "\n<form [formGroup]=\"formGroup\">\n <div class=\"d-flex-md row\">\n <div class=\"col-md-6\">\n <div class=\"form-group\" style=\"padding-top: var(--c8y-font-size-base)\">\n <label for=\"resultType\">{{ 'Result type' | translate }}</label>\n <div class=\"c8y-select-wrapper\">\n <select\n class=\"form-control\"\n id=\"resultType\"\n formControlName=\"resultType\"\n >\n <option\n *ngFor=\"let type of resultTypes | keyvalue\"\n [ngValue]=\"type.value.value\"\n >\n {{ type.value.label | translate }}\n </option>\n </select>\n </div>\n </div>\n </div>\n <div class=\"col-md-6 no-card-context\">\n <c8y-datapoint-selection-list\n class=\"bg-inherit\"\n name=\"dp\"\n [config]=\"datapointSelectionConfig\"\n [minActiveCount]=\"minSelectCount\"\n [maxActiveCount]=\"maxSelectCount\"\n formControlName=\"dp\"\n ></c8y-datapoint-selection-list>\n </div>\n </div>\n</form>\n" }]
}], propDecorators: { config: [{
type: Input
}], asset: [{
type: Input
}] } });
export { ComputedPropertyLastMeasurementConfigComponent, exactlyASingleDatapointActive };
//# sourceMappingURL=c8y-ngx-components-computed-asset-properties-last-measurement-config.component-BXfM7hTQ.mjs.map