@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
58 lines • 13.2 kB
JavaScript
import { Component, ElementRef, ViewChild } from '@angular/core';
import { FieldType } from '@ngx-formly/core';
import { Lwm2mConfigurationService } from '@c8y/ngx-components/protocol-lwm2m/services';
import { AlertService, FilesService } from '@c8y/ngx-components';
import * as i0 from "@angular/core";
import * as i1 from "@c8y/ngx-components/protocol-lwm2m/services";
import * as i2 from "@c8y/ngx-components";
import * as i3 from "@angular/forms";
import * as i4 from "@ngx-formly/core";
export 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 }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibHdtMm0tZmlsZS1waWNrLWFuZC1yZXBsYWNlLnR5cGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvdG9jb2wtbHdtMm0vZm9ybWx5L2x3bTJtLWZpbGUtcGljay1hbmQtcmVwbGFjZS50eXBlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uL3Byb3RvY29sLWx3bTJtL2Zvcm1seS9sd20ybS1maWxlLXBpY2stYW5kLXJlcGxhY2UudHlwZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakUsT0FBTyxFQUFFLFNBQVMsRUFBbUIsTUFBTSxrQkFBa0IsQ0FBQztBQUM5RCxPQUFPLEVBQUUseUJBQXlCLEVBQUUsTUFBTSw2Q0FBNkMsQ0FBQztBQUN4RixPQUFPLEVBQUUsWUFBWSxFQUFFLFlBQVksRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7QUFNakUsTUFBTSxPQUFPLDJCQUE0QixTQUFRLFNBQTBCO0lBSXpFLFlBQ1UsT0FBMkMsRUFDM0MsV0FBeUIsRUFDekIsWUFBMEI7UUFFbEMsS0FBSyxFQUFFLENBQUM7UUFKQSxZQUFPLEdBQVAsT0FBTyxDQUFvQztRQUMzQyxnQkFBVyxHQUFYLFdBQVcsQ0FBYztRQUN6QixpQkFBWSxHQUFaLFlBQVksQ0FBYztRQUw1QixlQUFVLEdBQUcsSUFBSSxVQUFVLEVBQUUsQ0FBQztJQVF0QyxDQUFDO0lBRUQsT0FBTztRQUNMLElBQUksQ0FBQyxNQUFNLEVBQUUsYUFBYSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQ25DLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFHLElBQUksQ0FBQztJQUMxQixDQUFDO0lBRUQsTUFBTSxDQUFDLEtBQUs7UUFDVixJQUFJLENBQUMsV0FBVyxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUVqQyxJQUFJLENBQUMsV0FBVyxDQUFDLGdCQUFnQixDQUFDLEtBQUssRUFBRSxNQUFNLEVBQUUsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssS0FBSztZQUNsRSxDQUFDLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsS0FBSyxFQUFFLE1BQU0sRUFBRSxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDeEQsQ0FBQyxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsV0FBVyxDQUFDLFNBQVMsQ0FBQyxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDO1FBRTdELElBQUksSUFBSSxDQUFDLEtBQUssRUFBRSxNQUFNLFlBQVksUUFBUSxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxNQUFNLEVBQUUsQ0FBQztZQUN4RSxJQUFJLENBQUMsVUFBVSxDQUFDLE1BQU0sR0FBRyxHQUFHLEVBQUUsQ0FDNUIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sRUFBRSxDQUFDLEtBQW1CLEVBQUUsRUFBRSxDQUNyRCxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLENBQ3hDLENBQUM7UUFDTixDQUFDO0lBQ0gsQ0FBQztJQUVELE1BQU07UUFDSixJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxZQUFZLFFBQVEsRUFBRSxDQUFDO1lBQzFDLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxFQUFFLENBQUM7UUFDdEIsQ0FBQztJQUNILENBQUM7SUFFTyxNQUFNLENBQUMsT0FBTyxFQUFFLE1BQU07UUFDNUIsSUFBSSxJQUFJLENBQUMsVUFBVSxDQUFDLFVBQVUsS0FBSyxDQUFDLEVBQUUsQ0FBQztZQUNyQyxPQUFPO1FBQ1QsQ0FBQztRQUVELElBQUksSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUMxQixNQUFNLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNoQyxDQUFDO1FBRUQsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLE1BQWdCLENBQUMsQ0FBQztRQUNoRixJQUFJLENBQUMsTUFBTTtZQUFFLElBQUksQ0FBQyxXQUFXLENBQUMsU0FBUyxDQUFDLEVBQUUsZUFBZSxFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7UUFFbkUsT0FBTyxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQ2xCLENBQUM7K0dBbkRVLDJCQUEyQjttR0FBM0IsMkJBQTJCLGlNQ1R4QywyL0JBd0NBOzs0RkQvQmEsMkJBQTJCO2tCQUp2QyxTQUFTOytCQUNFLGtDQUFrQztvSkFJSixNQUFNO3NCQUE3QyxTQUFTO3VCQUFDLFFBQVEsRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRmllbGRUeXBlLCBGaWVsZFR5cGVDb25maWcgfSBmcm9tICdAbmd4LWZvcm1seS9jb3JlJztcbmltcG9ydCB7IEx3bTJtQ29uZmlndXJhdGlvblNlcnZpY2UgfSBmcm9tICdAYzh5L25neC1jb21wb25lbnRzL3Byb3RvY29sLWx3bTJtL3NlcnZpY2VzJztcbmltcG9ydCB7IEFsZXJ0U2VydmljZSwgRmlsZXNTZXJ2aWNlIH0gZnJvbSAnQGM4eS9uZ3gtY29tcG9uZW50cyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2M4eS1sd20ybS1maWxlLXBpY2stcmVwbGFjZS10eXBlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2x3bTJtLWZpbGUtcGljay1hbmQtcmVwbGFjZS50eXBlLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBMd20ybUZpbGVQaWNrQW5kUmVwbGFjZVR5cGUgZXh0ZW5kcyBGaWVsZFR5cGU8RmllbGRUeXBlQ29uZmlnPiB7XG4gIEBWaWV3Q2hpbGQoJ3BpY2tlcicsIHsgc3RhdGljOiBmYWxzZSB9KSBwaWNrZXI6IEVsZW1lbnRSZWY8SFRNTElucHV0RWxlbWVudD47XG4gIHByaXZhdGUgZmlsZVJlYWRlciA9IG5ldyBGaWxlUmVhZGVyKCk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSBzZXJ2aWNlOiBMd20ybUNvbmZpZ3VyYXRpb25TZXJ2aWNlPHVua25vd24+LFxuICAgIHByaXZhdGUgZmlsZVNlcnZpY2U6IEZpbGVzU2VydmljZSxcbiAgICBwcml2YXRlIGFsZXJ0U2VydmljZTogQWxlcnRTZXJ2aWNlXG4gICkge1xuICAgIHN1cGVyKCk7XG4gIH1cblxuICBvbkZvY3VzKCkge1xuICAgIHRoaXMucGlja2VyPy5uYXRpdmVFbGVtZW50LmNsaWNrKCk7XG4gICAgdGhpcy5maWVsZC5mb2N1cyA9IHRydWU7XG4gIH1cblxuICBvblBpY2soZXZlbnQpIHtcbiAgICB0aGlzLmZvcm1Db250cm9sLnNldEVycm9ycyhudWxsKTtcblxuICAgIHRoaXMuZmlsZVNlcnZpY2UuZ2V0RmlsZUV4dGVuc2lvbihldmVudD8udGFyZ2V0Py5maWxlc1swXSkgPT09ICdwZW0nXG4gICAgICA/IHRoaXMuZmlsZVJlYWRlci5yZWFkQXNEYXRhVVJMKGV2ZW50Py50YXJnZXQ/LmZpbGVzWzBdKVxuICAgICAgOiB0aGlzLmZpZWxkPy5mb3JtQ29udHJvbC5zZXRFcnJvcnMoeyBpbnZhbGlkVHlwZTogdHJ1ZSB9KTtcblxuICAgIGlmICh0aGlzLnByb3BzPy5vblBpY2sgaW5zdGFuY2VvZiBGdW5jdGlvbiAmJiAhdGhpcy5mb3JtQ29udHJvbD8uZXJyb3JzKSB7XG4gICAgICB0aGlzLmZpbGVSZWFkZXIub25sb2FkID0gKCkgPT5cbiAgICAgICAgdGhpcy5vbkxvYWQodGhpcy5wcm9wcy5vblBpY2ssIChlcnJvcjogRE9NRXhjZXB0aW9uKSA9PlxuICAgICAgICAgIHRoaXMuYWxlcnRTZXJ2aWNlLmRhbmdlcihlcnJvci5tZXNzYWdlKVxuICAgICAgICApO1xuICAgIH1cbiAgfVxuXG4gIHJlbW92ZSgpIHtcbiAgICBpZiAodGhpcy5wcm9wcy5yZW1vdmUgaW5zdGFuY2VvZiBGdW5jdGlvbikge1xuICAgICAgdGhpcy5wcm9wcy5yZW1vdmUoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIG9uTG9hZChyZXNvbHZlLCByZWplY3QpIHtcbiAgICBpZiAodGhpcy5maWxlUmVhZGVyLnJlYWR5U3RhdGUgIT09IDIpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBpZiAodGhpcy5maWxlUmVhZGVyLmVycm9yKSB7XG4gICAgICByZWplY3QodGhpcy5maWxlUmVhZGVyLmVycm9yKTtcbiAgICB9XG5cbiAgICBjb25zdCByZXN1bHQgPSB0aGlzLnNlcnZpY2UuY2xlYW5VcEJhc2U2NERhdGEodGhpcy5maWxlUmVhZGVyLnJlc3VsdCBhcyBzdHJpbmcpO1xuICAgIGlmICghcmVzdWx0KSB0aGlzLmZvcm1Db250cm9sLnNldEVycm9ycyh7IHN0clJlcGxhY2VFcnJvcjogdHJ1ZSB9KTtcblxuICAgIHJlc29sdmUocmVzdWx0KTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cImlucHV0LWdyb3VwXCI+XG4gIDxpbnB1dFxuICAgIGNsYXNzPVwiZm9ybS1jb250cm9sXCJcbiAgICBbY2xhc3MuaXMtaW52YWxpZF09XCJzaG93RXJyb3JcIlxuICAgIFt0eXBlXT1cIid0ZXh0J1wiXG4gICAgW2Zvcm1Db250cm9sXT1cImZvcm1Db250cm9sXCJcbiAgICBbZm9ybWx5QXR0cmlidXRlc109XCJmaWVsZFwiXG4gICAgW3JlcXVpcmVkXT1cInByb3BzLnJlcXVpcmVkXCJcbiAgICBbZGlzYWJsZWRdPVwicHJvcHMuZGlzYWJsZWRcIlxuICAgIHJlYWRvbmx5XG4gIC8+XG4gIDxkaXYgY2xhc3M9XCJpbnB1dC1ncm91cC1idG4gYS1pLWVuZFwiPlxuICAgIDxidXR0b25cbiAgICAgIGNsYXNzPVwiYnRuIGJ0bi1wcmltYXJ5IGJ0bi1ibG9ja1wiXG4gICAgICB0aXRsZT1cInt7ICdSZXBsYWNlJyB8IHRyYW5zbGF0ZSB9fVwiXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIChjbGljayk9XCJvbkZvY3VzKClcIlxuICAgICAgW2Rpc2FibGVkXT1cInByb3BzLmRpc2FibGVkXCJcbiAgICA+XG4gICAgICA8aSBjOHlJY29uPVwicmVwbGFjZVwiPjwvaT5cbiAgICAgIDxpbnB1dFxuICAgICAgICBjbGFzcz1cImhpZGRlblwiXG4gICAgICAgIGlkPVwiZmlsZVwiXG4gICAgICAgIHR5cGU9XCJmaWxlXCJcbiAgICAgICAgYWNjZXB0PVwiLnBlbVwiXG4gICAgICAgICNwaWNrZXJcbiAgICAgICAgKGNoYW5nZSk9XCJvblBpY2soJGV2ZW50KVwiXG4gICAgICAvPlxuICAgIDwvYnV0dG9uPlxuICAgIDxidXR0b25cbiAgICAgIGNsYXNzPVwiYnRuIGJ0bi1kYW5nZXIgYnRuLWJsb2NrXCJcbiAgICAgIHRpdGxlPVwie3sgJ1JlbW92ZScgfCB0cmFuc2xhdGUgfX1cIlxuICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAoY2xpY2spPVwicmVtb3ZlKClcIlxuICAgICAgW2Rpc2FibGVkXT1cInByb3BzLmRpc2FibGVkXCJcbiAgICA+XG4gICAgICA8aSBjOHlJY29uPVwibWludXMtY2lyY2xlXCI+PC9pPlxuICAgIDwvYnV0dG9uPlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19