@rosoftlab/core 0.0.100

package/fesm2015/rosoftlab-core.mjs

@@ -0,0 +1,2217 @@
+import * as i0 from '@angular/core';
+import { Component, Input, EventEmitter, Optional, Self, Output, Injectable, ElementRef, ViewEncapsulation, ViewChild, Directive, ContentChildren, NgModule, Pipe } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i2 from '@angular/forms';
+import { FormControl, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import { Subject, Observable, throwError, from, merge, of, fromEvent, BehaviorSubject, combineLatest } from 'rxjs';
+import { filter, debounceTime, tap, switchMap, finalize, takeUntil, map, catchError, distinctUntilChanged, startWith } from 'rxjs/operators';
+import * as i1 from '@angular/cdk/a11y';
+import * as i3 from '@angular/material/form-field';
+import * as i4 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import * as i5 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i6 from '@angular/material/autocomplete';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import * as i7 from '@angular/material/core';
+import { MatNativeDateModule, MatRippleModule, MatOptionModule } from '@angular/material/core';
+import * as i8 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import * as i3$1 from '@angular/common';
+import { DatePipe, DecimalPipe, PercentPipe, CommonModule } from '@angular/common';
+import * as i1$1 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { __decorate } from 'tslib';
+import * as i2$2 from 'ng-block-ui';
+import { BlockUI, BlockUIModule } from 'ng-block-ui';
+import * as i2$1 from '@angular/router';
+import * as i1$2 from '@angular/common/http';
+import { HttpHeaders, HttpParams, HttpErrorResponse, HttpClientModule } from '@angular/common/http';
+import { compare } from 'fast-json-patch';
+import * as qs from 'qs';
+import Swal from 'sweetalert2';
+import * as i12 from '@angular/cdk/drag-drop';
+import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
+import * as i9 from '@angular/material/paginator';
+import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
+import * as i8$1 from '@angular/material/sort';
+import { MatSort, MatSortModule } from '@angular/material/sort';
+import * as i6$1 from '@angular/material/table';
+import { MatTableDataSource, MatTableModule } from '@angular/material/table';
+import * as jsonLogic from 'json-logic-js/logic.js';
+import * as i5$1 from '@angular/material/progress-spinner';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import * as i13 from '@angular/material/tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { parseISO } from 'date-fns';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatGridListModule } from '@angular/material/grid-list';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { MatSelectModule } from '@angular/material/select';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatSliderModule } from '@angular/material/slider';
+import { MatSnackBarModule } from '@angular/material/snack-bar';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatCardModule } from '@angular/material/card';
+import { MatTabsModule } from '@angular/material/tabs';
+import { MatExpansionModule } from '@angular/material/expansion';
+import { MatRadioModule } from '@angular/material/radio';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import { MatDividerModule } from '@angular/material/divider';
+import { MatListModule } from '@angular/material/list';
+import { MatDialogModule } from '@angular/material/dialog';
+import { PortalModule } from '@angular/cdk/portal';
+import { MatTreeModule } from '@angular/material/tree';
+import { MatBadgeModule } from '@angular/material/badge';
+import { MatStepperModule } from '@angular/material/stepper';
+import { CdkStepperModule } from '@angular/cdk/stepper';
+
+class FieldErrorDisplayComponent {
+}
+FieldErrorDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FieldErrorDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+FieldErrorDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: FieldErrorDisplayComponent, selector: "rsl-field-error-display", inputs: { errorMsg: "errorMsg", displayError: "displayError" }, ngImport: i0, template: "<div *ngIf=\"displayError\" >\n  <!-- <span class=\"glyphicon glyphicon-remove form-control-feedback fix-error-icon\"></span> -->\n  <span class=\"sr-only\">(error)</span>\n  <div class=\"error-msg\">\n    {{ errorMsg }}\n  </div>\n</div>\n", styles: [".error-msg{color:red}.fix-error-icon{top:27px}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FieldErrorDisplayComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rsl-field-error-display', template: "<div *ngIf=\"displayError\" >\n  <!-- <span class=\"glyphicon glyphicon-remove form-control-feedback fix-error-icon\"></span> -->\n  <span class=\"sr-only\">(error)</span>\n  <div class=\"error-msg\">\n    {{ errorMsg }}\n  </div>\n</div>\n", styles: [".error-msg{color:red}.fix-error-icon{top:27px}\n"] }]
+        }], propDecorators: { errorMsg: [{
+                type: Input
+            }], displayError: [{
+                type: Input
+            }] } });
+
+class PageNotFoundComponent {
+    constructor() {
+    }
+    ngOnInit() {
+    }
+}
+PageNotFoundComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: PageNotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+PageNotFoundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: PageNotFoundComponent, selector: "rsl-page-not-found", ngImport: i0, template: "<div class=\"forms-view-container\">\n  <div class=\"under-construction-view-container\">\n    Page not found\n  </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: PageNotFoundComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rsl-page-not-found', template: "<div class=\"forms-view-container\">\n  <div class=\"under-construction-view-container\">\n    Page not found\n  </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] }]
+        }], ctorParameters: function () { return []; } });
+
+class SearchableDropdownComponent {
+    constructor(_focusMonitor, _elementRef, ngControl) {
+        this._focusMonitor = _focusMonitor;
+        this._elementRef = _elementRef;
+        this.ngControl = ngControl;
+        this.onChange = (_) => { };
+        this.onTouched = () => { };
+        this.stateChanges = new Subject();
+        this.focused = false;
+        this.errorState = false;
+        this.id = `rsl-searchable-dropdown-${SearchableDropdownComponent.nextId++}`;
+        // label for the search dropdown
+        this.label = '';
+        //Fields for sorting the API data
+        this.sortFields = '';
+        // The value used to populate the control value
+        this.valueField = 'id';
+        // The minumum char for search
+        this.minLengthTerm = 3;
+        this.modelSelected = new EventEmitter();
+        this._required = false;
+        this._disabled = false;
+        this.showSerach = true;
+        this.isLoading = false;
+        this.options = [];
+        this.filteredOptions = [];
+        /** Subject that emits when the component has been destroyed. */
+        this._onDestroy = new Subject();
+        this.searchControl = new FormControl('');
+        _focusMonitor.monitor(_elementRef, true).subscribe(origin => {
+            if (this.focused && !origin) {
+                this.onTouched();
+            }
+            this.focused = !!origin;
+            this.stateChanges.next();
+        });
+        if (this.ngControl) {
+            this.ngControl.valueAccessor = this;
+        }
+    }
+    get empty() {
+        return !this.value;
+    }
+    get required() { return this._required; }
+    set required(value) {
+        this._required = coerceBooleanProperty(value);
+        this.stateChanges.next();
+    }
+    get disabled() { return this._disabled; }
+    set disabled(value) {
+        this._disabled = coerceBooleanProperty(value);
+        this.stateChanges.next();
+    }
+    get value() {
+        return this._value;
+    }
+    set value(value) {
+        if (value)
+            if (this._value !== value) {
+                this.loadModel(value);
+            }
+        this._value = value;
+        this.stateChanges.next();
+    }
+    ngOnInit() {
+        if (!this.displayFields)
+            this.displayFields = this.searchFields;
+        this.loadModel(this.ngControl.value);
+        if (this.preloadElementsCount) {
+            this.serviceRef.getAll(1, this.preloadElementsCount).subscribe({
+                next: (data) => {
+                    this.showSerach = false;
+                    this.options = data.getModels();
+                    this.filteredOptions = this.options;
+                }
+            });
+        }
+        this.searchControl.valueChanges
+            .pipe(filter((res) => {
+            const result = res !== null && res.length >= this.minLengthTerm;
+            if (!result) {
+                this.options = [];
+                this.filteredOptions = [];
+            }
+            this.showSerach = !result;
+            return result;
+        }), debounceTime(300), tap(() => {
+            this.filteredOptions = [];
+            this.isLoading = true;
+        }), switchMap((value) => this.serviceRef
+            .getAll(1, 10, this.sortFields, `${this.searchFields.replace(',', '|')}@=*${value}`)
+            .pipe(finalize(() => {
+            this.isLoading = false;
+        }))), takeUntil(this._onDestroy))
+            .subscribe((options) => {
+            this.filteredOptions = options.getModels();
+        });
+    }
+    onSelected($event) {
+        const value = $event.option.value;
+        this.searchControl.setValue(value);
+        this.modelSelected.emit(value);
+        if (this.valueField in value) {
+            this.setControlValue(value[this.valueField]);
+        }
+    }
+    setControlValue(value) {
+        this.value = value;
+        this.ngControl.control.setValue(value);
+    }
+    displayWith(value) {
+        return this.getConcatedFields(value);
+    }
+    clearSelection() {
+        this.modelSelected.emit(null);
+        this.setControlValue(null);
+        this.searchControl.setValue(null);
+        this.filteredOptions = this.options;
+    }
+    getConcatedFields(option) {
+        if (!option)
+            return null;
+        const filtersArr = this.displayFields.split(',');
+        return filtersArr.reduce((acc, cv) => {
+            return acc.concat(option[cv] + ' ');
+        }, '');
+    }
+    ngOnDestroy() {
+        this.searchControl = null;
+        this.stateChanges.complete();
+        this._focusMonitor.stopMonitoring(this._elementRef);
+        this._onDestroy.next();
+        this._onDestroy.complete();
+    }
+    getSearchText() {
+        return `Enter ${this.minLengthTerm} characters to start search`;
+    }
+    writeValue(model) {
+        console.log(model);
+        this.value = model;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    loadModel(id) {
+        //Load the model from API to display the value
+        let needLoad = false;
+        if (id) {
+            if (!this.searchControl.value)
+                needLoad = true;
+            else {
+                if (this.searchControl.value[this.valueField] !== id) {
+                    needLoad = true;
+                }
+            }
+        }
+        if (needLoad) {
+            this.serviceRef.get(id).subscribe({
+                next: (model) => {
+                    this.options.push(model);
+                    this.filteredOptions = this.options;
+                    this.searchControl.setValue(model);
+                }
+            });
+        }
+    }
+}
+SearchableDropdownComponent.nextId = 0;
+SearchableDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: SearchableDropdownComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }, { token: i2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+SearchableDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: SearchableDropdownComponent, selector: "rsl-searchable-dropdown", inputs: { label: "label", fControlName: "fControlName", serviceRef: "serviceRef", searchFields: "searchFields", displayFields: "displayFields", sortFields: "sortFields", valueField: "valueField", minLengthTerm: "minLengthTerm", preloadElementsCount: "preloadElementsCount", required: "required", disabled: "disabled", value: "value" }, outputs: { modelSelected: "modelSelected" }, host: { properties: { "class.example-floating": "shouldLabelFloat", "id": "id", "attr.aria-describedby": "describedBy" } }, ngImport: i0, template: "<div class=\"form-group\">\r\n  <label>{{label | translate}}</label>\r\n  <mat-form-field appearance=\"outline\" fxFlex>\r\n    <input matInput [matAutocomplete]=\"auto\" [formControl]=\"searchControl\">\r\n    <button *ngIf=\"searchControl.value\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearSelection()\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelected($event)\"\r\n      [displayWith]=\"displayWith.bind(this)\">\r\n      <mat-option *ngIf=\"isLoading\">Loading...</mat-option>\r\n      <mat-option *ngIf=\"!isLoading && filteredOptions.length == 0 && !showSerach\" disabled>Not found</mat-option>\r\n      <mat-option *ngIf=\"showSerach\" disabled>{{getSearchText()}}</mat-option>\r\n      <ng-container *ngIf=\"!isLoading && filteredOptions.length > 0\">\r\n        <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n          <span><b>{{getConcatedFields(option)}}</b></span>\r\n        </mat-option>\r\n      </ng-container>\r\n\r\n    </mat-autocomplete>\r\n  </mat-form-field>\r\n</div>", components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i6.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i7.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i6.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatSuffix, selector: "[matSuffix]" }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1$1.TranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: SearchableDropdownComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rsl-searchable-dropdown', host: {
+                        '[class.example-floating]': 'shouldLabelFloat',
+                        '[id]': 'id',
+                        '[attr.aria-describedby]': 'describedBy',
+                    }, template: "<div class=\"form-group\">\r\n  <label>{{label | translate}}</label>\r\n  <mat-form-field appearance=\"outline\" fxFlex>\r\n    <input matInput [matAutocomplete]=\"auto\" [formControl]=\"searchControl\">\r\n    <button *ngIf=\"searchControl.value\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearSelection()\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n    <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelected($event)\"\r\n      [displayWith]=\"displayWith.bind(this)\">\r\n      <mat-option *ngIf=\"isLoading\">Loading...</mat-option>\r\n      <mat-option *ngIf=\"!isLoading && filteredOptions.length == 0 && !showSerach\" disabled>Not found</mat-option>\r\n      <mat-option *ngIf=\"showSerach\" disabled>{{getSearchText()}}</mat-option>\r\n      <ng-container *ngIf=\"!isLoading && filteredOptions.length > 0\">\r\n        <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n          <span><b>{{getConcatedFields(option)}}</b></span>\r\n        </mat-option>\r\n      </ng-container>\r\n\r\n    </mat-autocomplete>\r\n  </mat-form-field>\r\n</div>" }]
+        }], ctorParameters: function () {
+        return [{ type: i1.FocusMonitor }, { type: i0.ElementRef }, { type: i2.NgControl, decorators: [{
+                        type: Optional
+                    }, {
+                        type: Self
+                    }] }];
+    }, propDecorators: { label: [{
+                type: Input
+            }], fControlName: [{
+                type: Input
+            }], serviceRef: [{
+                type: Input
+            }], searchFields: [{
+                type: Input
+            }], displayFields: [{
+                type: Input
+            }], sortFields: [{
+                type: Input
+            }], valueField: [{
+                type: Input
+            }], minLengthTerm: [{
+                type: Input
+            }], preloadElementsCount: [{
+                type: Input
+            }], modelSelected: [{
+                type: Output
+            }], required: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }] } });
+
+class UnderConstructionComponent {
+    constructor() { }
+}
+UnderConstructionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: UnderConstructionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+UnderConstructionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: UnderConstructionComponent, selector: "rsl-under-construction", ngImport: i0, template: "<div class=\"forms-view-container\">\n  <div class=\"under-construction-view-container\">\n    Page under construction\n  </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: UnderConstructionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rsl-under-construction', template: "<div class=\"forms-view-container\">\n  <div class=\"under-construction-view-container\">\n    Page under construction\n  </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] }]
+        }], ctorParameters: function () { return []; } });
+
+class BaseQueryData {
+    constructor(jsonApiModels, metaData) {
+        this.jsonApiModels = jsonApiModels;
+        this.metaData = metaData;
+    }
+    getModels() {
+        return this.jsonApiModels;
+    }
+    getMeta() {
+        return this.metaData;
+    }
+}
+
+class BaseDatastore {
+    constructor(httpClient) {
+        this.httpClient = httpClient;
+        // tslint:disable-next-line:variable-name
+        this._store = {};
+        // tslint:enable:max-line-length
+        // tslint:disable-next-line:ban-types
+        this.toQueryString = this.datastoreConfig.overrides
+            && this.datastoreConfig.overrides.toQueryString ?
+            this.datastoreConfig.overrides.toQueryString : this._toQueryString;
+    }
+    // tslint:enable:max-line-length
+    get getDirtyAttributes() {
+        if (this.datastoreConfig.overrides
+            && this.datastoreConfig.overrides.getDirtyAttributes) {
+            return this.datastoreConfig.overrides.getDirtyAttributes;
+        }
+        else {
+            return BaseDatastore.getDirtyAttributes;
+        }
+    }
+    get getAllAttributes() {
+        if (this.datastoreConfig.overrides
+            && this.datastoreConfig.overrides.getAllAttributes) {
+            return this.datastoreConfig.overrides.getAllAttributes;
+        }
+        else {
+            return BaseDatastore.getAllAttributes;
+        }
+    }
+    // protected config: DatastoreConfig;
+    static getDirtyAttributes(attributesMetadata) {
+        const dirtyData = {};
+        for (const propertyName in attributesMetadata) {
+            if (attributesMetadata.hasOwnProperty(propertyName)) {
+                const metadata = attributesMetadata[propertyName];
+                if (metadata.hasDirtyAttributes) {
+                    const attributeName = metadata.serializedName != null ? metadata.serializedName : propertyName;
+                    dirtyData[attributeName] = metadata.serialisationValue ? metadata.serialisationValue : metadata.newValue;
+                }
+            }
+        }
+        return dirtyData;
+    }
+    static getAllAttributes(attributesMetadata) {
+        const dirtyData = {};
+        for (const propertyName in attributesMetadata) {
+            if (attributesMetadata.hasOwnProperty(propertyName)) {
+                const metadata = attributesMetadata[propertyName];
+                const attributeName = metadata.serializedName != null ? metadata.serializedName : propertyName;
+                dirtyData[attributeName] = metadata.serialisationValue ? metadata.serialisationValue : metadata.newValue;
+            }
+        }
+        return dirtyData;
+    }
+    findAll(modelType, params, headers, customUrl) {
+        const customHeadhers = this.buildHeaders(headers);
+        const htmlParams = this.buildParams(params);
+        const url = this.buildUrl(modelType, customUrl);
+        const response = this.httpClient.get(url, { headers: customHeadhers, params: htmlParams, withCredentials: true })
+            .pipe(map(res => this.extractQueryData(res, modelType)), catchError(this.handleError));
+        return response;
+    }
+    findRecord(modelType, id, params, headers, customUrl) {
+        const customHeadhers = this.buildHeaders(headers);
+        let url = this.buildUrl(modelType, customUrl);
+        if (id) {
+            url += '/' + id;
+        }
+        const htmlParams = this.buildParams(params, undefined);
+        return this.httpClient.get(url, { headers: customHeadhers, params: htmlParams, withCredentials: true })
+            .pipe(map(res => this.entityToModel(res, modelType, undefined)), catchError(this.handleError));
+    }
+    getCustom(modelType, params, headers, customUrl, customResponseType) {
+        const customHeadhers = this.buildHeaders(headers);
+        const url = this.buildUrl(modelType, customUrl);
+        const htmlParams = this.buildParams(params, undefined);
+        if (!customResponseType)
+            customResponseType = 'json';
+        return this.httpClient.get(url, { headers: customHeadhers, params: htmlParams, withCredentials: true, responseType: customResponseType });
+    }
+    postCustom(modelType, body, params, headers, customUrl) {
+        const customHeadhers = this.buildHeaders(headers);
+        const url = this.buildUrl(modelType, customUrl);
+        const htmlParams = this.buildParams(params, undefined);
+        return this.httpClient.post(url, body, { headers: customHeadhers, params: htmlParams, reportProgress: true, withCredentials: true });
+    }
+    patchCustom(modelType, body, params, headers, customUrl) {
+        const customHeadhers = this.buildHeaders(headers);
+        const url = this.buildUrl(modelType, customUrl);
+        const htmlParams = this.buildParams(params, undefined);
+        return this.httpClient.patch(url, body, { headers: customHeadhers, params: htmlParams, withCredentials: true });
+    }
+    createRecord(modelType, data) {
+        return new modelType(this, data);
+    }
+    saveRecord(attributesMetadata, model, params, headers, customUrl, customBody) {
+        const modelType = model.constructor;
+        const modelConfig = model.modelConfig;
+        const customHeadhers = this.buildHeaders(headers);
+        const url = this.buildUrl(modelType, customUrl);
+        const htmlParams = this.buildParams(params);
+        let httpCall;
+        const body = customBody || this.modelToEntity(model, attributesMetadata);
+        if (model.id) {
+            // tslint:disable-next-line:max-line-length
+            httpCall = this.httpClient.patch(url + '/' + model.id, body, { headers: customHeadhers, params: htmlParams, withCredentials: true });
+        }
+        else {
+            httpCall = this.httpClient.post(url, body, { headers: customHeadhers, params: htmlParams, withCredentials: true });
+        }
+        return httpCall
+            .pipe(map(res => {
+            const data = this.resetMetadataAttributes(res, attributesMetadata, modelType);
+            return this.entityToModel(data, modelType);
+        }), catchError(this.handleError));
+    }
+    patchRecord(attributesMetadata, model, origModel, params, headers, customUrl) {
+        const modelType = model.constructor;
+        const modelConfig = model.modelConfig;
+        const customHeadhers = this.buildHeaders(headers);
+        const url = this.buildUrl(modelType, customUrl);
+        const htmlParams = this.buildParams(params);
+        let httpCall;
+        let origData = { id: '' };
+        if (origModel)
+            origData = this.modelToEntity(origModel, origModel.attributeMetadata, true);
+        const newData = this.modelToEntity(model, attributesMetadata, true);
+        newData.id = origData.id;
+        const patch = compare(origData, newData);
+        if (patch.length > 0) {
+            httpCall = this.httpClient.patch(url + '/' + model.id, patch, { headers: customHeadhers, params: htmlParams, withCredentials: true });
+            return httpCall
+                .pipe(map(res => {
+                const data = this.resetMetadataAttributes(res, attributesMetadata, modelType);
+                return this.entityToModel(data, modelType);
+            }), catchError(this.handleError));
+        }
+        else {
+            return new Observable((observer) => {
+                observer.next(model);
+                observer.complete();
+            });
+        }
+    }
+    // getPatch<T extends BaseModel>(
+    //   model: T,
+    //   origModel: T): any {
+    // }
+    replaceRecord(attributesMetadata, model, params, headers, customUrl, customBody) {
+        const modelType = model.constructor;
+        const modelConfig = model.modelConfig;
+        const customHeadhers = this.buildHeaders(headers);
+        const url = this.buildUrl(modelType, customUrl);
+        const htmlParams = this.buildParams(params);
+        let httpCall;
+        const body = customBody || this.modelToEntity(model, attributesMetadata, true);
+        if (model.id) {
+            httpCall = this.httpClient.put(url + '/' + model.id, body, { headers: customHeadhers, params: htmlParams, withCredentials: true });
+        }
+        else {
+            httpCall = this.httpClient.post(url, body, { headers: customHeadhers, params: htmlParams, withCredentials: true });
+        }
+        return httpCall
+            .pipe(map(res => {
+            const data = this.resetMetadataAttributes(res, attributesMetadata, modelType);
+            return this.entityToModel(data, modelType);
+        }), catchError(this.handleError));
+    }
+    deleteRecord(modelType, id, headers, customUrl) {
+        const customHeadhers = this.buildHeaders(headers);
+        let url = this.buildUrl(modelType, customUrl);
+        if (!url.includes('share')) {
+            url = url + '/' + id;
+        }
+        // const idParam = new HttpParams().set('id', id);
+        return this.httpClient.delete(url, { headers: customHeadhers, withCredentials: true })
+            .pipe(catchError(this.handleError));
+    }
+    buildUrl(modelType, customUrl) {
+        if (customUrl) {
+            return customUrl;
+        }
+        const modelConfig = Reflect.getMetadata('BaseModelConfig', modelType);
+        const baseUrl = modelConfig.baseUrl || this.datastoreConfig.baseUrl;
+        const apiVersion = modelConfig.apiVersion || this.datastoreConfig.apiVersion;
+        const modelEndpointUrl = modelConfig.modelEndpointUrl || modelConfig.type;
+        const url = [baseUrl, apiVersion, modelEndpointUrl].filter((x) => x).join('/');
+        return url;
+    }
+    extractQueryData(res, modelType) {
+        let result;
+        const body = res;
+        const models = [];
+        for (const data of body.data) {
+            const model = this.entityToModel(data, modelType, undefined);
+            models.push(model);
+        }
+        result = new BaseQueryData(models, this.parseMeta(body, modelType));
+        return result;
+    }
+    deserializeModel(modelType, data) {
+        data = this.transformSerializedNamesToPropertyNames(modelType, data);
+        return new modelType(this, data);
+    }
+    handleError(error) {
+        if (error.error instanceof ErrorEvent) {
+            // A client-side or network error occurred. Handle it accordingly.
+            // console.error('An error occurred:', error.error.message);
+        }
+        else {
+            // The backend returned an unsuccessful response code.
+            // The response body may contain clues as to what went wrong,
+            // console.error(
+            //   'Backend returned code ${error.status}, ' +
+            //   'body was: ${error.error}');
+        }
+        // return an observable with a user-facing error message
+        return throwError(error);
+    }
+    parseMeta(body, modelType) {
+        const metaModel = Reflect.getMetadata('BaseModelConfig', modelType).meta;
+        return new metaModel(body);
+    }
+    resetMetadataAttributes(res, attributesMetadata, modelType) {
+        // TODO check why is attributesMetadata from the arguments never used
+        for (const propertyName in attributesMetadata) {
+            if (attributesMetadata.hasOwnProperty(propertyName)) {
+                const metadata = attributesMetadata[propertyName];
+                if (metadata.hasDirtyAttributes) {
+                    metadata.hasDirtyAttributes = false;
+                }
+            }
+        }
+        if (res) {
+            res.attributeMetadata = attributesMetadata;
+        }
+        return res;
+    }
+    get datastoreConfig() {
+        const configFromDecorator = Reflect.getMetadata('BaseDatastoreConfig', this.constructor);
+        return Object.assign(configFromDecorator, this.config);
+    }
+    transformSerializedNamesToPropertyNames(modelType, attributes) {
+        const serializedNameToPropertyName = this.getModelPropertyNames(modelType.prototype);
+        const properties = {};
+        Object.keys(serializedNameToPropertyName).forEach((serializedName) => {
+            if (attributes[serializedName] !== null && attributes[serializedName] !== undefined) {
+                properties[serializedNameToPropertyName[serializedName]] = attributes[serializedName];
+            }
+        });
+        return properties;
+    }
+    getModelPropertyNames(model) {
+        return Reflect.getMetadata('AttributeMapping', model);
+    }
+    buildHeaders(customHeaders) {
+        const headers = {
+            Accept: 'application/json-patch+json',
+            // 'Content-Type': 'application/vnd.api+json',
+            'Content-Type': 'application/json-patch+json'
+        };
+        if (customHeaders && customHeaders.keys().length) {
+            // tslint:disable-next-line:variable-name
+            Object.assign({}, headers, customHeaders.keys().map(header_name => {
+                headers['' + header_name] = customHeaders.get(header_name);
+            }));
+        }
+        return new HttpHeaders(headers);
+    }
+    buildParams(params, id) {
+        let httpParams = new HttpParams();
+        if (id) {
+            httpParams = httpParams.set('id', id);
+        }
+        if (params) {
+            Object.keys(params)
+                .filter(key => {
+                const v = params[key];
+                return (Array.isArray(v) || typeof v === 'string') ?
+                    (v.length > 0) :
+                    (v !== null && v !== undefined);
+            })
+                .forEach(key => {
+                httpParams = httpParams.set(key, params[key]);
+            });
+        }
+        return httpParams;
+    }
+    entityToModel(res, modelType, model) {
+        return this.extractRecordDataJson(res, modelType, model);
+    }
+    extractRecordDataJson(res, modelType, model) {
+        const body = res;
+        if (!body) {
+            throw new Error('no body in response');
+        }
+        if (model) {
+            Object.assign(model, body);
+        }
+        const deserializedModel = model || this.deserializeModel(modelType, body.data || body);
+        return deserializedModel;
+    }
+    modelToEntity(model, attributesMetadata, allAttributes = false) {
+        let attributes;
+        if (allAttributes) {
+            attributes = this.getAllAttributes(attributesMetadata, model);
+        }
+        else {
+            attributes = this.getDirtyAttributes(attributesMetadata, model);
+        }
+        // this.getRelationships(model, attributes);
+        return attributes;
+    }
+    _toQueryString(params) {
+        return qs.stringify(params, { arrayFormat: 'brackets' });
+    }
+}
+BaseDatastore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+BaseDatastore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$2.HttpClient }]; } });
+
+class BaseService {
+    constructor(datastore) {
+        this.datastore = datastore;
+    }
+    setModelType(modelType) {
+        this.modelType = modelType;
+    }
+    get(id, customInclude = '') {
+        const response = this.datastore.findRecord(this.modelType, id, { customInclude });
+        return response;
+    }
+    getAll(page, pageSize, sort = '', filters = '', customInclude = '') {
+        const response = this.datastore.findAll(this.modelType, {
+            Page: page,
+            PageSize: pageSize,
+            Sorts: sort,
+            Filters: filters,
+            customInclude
+        });
+        return response;
+    }
+    delete(id) {
+        const response = this.datastore.deleteRecord(this.modelType, id);
+        return response;
+    }
+    getCustom(params, headers, customUrl, customResponseType) {
+        return this.datastore.getCustom(this.modelType, params, headers, customUrl, customResponseType);
+    }
+    postCustom(body, params, headers, customUrl) {
+        return this.datastore.postCustom(this.modelType, body, params, headers, customUrl);
+    }
+    patchCustom(body, params, headers, customUrl) {
+        return this.datastore.patchCustom(this.modelType, body, params, headers, customUrl);
+    }
+    // checkIfPropertyUnique(property: string, value: any): Observable<boolean> {
+    // }
+    save(docTypeOrFormGroup, id, origModel) {
+        if (id == null) {
+            let fromModel;
+            if (docTypeOrFormGroup instanceof FormGroup) {
+                fromModel = this.fromFormGroup(docTypeOrFormGroup, id);
+            }
+            else {
+                fromModel = docTypeOrFormGroup;
+            }
+            const data = this.datastore.createRecord(this.modelType, fromModel);
+            return data.save();
+        }
+        else {
+            return this.patch(docTypeOrFormGroup, origModel, id);
+        }
+    }
+    patch(docTypeOrFormGroup, origModel, id) {
+        let fromModel;
+        if (docTypeOrFormGroup instanceof FormGroup) {
+            fromModel = this.fromFormGroup(docTypeOrFormGroup, id);
+        }
+        else {
+            fromModel = docTypeOrFormGroup;
+        }
+        const data = this.datastore.createRecord(this.modelType, fromModel);
+        return data.patch(origModel);
+    }
+    newModel(data) {
+        return new this.modelType(this.datastore, data);
+    }
+    toFormGroup(fb, fromModel) {
+        if (fromModel === undefined) {
+            fromModel = this.newModel();
+        }
+        return fromModel.getFromGroup(fb);
+    }
+    fromFormGroup(formGroup, id) {
+        // const saveModel = this.newModel(formGroup.getRawValue());
+        // saveModel.id = id ? id : null;
+        // return saveModel;
+        const saveModel = this.newModel();
+        saveModel.getModelFromFormGroup(formGroup);
+        saveModel.id = id ? id : null;
+        return saveModel;
+    }
+}
+BaseService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseService, deps: [{ token: BaseDatastore }], target: i0.ɵɵFactoryTarget.Injectable });
+BaseService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: function () { return [{ type: BaseDatastore }]; } });
+
+/**
+ * Async modal dialog service
+ * DialogService makes this app easier to test by faking this service.
+ * TODO: better modal implementation that doesn't use window.confirm
+ */
+class DialogService {
+    /**
+     * Ask user to confirm an action. `message` explains the action and choices.
+     * Returns observable resolving to `true`=confirm or `false`=cancel
+     */
+    constructor() { }
+    confirm(message, text, confirmButtonText = 'Delete', cancelButtonText = 'Cancel') {
+        const confirmation = Swal.fire({
+            title: message || 'Are you sure?',
+            icon: 'warning',
+            text: text || '',
+            showCancelButton: true,
+            confirmButtonText: confirmButtonText,
+            cancelButtonText: cancelButtonText,
+            customClass: {
+                confirmButton: 'btn btn-red btn-fill btn-wd',
+                cancelButton: 'btn btn-grey btn-fill btn-wd',
+            },
+            buttonsStyling: false,
+            reverseButtons: true
+        })
+            .then((result) => {
+            if (result.value) {
+                return true;
+            }
+            else {
+                return false;
+            }
+        }).catch();
+        return from(confirmation);
+    }
+    showSaveMessage(message, title) {
+        const confirmation = Swal.fire({
+            icon: 'success',
+            title: message,
+            timer: 2000,
+            showConfirmButton: false,
+            // customClass: 'overflow-hidden',
+            buttonsStyling: false
+        }).then(() => {
+            return true;
+        }, () => {
+            return false;
+        }).catch();
+        return from(confirmation);
+    }
+    showRegisteredMessage(message, title) {
+        const confirmation = Swal.fire({
+            icon: 'success',
+            title: message,
+            showConfirmButton: true,
+            customClass: {
+                confirmButton: 'btn btn-success',
+            },
+            buttonsStyling: false
+        }).then(() => {
+            return true;
+        }, () => {
+            return false;
+        }).catch();
+        return from(confirmation);
+    }
+    // notification(message?: string, type?: NotificationType, fromPosition?: NotificationFrom, align?: NotificationAlign, timer?: number) {
+    //   if (!type) {
+    //     type = NotificationType.success;
+    //   }
+    //   if (!fromPosition) {
+    //     fromPosition = NotificationFrom.bottom;
+    //   }
+    //   if (!align) {
+    //     align = NotificationAlign.center;
+    //   }
+    //   if (!timer) {
+    //     timer = 3000;
+    //   }
+    //   $.notify({
+    //     icon: 'notifications',
+    //     message: message
+    //   }, {
+    //       type: type,
+    //       timer: 3000,
+    //       placement: {
+    //         from: from,
+    //         align: align
+    //       }
+    //     });
+    // }
+    showErrorMessage(e, message) {
+        if (!message) {
+            message = 'Validation errors';
+        }
+        if (e instanceof HttpErrorResponse) {
+            // Validation errors
+            if (e.status === 400) {
+                const errors = e.error.errors;
+                if (errors) {
+                    errors.forEach(error => {
+                        message += error.field + ' ' + error.detail + '\n';
+                    });
+                    // message = errors.detail;
+                    // if (detail.relationships) {
+                    //   detail.relationships.forEach(relation => {
+                    //     console.log(relation);
+                    //   });
+                    // }
+                }
+            }
+        }
+        const confirmation = Swal.fire({
+            icon: 'error',
+            title: message,
+            // timer: 2000,
+            showConfirmButton: true,
+            customClass: {
+                confirmButton: 'btn btn-success',
+            },
+            buttonsStyling: false
+        }).then(() => {
+            return true;
+        }, () => {
+            return false;
+        }).catch();
+        return from(confirmation);
+    }
+    getTextTranslation(translationKey) {
+        // // const result = await promise;
+        // // return result;
+        // const result = this.translate.instant(translationKey);
+        // if (result === translationKey) {
+        return translationKey;
+        // }
+        // return result;
+    }
+}
+DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DialogService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: DialogService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return []; } });
+
+class BaseFormEditComponent {
+    constructor(fb, router, route, modelService, dialogService, translate, location) {
+        this.fb = fb;
+        this.router = router;
+        this.route = route;
+        this.modelService = modelService;
+        this.dialogService = dialogService;
+        this.translate = translate;
+        this.location = location;
+        this.isLoading = true;
+        this.changeUrlRoute = true;
+        this.generateForm(this.modelService.newModel());
+    }
+    afterSave(model) {
+        return new Observable((observer) => {
+            observer.next(model);
+            observer.complete();
+        });
+    }
+    beforeSave(model) {
+        return new Observable((observer) => {
+            observer.next(model);
+            observer.complete();
+        });
+    }
+    ngOnInit() {
+        this.initForm();
+    }
+    initForm(customInclude = '', newModelId = null, model = null) {
+        var _a;
+        if (model === null) {
+            this.modelId = (_a = this.route.snapshot.paramMap.get('id')) !== null && _a !== void 0 ? _a : newModelId;
+            this.isEdit = false;
+            if (this.modelId) {
+                this.modelService.get(this.modelId, customInclude).subscribe((value) => {
+                    this.isEdit = true;
+                    this.generateForm(value);
+                });
+            }
+            else {
+                if (this.changeUrlRoute) {
+                    const addUrl = this.router.createUrlTree([]).toString();
+                    this.editRoute = this.router.createUrlTree([addUrl.replace('add', 'edit')]).toString();
+                }
+                // }
+                this.generateForm(this.modelService.newModel());
+            }
+        }
+        else {
+            this.modelId = model.id;
+            this.isEdit = true;
+            this.generateForm(model);
+        }
+    }
+    generateForm(model) {
+        this.isLoading = false;
+        this.modelId = model.id;
+        this.model = model;
+        this.baseForm = this.modelService.toFormGroup(this.fb, model);
+        this.afterFormGenerated();
+    }
+    afterFormGenerated() {
+    }
+    getFromGroup(formGroup = null) {
+        if (!formGroup)
+            return this.baseForm;
+        if (formGroup instanceof FormGroup)
+            return formGroup;
+        return this.baseForm.controls[formGroup];
+    }
+    validateAllFormFields(formGroup = null) {
+        const fg = this.getFromGroup(formGroup);
+        Object.keys(fg.controls).forEach(field => {
+            // console.log(field);
+            const control = fg.get(field);
+            if (control instanceof FormControl) {
+                control.markAsTouched({ onlySelf: true });
+            }
+            else if (control instanceof FormGroup) {
+                this.validateAllFormFields(control);
+            }
+        });
+    }
+    isFieldValid(field, formGroup = null) {
+        const fg = this.getFromGroup(formGroup);
+        const filedControl = fg.get(field);
+        return !filedControl.valid && filedControl.touched;
+    }
+    isFieldValidFromArray(arrayIndex, field, arrayName = 'formArray') {
+        const fieldControl = this.baseForm.get(arrayName).get([arrayIndex]).get(field);
+        return !fieldControl.valid && fieldControl.touched;
+    }
+    displayFieldCss(field) {
+        return {
+            'has-error': this.isFieldValid(field),
+            'has-feedback': this.isFieldValid(field)
+        };
+    }
+    onCancel() {
+        this.router.navigate([this.cancelRoute]);
+    }
+    onSave() {
+        this.saveModel(this.baseForm);
+    }
+    saveModel(formGroup = null) {
+        const fg = this.getFromGroup(formGroup);
+        const that = this;
+        if (fg) {
+            if (fg.valid) {
+                that.blockUI.start('Saving ...');
+                this.beforeSave(this.model).subscribe(_ => {
+                    this.modelService.save(this.baseForm, this.modelId, this.model).subscribe((newModel) => {
+                        this.model = newModel;
+                        this.modelId = newModel.id;
+                        if (this.editRoute) {
+                            this.isEdit = true;
+                            if (this.changeUrlRoute) {
+                                const url = this.router.createUrlTree([this.editRoute, this.modelId]).toString();
+                                this.location.replaceState(url);
+                            }
+                        }
+                        this.afterSave(newModel).subscribe((val) => {
+                            this.blockUI.stop();
+                            this.dialogService.showSaveMessage('Your changes were saved successfully.').subscribe(d => {
+                                fg.markAsPristine();
+                            });
+                        });
+                    }, err => {
+                        this.serverErrors(err);
+                        this.blockUI.stop();
+                    });
+                });
+            }
+            else {
+                this.validateAllFormFields(formGroup);
+            }
+        }
+    }
+    serverErrors(err) {
+        if (err.error) {
+            if (err.error.errors) {
+                const validationErrors = err.error.errors;
+                if (Array.isArray(validationErrors)) {
+                    validationErrors.forEach(prop => {
+                        const formControl = this.baseForm.get(prop);
+                        if (formControl) {
+                            // activate the error message
+                            formControl.setErrors({
+                                serverError: validationErrors[prop].join('\n')
+                            });
+                        }
+                    });
+                }
+                else {
+                    const keys = Object.keys(validationErrors);
+                    keys.forEach(prop => {
+                        const formControl = this.baseForm.get(prop);
+                        if (formControl) {
+                            // activate the error message
+                            formControl.setErrors({
+                                serverError: validationErrors[prop].join('\n')
+                            });
+                        }
+                    });
+                }
+            }
+        }
+    }
+    canDeactivate() {
+        // Allow synchronous navigation (`true`) if no crisis or the crisis is unchanged
+        if (!this.baseForm.dirty) {
+            return true;
+        }
+        // Otherwise ask the user with the dialog service and return its
+        // observable which resolves to true or false when the user decides
+        return this.dialogService.confirm('Discard changes ?', null, 'Discard');
+    }
+    getFiledName(filedTranslationKey) {
+        return { field: this.translate.instant(filedTranslationKey) };
+    }
+    getCustomErrorMessage(error, fieldLabel) {
+        return '';
+    }
+    getErrorMessageFromArray(arrayIndex, field, filedTranslationKey, arrayName = 'formArray') {
+        const fieldControl = this.baseForm.get(arrayName).get([arrayIndex]).get(field);
+        return this.getErrorMessageForField(fieldControl, filedTranslationKey);
+    }
+    getErrorMessage(field, filedTranslationKey, formGroup = null) {
+        const fg = this.getFromGroup(formGroup);
+        return this.getErrorMessageForField(fg.get(field), filedTranslationKey);
+    }
+    getErrorMessageForField(fieldControl, filedTranslationKey) {
+        const error = fieldControl.errors;
+        const fieldLabel = this.translate.instant(filedTranslationKey);
+        let rvalue = '';
+        if (error !== null) {
+            if (error['required'] === true) {
+                rvalue = this.translate.instant('General.Field.Required', { field: fieldLabel });
+            }
+            if (error['minlength']) {
+                rvalue = this.translate.instant('General.Field.MinLength', { field: fieldLabel, requiredLength: error.minlength.requiredLength });
+            }
+            if (error['email'] === true) {
+                rvalue = this.translate.instant('General.Field.InvalidEmail');
+            }
+            if (error['url'] === true) {
+                rvalue = this.translate.instant('General.Field.InvalidUrl');
+            }
+            if (error['serverError']) {
+                rvalue = error['serverError'];
+            }
+            if (rvalue === '') {
+                rvalue = this.getCustomErrorMessage(error, fieldLabel);
+            }
+        }
+        return rvalue;
+    }
+}
+BaseFormEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseFormEditComponent, deps: [{ token: i2.FormBuilder }, { token: i2$1.Router }, { token: i2$1.ActivatedRoute }, { token: BaseService }, { token: DialogService }, { token: i1$1.TranslateService }, { token: i3$1.Location }], target: i0.ɵɵFactoryTarget.Component });
+BaseFormEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BaseFormEditComponent, selector: "app-base.form.edit", ngImport: i0, template: '', isInline: true });
+__decorate([
+    BlockUI()
+], BaseFormEditComponent.prototype, "blockUI", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseFormEditComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'app-base.form.edit',
+                    template: ''
+                }]
+        }], ctorParameters: function () { return [{ type: i2.FormBuilder }, { type: i2$1.Router }, { type: i2$1.ActivatedRoute }, { type: BaseService }, { type: DialogService }, { type: i1$1.TranslateService }, { type: i3$1.Location }]; }, propDecorators: { blockUI: [] } });
+
+var GridLayoutFormat;
+(function (GridLayoutFormat) {
+    GridLayoutFormat[GridLayoutFormat["none"] = 0] = "none";
+    GridLayoutFormat[GridLayoutFormat["date"] = 1] = "date";
+    GridLayoutFormat[GridLayoutFormat["number"] = 2] = "number";
+    GridLayoutFormat[GridLayoutFormat["percent"] = 3] = "percent";
+    GridLayoutFormat[GridLayoutFormat["picture"] = 4] = "picture";
+})(GridLayoutFormat || (GridLayoutFormat = {}));
+var CellTextAlign;
+(function (CellTextAlign) {
+    CellTextAlign["left"] = "left";
+    CellTextAlign["center"] = "center";
+    CellTextAlign["right"] = "right";
+})(CellTextAlign || (CellTextAlign = {}));
+
+class GenericTableComponent {
+    // ruleEngineService: RuleEngineService<T>;
+    constructor(dialogService, router, datePipe, numberPipe, percentPipe, renderer) {
+        this.dialogService = dialogService;
+        this.router = router;
+        this.datePipe = datePipe;
+        this.numberPipe = numberPipe;
+        this.percentPipe = percentPipe;
+        this.renderer = renderer;
+        this.defaultSort = null;
+        this.defaultSortDirection = null;
+        this.deletePropertyName = 'name';
+        this.stickyColumns = null;
+        this.editOnClick = false;
+        this.editOnDblClick = false;
+        this.allowEdit = true;
+        this.popupEdit = false;
+        this.customInclude = null;
+        this.infiniteScroll = false;
+        this.dataSource = new MatTableDataSource();
+        this.resultsLength = 0;
+        this.isLoadingResults = true;
+        this.isRateLimitReached = false;
+        this.filterChanged = new Subject();
+        this.selectedObject = new EventEmitter();
+        this.click = new EventEmitter();
+        this.editModel = new EventEmitter();
+    }
+    ngOnChanges() {
+        if (this.baseService !== undefined || this.baseService !== null) {
+            if (this.gridLayoutService != null) {
+                this.gridLayout = this.gridLayoutService.getGridLayout();
+            }
+            else {
+                const model = this.baseService.newModel();
+                this.gridLayout = model.getGridLayout();
+            }
+            this.displayedColumns = [];
+            if (this.allowReorderItems) {
+                this.displayedColumns.push('position');
+            }
+            this.displayedColumns.push.apply(this.displayedColumns, this.gridLayout.map(x => x.propertyName));
+            if (!this.editOnClick && !this.editOnDblClick && this.allowEdit) {
+                this.displayedColumns.push('delete');
+            }
+        }
+    }
+    ngOnInit() {
+        this.filterChangedSubscription = this.filterChanged
+            .pipe(debounceTime(300), distinctUntilChanged())
+            .subscribe(newText => {
+            if (newText.length >= 3 || newText.length == 0) {
+                this.filterValue = newText;
+                this.paginator.pageIndex = 0;
+                this.refreshForm();
+            }
+        });
+        // this.getGridLayout();
+        this.sort.sortChange.subscribe(() => this.paginator.pageIndex = 0);
+        this.paginator.pageSize = 15;
+        if (this.defaultSort) {
+            this.sort.active = this.defaultSort;
+            if (this.defaultSortDirection) {
+                this.sort.direction = this.defaultSortDirection;
+            }
+            else {
+                this.sort.direction = 'asc';
+            }
+        }
+        // this.dataSource.paginator = this.paginator;
+        merge(this.sort.sortChange, this.paginator.page)
+            .pipe(startWith({}), switchMap(() => {
+            this.isLoadingResults = true;
+            return this.getData();
+        }), map(data => {
+            // Flip flag to show that loading has finished.
+            this.isLoadingResults = false;
+            this.isRateLimitReached = false;
+            if (data) {
+                this.resultsLength = data.getMeta().meta.count;
+                return data.getModels();
+            }
+            else {
+                this.resultsLength = 0;
+                return [];
+            }
+        }), catchError(() => {
+            this.isLoadingResults = false;
+            // Catch if the GitHub API has reached its rate limit. Return empty data.
+            this.isRateLimitReached = true;
+            return of([]);
+        })).subscribe(data => {
+            // if (this.infiniteScroll) {
+            //   let oldData = this.dataSource.data ?? null;
+            //   // if (oldData.length === 0) {
+            //   //   oldData = data;
+            //   // } else {
+            //     oldData=oldData.concat(data);
+            //   // }
+            //   this.dataSource.data = oldData;
+            // }
+            // else {
+            this.dataSource.data = data;
+            // }
+        });
+        // this.paginator.nextPage()
+    }
+    getData() {
+        this.isLoadingResults = true;
+        const pageIndex = (this.paginator.pageIndex || 0) + 1;
+        const pageSize = this.paginator.pageSize || 20;
+        const filters = [];
+        let sorts = '';
+        if (this.sort.active) {
+            if (this.sort.direction === 'desc') {
+                sorts = '-' + this.sort.active;
+            }
+            else {
+                sorts = this.sort.active;
+            }
+        }
+        if (this.hasSearch) {
+            if (this.filterValue) {
+                // const filtersArr = this.searchFields.split(",");
+                // filtersArr.forEach(element => {
+                //   filters.push(element + '@=*' + this.filterValue);
+                // });
+                const y = '(' + this.searchFields.replace(',', '|') + ')';
+                filters.push(y + '@=*' + this.filterValue);
+            }
+        }
+        if (this.defaultFilter) {
+            filters.push(this.defaultFilter);
+        }
+        const filtersValue = filters.join(', ');
+        return this.baseService.getAll(pageIndex, pageSize, sorts, filtersValue, this.customInclude);
+    }
+    refreshForm() {
+        this.getData().subscribe(data => {
+            if (data) {
+                this.isLoadingResults = false;
+                this.isRateLimitReached = false;
+                this.resultsLength = data.getMeta().meta.count;
+                this.dataSource.data = data.getModels();
+            }
+            else {
+                this.isLoadingResults = false;
+                this.isRateLimitReached = false;
+                this.resultsLength = 0;
+                this.dataSource.data = [];
+            }
+        });
+    }
+    highlight(element) {
+        if (this.selectedItem) {
+            this.selectedItem.highlighted = element.highlighted;
+        }
+        this.selectedItem = null;
+        element.highlighted = !element.highlighted;
+        if (element.highlighted) {
+            this.selectedItem = element;
+            this.selectedObject.emit(element);
+        }
+        else {
+            this.selectedObject.emit(null);
+        }
+    }
+    deleteObject(model) {
+        const msg = 'Do you want to delete ' + model[this.deletePropertyName] + '?';
+        this.dialogService.confirm(msg).subscribe((response) => {
+            if (response) {
+                this.baseService.delete(model.id).subscribe(() => {
+                    const tempData = [];
+                    this.selectedObject.emit(null);
+                    this.dataSource.data.map((item) => {
+                        if (item.id !== model.id) {
+                            tempData.push(item);
+                        }
+                    });
+                    this.dataSource.data = tempData;
+                });
+            }
+        });
+    }
+    editObject(model) {
+        if (!this.popupEdit) {
+            const id = model.id;
+            this.router.navigate([this.editLink, id]);
+        }
+        else {
+            this.editModel.emit(model);
+        }
+    }
+    getFlexStyle(column) {
+        if (column.width) {
+            const style = column.grow + ' ' + column.shrink + ' ' + column.width + 'px';
+            return style;
+        }
+        return null;
+    }
+    getCellTextAlign(column) {
+        var _a;
+        return (_a = column.textAlign) !== null && _a !== void 0 ? _a : CellTextAlign.left;
+    }
+    showPictureCell(column) {
+        var _a;
+        return ((_a = column === null || column === void 0 ? void 0 : column.formating) !== null && _a !== void 0 ? _a : GridLayoutFormat.none) === GridLayoutFormat.picture;
+    }
+    deleteDisabled(model) {
+        if (this.deleteDisableRule) {
+            return this.evaluateRule(this.deleteDisableRule, model);
+        }
+        else {
+            return false;
+        }
+    }
+    cellClick(model, propertyName) {
+        this.click.emit({ propertyName, model });
+    }
+    evaluateRule(rules, model) {
+        let result = true;
+        rules.forEach(rule => {
+            let jsonRule;
+            if (typeof rule.rule === 'string') {
+                jsonRule = JSON.parse(rule.rule);
+            }
+            else {
+                jsonRule = rule.rule;
+            }
+            if (rule.parameters) {
+                const data = '{' + rule.parameters.map((item) => {
+                    return '"' + item + '":"' + model[item] + '"';
+                }).join(',') + '}';
+                result = jsonLogic.apply(jsonRule, JSON.parse(data));
+            }
+            else {
+                result = jsonLogic.apply(jsonRule);
+            }
+        });
+        return result;
+    }
+    getCelValue(row, propertyName) {
+        if (!row)
+            return "";
+        // if (propertyName == 'kompetenzenStdev')
+        //   console.log(propertyName);
+        if (propertyName.indexOf('.') === -1) {
+            var gridLayout = this.gridLayout.find(f => f.propertyName.indexOf(propertyName) > -1);
+            return this.getFormatedValue(gridLayout, row[propertyName]);
+        }
+        else {
+            const prop = propertyName.split('.')[0];
+            const subProp = propertyName.replace(prop + '.', '');
+            return this.getCelValue(row[prop], subProp);
+        }
+    }
+    getFormatedValue(gridLayout, value) {
+        if (gridLayout) {
+            switch (gridLayout.formating) {
+                case GridLayoutFormat.date:
+                    return this.datePipe.transform(value, gridLayout.format);
+                    break;
+                case GridLayoutFormat.number:
+                    return this.numberPipe.transform(value, gridLayout.format);
+                case GridLayoutFormat.percent:
+                    const valuePrc = value / 100;
+                    return this.percentPipe.transform(valuePrc, gridLayout.format);
+                default:
+                    return value;
+                    break;
+            }
+        }
+        return value;
+    }
+    applyFilter(event) {
+    }
+    dropTable(event) {
+        if (this.changeItemPosition) {
+            const prevItem = this.dataSource.data[event.previousIndex];
+            const currentItem = this.dataSource.data[event.currentIndex];
+            if (this.changeItemPosition(prevItem, currentItem)) {
+                const prevIndex = this.dataSource.data.findIndex((d) => d === event.item.data);
+                moveItemInArray(this.dataSource.data, prevIndex, event.currentIndex);
+                this.table.renderRows();
+            }
+        }
+    }
+    isColumnSticky(name) {
+        if (this.stickyColumns) {
+            const filtersArr = this.stickyColumns.split(",");
+            return filtersArr.findIndex(f => f == name) !== -1;
+        }
+        return false;
+    }
+    updateElement(model) {
+        //Find if element exist
+        var currentElement = this.dataSource.data.find(f => f.id === model.id);
+        if (currentElement !== null) {
+            const index = this.dataSource.data.indexOf(currentElement);
+            this.dataSource.data[index] = model;
+        }
+        else {
+            this.dataSource.data.push(model);
+        }
+        const newData = [...this.dataSource.data];
+        this.dataSource.data = newData;
+        this.dataSource._updateChangeSubscription();
+    }
+    ngAfterViewInit() {
+        fromEvent(this.matTableRef.nativeElement, 'scroll')
+            .pipe(debounceTime(700))
+            .subscribe((e) => this.onTableScroll(e));
+    }
+    onTableScroll(e) {
+        const tableViewHeight = e.target.offsetHeight; // viewport: ~500px
+        const tableScrollHeight = e.target.scrollHeight; // length of all table
+        const scrollLocation = e.target.scrollTop; // how far user scrolled
+        // If the user has scrolled within 200px of the bottom, add more data
+        const scrollThreshold = 200;
+        const scrollUpLimit = scrollThreshold;
+        if (scrollLocation < scrollUpLimit && this.paginator.pageIndex > 0) {
+            // this.firstPage--;
+            console.log(`onTableScroll() UP: firstPage decreased to ${this.paginator.pageIndex}. Now fetching data...`);
+            // this.fetchData();
+            this.scrollTo(tableScrollHeight / 2 - 2 * tableViewHeight);
+        }
+        const scrollDownLimit = tableScrollHeight - tableViewHeight - scrollThreshold;
+        if (scrollLocation > scrollDownLimit && this.paginator.pageIndex < this.paginator.getNumberOfPages()) {
+            // this.firstPage++;
+            console.log(`onTableScroll(): firstPage increased to ${this.paginator.pageIndex}. Now fetching data...`);
+            this.paginator.nextPage();
+            // this.scrollTo(tableScrollHeight / 2 + tableViewHeight);
+        }
+    }
+    scrollTo(position) {
+        this.renderer.setProperty(this.matTableRef.nativeElement, 'scrollTop', position);
+    }
+    getCellClass(model, property) {
+        return model.getCellClass(property);
+    }
+}
+GenericTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GenericTableComponent, deps: [{ token: DialogService }, { token: i2$1.Router }, { token: i3$1.DatePipe }, { token: i3$1.DecimalPipe }, { token: i3$1.PercentPipe }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+GenericTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: GenericTableComponent, selector: "rsl-generic-table", inputs: { modelType: "modelType", baseService: "baseService", gridLayoutService: "gridLayoutService", editLink: "editLink", defaultSort: "defaultSort", defaultSortDirection: "defaultSortDirection", deleteDisableRule: "deleteDisableRule", deletePropertyName: "deletePropertyName", hasSearch: "hasSearch", searchFields: "searchFields", defaultFilter: "defaultFilter", allowReorderItems: "allowReorderItems", stickyColumns: "stickyColumns", editOnClick: "editOnClick", editOnDblClick: "editOnDblClick", allowEdit: "allowEdit", popupEdit: "popupEdit", customInclude: "customInclude", changeItemPosition: "changeItemPosition", infiniteScroll: "infiniteScroll" }, outputs: { selectedObject: "selectedObject", click: "click", editModel: "editModel" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ElementRef, descendants: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }, { propertyName: "matTableRef", first: true, predicate: ["table"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"containerX\" *ngIf=\"hasSearch\">\r\n  <div fxLayout=\"row\" fxLayout.xs=\"column\" fxLayout.sm=\"column\" fxFlexFill>\r\n    <mat-form-field fxFlex>\r\n      <mat-label>Filter</mat-label>\r\n      <input matInput [ngModel]='filterValue' (ngModelChange)='filterChanged.next($event)' #filter>\r\n    </mat-form-field>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"table-container\">\r\n  <div class=\"mat-elevation-z2\">\r\n    <!--  #applicationsContainer -->\r\n    <div class=\"example-loading-shade\" *ngIf=\"isLoadingResults || isRateLimitReached\">\r\n      <mat-spinner *ngIf=\"isLoadingResults\"></mat-spinner>\r\n      <div class=\"example-rate-limit-reached\" *ngIf=\"isRateLimitReached\">\r\n        {{'General.LoadingData' | translate}}\r\n      </div>\r\n    </div>\r\n\r\n\r\n    <mat-table fxFlex #table [dataSource]=\"dataSource\" id=\"tempalte-forms-table\" matSort matSortDisableClear\r\n      matSortDirection=\"asc\" cdkDropList [cdkDropListData]=\"dataSource\" (cdkDropListDropped)=\"dropTable($event)\">\r\n      <!-- (scroll)=\"onTableScroll($event)\" -->\r\n\r\n\r\n      <ng-container matColumnDef=\"position\">\r\n        <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n          <!-- {{'General.Order' | translate}} -->\r\n        </mat-header-cell>\r\n        <mat-cell fxFlex *matCellDef=\"let element;\">\r\n          <mat-icon cdkDragHandle>reorder</mat-icon>\r\n        </mat-cell>\r\n      </ng-container>\r\n\r\n\r\n      <ng-container *ngFor=\"let column of gridLayout\" [matColumnDef]=\"column.propertyName\"\r\n        [sticky]=\"isColumnSticky(column.propertyName)\">\r\n        <mat-header-cell mat-sort-header disableClear [style.flex]=\"getFlexStyle(column)\" *matHeaderCellDef>\r\n          {{column.translateKey | translate}}\r\n        </mat-header-cell>\r\n        <mat-cell matTooltip={{getCelValue(row,column.propertyName)}} [style.flex]=\"getFlexStyle(column)\"\r\n          [style.text-align]=\"getCellTextAlign(column)\" *matCellDef=\"let row\"  (click)=\"cellClick(row,column.propertyName)\">\r\n          <div [ngClass]=\"getCellClass(row,column.propertyName)\" *ngIf=\"!showPictureCell(column)\">\r\n            {{getCelValue(row,column.propertyName)}}\r\n          </div>\r\n          <img [ngClass]=\"getCellClass(row,column.propertyName)\" *ngIf=\"showPictureCell(column)\">\r\n        </mat-cell>\r\n      </ng-container>\r\n\r\n\r\n      <ng-container matColumnDef=\"delete\" stickyEnd *ngIf=\"!editOnClick && !editOnDblClick\">\r\n        <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n        </mat-header-cell>\r\n        <mat-cell *matCellDef=\"let row\">\r\n          <button class=\"btn btn-green btn-fill btn-wd btn-just-icon\" (click)=\"editObject(row)\"\r\n            matTooltip=\"{{'General.Edit' | translate}}\">\r\n            <!-- <mat-icon>edit</mat-icon> -->\r\n            <i class=\"material-icons\">edit</i>\r\n            <div class=\"ripple-container\"></div>\r\n          </button>\r\n          <button class=\"btn btn-red btn-fill btn-wd btn-just-icon\" (click)=\"deleteObject(row)\"\r\n            [disabled]=\"deleteDisabled(row)\" matTooltip=\"{{'General.Delete' | translate}}\">\r\n            <i class=\"material-icons\">delete</i>\r\n            <div class=\"ripple-container\"></div>\r\n          </button>\r\n        </mat-cell>\r\n      </ng-container>\r\n\r\n      <mat-header-row *matHeaderRowDef=\"displayedColumns;sticky: true\"></mat-header-row>\r\n\r\n      <ng-container *ngIf=\"!editOnClick && !editOnDblClick\">\r\n        <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n          [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"highlight(row)\"\r\n          (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\">\r\n        </mat-row>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"editOnClick && !editOnDblClick\">\r\n        <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n          [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"editObject(row)\"\r\n          (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"!editOnClick && editOnDblClick\">\r\n        <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n          [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (dblclick)=\"editObject(row)\"\r\n          (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\"\r\n          style=\"cursor: pointer;\"></mat-row>\r\n      </ng-container>\r\n\r\n      <!-- [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\"\r\n        (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" -->\r\n    </mat-table>\r\n    <mat-paginator #paginator [hidden]=\"infiniteScroll\" [length]=\"resultsLength\" [pageSize]=\"15\"\r\n      [pageSizeOptions]=\"[15, 30,  100]\" [showFirstLastButtons]=\"true\">\r\n    </mat-paginator>\r\n  </div>\r\n</div>", styles: [".mat-column-delete{flex:0 0 90px;padding-right:30px}.mat-sort-header-button{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-column-position{flex:0 0 60px!important}.mat-table{overflow-x:auto}[hidden]{display:none!important}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i8$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i9.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i12.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i6$1.MatCellDef, selector: "[matCellDef]" }, { type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i12.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i12.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "translate": i1$1.TranslatePipe }, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GenericTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rsl-generic-table', encapsulation: ViewEncapsulation.None, template: "<div class=\"containerX\" *ngIf=\"hasSearch\">\r\n  <div fxLayout=\"row\" fxLayout.xs=\"column\" fxLayout.sm=\"column\" fxFlexFill>\r\n    <mat-form-field fxFlex>\r\n      <mat-label>Filter</mat-label>\r\n      <input matInput [ngModel]='filterValue' (ngModelChange)='filterChanged.next($event)' #filter>\r\n    </mat-form-field>\r\n  </div>\r\n</div>\r\n\r\n<div class=\"table-container\">\r\n  <div class=\"mat-elevation-z2\">\r\n    <!--  #applicationsContainer -->\r\n    <div class=\"example-loading-shade\" *ngIf=\"isLoadingResults || isRateLimitReached\">\r\n      <mat-spinner *ngIf=\"isLoadingResults\"></mat-spinner>\r\n      <div class=\"example-rate-limit-reached\" *ngIf=\"isRateLimitReached\">\r\n        {{'General.LoadingData' | translate}}\r\n      </div>\r\n    </div>\r\n\r\n\r\n    <mat-table fxFlex #table [dataSource]=\"dataSource\" id=\"tempalte-forms-table\" matSort matSortDisableClear\r\n      matSortDirection=\"asc\" cdkDropList [cdkDropListData]=\"dataSource\" (cdkDropListDropped)=\"dropTable($event)\">\r\n      <!-- (scroll)=\"onTableScroll($event)\" -->\r\n\r\n\r\n      <ng-container matColumnDef=\"position\">\r\n        <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n          <!-- {{'General.Order' | translate}} -->\r\n        </mat-header-cell>\r\n        <mat-cell fxFlex *matCellDef=\"let element;\">\r\n          <mat-icon cdkDragHandle>reorder</mat-icon>\r\n        </mat-cell>\r\n      </ng-container>\r\n\r\n\r\n      <ng-container *ngFor=\"let column of gridLayout\" [matColumnDef]=\"column.propertyName\"\r\n        [sticky]=\"isColumnSticky(column.propertyName)\">\r\n        <mat-header-cell mat-sort-header disableClear [style.flex]=\"getFlexStyle(column)\" *matHeaderCellDef>\r\n          {{column.translateKey | translate}}\r\n        </mat-header-cell>\r\n        <mat-cell matTooltip={{getCelValue(row,column.propertyName)}} [style.flex]=\"getFlexStyle(column)\"\r\n          [style.text-align]=\"getCellTextAlign(column)\" *matCellDef=\"let row\"  (click)=\"cellClick(row,column.propertyName)\">\r\n          <div [ngClass]=\"getCellClass(row,column.propertyName)\" *ngIf=\"!showPictureCell(column)\">\r\n            {{getCelValue(row,column.propertyName)}}\r\n          </div>\r\n          <img [ngClass]=\"getCellClass(row,column.propertyName)\" *ngIf=\"showPictureCell(column)\">\r\n        </mat-cell>\r\n      </ng-container>\r\n\r\n\r\n      <ng-container matColumnDef=\"delete\" stickyEnd *ngIf=\"!editOnClick && !editOnDblClick\">\r\n        <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n        </mat-header-cell>\r\n        <mat-cell *matCellDef=\"let row\">\r\n          <button class=\"btn btn-green btn-fill btn-wd btn-just-icon\" (click)=\"editObject(row)\"\r\n            matTooltip=\"{{'General.Edit' | translate}}\">\r\n            <!-- <mat-icon>edit</mat-icon> -->\r\n            <i class=\"material-icons\">edit</i>\r\n            <div class=\"ripple-container\"></div>\r\n          </button>\r\n          <button class=\"btn btn-red btn-fill btn-wd btn-just-icon\" (click)=\"deleteObject(row)\"\r\n            [disabled]=\"deleteDisabled(row)\" matTooltip=\"{{'General.Delete' | translate}}\">\r\n            <i class=\"material-icons\">delete</i>\r\n            <div class=\"ripple-container\"></div>\r\n          </button>\r\n        </mat-cell>\r\n      </ng-container>\r\n\r\n      <mat-header-row *matHeaderRowDef=\"displayedColumns;sticky: true\"></mat-header-row>\r\n\r\n      <ng-container *ngIf=\"!editOnClick && !editOnDblClick\">\r\n        <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n          [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"highlight(row)\"\r\n          (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\">\r\n        </mat-row>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"editOnClick && !editOnDblClick\">\r\n        <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n          [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"editObject(row)\"\r\n          (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"!editOnClick && editOnDblClick\">\r\n        <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n          [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (dblclick)=\"editObject(row)\"\r\n          (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\"\r\n          style=\"cursor: pointer;\"></mat-row>\r\n      </ng-container>\r\n\r\n      <!-- [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\"\r\n        (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" -->\r\n    </mat-table>\r\n    <mat-paginator #paginator [hidden]=\"infiniteScroll\" [length]=\"resultsLength\" [pageSize]=\"15\"\r\n      [pageSizeOptions]=\"[15, 30,  100]\" [showFirstLastButtons]=\"true\">\r\n    </mat-paginator>\r\n  </div>\r\n</div>", styles: [".mat-column-delete{flex:0 0 90px;padding-right:30px}.mat-sort-header-button{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-column-position{flex:0 0 60px!important}.mat-table{overflow-x:auto}[hidden]{display:none!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: DialogService }, { type: i2$1.Router }, { type: i3$1.DatePipe }, { type: i3$1.DecimalPipe }, { type: i3$1.PercentPipe }, { type: i0.Renderer2 }]; }, propDecorators: { modelType: [{
+                type: Input
+            }], baseService: [{
+                type: Input
+            }], gridLayoutService: [{
+                type: Input
+            }], editLink: [{
+                type: Input
+            }], defaultSort: [{
+                type: Input
+            }], defaultSortDirection: [{
+                type: Input
+            }], deleteDisableRule: [{
+                type: Input
+            }], deletePropertyName: [{
+                type: Input
+            }], hasSearch: [{
+                type: Input
+            }], searchFields: [{
+                type: Input
+            }], defaultFilter: [{
+                type: Input
+            }], allowReorderItems: [{
+                type: Input
+            }], stickyColumns: [{
+                type: Input
+            }], editOnClick: [{
+                type: Input
+            }], editOnDblClick: [{
+                type: Input
+            }], allowEdit: [{
+                type: Input
+            }], popupEdit: [{
+                type: Input
+            }], customInclude: [{
+                type: Input
+            }], changeItemPosition: [{
+                type: Input
+            }], infiniteScroll: [{
+                type: Input
+            }], paginator: [{
+                type: ViewChild,
+                args: [MatPaginator, { static: true }]
+            }], sort: [{
+                type: ViewChild,
+                args: [MatSort, { static: true }]
+            }], filter: [{
+                type: ViewChild,
+                args: [ElementRef, { static: false }]
+            }], table: [{
+                type: ViewChild,
+                args: ['table']
+            }], matTableRef: [{
+                type: ViewChild,
+                args: ['table', { read: ElementRef }]
+            }], selectedObject: [{
+                type: Output
+            }], click: [{
+                type: Output
+            }], editModel: [{
+                type: Output
+            }] } });
+
+// tslint:disable-next-line:variable-name
+const AttributeMetadata = Symbol('AttributeMetadata');
+
+class DateConverter {
+    mask(value) {
+        const d = parseISO(value);
+        return d;
+    }
+    unmask(value) {
+        // const result = format(value, 'YYYY-MM-DDTHH:mm:ssZ');
+        return value;
+    }
+}
+
+function Attribute(options = {}) {
+    return (target, propertyName) => {
+        const converter = (dataType, value, forSerialisation = false) => {
+            let attrConverter;
+            if (dataType) {
+                if (options.converter) {
+                    attrConverter = options.converter;
+                }
+                else if (dataType === Date) {
+                    attrConverter = new DateConverter();
+                }
+                else {
+                    const datatype = new dataType();
+                    if (datatype.mask && datatype.unmask) {
+                        attrConverter = datatype;
+                    }
+                }
+                if (attrConverter) {
+                    if (!forSerialisation) {
+                        return attrConverter.mask(value);
+                    }
+                    return attrConverter.unmask(value);
+                }
+            }
+            return value;
+        };
+        const saveAnnotations = () => {
+            const metadata = Reflect.getMetadata('Attribute', target) || {};
+            metadata[propertyName] = {
+                marked: true
+            };
+            Reflect.defineMetadata('Attribute', metadata, target);
+            const mappingMetadata = Reflect.getMetadata('AttributeMapping', target) || {};
+            const serializedPropertyName = options.serializedName !== undefined ? options.serializedName : propertyName;
+            mappingMetadata[serializedPropertyName] = propertyName;
+            Reflect.defineMetadata('AttributeMapping', mappingMetadata, target);
+            const requiredMetadata = Reflect.getMetadata('AttributeRequired', target) || {};
+            requiredMetadata[serializedPropertyName] = options.required !== undefined ? options.required : false;
+            Reflect.defineMetadata('AttributeRequired', requiredMetadata, target);
+            const defaultMetadata = Reflect.getMetadata('AttributedefaultValue', target) || {};
+            defaultMetadata[serializedPropertyName] = options.defaultValue !== undefined ? options.defaultValue : null;
+            Reflect.defineMetadata('AttributedefaultValue', defaultMetadata, target);
+            const formSubGroupMetadata = Reflect.getMetadata('AttributeformSubGroup', target) || {};
+            formSubGroupMetadata[serializedPropertyName] = options.formSubGroup !== undefined ? options.formSubGroup : null;
+            Reflect.defineMetadata('AttributeformSubGroup', formSubGroupMetadata, target);
+        };
+        const setMetadata = (hasDirtyAttributes, instance, oldValue, newValue, isNew) => {
+            const targetType = Reflect.getMetadata('design:type', target, propertyName);
+            if (!instance[AttributeMetadata]) {
+                instance[AttributeMetadata] = {};
+            }
+            const propertyHasDirtyAttributes = typeof oldValue === 'undefined' && !isNew ? false : hasDirtyAttributes;
+            instance[AttributeMetadata][propertyName] = {
+                newValue,
+                oldValue,
+                serializedName: options.serializedName,
+                hasDirtyAttributes: propertyHasDirtyAttributes,
+                serialisationValue: converter(targetType, newValue, true)
+            };
+        };
+        const getter = function () {
+            return this['_' + propertyName];
+        };
+        const setter = function (newVal) {
+            const targetType = Reflect.getMetadata('design:type', target, propertyName);
+            const convertedValue = converter(targetType, newVal);
+            if (convertedValue !== this['_' + propertyName]) {
+                setMetadata(true, this, this['_' + propertyName], newVal, !this.id);
+                this['_' + propertyName] = convertedValue;
+            }
+        };
+        if (delete target[propertyName]) {
+            saveAnnotations();
+            Object.defineProperty(target, propertyName, {
+                get: getter,
+                set: setter,
+                enumerable: true,
+                configurable: true
+            });
+        }
+    };
+}
+
+function BaseDatastoreConfig(config = {}) {
+    // tslint:disable-next-line:only-arrow-functions
+    return (target) => {
+        Reflect.defineMetadata('BaseDatastoreConfig', config, target);
+    };
+}
+
+class BaseMetaModel {
+    constructor(response) {
+        this.links = response.links || [];
+        this.meta = response.meta;
+    }
+}
+
+function BaseModelConfig(config = {}) {
+    return (target) => {
+        if (typeof config['meta'] === 'undefined' || config['meta'] == null) {
+            config['meta'] = BaseMetaModel;
+        }
+        Reflect.defineMetadata('BaseModelConfig', config, target);
+    };
+}
+
+function CustomType(config = {}) {
+    return (target, propertyName) => {
+        const annotations = Reflect.getMetadata('CustomType', target) || [];
+        annotations.push({
+            propertyName,
+            relationship: config.key || propertyName
+        });
+        Reflect.defineMetadata('CustomType', annotations, target);
+    };
+}
+
+function GridLayout(translateKey, width, grow = 0, shrink = 0, subProperty, formating = GridLayoutFormat.none, format = '', order = 0, textAlign = CellTextAlign.left) {
+    return (target, propertyName) => {
+        const annotations = Reflect.getMetadata('GridLayout', target) || [];
+        let propName = propertyName;
+        if (subProperty) {
+            propName = propertyName.toString() + '.' + subProperty;
+        }
+        annotations.push({
+            propertyName: propName,
+            translateKey,
+            width,
+            grow,
+            shrink,
+            formating,
+            format,
+            order,
+            textAlign
+        });
+        Reflect.defineMetadata('GridLayout', annotations, target);
+    };
+}
+
+class TranslatedElementDirective {
+    constructor(viewRef, templateRef) {
+        this.viewRef = viewRef;
+        this.templateRef = templateRef;
+    }
+}
+TranslatedElementDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedElementDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+TranslatedElementDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: TranslatedElementDirective, selector: "[translatedElement]", inputs: { elementKey: ["translatedElement", "elementKey"] }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedElementDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[translatedElement]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }]; }, propDecorators: { elementKey: [{
+                type: Input,
+                args: ['translatedElement']
+            }] } });
+
+const TOKEN_START_DEMARC = '{{';
+const TOKEN_END_DEMARC = '}}';
+// adapted from @kasperlauge's solution in https://github.com/ngx-translate/core/issues/223
+class TranslatedContentDirective {
+    constructor(viewRef, renderer, translateService, changeDetectorRef) {
+        this.viewRef = viewRef;
+        this.renderer = renderer;
+        this.translateService = translateService;
+        this.changeDetectorRef = changeDetectorRef;
+        this.subs = [];
+    }
+    ngOnInit() {
+        this.rawTranslation = merge(this.translateService.get(this.translationKey), this.translateService.onLangChange.asObservable().pipe(switchMap(() => this.translateService.get(this.translationKey))));
+    }
+    ngAfterContentInit() {
+        // QueryList.changes doesn't re-emit after its initial value, which we have by now
+        // BehaviorSubjects re-emit their initial value on subscription, so we get what we need by merging
+        // the BehaviorSubject and the QueryList.changes observable
+        const elementsSubject = new BehaviorSubject(this.elements.toArray());
+        const elementsChanges = merge(elementsSubject, this.elements.changes);
+        this.translationData = combineLatest(this.rawTranslation, elementsChanges)
+            .pipe(map(([rawTranslation]) => {
+            return {
+                elements: this.elements.toArray(),
+                rawTranslation,
+            };
+        }));
+        this.subs.push(this.translationData.subscribe(this.render.bind(this)));
+    }
+    render(translationData) {
+        if (!translationData.rawTranslation || translationData.rawTranslation === this.translationKey) {
+            throw new Error(`No resource matching the key '${this.translationKey}'`);
+        }
+        while (this.viewRef.element.nativeElement.firstChild) {
+            this.renderer.removeChild(this.viewRef.element.nativeElement, this.viewRef.element.nativeElement.firstChild);
+        }
+        let lastTokenEnd = 0;
+        while (lastTokenEnd < translationData.rawTranslation.length) {
+            const tokenStartDemarc = translationData.rawTranslation.indexOf(TOKEN_START_DEMARC, lastTokenEnd);
+            if (tokenStartDemarc < 0) {
+                break;
+            }
+            const tokenStart = tokenStartDemarc + TOKEN_START_DEMARC.length;
+            const tokenEnd = translationData.rawTranslation.indexOf(TOKEN_END_DEMARC, tokenStart);
+            if (tokenEnd < 0) {
+                throw new Error(`Encountered unterminated token in translation string '${this.translationKey}'`);
+            }
+            const tokenEndDemarc = tokenEnd + TOKEN_END_DEMARC.length;
+            const precedingText = translationData.rawTranslation.substring(lastTokenEnd, tokenStartDemarc);
+            const precedingTextElement = this.renderer.createText(precedingText);
+            this.renderer.appendChild(this.viewRef.element.nativeElement, precedingTextElement);
+            const elementKey = translationData.rawTranslation.substring(tokenStart, tokenEnd);
+            const embeddedElementTemplate = translationData.elements.find(element => element.elementKey === elementKey);
+            if (embeddedElementTemplate) {
+                const embeddedElementView = embeddedElementTemplate.viewRef.createEmbeddedView(embeddedElementTemplate.templateRef);
+                this.renderer.appendChild(this.viewRef.element.nativeElement, embeddedElementView.rootNodes[0]);
+            }
+            else {
+                const missingTokenText = translationData.rawTranslation.substring(tokenStartDemarc, tokenEndDemarc);
+                const missingTokenElement = this.renderer.createText(missingTokenText);
+                this.renderer.appendChild(this.viewRef.element.nativeElement, missingTokenElement);
+            }
+            lastTokenEnd = tokenEndDemarc;
+        }
+        const trailingText = translationData.rawTranslation.substring(lastTokenEnd);
+        const trailingTextElement = this.renderer.createText(trailingText);
+        this.renderer.appendChild(this.viewRef.element.nativeElement, trailingTextElement);
+        // in case the rendering happens outside of a change detection event, this ensures that any translations in the
+        // embedded elements are rendered
+        this.changeDetectorRef.detectChanges();
+    }
+    ngOnDestroy() {
+        this.subs.forEach(sub => sub.unsubscribe());
+    }
+}
+TranslatedContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedContentDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.Renderer2 }, { token: i1$1.TranslateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
+TranslatedContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: TranslatedContentDirective, selector: "[appTranslatedContent]", inputs: { translationKey: ["appTranslatedContent", "translationKey"] }, queries: [{ propertyName: "elements", predicate: TranslatedElementDirective }], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedContentDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[appTranslatedContent]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.Renderer2 }, { type: i1$1.TranslateService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { translationKey: [{
+                type: Input,
+                args: ['appTranslatedContent']
+            }], elements: [{
+                type: ContentChildren,
+                args: [TranslatedElementDirective]
+            }] } });
+
+class GridLayoutModel {
+    constructor(propertyName, translateKey = null, width = null, grow = 0, shrink = 0, formating = GridLayoutFormat.none, format = '', order = 0, textAlign = CellTextAlign.left) {
+        this.formating = GridLayoutFormat.none;
+        this.order = 0;
+        this.textAlign = CellTextAlign.left;
+        this.propertyName = propertyName;
+        this.translateKey = translateKey;
+        this.width = width;
+        this.grow = grow;
+        this.shrink = shrink;
+        this.formating = formating;
+        this.format = format;
+        this.order = order;
+        this.textAlign = textAlign;
+    }
+}
+
+class BaseModel {
+    // tslint:disable-next-line:variable-name
+    constructor(_datastore, data) {
+        this._datastore = _datastore;
+        if (data) {
+            if (data.id) {
+                this.id = data.id;
+            }
+            Object.assign(this, data);
+        }
+    }
+    save(params, headers, customUrl, customBody) {
+        const attributesMetadata = this[AttributeMetadata];
+        return this._datastore.saveRecord(attributesMetadata, this, params, headers, customUrl, customBody);
+    }
+    patch(origModel, params, headers, customUrl) {
+        const attributesMetadata = this[AttributeMetadata];
+        return this._datastore.patchRecord(attributesMetadata, this, origModel, params, headers, customUrl);
+    }
+    replace(params, headers, customUrl, customBody) {
+        const attributesMetadata = this[AttributeMetadata];
+        return this._datastore.replaceRecord(attributesMetadata, this, params, headers, customUrl, customBody);
+    }
+    get attributeMetadata() {
+        const attributesMetadata = this[AttributeMetadata];
+        return attributesMetadata;
+    }
+    set attributeMetadata(val) {
+        this[AttributeMetadata] = val;
+    }
+    get hasDirtyAttributes() {
+        const attributesMetadata = this[AttributeMetadata];
+        let hasDirtyAttributes = false;
+        for (const propertyName in attributesMetadata) {
+            if (attributesMetadata.hasOwnProperty(propertyName)) {
+                const metadata = attributesMetadata[propertyName];
+                if (metadata.hasDirtyAttributes) {
+                    hasDirtyAttributes = true;
+                    break;
+                }
+            }
+        }
+        return hasDirtyAttributes;
+    }
+    rollbackAttributes() {
+        const attributesMetadata = this[AttributeMetadata];
+        let metadata;
+        for (const propertyName in attributesMetadata) {
+            if (attributesMetadata.hasOwnProperty(propertyName)) {
+                if (attributesMetadata[propertyName].hasDirtyAttributes) {
+                    this[propertyName] = attributesMetadata[propertyName].oldValue;
+                    metadata = {
+                        hasDirtyAttributes: false,
+                        newValue: attributesMetadata[propertyName].oldValue,
+                        oldValue: undefined
+                    };
+                    attributesMetadata[propertyName] = metadata;
+                }
+            }
+        }
+        this[AttributeMetadata] = attributesMetadata;
+    }
+    get modelConfig() {
+        return Reflect.getMetadata('BaseModelConfig', this.constructor);
+    }
+    deserializeModel(modelType, data) {
+        data = this.transformSerializedNamesToPropertyNames(modelType, data);
+        return new modelType(this._datastore, data);
+    }
+    transformSerializedNamesToPropertyNames(modelType, attributes) {
+        const serializedNameToPropertyName = this.getModelPropertyNames(modelType.prototype);
+        const properties = {};
+        Object.keys(serializedNameToPropertyName).forEach((serializedName) => {
+            if (attributes[serializedName] !== null && attributes[serializedName] !== undefined) {
+                properties[serializedNameToPropertyName[serializedName]] = attributes[serializedName];
+            }
+        });
+        return properties;
+    }
+    getModelPropertyNames(model) {
+        return Reflect.getMetadata('AttributeMapping', model);
+    }
+    getModelRequiredPropertyNames(model) {
+        return Reflect.getMetadata('AttributeRequired', model);
+    }
+    getModelDefaultPropertyValues(model) {
+        return Reflect.getMetadata('AttributedefaultValue', model);
+    }
+    getModelSubGroupPropertyNames(model) {
+        return Reflect.getMetadata('AttributeformSubGroup', model);
+    }
+    getFromGroup(fb) {
+        const props = Object.keys(this.getModelPropertyNames(this));
+        const requiredProps = this.getModelRequiredPropertyNames(this);
+        const defaultValues = this.getModelDefaultPropertyValues(this);
+        const formSubGroupsValues = this.getModelSubGroupPropertyNames(this);
+        const controlsConfig = {};
+        const that = this;
+        if (props) {
+            props.forEach(property => {
+                var _a;
+                const value = that[property] !== undefined ? that[property] : defaultValues[property];
+                const formSubGroup = (_a = formSubGroupsValues[property]) !== null && _a !== void 0 ? _a : null;
+                if (requiredProps[property]) {
+                    if (formSubGroup)
+                        this.getSubFromGroup(fb, controlsConfig, formSubGroup).addControl(property, fb.control(value, Validators.required));
+                    else
+                        controlsConfig[property] = [value, Validators.required];
+                }
+                else {
+                    if (formSubGroup)
+                        this.getSubFromGroup(fb, controlsConfig, formSubGroup).addControl(property, fb.control(value));
+                    else
+                        controlsConfig[property] = value;
+                }
+            });
+        }
+        return fb.group(controlsConfig);
+    }
+    getSubFromGroup(fb, controlsConfig, subGroup) {
+        if (!controlsConfig[subGroup])
+            controlsConfig[subGroup] = fb.group({});
+        return controlsConfig[subGroup];
+    }
+    getModelFromFormGroup(formGroup, id) {
+        const props = Object.keys(this.getModelPropertyNames(this));
+        const formSubGroupsValues = this.getModelSubGroupPropertyNames(this);
+        const data = {};
+        if (id) {
+            data.id = id;
+        }
+        const that = this;
+        if (props) {
+            props.forEach(property => {
+                var _a, _b, _c;
+                const formSubGroup = (_a = formSubGroupsValues[property]) !== null && _a !== void 0 ? _a : null;
+                if (!formSubGroup)
+                    data[property] = (_b = formGroup.controls[property].value) !== null && _b !== void 0 ? _b : null;
+                else
+                    data[property] = (_c = formGroup.controls[formSubGroup].controls[property].value) !== null && _c !== void 0 ? _c : null;
+            });
+        }
+        if (data) {
+            if (id) {
+                this.id = id;
+            }
+            Object.assign(this, data);
+        }
+    }
+    getGridLayout() {
+        const result = Array();
+        const gridLayout = Reflect.getMetadata('GridLayout', this);
+        if (gridLayout) {
+            for (const layout of gridLayout) {
+                const data = new GridLayoutModel(layout.propertyName, layout.translateKey, layout.width, layout.shrink, layout.grow, layout.formating, layout.format, layout.order, layout.textAlign);
+                result.push(data);
+            }
+        }
+        return result.sort(function (a, b) { return a.order - b.order; });
+        //result;
+    }
+    getSerializedModel() {
+        const attributesMetadata = this[AttributeMetadata];
+        return this._datastore.modelToEntity(this, attributesMetadata, true);
+    }
+    getCellClass(property) {
+        return '';
+    }
+}
+
+class ErrorResponse {
+    constructor(errors) {
+        this.errors = [];
+        if (errors) {
+            this.errors = errors;
+        }
+    }
+}
+
+class Rule {
+    constructor() {
+        this.parameters = [];
+    }
+}
+
+class MaterialModule {
+}
+MaterialModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MaterialModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: MaterialModule, imports: [MatAutocompleteModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+        MatDialogModule, MatExpansionModule, MatGridListModule, MatIconModule,
+        MatInputModule, MatListModule, MatMenuModule, MatNativeDateModule,
+        MatPaginatorModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, MatSidenavModule,
+        MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, MatTableModule, MatTabsModule, MatToolbarModule,
+        MatTooltipModule, MatOptionModule, DragDropModule, MatDividerModule, PortalModule, MatTreeModule, MatBadgeModule, MatStepperModule,
+        CdkStepperModule], exports: [MatAutocompleteModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+        MatDialogModule, MatExpansionModule, MatGridListModule, MatIconModule,
+        MatInputModule, MatListModule, MatMenuModule, MatNativeDateModule,
+        MatPaginatorModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, MatSidenavModule,
+        MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, MatTableModule, MatTabsModule, MatToolbarModule,
+        MatTooltipModule, MatOptionModule, DragDropModule, MatDividerModule, PortalModule, MatTreeModule, MatBadgeModule, MatStepperModule,
+        CdkStepperModule] });
+MaterialModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: MaterialModule, imports: [[
+            MatAutocompleteModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+            MatDialogModule, MatExpansionModule, MatGridListModule, MatIconModule,
+            MatInputModule, MatListModule, MatMenuModule, MatNativeDateModule,
+            MatPaginatorModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, MatSidenavModule,
+            MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, MatTableModule, MatTabsModule, MatToolbarModule,
+            MatTooltipModule, MatOptionModule, DragDropModule, MatDividerModule, PortalModule, MatTreeModule, MatBadgeModule, MatStepperModule,
+            CdkStepperModule
+        ], MatAutocompleteModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+        MatDialogModule, MatExpansionModule, MatGridListModule, MatIconModule,
+        MatInputModule, MatListModule, MatMenuModule, MatNativeDateModule,
+        MatPaginatorModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, MatSidenavModule,
+        MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, MatTableModule, MatTabsModule, MatToolbarModule,
+        MatTooltipModule, MatOptionModule, DragDropModule, MatDividerModule, PortalModule, MatTreeModule, MatBadgeModule, MatStepperModule,
+        CdkStepperModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: MaterialModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        MatAutocompleteModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+                        MatDialogModule, MatExpansionModule, MatGridListModule, MatIconModule,
+                        MatInputModule, MatListModule, MatMenuModule, MatNativeDateModule,
+                        MatPaginatorModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, MatSidenavModule,
+                        MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, MatTableModule, MatTabsModule, MatToolbarModule,
+                        MatTooltipModule, MatOptionModule, DragDropModule, MatDividerModule, PortalModule, MatTreeModule, MatBadgeModule, MatStepperModule,
+                        CdkStepperModule
+                    ],
+                    exports: [
+                        MatAutocompleteModule, MatButtonModule, MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
+                        MatDialogModule, MatExpansionModule, MatGridListModule, MatIconModule,
+                        MatInputModule, MatListModule, MatMenuModule, MatNativeDateModule,
+                        MatPaginatorModule, MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, MatSidenavModule,
+                        MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, MatTableModule, MatTabsModule, MatToolbarModule,
+                        MatTooltipModule, MatOptionModule, DragDropModule, MatDividerModule, PortalModule, MatTreeModule, MatBadgeModule, MatStepperModule,
+                        CdkStepperModule
+                    ],
+                }]
+        }] });
+
+class GridLayoutService {
+    constructor(baseService) {
+        this.baseService = baseService;
+    }
+    getGridLayout() {
+        var model = this.baseService.newModel();
+        return model.getGridLayout();
+    }
+}
+GridLayoutService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GridLayoutService, deps: [{ token: BaseService }], target: i0.ɵɵFactoryTarget.Injectable });
+GridLayoutService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GridLayoutService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GridLayoutService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: function () { return [{ type: BaseService }]; } });
+
+const PROVIDERS = [
+    BaseDatastore,
+    DatePipe,
+    DecimalPipe,
+    PercentPipe,
+];
+
+class RslBaseModule {
+}
+RslBaseModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+RslBaseModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, declarations: [GenericTableComponent,
+        SearchableDropdownComponent], imports: [CommonModule, i1$1.TranslateModule, MaterialModule,
+        ReactiveFormsModule, i2$2.BlockUIModule], exports: [HttpClientModule,
+        GenericTableComponent,
+        SearchableDropdownComponent] });
+RslBaseModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, providers: [
+        PROVIDERS
+    ], imports: [[
+            CommonModule,
+            TranslateModule.forChild({}),
+            MaterialModule,
+            ReactiveFormsModule,
+            BlockUIModule.forRoot(),
+        ], HttpClientModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        GenericTableComponent,
+                        SearchableDropdownComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        TranslateModule.forChild({}),
+                        MaterialModule,
+                        ReactiveFormsModule,
+                        BlockUIModule.forRoot(),
+                    ],
+                    providers: [
+                        PROVIDERS
+                    ],
+                    exports: [
+                        HttpClientModule,
+                        GenericTableComponent,
+                        SearchableDropdownComponent
+                    ]
+                }]
+        }] });
+
+class InputErrorPipe {
+    constructor(translate) {
+        this.translate = translate;
+    }
+    transform(value, filedTranslationKey) {
+        let rvalue = '';
+        if (value !== null) {
+            if (value['invalid'] === true) {
+                rvalue = 'ERROR.INVALID';
+            }
+            if (value['mustMatch'] === true) {
+                rvalue = 'Account.Password.MustMach';
+            }
+            if (value['required'] === true) {
+                const field = this.translate.instant(filedTranslationKey.field);
+                rvalue = this.translate.instant('General.Field.Required', { field });
+            }
+            if (value['minlength']) {
+                const field = this.translate.instant(filedTranslationKey.field);
+                rvalue = this.translate.instant('General.Field.MinLength', { field, requiredLength: value.minlength.requiredLength });
+            }
+        }
+        return rvalue;
+    }
+}
+InputErrorPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe });
+InputErrorPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, name: "inputError" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'inputError'
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.TranslateService }]; } });
+
+class Nl2brPipe {
+    transform(value, args) {
+        // return value.replace(/\n/g, '<br />');
+        if (value) {
+            value = value.replace(/(?:\r\n\r\n|\r\r|\n\n)/g, '</p><p>');
+            return '<p>' + value.replace(/(?:\r\n|\r|\n)/g, '<br>') + '</p>';
+        }
+        return value;
+    }
+}
+Nl2brPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: Nl2brPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+Nl2brPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: Nl2brPipe, name: "nl2br" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: Nl2brPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'nl2br'
+                }]
+        }] });
+
+class CustomValidators {
+    static patternValidator(regex, error) {
+        return (control) => {
+            if (!control.value) {
+                // if control is empty return no error
+                return null;
+            }
+            // test the value of the control against the regexp supplied
+            const valid = regex.test(control.value);
+            // if true, return no error (no error), else return error passed in the second parameter
+            return valid ? null : error;
+        };
+    }
+}
+
+/*
+ * Public API Surface of core
+ */
+// export * from './lib/services/base-datastore.service';
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Attribute, BaseDatastore, BaseDatastoreConfig, BaseFormEditComponent, BaseMetaModel, BaseModel, BaseModelConfig, BaseQueryData, BaseService, CellTextAlign, CustomType, CustomValidators, DialogService, ErrorResponse, FieldErrorDisplayComponent, GenericTableComponent, GridLayout, GridLayoutFormat, GridLayoutModel, GridLayoutService, InputErrorPipe, MaterialModule, Nl2brPipe, PROVIDERS, PageNotFoundComponent, RslBaseModule, Rule, SearchableDropdownComponent, TranslatedContentDirective, TranslatedElementDirective, UnderConstructionComponent };
+//# sourceMappingURL=rosoftlab-core.mjs.map