@c8y/ngx-components 1018.0.23 → 1018.0.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -669,14 +669,34 @@ class AssetPropertiesItemComponent {
669
669
  }
670
670
  });
671
671
  }
672
+ formComplexPropsValue() {
673
+ const complexProps = {};
674
+ this.complex.forEach(complexObj => {
675
+ if (complexObj.file) {
676
+ complexProps[complexObj.key] = complexObj.value;
677
+ }
678
+ else if (this.value[complexObj.key] != null) {
679
+ complexProps[complexObj.key] = this.value[complexObj.key];
680
+ }
681
+ });
682
+ return complexProps;
683
+ }
684
+ getModel() {
685
+ if (this.complex && this.complex.length > 0) {
686
+ return {
687
+ [this.key]: this.formComplexPropsValue()
688
+ };
689
+ }
690
+ return {
691
+ [this.key]: clone(this.value)
692
+ };
693
+ }
672
694
  resolveJsonSchema() {
673
695
  if (this.jsonSchema) {
674
696
  const fieldConfig = this.c8yJsonSchemaService.toFieldConfig(this.jsonSchema, this.jsonSchema);
675
697
  this.form = new FormGroup({});
676
698
  this.fields = [fieldConfig];
677
- this.model = {
678
- [this.key]: clone(this.value)
679
- };
699
+ this.model = this.getModel();
680
700
  }
681
701
  }
682
702
  getPreviewIfImage(imageFile) {
@@ -688,10 +708,10 @@ class AssetPropertiesItemComponent {
688
708
  }
689
709
  }
690
710
  AssetPropertiesItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: AssetPropertiesItemComponent, deps: [{ token: i1.AlertService }, { token: i1.C8yJSONSchema }, { token: i1.FilesService }], target: i0.ɵɵFactoryTarget.Component });
691
- AssetPropertiesItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: AssetPropertiesItemComponent, selector: "c8y-asset-properties-item", inputs: { key: "key", value: "value", label: "label", type: "type", file: "file", complex: "complex", isEdit: "isEdit", jsonSchema: "jsonSchema" }, usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\" *ngIf=\"!isEdit\">\n <ng-container *ngSwitchCase=\"'date'\">\n {{ value | c8yDate: 'fullDate' }}\n </ng-container>\n <ng-container *ngSwitchCase=\"'file'\">\n <ng-container *ngIf=\"file\">\n <img *ngIf=\"previewImage\" [src]=\"previewImage\" class=\"img-responsive\" />\n <button\n *ngIf=\"!previewImage\"\n (click)=\"filesService.download(file)\"\n type=\"button\"\n title=\"{{ 'Download' | translate }} {{ file.name }}\"\n class=\"btn btn-clean text-truncate p-0\"\n >\n {{ file.name }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"!file\">\n {{ 'No file attached.' | translate }}\n </ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <ul class=\"list-unstyled c8y-custom-properties\">\n <li\n *ngFor=\"let prop of complex; let i = index\"\n [ngClass]=\"{ 'separator-top-bottom': i === 0, 'separator-bottom': i > 0 }\"\n class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n >\n <label class=\"small m-b-0 m-r-8\" [ngClass]=\"{ 'a-s-start': prop.file }\">\n {{ prop.label | humanize }}\n </label>\n <span class=\"m-l-auto\" style=\"max-width: {{ prop.file ? '50%' : '100%' }}; min-width:0;\">\n <c8y-asset-properties-item\n [file]=\"prop.file\"\n [key]=\"prop.key\"\n [type]=\"prop.type\"\n [value]=\"prop.value\"\n ></c8y-asset-properties-item>\n </span>\n </li>\n </ul>\n </ng-container>\n <!--\n <ng-container *ngSwitchCase=\"'boolean'\">\n <input type=\"checkbox\" [checked]=\"value\" [disabled]=\"true\" />\n </ng-container>\n -->\n <ng-container *ngSwitchCase=\"'number'\">\n <p class=\"text-truncate\" title=\"{{ value != null ? value : ('Undefined' | translate) }}\">\n {{ value != null ? value : ('Undefined' | translate) }}\n </p>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <p class=\"text-truncate\" title=\"{{ (value | translate) || ('Undefined' | translate) }}\">\n {{ (value | translate) || ('Undefined' | translate) }}\n </p>\n </ng-container>\n</ng-container>\n<formly-form *ngIf=\"isEdit\" [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n", dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i3.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "component", type: AssetPropertiesItemComponent, selector: "c8y-asset-properties-item", inputs: ["key", "value", "label", "type", "file", "complex", "isEdit", "jsonSchema"] }, { kind: "pipe", type: i1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HumanizePipe, name: "humanize" }, { kind: "pipe", type: i1.DatePipe, name: "c8yDate" }] });
711
+ AssetPropertiesItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: AssetPropertiesItemComponent, selector: "c8y-asset-properties-item", inputs: { key: "key", value: "value", label: "label", type: "type", file: "file", complex: "complex", isEdit: "isEdit", jsonSchema: "jsonSchema" }, usesOnChanges: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\" *ngIf=\"!isEdit\">\n <ng-container *ngSwitchCase=\"'date'\">\n {{ value | c8yDate: 'fullDate' }}\n </ng-container>\n <ng-container *ngSwitchCase=\"'file'\">\n <ng-container *ngIf=\"file\">\n <img *ngIf=\"previewImage\" [src]=\"previewImage\" class=\"img-responsive\" />\n <button\n *ngIf=\"!previewImage\"\n (click)=\"filesService.download(file)\"\n type=\"button\"\n title=\"{{ 'Download' | translate }} {{ file.name }}\"\n class=\"btn btn-clean text-truncate p-0\"\n >\n {{ file.name }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"!file\">\n {{ 'No file attached.' | translate }}\n </ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <ul class=\"list-unstyled c8y-custom-properties\">\n <li\n *ngFor=\"let prop of complex; let i = index\"\n [ngClass]=\"{ 'separator-top-bottom': i === 0, 'separator-bottom': i > 0 }\"\n class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n >\n <label class=\"small m-b-0 m-r-8\" [ngClass]=\"{ 'a-s-start': prop.file }\">\n {{ prop.label | humanize }}\n </label>\n <span class=\"m-l-auto\" style=\"max-width: {{ prop.file ? '50%' : '100%' }}; min-width:0;\">\n <c8y-asset-properties-item\n [file]=\"prop.file\"\n [key]=\"prop.key\"\n [type]=\"prop.type\"\n [value]=\"prop.value\"\n ></c8y-asset-properties-item>\n </span>\n </li>\n </ul>\n </ng-container>\n <!--\n <ng-container *ngSwitchCase=\"'boolean'\">\n <input type=\"checkbox\" [checked]=\"value\" [disabled]=\"true\" />\n </ng-container>\n -->\n <ng-container *ngSwitchCase=\"type === 'number' || type === 'boolean' ? type : ''\">\n <p class=\"text-truncate\" title=\"{{ value != null ? value : ('Undefined' | translate) }}\">\n {{ value != null ? value : ('Undefined' | translate) }}\n </p>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <p class=\"text-truncate\" title=\"{{ (value | translate) || ('Undefined' | translate) }}\">\n {{ (value | translate) || ('Undefined' | translate) }}\n </p>\n </ng-container>\n</ng-container>\n<formly-form *ngIf=\"isEdit\" [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n", dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i3.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "component", type: AssetPropertiesItemComponent, selector: "c8y-asset-properties-item", inputs: ["key", "value", "label", "type", "file", "complex", "isEdit", "jsonSchema"] }, { kind: "pipe", type: i1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HumanizePipe, name: "humanize" }, { kind: "pipe", type: i1.DatePipe, name: "c8yDate" }] });
692
712
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: AssetPropertiesItemComponent, decorators: [{
693
713
  type: Component,
694
- args: [{ selector: 'c8y-asset-properties-item', template: "<ng-container [ngSwitch]=\"type\" *ngIf=\"!isEdit\">\n <ng-container *ngSwitchCase=\"'date'\">\n {{ value | c8yDate: 'fullDate' }}\n </ng-container>\n <ng-container *ngSwitchCase=\"'file'\">\n <ng-container *ngIf=\"file\">\n <img *ngIf=\"previewImage\" [src]=\"previewImage\" class=\"img-responsive\" />\n <button\n *ngIf=\"!previewImage\"\n (click)=\"filesService.download(file)\"\n type=\"button\"\n title=\"{{ 'Download' | translate }} {{ file.name }}\"\n class=\"btn btn-clean text-truncate p-0\"\n >\n {{ file.name }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"!file\">\n {{ 'No file attached.' | translate }}\n </ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <ul class=\"list-unstyled c8y-custom-properties\">\n <li\n *ngFor=\"let prop of complex; let i = index\"\n [ngClass]=\"{ 'separator-top-bottom': i === 0, 'separator-bottom': i > 0 }\"\n class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n >\n <label class=\"small m-b-0 m-r-8\" [ngClass]=\"{ 'a-s-start': prop.file }\">\n {{ prop.label | humanize }}\n </label>\n <span class=\"m-l-auto\" style=\"max-width: {{ prop.file ? '50%' : '100%' }}; min-width:0;\">\n <c8y-asset-properties-item\n [file]=\"prop.file\"\n [key]=\"prop.key\"\n [type]=\"prop.type\"\n [value]=\"prop.value\"\n ></c8y-asset-properties-item>\n </span>\n </li>\n </ul>\n </ng-container>\n <!--\n <ng-container *ngSwitchCase=\"'boolean'\">\n <input type=\"checkbox\" [checked]=\"value\" [disabled]=\"true\" />\n </ng-container>\n -->\n <ng-container *ngSwitchCase=\"'number'\">\n <p class=\"text-truncate\" title=\"{{ value != null ? value : ('Undefined' | translate) }}\">\n {{ value != null ? value : ('Undefined' | translate) }}\n </p>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <p class=\"text-truncate\" title=\"{{ (value | translate) || ('Undefined' | translate) }}\">\n {{ (value | translate) || ('Undefined' | translate) }}\n </p>\n </ng-container>\n</ng-container>\n<formly-form *ngIf=\"isEdit\" [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n" }]
714
+ args: [{ selector: 'c8y-asset-properties-item', template: "<ng-container [ngSwitch]=\"type\" *ngIf=\"!isEdit\">\n <ng-container *ngSwitchCase=\"'date'\">\n {{ value | c8yDate: 'fullDate' }}\n </ng-container>\n <ng-container *ngSwitchCase=\"'file'\">\n <ng-container *ngIf=\"file\">\n <img *ngIf=\"previewImage\" [src]=\"previewImage\" class=\"img-responsive\" />\n <button\n *ngIf=\"!previewImage\"\n (click)=\"filesService.download(file)\"\n type=\"button\"\n title=\"{{ 'Download' | translate }} {{ file.name }}\"\n class=\"btn btn-clean text-truncate p-0\"\n >\n {{ file.name }}\n </button>\n </ng-container>\n <ng-container *ngIf=\"!file\">\n {{ 'No file attached.' | translate }}\n </ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"'object'\">\n <ul class=\"list-unstyled c8y-custom-properties\">\n <li\n *ngFor=\"let prop of complex; let i = index\"\n [ngClass]=\"{ 'separator-top-bottom': i === 0, 'separator-bottom': i > 0 }\"\n class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n >\n <label class=\"small m-b-0 m-r-8\" [ngClass]=\"{ 'a-s-start': prop.file }\">\n {{ prop.label | humanize }}\n </label>\n <span class=\"m-l-auto\" style=\"max-width: {{ prop.file ? '50%' : '100%' }}; min-width:0;\">\n <c8y-asset-properties-item\n [file]=\"prop.file\"\n [key]=\"prop.key\"\n [type]=\"prop.type\"\n [value]=\"prop.value\"\n ></c8y-asset-properties-item>\n </span>\n </li>\n </ul>\n </ng-container>\n <!--\n <ng-container *ngSwitchCase=\"'boolean'\">\n <input type=\"checkbox\" [checked]=\"value\" [disabled]=\"true\" />\n </ng-container>\n -->\n <ng-container *ngSwitchCase=\"type === 'number' || type === 'boolean' ? type : ''\">\n <p class=\"text-truncate\" title=\"{{ value != null ? value : ('Undefined' | translate) }}\">\n {{ value != null ? value : ('Undefined' | translate) }}\n </p>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <p class=\"text-truncate\" title=\"{{ (value | translate) || ('Undefined' | translate) }}\">\n {{ (value | translate) || ('Undefined' | translate) }}\n </p>\n </ng-container>\n</ng-container>\n<formly-form *ngIf=\"isEdit\" [form]=\"form\" [fields]=\"fields\" [model]=\"model\"></formly-form>\n" }]
695
715
  }], ctorParameters: function () { return [{ type: i1.AlertService }, { type: i1.C8yJSONSchema }, { type: i1.FilesService }]; }, propDecorators: { key: [{
696
716
  type: Input
697
717
  }], value: [{