@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
400 lines (391 loc) • 26.6 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, ViewChild, NgModule, Injectable } from '@angular/core';
import * as i2 from '@c8y/ngx-components';
import { gettext, CommonModule, FormsModule, DynamicFormsModule, LegendFieldWrapper, hookNavigator, hookDataGridActionControls, hookRoute, ViewContext, hookPatternMessages } from '@c8y/ngx-components';
import { LWM2MPostOpertaionsNavigationFactory, Lwm2mDeviceGridFactory } from '@c8y/ngx-components/protocol-lwm2m/factories';
import { Lwm2mMicroserviceGuard, Lwm2mDeviceTypeGuard, Lwm2mConfigurationApiGuard, Lwm2mBootstrapParametersApiGuard } from '@c8y/ngx-components/protocol-lwm2m/guards';
import { Mode, LWM2MEndpoint, lwm2mRegisterDeviceStringsIncomingFromMS } from '@c8y/ngx-components/protocol-lwm2m/model';
import * as i4 from '@ngx-formly/core';
import { FieldType, FORMLY_CONFIG } from '@ngx-formly/core';
import { FormlyPresetModule } from '@ngx-formly/core/preset';
import * as i1 from '@c8y/ngx-components/protocol-lwm2m/services';
import * as i3 from '@angular/forms';
import { downgradeInjectable } from '@angular/upgrade/static';
import * as i1$1 from '@c8y/client';
import * as angular from 'angular';
import { registerNgModule } from '@c8y/ng1-modules';
class Lwm2mFilePickAndReplaceType extends FieldType {
constructor(service, fileService, alertService) {
super();
this.service = service;
this.fileService = fileService;
this.alertService = alertService;
this.fileReader = new FileReader();
}
onFocus() {
this.picker?.nativeElement.click();
this.field.focus = true;
}
onPick(event) {
this.formControl.setErrors(null);
this.fileService.getFileExtension(event?.target?.files[0]) === 'pem'
? this.fileReader.readAsDataURL(event?.target?.files[0])
: this.field?.formControl.setErrors({ invalidType: true });
if (this.props?.onPick instanceof Function && !this.formControl?.errors) {
this.fileReader.onload = () => this.onLoad(this.props.onPick, (error) => this.alertService.danger(error.message));
}
}
remove() {
if (this.props.remove instanceof Function) {
this.props.remove();
}
}
onLoad(resolve, reject) {
if (this.fileReader.readyState !== 2) {
return;
}
if (this.fileReader.error) {
reject(this.fileReader.error);
}
const result = this.service.cleanUpBase64Data(this.fileReader.result);
if (!result)
this.formControl.setErrors({ strReplaceError: true });
resolve(result);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mFilePickAndReplaceType, deps: [{ token: i1.Lwm2mConfigurationService }, { token: i2.FilesService }, { token: i2.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: Lwm2mFilePickAndReplaceType, selector: "c8y-lwm2m-file-pick-replace-type", viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"input-group\">\n <input\n class=\"form-control\"\n [class.is-invalid]=\"showError\"\n [type]=\"'text'\"\n [formControl]=\"formControl\"\n [formlyAttributes]=\"field\"\n [required]=\"props.required\"\n [disabled]=\"props.disabled\"\n readonly\n />\n <div class=\"input-group-btn a-i-end\">\n <button\n class=\"btn btn-primary btn-block\"\n title=\"{{ 'Replace' | translate }}\"\n type=\"button\"\n (click)=\"onFocus()\"\n [disabled]=\"props.disabled\"\n >\n <i c8yIcon=\"replace\"></i>\n <input\n class=\"hidden\"\n id=\"file\"\n type=\"file\"\n accept=\".pem\"\n #picker\n (change)=\"onPick($event)\"\n />\n </button>\n <button\n class=\"btn btn-danger btn-block\"\n title=\"{{ 'Remove' | translate }}\"\n type=\"button\"\n (click)=\"remove()\"\n [disabled]=\"props.disabled\"\n >\n <i c8yIcon=\"minus-circle\"></i>\n </button>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i4.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mFilePickAndReplaceType, decorators: [{
type: Component,
args: [{ selector: 'c8y-lwm2m-file-pick-replace-type', template: "<div class=\"input-group\">\n <input\n class=\"form-control\"\n [class.is-invalid]=\"showError\"\n [type]=\"'text'\"\n [formControl]=\"formControl\"\n [formlyAttributes]=\"field\"\n [required]=\"props.required\"\n [disabled]=\"props.disabled\"\n readonly\n />\n <div class=\"input-group-btn a-i-end\">\n <button\n class=\"btn btn-primary btn-block\"\n title=\"{{ 'Replace' | translate }}\"\n type=\"button\"\n (click)=\"onFocus()\"\n [disabled]=\"props.disabled\"\n >\n <i c8yIcon=\"replace\"></i>\n <input\n class=\"hidden\"\n id=\"file\"\n type=\"file\"\n accept=\".pem\"\n #picker\n (change)=\"onPick($event)\"\n />\n </button>\n <button\n class=\"btn btn-danger btn-block\"\n title=\"{{ 'Remove' | translate }}\"\n type=\"button\"\n (click)=\"remove()\"\n [disabled]=\"props.disabled\"\n >\n <i c8yIcon=\"minus-circle\"></i>\n </button>\n </div>\n</div>\n" }]
}], ctorParameters: () => [{ type: i1.Lwm2mConfigurationService }, { type: i2.FilesService }, { type: i2.AlertService }], propDecorators: { picker: [{
type: ViewChild,
args: ['picker', { static: false }]
}] } });
class Lwm2mInputGroupAddonType extends FieldType {
ngOnInit() {
this.props.addonLabel = this.props?.addonLabel || gettext('undefined');
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mInputGroupAddonType, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: Lwm2mInputGroupAddonType, selector: "c8y-lwm2m-input-group-addon", usesInheritance: true, ngImport: i0, template: "<div class=\"input-group\">\n <span class=\"input-group-addon\">{{ props?.addonLabel }}</span>\n <input\n class=\"form-control\"\n [class.is-invalid]=\"showError\"\n [type]=\"'text'\"\n [formControl]=\"formControl\"\n [formlyAttributes]=\"field\"\n [required]=\"props.required\"\n [disabled]=\"props.disabled\"\n />\n</div>\n", dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i4.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mInputGroupAddonType, decorators: [{
type: Component,
args: [{ selector: 'c8y-lwm2m-input-group-addon', template: "<div class=\"input-group\">\n <span class=\"input-group-addon\">{{ props?.addonLabel }}</span>\n <input\n class=\"form-control\"\n [class.is-invalid]=\"showError\"\n [type]=\"'text'\"\n [formControl]=\"formControl\"\n [formlyAttributes]=\"field\"\n [required]=\"props.required\"\n [disabled]=\"props.disabled\"\n />\n</div>\n" }]
}] });
class Lwm2mUIThemeModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mUIThemeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mUIThemeModule, declarations: [Lwm2mFilePickAndReplaceType, Lwm2mInputGroupAddonType], imports: [CommonModule, FormsModule, DynamicFormsModule, FormlyPresetModule] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mUIThemeModule, providers: [
{
provide: FORMLY_CONFIG,
multi: true,
useValue: {
wrappers: [
{
name: 'legend',
component: LegendFieldWrapper
}
],
presets: [
{
name: 'securityMode',
config: {
key: 'mode',
type: 'select',
defaultValue: Mode.NO_SEC,
props: {
label: gettext('Mode')
}
}
},
{
name: 'pskId',
config: {
key: 'pskId',
type: 'string',
props: {
label: gettext('PSK ID'),
required: true
},
expressions: {
'props.disabled': (field) => field?.options?.formState?.disabled,
hide: (field) => {
return field.model?.mode !== Mode.PSK;
}
}
}
},
{
name: 'pskKey',
config: {
key: 'pskKey',
type: 'string',
props: {
label: gettext('Pre-shared key'),
placeholder: '0123456789abcdef',
pattern: '^([a-fA-F0-9]{2})+$',
required: true
},
expressions: {
'props.disabled': (field) => field?.options?.formState?.disabled,
hide: (field) => {
return field.model?.mode !== Mode.PSK;
}
}
}
}
],
types: [
{
name: 'switch',
extends: 'checkbox',
defaultOptions: {
props: {
switchMode: true,
indeterminate: false
}
}
},
{
name: 'file-pick-replace',
component: Lwm2mFilePickAndReplaceType,
wrappers: ['c8y-form-field']
},
{
name: 'input-addon',
component: Lwm2mInputGroupAddonType,
wrappers: ['c8y-form-field']
}
],
validationMessages: [
{
name: 'invalidType',
message: gettext('The selected file is not supported.')
},
{
name: 'strReplaceError',
message: gettext('The selected file is not processable.')
}
]
}
}
], imports: [CommonModule, FormsModule, DynamicFormsModule, FormlyPresetModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mUIThemeModule, decorators: [{
type: NgModule,
args: [{
imports: [CommonModule, FormsModule, DynamicFormsModule, FormlyPresetModule],
declarations: [Lwm2mFilePickAndReplaceType, Lwm2mInputGroupAddonType],
providers: [
{
provide: FORMLY_CONFIG,
multi: true,
useValue: {
wrappers: [
{
name: 'legend',
component: LegendFieldWrapper
}
],
presets: [
{
name: 'securityMode',
config: {
key: 'mode',
type: 'select',
defaultValue: Mode.NO_SEC,
props: {
label: gettext('Mode')
}
}
},
{
name: 'pskId',
config: {
key: 'pskId',
type: 'string',
props: {
label: gettext('PSK ID'),
required: true
},
expressions: {
'props.disabled': (field) => field?.options?.formState?.disabled,
hide: (field) => {
return field.model?.mode !== Mode.PSK;
}
}
}
},
{
name: 'pskKey',
config: {
key: 'pskKey',
type: 'string',
props: {
label: gettext('Pre-shared key'),
placeholder: '0123456789abcdef',
pattern: '^([a-fA-F0-9]{2})+$',
required: true
},
expressions: {
'props.disabled': (field) => field?.options?.formState?.disabled,
hide: (field) => {
return field.model?.mode !== Mode.PSK;
}
}
}
}
],
types: [
{
name: 'switch',
extends: 'checkbox',
defaultOptions: {
props: {
switchMode: true,
indeterminate: false
}
}
},
{
name: 'file-pick-replace',
component: Lwm2mFilePickAndReplaceType,
wrappers: ['c8y-form-field']
},
{
name: 'input-addon',
component: Lwm2mInputGroupAddonType,
wrappers: ['c8y-form-field']
}
],
validationMessages: [
{
name: 'invalidType',
message: gettext('The selected file is not supported.')
},
{
name: 'strReplaceError',
message: gettext('The selected file is not processable.')
}
]
}
}
]
}]
}] });
class Lwm2mModule {
static forRoot() {
return {
ngModule: Lwm2mModule,
providers: [
hookNavigator(LWM2MPostOpertaionsNavigationFactory),
hookDataGridActionControls(Lwm2mDeviceGridFactory),
hookRoute({
path: 'post-operations',
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/post-registration-operations').then(m => m.LWM2MPostOperationsComponent),
icon: 'terminal',
priority: 2000,
canActivate: [Lwm2mMicroserviceGuard]
}),
hookRoute({
label: gettext('LWM2M Configuration'),
icon: 'c8y-device-protocols',
path: 'lwm2m-configuration',
context: ViewContext.Device,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/configuration').then(m => m.Lwm2mConfigurationComponent),
canActivate: [Lwm2mMicroserviceGuard, Lwm2mDeviceTypeGuard, Lwm2mConfigurationApiGuard],
children: [
{ path: '', redirectTo: 'basic', pathMatch: 'full' },
{
path: LWM2MEndpoint.deviceSettings,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/configuration').then(m => m.Lwm2mFormDeviceSettings)
},
{
path: LWM2MEndpoint.connectivity,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/configuration').then(m => m.Lwm2mFormConnectivitySettings)
},
{
path: LWM2MEndpoint.firmware,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/configuration').then(m => m.Lwm2mFormFirmwareSettings)
},
{
path: LWM2MEndpoint.bootstrap,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/configuration').then(m => m.Lwm2mFormBootstrapSettings)
},
{
path: LWM2MEndpoint.servers,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/configuration').then(m => m.Lwm2mFormServerSettings)
}
]
}),
hookRoute({
path: 'lwm2m-bootstrap-parameters',
context: ViewContext.Device,
loadComponent: () => import('@c8y/ngx-components/protocol-lwm2m/components/bootstrap-parameters').then(m => m.Lwm2mBootstrapParametersComponent),
label: gettext('LWM2M bootstrap parameters'),
icon: 'c8y-device-protocols',
canActivate: [
Lwm2mMicroserviceGuard,
Lwm2mDeviceTypeGuard,
Lwm2mBootstrapParametersApiGuard
]
}),
hookPatternMessages(lwm2mRegisterDeviceStringsIncomingFromMS)
]
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mModule, imports: [Lwm2mUIThemeModule] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mModule, imports: [Lwm2mUIThemeModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mModule, decorators: [{
type: NgModule,
args: [{
imports: [Lwm2mUIThemeModule]
}]
}] });
class LWM2Module {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LWM2Module, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: LWM2Module, imports: [Lwm2mModule] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LWM2Module, imports: [Lwm2mModule.forRoot()] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LWM2Module, decorators: [{
type: NgModule,
args: [{
imports: [Lwm2mModule.forRoot()]
}]
}] });
/**
* @deprecated This service is deprecated and will be removed in a future version.
* Use the PluginsResolveService instead.
*/
class Lwm2mPluginCheckerService {
constructor(applicationService) {
this.applicationService = applicationService;
}
async isLwm2mPluginInstalled() {
const { data } = await this.applicationService.listByName('lwm2m-ui-plugin');
return data.some(({ manifest }) => manifest?.exports[0]?.module === 'Lwm2mModuleWrapper');
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mPluginCheckerService, deps: [{ token: i1$1.ApplicationService }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mPluginCheckerService, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: Lwm2mPluginCheckerService, decorators: [{
type: Injectable,
args: [{
providedIn: 'root'
}]
}], ctorParameters: () => [{ type: i1$1.ApplicationService }] });
const lwm2mPluginCheckerServiceDowngradedInjectable = downgradeInjectable(Lwm2mPluginCheckerService);
const NAME_LWM2M = 'c8y.upgrade.lwm2m';
angular
.module(NAME_LWM2M, [])
.factory('c8yLwm2mPluginCheckerService', lwm2mPluginCheckerServiceDowngradedInjectable);
const ng1ModulesLWM2M = [NAME_LWM2M];
registerNgModule(ng1ModulesLWM2M);
/**
* Generated bundle index. Do not edit.
*/
export { LWM2Module, Lwm2mModule, Lwm2mPluginCheckerService, lwm2mPluginCheckerServiceDowngradedInjectable, ng1ModulesLWM2M };
//# sourceMappingURL=c8y-ngx-components-protocol-lwm2m.mjs.map