@lenne.tech/ng-base 14.31.0 → 14.33.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/base-components/base-components.module.d.ts +2 -1
- package/base-components/components/input/input.component.d.ts +2 -4
- package/base-components/components/refence-input/refence-input.component.d.ts +2 -4
- package/base-components/components/select/select.component.d.ts +2 -4
- package/base-components/components/tags/tags.component.d.ts +1 -4
- package/base-components/components/textarea/textarea.component.d.ts +8 -5
- package/base-components/components/upload-image/upload-image.component.d.ts +2 -4
- package/esm2020/base-components/base-components.module.mjs +4 -3
- package/esm2020/base-components/components/input/input.component.mjs +6 -14
- package/esm2020/base-components/components/model-form-sub/model-form-sub.component.mjs +2 -2
- package/esm2020/base-components/components/refence-input/refence-input.component.mjs +7 -15
- package/esm2020/base-components/components/select/select.component.mjs +4 -12
- package/esm2020/base-components/components/tags/tags.component.mjs +6 -14
- package/esm2020/base-components/components/textarea/textarea.component.mjs +32 -9
- package/esm2020/base-components/components/upload-image/upload-image.component.mjs +5 -13
- package/fesm2015/lenne.tech-ng-base-base-components.mjs +49 -65
- package/fesm2015/lenne.tech-ng-base-base-components.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base-base-components.mjs +49 -65
- package/fesm2020/lenne.tech-ng-base-base-components.mjs.map +1 -1
- package/package.json +2 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component,
|
|
2
|
+
import { EventEmitter, Component, Input, Output, ViewChild, Directive, Inject, HostListener, Pipe, ViewContainerRef, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/forms';
|
|
4
4
|
import { FormControl, UntypedFormControl, UntypedFormGroup, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
5
5
|
import * as i2 from '@angular/common';
|
|
6
6
|
import { DOCUMENT, CommonModule } from '@angular/common';
|
|
7
|
-
import
|
|
7
|
+
import * as i3 from '@ng-bootstrap/ng-bootstrap';
|
|
8
|
+
import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
|
|
8
9
|
import { trigger, transition, query, style, animate } from '@angular/animations';
|
|
9
10
|
import { Subscription } from 'rxjs';
|
|
10
11
|
import * as i1$1 from '@lenne.tech/ng-base/shared';
|
|
@@ -24,11 +25,6 @@ class InputComponent {
|
|
|
24
25
|
this.objectPath = '';
|
|
25
26
|
this.enter = new EventEmitter();
|
|
26
27
|
}
|
|
27
|
-
ngAfterViewInit() {
|
|
28
|
-
if (this.toolTipElement && this.infoText) {
|
|
29
|
-
new Tooltip(this.toolTipElement.nativeElement);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
28
|
/**
|
|
33
29
|
* If the control has a value, emit the enter event
|
|
34
30
|
*/
|
|
@@ -50,14 +46,11 @@ class InputComponent {
|
|
|
50
46
|
}
|
|
51
47
|
}
|
|
52
48
|
InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
53
|
-
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: InputComponent, selector: "base-input", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", type: "type", required: "required", eyeButton: "eyeButton", objectPath: "objectPath" }, outputs: { enter: "enter" },
|
|
49
|
+
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: InputComponent, selector: "base-input", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", type: "type", required: "required", eyeButton: "eyeButton", objectPath: "objectPath" }, outputs: { enter: "enter" }, ngImport: i0, template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <div class=\"input-group\">\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [type]=\"type\"\n [formControl]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (keyup.enter)=\"enterEvent()\"\n [attr.aria-describedby]=\"id + 'eye-button'\"\n />\n <button\n class=\"btn btn-outline-primary\"\n type=\"button\"\n [id]=\"id + 'eye-button'\"\n (click)=\"togglePasswordType()\"\n *ngIf=\"eyeButton\"\n >\n <i class=\"bi bi-eye\" *ngIf=\"type === 'password'\"></i>\n <i class=\"bi bi-eye-slash\" *ngIf=\"type === 'text'\"></i>\n </button>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['pattern'] && type === 'tel'\">Bitte eine g\u00FCltige Telefonnummer angeben.</div>\n <div *ngIf=\"control?.errors?.['invalidEmail']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n <div *ngIf=\"control?.errors?.['invalidSecurePassword']\">\n Das Passwort ist zu unsicher. Es muss mind. 8 Zeichen lang sein, ein Gro\u00DFbustabe, ein Kleinbuchstabe, eine Zahl\n und ein Sonderzeichen enthalten.\n </div>\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.input-group>.btn{min-width:100px}button{height:100%}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
54
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: InputComponent, decorators: [{
|
|
55
51
|
type: Component,
|
|
56
|
-
args: [{ selector: 'base-input', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i
|
|
57
|
-
}], propDecorators: {
|
|
58
|
-
type: ViewChild,
|
|
59
|
-
args: ['tooltip']
|
|
60
|
-
}], id: [{
|
|
52
|
+
args: [{ selector: 'base-input', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <div class=\"input-group\">\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [type]=\"type\"\n [formControl]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (keyup.enter)=\"enterEvent()\"\n [attr.aria-describedby]=\"id + 'eye-button'\"\n />\n <button\n class=\"btn btn-outline-primary\"\n type=\"button\"\n [id]=\"id + 'eye-button'\"\n (click)=\"togglePasswordType()\"\n *ngIf=\"eyeButton\"\n >\n <i class=\"bi bi-eye\" *ngIf=\"type === 'password'\"></i>\n <i class=\"bi bi-eye-slash\" *ngIf=\"type === 'text'\"></i>\n </button>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['pattern'] && type === 'tel'\">Bitte eine g\u00FCltige Telefonnummer angeben.</div>\n <div *ngIf=\"control?.errors?.['invalidEmail']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n <div *ngIf=\"control?.errors?.['invalidSecurePassword']\">\n Das Passwort ist zu unsicher. Es muss mind. 8 Zeichen lang sein, ein Gro\u00DFbustabe, ein Kleinbuchstabe, eine Zahl\n und ein Sonderzeichen enthalten.\n </div>\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.input-group>.btn{min-width:100px}button{height:100%}\n"] }]
|
|
53
|
+
}], propDecorators: { id: [{
|
|
61
54
|
type: Input
|
|
62
55
|
}], name: [{
|
|
63
56
|
type: Input
|
|
@@ -99,23 +92,15 @@ class SelectComponent {
|
|
|
99
92
|
this.select.nativeElement.setAttribute('multiple', true);
|
|
100
93
|
}
|
|
101
94
|
}
|
|
102
|
-
ngAfterViewInit() {
|
|
103
|
-
if (this.toolTipElement && this.infoText) {
|
|
104
|
-
new Tooltip(this.toolTipElement.nativeElement);
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
95
|
}
|
|
108
96
|
SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
109
|
-
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: SelectComponent, selector: "base-select", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", objectPath: "objectPath", control: "control", tabIndex: "tabIndex", required: "required", multiple: "multiple", search: "search", options: "options" }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true }
|
|
97
|
+
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: SelectComponent, selector: "base-select", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", objectPath: "objectPath", control: "control", tabIndex: "tabIndex", required: "required", multiple: "multiple", search: "search", options: "options" }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true }], ngImport: i0, template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <select\n #select\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-select\"\n [attr.aria-label]=\"placeholder\"\n [attr.data-live-search]=\"search\"\n [formControl]=\"control\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n >\n <option [ngValue]=\"null\" disabled selected>{{ placeholder }}</option>\n <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n {{ option.text }}\n </option>\n </select>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"], dependencies: [{ kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
110
98
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectComponent, decorators: [{
|
|
111
99
|
type: Component,
|
|
112
|
-
args: [{ selector: 'base-select', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i
|
|
100
|
+
args: [{ selector: 'base-select', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n <select\n #select\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-select\"\n [attr.aria-label]=\"placeholder\"\n [attr.data-live-search]=\"search\"\n [formControl]=\"control\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n >\n <option [ngValue]=\"null\" disabled selected>{{ placeholder }}</option>\n <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\n {{ option.text }}\n </option>\n </select>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"] }]
|
|
113
101
|
}], propDecorators: { select: [{
|
|
114
102
|
type: ViewChild,
|
|
115
103
|
args: ['select']
|
|
116
|
-
}], toolTipElement: [{
|
|
117
|
-
type: ViewChild,
|
|
118
|
-
args: ['tooltip']
|
|
119
104
|
}], id: [{
|
|
120
105
|
type: Input
|
|
121
106
|
}], name: [{
|
|
@@ -175,22 +160,43 @@ class TextareaComponent {
|
|
|
175
160
|
this.placeholder = '';
|
|
176
161
|
this.rows = 5;
|
|
177
162
|
this.required = false;
|
|
163
|
+
this.autoHeight = true;
|
|
178
164
|
this.objectPath = '';
|
|
179
165
|
}
|
|
180
|
-
|
|
181
|
-
if (
|
|
182
|
-
|
|
166
|
+
ngOnChanges(changes) {
|
|
167
|
+
if (changes['control'] && this.autoHeight) {
|
|
168
|
+
setTimeout(() => {
|
|
169
|
+
this.adjustInitHeight();
|
|
170
|
+
}, 350);
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
adjustInitHeight() {
|
|
174
|
+
if (!this.textarea || !this.autoHeight) {
|
|
175
|
+
return;
|
|
176
|
+
}
|
|
177
|
+
this.textarea.nativeElement.style.cssText = 'height:auto;';
|
|
178
|
+
this.textarea.nativeElement.style.cssText = 'height:' + (this.textarea.nativeElement.scrollHeight + 5) + 'px';
|
|
179
|
+
}
|
|
180
|
+
adjustHeight(event) {
|
|
181
|
+
if (!this.autoHeight) {
|
|
182
|
+
return;
|
|
183
183
|
}
|
|
184
|
+
setTimeout(() => {
|
|
185
|
+
event.target.style.cssText = 'height:auto;';
|
|
186
|
+
// for box-sizing other than "content-box" use:
|
|
187
|
+
// el.style.cssText = '-moz-box-sizing:content-box';
|
|
188
|
+
event.target.style.cssText = 'height:' + (event.target.scrollHeight + 5) + 'px';
|
|
189
|
+
}, 0);
|
|
184
190
|
}
|
|
185
191
|
}
|
|
186
192
|
TextareaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
187
|
-
TextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TextareaComponent, selector: "base-textarea", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", control: "control", rows: "rows", required: "required", tabIndex: "tabIndex", objectPath: "objectPath" }, viewQueries: [{ propertyName: "
|
|
193
|
+
TextareaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TextareaComponent, selector: "base-textarea", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", control: "control", rows: "rows", required: "required", autoHeight: "autoHeight", tabIndex: "tabIndex", objectPath: "objectPath" }, viewQueries: [{ propertyName: "textarea", first: true, predicate: ["textarea"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <textarea\n #textarea\n class=\"form-control\"\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [rows]=\"rows\"\n (input)=\"adjustHeight($event)\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n ></textarea>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
188
194
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TextareaComponent, decorators: [{
|
|
189
195
|
type: Component,
|
|
190
|
-
args: [{ selector: 'base-textarea', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i
|
|
191
|
-
}], propDecorators: {
|
|
196
|
+
args: [{ selector: 'base-textarea', template: "<div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <textarea\n #textarea\n class=\"form-control\"\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [rows]=\"rows\"\n (input)=\"adjustHeight($event)\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n ></textarea>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control?.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}\n"] }]
|
|
197
|
+
}], propDecorators: { textarea: [{
|
|
192
198
|
type: ViewChild,
|
|
193
|
-
args: ['
|
|
199
|
+
args: ['textarea']
|
|
194
200
|
}], id: [{
|
|
195
201
|
type: Input
|
|
196
202
|
}], name: [{
|
|
@@ -207,6 +213,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
207
213
|
type: Input
|
|
208
214
|
}], required: [{
|
|
209
215
|
type: Input
|
|
216
|
+
}], autoHeight: [{
|
|
217
|
+
type: Input
|
|
210
218
|
}], tabIndex: [{
|
|
211
219
|
type: Input
|
|
212
220
|
}], objectPath: [{
|
|
@@ -285,11 +293,6 @@ class TagsComponent {
|
|
|
285
293
|
this.validators = [];
|
|
286
294
|
this.inputValue = '';
|
|
287
295
|
}
|
|
288
|
-
ngAfterViewInit() {
|
|
289
|
-
if (this.toolTipElement && this.infoText) {
|
|
290
|
-
new Tooltip(this.toolTipElement.nativeElement);
|
|
291
|
-
}
|
|
292
|
-
}
|
|
293
296
|
/**
|
|
294
297
|
* Convert id into text field
|
|
295
298
|
*/
|
|
@@ -457,14 +460,11 @@ class TagsComponent {
|
|
|
457
460
|
}
|
|
458
461
|
}
|
|
459
462
|
TagsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
460
|
-
TagsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TagsComponent, selector: "base-tags", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", options: "options", custom: "custom", removeByKey: "removeByKey", required: "required", objectPath: "objectPath", validators: "validators" },
|
|
463
|
+
TagsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: TagsComponent, selector: "base-tags", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", options: "options", custom: "custom", removeByKey: "removeByKey", required: "required", objectPath: "objectPath", validators: "validators" }, ngImport: i0, template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n {{ getReadableTag(tag) }}\n <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n </div>\n </div>\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n [(ngModel)]=\"inputValue\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n type=\"text\"\n class=\"form-control\"\n (keyup)=\"enterKey($event)\"\n />\n\n <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option?.text, true, true)\">\n {{ option?.text }}\n </div>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && inputValue\">\n {{ inputValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte gib eine g\u00FCltige E-Mail Adresse ein.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }] });
|
|
461
464
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TagsComponent, decorators: [{
|
|
462
465
|
type: Component,
|
|
463
|
-
args: [{ selector: 'base-tags', template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i
|
|
464
|
-
}], propDecorators: {
|
|
465
|
-
type: ViewChild,
|
|
466
|
-
args: ['tooltip']
|
|
467
|
-
}], id: [{
|
|
466
|
+
args: [{ selector: 'base-tags', template: "<div class=\"form-group position-relative\" *ngIf=\"control\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"tag-wrapper\" *ngIf=\"control?.value\">\n <div class=\"tag\" *ngFor=\"let tag of control?.value\">\n {{ getReadableTag(tag) }}\n <span (click)=\"removeTag(tag)\"><i class=\"bi bi-x-circle\"></i></span>\n </div>\n </div>\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n [(ngModel)]=\"inputValue\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n type=\"text\"\n class=\"form-control\"\n (keyup)=\"enterKey($event)\"\n />\n\n <div class=\"tag-options\" *ngIf=\"options && selectedElement\">\n <div class=\"tag-option-item\" *ngFor=\"let option of filterOptions()\" (click)=\"addTag(option?.text, true, true)\">\n {{ option?.text }}\n </div>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && inputValue\">\n {{ inputValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte gib eine g\u00FCltige E-Mail Adresse ein.</div>\n </div>\n</div>\n", styles: [".required:after{content:\" *\"}.tag-options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.tag-options .tag-option-item{padding:10px;cursor:pointer}.tag-options .tag-option-item:hover{color:var(--bs-primary)}.tag-wrapper{display:flex;flex-direction:row;justify-content:flex-start;column-gap:10px;row-gap:10px;flex-wrap:wrap;margin-bottom:10px;position:relative}.tag-wrapper .tag{background-color:var(--bs-light);color:var(--bs-dark);padding:10px 15px;font-style:normal;font-weight:300;font-size:14px;line-height:140%}.tag-wrapper .tag span{margin-left:20px;cursor:pointer}.tag-wrapper .tag span .bi{color:var(--bs-black)}.tag-wrapper .tag span .bi:before{vertical-align:-.175em}\n"] }]
|
|
467
|
+
}], propDecorators: { id: [{
|
|
468
468
|
type: Input
|
|
469
469
|
}], name: [{
|
|
470
470
|
type: Input
|
|
@@ -784,11 +784,6 @@ class UploadImageComponent {
|
|
|
784
784
|
...this.croppingOptions,
|
|
785
785
|
};
|
|
786
786
|
}
|
|
787
|
-
ngAfterViewInit() {
|
|
788
|
-
if (this.toolTipElement && this.infoText) {
|
|
789
|
-
new Tooltip(this.toolTipElement.nativeElement);
|
|
790
|
-
}
|
|
791
|
-
}
|
|
792
787
|
/**
|
|
793
788
|
* The dragOver function is called when the user drags a file over the dropzone. It prevents the default action of the
|
|
794
789
|
* event, and sets the dragText to 'Release to Upload' and the dragActive to true
|
|
@@ -1002,16 +997,13 @@ class UploadImageComponent {
|
|
|
1002
997
|
}
|
|
1003
998
|
}
|
|
1004
999
|
UploadImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: UploadImageComponent, deps: [{ token: i1$2.HttpClient }, { token: i1$1.AuthService }, { token: i1$1.FileService }, { token: i1$1.ToastService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1005
|
-
UploadImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: UploadImageComponent, selector: "base-upload-image", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", supportText: "supportText", required: "required", defaultDragText: "defaultDragText", defaultReleaseText: "defaultReleaseText", preButtonText: "preButtonText", buttonText: "buttonText", validExtensions: "validExtensions", control: "control", url: "url", uploadPath: "uploadPath", deletePath: "deletePath", path: "path", compressOptions: "compressOptions", maxSize: "maxSize", uploadDirectly: "uploadDirectly", croppingImage: "croppingImage", croppingOptions: "croppingOptions", objectPath: "objectPath", mode: "mode" }, outputs: { imageUploaded: "imageUploaded", imageDeleted: "imageDeleted", fileChanged: "fileChanged" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }
|
|
1000
|
+
UploadImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: UploadImageComponent, selector: "base-upload-image", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", supportText: "supportText", required: "required", defaultDragText: "defaultDragText", defaultReleaseText: "defaultReleaseText", preButtonText: "preButtonText", buttonText: "buttonText", validExtensions: "validExtensions", control: "control", url: "url", uploadPath: "uploadPath", deletePath: "deletePath", path: "path", compressOptions: "compressOptions", maxSize: "maxSize", uploadDirectly: "uploadDirectly", croppingImage: "croppingImage", croppingOptions: "croppingOptions", objectPath: "objectPath", mode: "mode" }, outputs: { imageUploaded: "imageUploaded", imageDeleted: "imageDeleted", fileChanged: "fileChanged" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div class=\"form-group mt-3\" [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n class=\"drag-area\"\n (dragover)=\"dragOver($event)\"\n (dragleave)=\"dragLeave($event)\"\n (drop)=\"drop($event)\"\n [ngClass]=\"{ active: dragActive, pointer: !loading, 'is-invalid': control?.invalid && control?.touched }\"\n (click)=\"!croppedInProgress && !loading && fileInput.click()\"\n >\n <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\n <div class=\"spinner-border text-primary\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n </div>\n\n <ng-container *ngIf=\"selectedFile && !fileEvent && !croppedInProgress && !loading\">\n <img [src]=\"fileUrl\" *ngIf=\"selectedFile\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile()\" baseStopPropagation>L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"control?.value && !fileEvent && !selectedFile && !loading && !croppedInProgress\">\n <img [src]=\"control?.value.startsWith('data:') ? control?.value : url + path + control?.value\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile(control?.value)\" baseStopPropagation>\n L\u00F6schen\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"!selectedFile && !control?.value && !loading && !fileEvent\">\n <div class=\"icon\">\n <i class=\"bi bi-images\"></i>\n </div>\n\n <span class=\"header\">{{ dragText }}</span>\n <span class=\"header\"\n >{{ preButtonText }}\n <span class=\"button\" (click)=\"fileInput.click()\" baseStopPropagation>{{ buttonText }}</span></span\n >\n <span class=\"support\" [innerText]=\"supportText\"></span>\n </ng-container>\n\n <input type=\"file\" (change)=\"selectFile($event)\" [attr.accept]=\"validExtensions?.join(',')\" hidden #fileInput />\n\n <ng-container *ngIf=\"croppedInProgress && fileEvent\">\n <image-cropper\n [imageChangedEvent]=\"fileEvent\"\n [maintainAspectRatio]=\"cOptions.maintainAspectRatio\"\n [aspectRatio]=\"cOptions.aspectRatio\"\n [alignImage]=\"cOptions.alignImage\"\n [resizeToWidth]=\"cOptions.resizeToWidth\"\n [resizeToHeight]=\"cOptions.resizeToHeight\"\n [autoCrop]=\"cOptions.autoCrop\"\n [imageQuality]=\"cOptions.imageQuality\"\n [onlyScaleDown]=\"cOptions.onlyScaleDown\"\n [format]=\"cOptions.format\"\n (imageCropped)=\"imageCropped($event, fileEvent)\"\n (loadImageFailed)=\"loadImageFailed()\"\n ></image-cropper>\n <button class=\"btn btn-primary mt-2\" type=\"button\" (click)=\"finishedCropping()\" baseStopPropagation>\n Zuschneiden\n </button>\n </ng-container>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n </div>\n</div>\n", styles: [":host{--base-upload-image-area-bg: #ffffff;--base-upload-image-area-border-color: #e1e1e1;--base-upload-image-area-height: 400px}.is-invalid .drag-area{border-color:var(--bs-danger)}.is-invalid .invalid-feedback{display:block}.required:after{content:\" *\"}.drag-area{height:var(--base-upload-image-area-height);border:2px dashed var(--base-upload-image-area-border-color);background-color:var(--base-upload-image-area-bg);display:flex;flex-direction:column;justify-content:center;align-items:center;margin:10px auto;padding:20px}.drag-area img{height:100%;max-height:280px;max-width:100%;object-fit:scale-down}.drag-area .btn-danger{margin-top:auto}.drag-area .icon{font-size:50px;color:var(--bs-primary)}.drag-area .header{font-size:20px;font-weight:500}.drag-area .support{font-size:12px;color:#e1e1e1;margin:10px 0 15px}.drag-area .button{font-size:20px;font-weight:500;color:var(--bs-primary);cursor:pointer}.active{border:2px solid var(--bs-primary)}.pointer{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.ImageCropperComponent, selector: "image-cropper", inputs: ["imageChangedEvent", "imageURL", "imageBase64", "imageFile", "imageAltText", "format", "transform", "maintainAspectRatio", "aspectRatio", "resetCropOnAspectRatioChange", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "autoCrop", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "allowMoveImage", "cropper", "alignImage", "disabled", "hidden"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed", "transformChange"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: StopPropagationDirective, selector: "[baseStopPropagation]" }] });
|
|
1006
1001
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: UploadImageComponent, decorators: [{
|
|
1007
1002
|
type: Component,
|
|
1008
|
-
args: [{ selector: 'base-upload-image', template: "<div class=\"form-group mt-3\" [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i
|
|
1003
|
+
args: [{ selector: 'base-upload-image', template: "<div class=\"form-group mt-3\" [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n class=\"drag-area\"\n (dragover)=\"dragOver($event)\"\n (dragleave)=\"dragLeave($event)\"\n (drop)=\"drop($event)\"\n [ngClass]=\"{ active: dragActive, pointer: !loading, 'is-invalid': control?.invalid && control?.touched }\"\n (click)=\"!croppedInProgress && !loading && fileInput.click()\"\n >\n <div class=\"d-flex justify-content-center\" *ngIf=\"loading\">\n <div class=\"spinner-border text-primary\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n </div>\n\n <ng-container *ngIf=\"selectedFile && !fileEvent && !croppedInProgress && !loading\">\n <img [src]=\"fileUrl\" *ngIf=\"selectedFile\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile()\" baseStopPropagation>L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"control?.value && !fileEvent && !selectedFile && !loading && !croppedInProgress\">\n <img [src]=\"control?.value.startsWith('data:') ? control?.value : url + path + control?.value\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile(control?.value)\" baseStopPropagation>\n L\u00F6schen\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"!selectedFile && !control?.value && !loading && !fileEvent\">\n <div class=\"icon\">\n <i class=\"bi bi-images\"></i>\n </div>\n\n <span class=\"header\">{{ dragText }}</span>\n <span class=\"header\"\n >{{ preButtonText }}\n <span class=\"button\" (click)=\"fileInput.click()\" baseStopPropagation>{{ buttonText }}</span></span\n >\n <span class=\"support\" [innerText]=\"supportText\"></span>\n </ng-container>\n\n <input type=\"file\" (change)=\"selectFile($event)\" [attr.accept]=\"validExtensions?.join(',')\" hidden #fileInput />\n\n <ng-container *ngIf=\"croppedInProgress && fileEvent\">\n <image-cropper\n [imageChangedEvent]=\"fileEvent\"\n [maintainAspectRatio]=\"cOptions.maintainAspectRatio\"\n [aspectRatio]=\"cOptions.aspectRatio\"\n [alignImage]=\"cOptions.alignImage\"\n [resizeToWidth]=\"cOptions.resizeToWidth\"\n [resizeToHeight]=\"cOptions.resizeToHeight\"\n [autoCrop]=\"cOptions.autoCrop\"\n [imageQuality]=\"cOptions.imageQuality\"\n [onlyScaleDown]=\"cOptions.onlyScaleDown\"\n [format]=\"cOptions.format\"\n (imageCropped)=\"imageCropped($event, fileEvent)\"\n (loadImageFailed)=\"loadImageFailed()\"\n ></image-cropper>\n <button class=\"btn btn-primary mt-2\" type=\"button\" (click)=\"finishedCropping()\" baseStopPropagation>\n Zuschneiden\n </button>\n </ng-container>\n </div>\n\n <div class=\"invalid-feedback m-2\" *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n </div>\n</div>\n", styles: [":host{--base-upload-image-area-bg: #ffffff;--base-upload-image-area-border-color: #e1e1e1;--base-upload-image-area-height: 400px}.is-invalid .drag-area{border-color:var(--bs-danger)}.is-invalid .invalid-feedback{display:block}.required:after{content:\" *\"}.drag-area{height:var(--base-upload-image-area-height);border:2px dashed var(--base-upload-image-area-border-color);background-color:var(--base-upload-image-area-bg);display:flex;flex-direction:column;justify-content:center;align-items:center;margin:10px auto;padding:20px}.drag-area img{height:100%;max-height:280px;max-width:100%;object-fit:scale-down}.drag-area .btn-danger{margin-top:auto}.drag-area .icon{font-size:50px;color:var(--bs-primary)}.drag-area .header{font-size:20px;font-weight:500}.drag-area .support{font-size:12px;color:#e1e1e1;margin:10px 0 15px}.drag-area .button{font-size:20px;font-weight:500;color:var(--bs-primary);cursor:pointer}.active{border:2px solid var(--bs-primary)}.pointer{cursor:pointer}\n"] }]
|
|
1009
1004
|
}], ctorParameters: function () { return [{ type: i1$2.HttpClient }, { type: i1$1.AuthService }, { type: i1$1.FileService }, { type: i1$1.ToastService }]; }, propDecorators: { fileInput: [{
|
|
1010
1005
|
type: ViewChild,
|
|
1011
1006
|
args: ['fileInput']
|
|
1012
|
-
}], toolTipElement: [{
|
|
1013
|
-
type: ViewChild,
|
|
1014
|
-
args: ['tooltip']
|
|
1015
1007
|
}], id: [{
|
|
1016
1008
|
type: Input
|
|
1017
1009
|
}], name: [{
|
|
@@ -1093,11 +1085,6 @@ class RefenceInputComponent {
|
|
|
1093
1085
|
}
|
|
1094
1086
|
}));
|
|
1095
1087
|
}
|
|
1096
|
-
ngAfterViewInit() {
|
|
1097
|
-
if (this.toolTipElement && this.infoText) {
|
|
1098
|
-
new Tooltip(this.toolTipElement.nativeElement);
|
|
1099
|
-
}
|
|
1100
|
-
}
|
|
1101
1088
|
ngOnDestroy() {
|
|
1102
1089
|
this.subscription.unsubscribe();
|
|
1103
1090
|
}
|
|
@@ -1278,14 +1265,11 @@ class RefenceInputComponent {
|
|
|
1278
1265
|
}
|
|
1279
1266
|
}
|
|
1280
1267
|
RefenceInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: RefenceInputComponent, deps: [{ token: i1$1.GraphQLService }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
1281
|
-
RefenceInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: RefenceInputComponent, selector: "base-refence-input", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", isList: "isList", search: "search", useParamAsArg: "useParamAsArg", param: "param", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", required: "required", method: "method", fields: "fields", valueField: "valueField", objectPath: "objectPath", nameField: "nameField", creationLink: "creationLink" },
|
|
1268
|
+
RefenceInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: RefenceInputComponent, selector: "base-refence-input", inputs: { id: "id", name: "name", infoText: "infoText", label: "label", isList: "isList", search: "search", useParamAsArg: "useParamAsArg", param: "param", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", required: "required", method: "method", fields: "fields", valueField: "valueField", objectPath: "objectPath", nameField: "nameField", creationLink: "creationLink" }, ngImport: i0, template: "<ng-container *ngIf=\"!isList\">\n <div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"position-relative\" *ngIf=\"search\">\n <div class=\"d-flex flex-row\">\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [(ngModel)]=\"currentValue\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (keyup)=\"enterKey($event)\"\n />\n <button class=\"btn btn-primary\" (click)=\"openLink()\" *ngIf=\"creationLink\">Erstellen</button>\n </div>\n <div class=\"options\" *ngIf=\"objects && selectedElement\">\n <div class=\"option-item\" *ngFor=\"let object of filterOptions()\" (click)=\"set(object[valueField])\">\n {{ prepareNameField(object) }}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!search\">\n <div class=\"d-flex flex-row\">\n <select\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-select\"\n [attr.aria-label]=\"placeholder\"\n [formControl]=\"control\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n >\n <option [ngValue]=\"null\" selected>{{ placeholder }}</option>\n <option *ngFor=\"let object of objects\" [ngValue]=\"object[valueField]\">\n {{ prepareNameField(object) }}\n </option>\n </select>\n <button class=\"btn btn-primary\" (click)=\"openLink()\" *ngIf=\"creationLink\">Erstellen</button>\n </div>\n </div>\n\n <div\n class=\"d-block invalid-feedback m-2\"\n *ngIf=\"control?.invalid && (control?.dirty || control?.touched) && !selectedElement\"\n >\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && currentValue\">\n {{ currentValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n </div>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isList\">\n <base-tags\n [id]=\"id\"\n [label]=\"label\"\n [name]=\"name\"\n [control]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [custom]=\"false\"\n [options]=\"optionsForTagInput\"\n ></base-tags>\n</ng-container>\n", styles: [".options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.options .option-item{padding:10px;cursor:pointer}.options .option-item:hover{color:var(--bs-primary)}\n"], dependencies: [{ kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "infoText", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required", "objectPath", "validators"] }] });
|
|
1282
1269
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: RefenceInputComponent, decorators: [{
|
|
1283
1270
|
type: Component,
|
|
1284
|
-
args: [{ selector: 'base-refence-input', template: "<ng-container *ngIf=\"!isList\">\n <div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i
|
|
1285
|
-
}], ctorParameters: function () { return [{ type: i1$1.GraphQLService }, { type: i2$1.Router }]; }, propDecorators: {
|
|
1286
|
-
type: ViewChild,
|
|
1287
|
-
args: ['tooltip']
|
|
1288
|
-
}], id: [{
|
|
1271
|
+
args: [{ selector: 'base-refence-input', template: "<ng-container *ngIf=\"!isList\">\n <div class=\"form-group mb-3\">\n <div class=\"d-flex justify-content-between align-items-center\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <i class=\"bi bi-info-circle\" [ngbTooltip]=\"infoText\" placement=\"start\" *ngIf=\"infoText\"></i>\n </div>\n\n <div class=\"position-relative\" *ngIf=\"search\">\n <div class=\"d-flex flex-row\">\n <input [formControl]=\"control\" hidden />\n <input\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-control\"\n [(ngModel)]=\"currentValue\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onFocus()\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [autocomplete]=\"autocomplete ?? null\"\n [tabIndex]=\"tabIndex ?? null\"\n (keyup)=\"enterKey($event)\"\n />\n <button class=\"btn btn-primary\" (click)=\"openLink()\" *ngIf=\"creationLink\">Erstellen</button>\n </div>\n <div class=\"options\" *ngIf=\"objects && selectedElement\">\n <div class=\"option-item\" *ngFor=\"let object of filterOptions()\" (click)=\"set(object[valueField])\">\n {{ prepareNameField(object) }}\n </div>\n </div>\n </div>\n\n <div *ngIf=\"!search\">\n <div class=\"d-flex flex-row\">\n <select\n [id]=\"objectPath ? objectPath + '.' + id : id\"\n [name]=\"name\"\n class=\"form-select\"\n [attr.aria-label]=\"placeholder\"\n [formControl]=\"control\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex ?? null\"\n [ngClass]=\"{ 'is-invalid': control?.invalid && control?.touched }\"\n >\n <option [ngValue]=\"null\" selected>{{ placeholder }}</option>\n <option *ngFor=\"let object of objects\" [ngValue]=\"object[valueField]\">\n {{ prepareNameField(object) }}\n </option>\n </select>\n <button class=\"btn btn-primary\" (click)=\"openLink()\" *ngIf=\"creationLink\">Erstellen</button>\n </div>\n </div>\n\n <div\n class=\"d-block invalid-feedback m-2\"\n *ngIf=\"control?.invalid && (control?.dirty || control?.touched) && !selectedElement\"\n >\n <div *ngIf=\"control?.errors?.['required']\">Dieses Feld ist ein Pflichtfeld.</div>\n <div *ngIf=\"control?.errors?.['invalidReference'] && currentValue\">\n {{ currentValue }} ist kein g\u00FCltiger Wert f\u00FCr {{ label }}.\n </div>\n <div *ngIf=\"control?.errors?.['minlength']\">\n Die Mindestl\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['minlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['maxlength']\">\n Die maximale L\u00E4nge f\u00FCr dieses Feld betr\u00E4gt\n {{control.errors?.['maxlength']?.requiredLength}} Zeichen.\n </div>\n <div *ngIf=\"control?.errors?.['email']\">Bitte eine g\u00FCltige E-Mail Adresse angeben.</div>\n <div *ngIf=\"control?.errors?.['matching']\">Die Passw\u00F6rter m\u00FCssen \u00FCberein stimmen.</div>\n </div>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"isList\">\n <base-tags\n [id]=\"id\"\n [label]=\"label\"\n [name]=\"name\"\n [control]=\"control\"\n [required]=\"required\"\n [placeholder]=\"placeholder\"\n [custom]=\"false\"\n [options]=\"optionsForTagInput\"\n ></base-tags>\n</ng-container>\n", styles: [".options{position:absolute;display:block;top:100%;left:0;right:0;border-top:0;background-color:#fff;box-shadow:0 2px 5px #00000029,0 2px 10px #0000001f;transition:all .5s;z-index:999;max-height:200px;overflow-y:scroll}.options .option-item{padding:10px;cursor:pointer}.options .option-item:hover{color:var(--bs-primary)}\n"] }]
|
|
1272
|
+
}], ctorParameters: function () { return [{ type: i1$1.GraphQLService }, { type: i2$1.Router }]; }, propDecorators: { id: [{
|
|
1289
1273
|
type: Input
|
|
1290
1274
|
}], name: [{
|
|
1291
1275
|
type: Input
|
|
@@ -1395,7 +1379,7 @@ class ModelFormSubComponent {
|
|
|
1395
1379
|
}
|
|
1396
1380
|
}
|
|
1397
1381
|
ModelFormSubComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ModelFormSubComponent, deps: [{ token: i1$1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1398
|
-
ModelFormSubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: { id: "id", parentKey: "parentKey", fields: "fields", form: "form", config: "config" }, outputs: { imageChanged: "imageChanged", fileChanged: "fileChanged" }, ngImport: i0, template: "<div class=\"mt-3\" *ngFor=\"let key of keys\">\n <ng-container\n *ngIf=\"checkFieldHasFields(fields[key]) && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\"\n >\n <fieldset class=\"border rounded-3 p-3 mt-3\">\n <legend class=\"float-none w-auto px-3\">\n {{ config[key]?.label ? config[key].label : capitalizeFirstLetter(key) }}\n </legend>\n <base-model-form-sub\n [parentKey]=\"key\"\n [fields]=\"fields[key].fields\"\n [config]=\"config[key]?.fields || {}\"\n [form]=\"form.get(key)\"\n (imageChanged)=\"imageChanged.emit($event)\"\n (fileChanged)=\"fileChanged.emit($event)\"\n ></base-model-form-sub>\n </fieldset>\n </ng-container>\n\n <ng-container\n *ngIf=\"!checkFieldHasFields(fields[key]) && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\"\n >\n <ng-container *ngIf=\"fields[key]?.isEnum && !config[key]?.exclude\">\n <base-select\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || 'Bitte einen Wert ausw\u00E4hlen'\"\n [options]=\"prepareEnumForSelect(fields[key]?.validEnums, config[key]?.enumValues)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\"\n [objectPath]=\"objectPath\"\n ></base-select>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isEnum && !config[key]?.exclude\">\n <ng-container [ngSwitch]=\"config[key]?.type ? config[key]?.type : fields[key]?.type\">\n <ng-container *ngSwitchCase=\"'String'\">\n <ng-container *ngIf=\"fields[key]?.isList && !config[key]?.exclude\">\n <base-tags\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [validators]=\"config[key]?.validators\"\n [objectPath]=\"objectPath\"\n ></base-tags>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isList && !config[key]?.exclude\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'text'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Image'\">\n <base-upload-image\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [url]=\"config[key]?.url\"\n [path]=\"config[key]?.path || '/files/'\"\n [uploadPath]=\"config[key]?.uploadPath || '/files/upload'\"\n [deletePath]=\"config[key]?.deletePath || '/files/'\"\n [supportText]=\"config[key]?.supportText || 'Unterst\u00FCtzte Formate: JPEG, JPG, PNG'\"\n [defaultDragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [defaultReleaseText]=\"config[key]?.releaseText || 'Loslassen zum hochladen'\"\n [preButtonText]=\"config[key]?.preButtonText || 'or'\"\n [buttonText]=\"config[key]?.buttonText || 'browse'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png', 'image/webp']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [compressOptions]=\"config[key]?.compressOptions\"\n [croppingOptions]=\"config[key]?.croppingOptions\"\n [croppingImage]=\"config[key]?.croppingImage\"\n [maxSize]=\"config[key]?.maxSize\"\n [uploadDirectly]=\"false\"\n [objectPath]=\"objectPath\"\n [mode]=\"config[key]?.imageMode || 'base64'\"\n (fileChanged)=\"fileChanged.emit($event)\"\n (imageDeleted)=\"imageChanged.emit(key)\"\n (imageUploaded)=\"imageChanged.emit(key)\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Upload'\">\n <base-upload-image\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [supportText]=\"config[key]?.supportText || 'Unterst\u00FCtzte Formate: JPEG, JPG, PNG'\"\n [defaultDragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [defaultReleaseText]=\"config[key]?.releaseText || 'Loslassen zum hochladen'\"\n [preButtonText]=\"config[key]?.preButtonText || 'or'\"\n [buttonText]=\"config[key]?.buttonText || 'browse'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png', 'image/webp']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [compressOptions]=\"config[key]?.compressOptions\"\n [maxSize]=\"config[key]?.maxSize\"\n [objectPath]=\"objectPath\"\n [mode]=\"'file'\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Reference'\">\n <base-refence-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [isList]=\"fields[key]?.isList\"\n [useParamAsArg]=\"config[key]?.useParamAsArg ?? false\"\n [param]=\"id\"\n [search]=\"config[key]?.searchable ?? true\"\n [placeholder]=\"config[key]?.placeholder || 'Bitte einen Wert ausw\u00E4hlen'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [method]=\"config[key]?.method || 'find'\"\n [fields]=\"config[key]?.requestFields || ['id', 'name']\"\n [valueField]=\"config[key]?.valueField || 'id'\"\n [nameField]=\"config[key]?.nameField || 'name'\"\n [creationLink]=\"config[key]?.creationLink || ''\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-refence-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Boolean'\">\n <base-checkbox\n [id]=\"key\"\n [name]=\"key\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'LongText'\">\n <base-textarea\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-textarea>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Float'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'number'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Password'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'password'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Color'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'color'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'URL'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'url'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Email'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'email'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'DateTime'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'datetime-local'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n </ng-container>\n </ng-container>\n </ng-container>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: InputComponent, selector: "base-input", inputs: ["id", "name", "infoText", "label", "placeholder", "autocomplete", "tabIndex", "control", "type", "required", "eyeButton", "objectPath"], outputs: ["enter"] }, { kind: "component", type: SelectComponent, selector: "base-select", inputs: ["id", "name", "infoText", "label", "placeholder", "objectPath", "control", "tabIndex", "required", "multiple", "search", "options"] }, { kind: "component", type: CheckboxComponent, selector: "base-checkbox", inputs: ["id", "name", "label", "value", "control", "required", "objectPath"] }, { kind: "component", type: TextareaComponent, selector: "base-textarea", inputs: ["id", "name", "infoText", "label", "placeholder", "control", "rows", "required", "tabIndex", "objectPath"] }, { kind: "component", type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "infoText", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required", "objectPath", "validators"] }, { kind: "component", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: ["id", "parentKey", "fields", "form", "config"], outputs: ["imageChanged", "fileChanged"] }, { kind: "component", type: UploadImageComponent, selector: "base-upload-image", inputs: ["id", "name", "infoText", "label", "supportText", "required", "defaultDragText", "defaultReleaseText", "preButtonText", "buttonText", "validExtensions", "control", "url", "uploadPath", "deletePath", "path", "compressOptions", "maxSize", "uploadDirectly", "croppingImage", "croppingOptions", "objectPath", "mode"], outputs: ["imageUploaded", "imageDeleted", "fileChanged"] }, { kind: "component", type: RefenceInputComponent, selector: "base-refence-input", inputs: ["id", "name", "infoText", "label", "isList", "search", "useParamAsArg", "param", "placeholder", "autocomplete", "tabIndex", "control", "required", "method", "fields", "valueField", "objectPath", "nameField", "creationLink"] }] });
|
|
1382
|
+
ModelFormSubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: { id: "id", parentKey: "parentKey", fields: "fields", form: "form", config: "config" }, outputs: { imageChanged: "imageChanged", fileChanged: "fileChanged" }, ngImport: i0, template: "<div class=\"mt-3\" *ngFor=\"let key of keys\">\n <ng-container\n *ngIf=\"checkFieldHasFields(fields[key]) && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\"\n >\n <fieldset class=\"border rounded-3 p-3 mt-3\">\n <legend class=\"float-none w-auto px-3\">\n {{ config[key]?.label ? config[key].label : capitalizeFirstLetter(key) }}\n </legend>\n <base-model-form-sub\n [parentKey]=\"key\"\n [fields]=\"fields[key].fields\"\n [config]=\"config[key]?.fields || {}\"\n [form]=\"form.get(key)\"\n (imageChanged)=\"imageChanged.emit($event)\"\n (fileChanged)=\"fileChanged.emit($event)\"\n ></base-model-form-sub>\n </fieldset>\n </ng-container>\n\n <ng-container\n *ngIf=\"!checkFieldHasFields(fields[key]) && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\"\n >\n <ng-container *ngIf=\"fields[key]?.isEnum && !config[key]?.exclude\">\n <base-select\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || 'Bitte einen Wert ausw\u00E4hlen'\"\n [options]=\"prepareEnumForSelect(fields[key]?.validEnums, config[key]?.enumValues)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\"\n [objectPath]=\"objectPath\"\n ></base-select>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isEnum && !config[key]?.exclude\">\n <ng-container [ngSwitch]=\"config[key]?.type ? config[key]?.type : fields[key]?.type\">\n <ng-container *ngSwitchCase=\"'String'\">\n <ng-container *ngIf=\"fields[key]?.isList && !config[key]?.exclude\">\n <base-tags\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [validators]=\"config[key]?.validators\"\n [objectPath]=\"objectPath\"\n ></base-tags>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isList && !config[key]?.exclude\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'text'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Image'\">\n <base-upload-image\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [url]=\"config[key]?.url\"\n [path]=\"config[key]?.path || '/files/'\"\n [uploadPath]=\"config[key]?.uploadPath || '/files/upload'\"\n [deletePath]=\"config[key]?.deletePath || '/files/'\"\n [supportText]=\"config[key]?.supportText || 'Unterst\u00FCtzte Formate: JPEG, JPG, PNG'\"\n [defaultDragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [defaultReleaseText]=\"config[key]?.releaseText || 'Loslassen zum hochladen'\"\n [preButtonText]=\"config[key]?.preButtonText || 'or'\"\n [buttonText]=\"config[key]?.buttonText || 'browse'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png', 'image/webp']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [compressOptions]=\"config[key]?.compressOptions\"\n [croppingOptions]=\"config[key]?.croppingOptions\"\n [croppingImage]=\"config[key]?.croppingImage\"\n [maxSize]=\"config[key]?.maxSize\"\n [uploadDirectly]=\"false\"\n [objectPath]=\"objectPath\"\n [mode]=\"config[key]?.imageMode || 'base64'\"\n (fileChanged)=\"fileChanged.emit($event)\"\n (imageDeleted)=\"imageChanged.emit(key)\"\n (imageUploaded)=\"imageChanged.emit(key)\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Upload'\">\n <base-upload-image\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [supportText]=\"config[key]?.supportText || 'Unterst\u00FCtzte Formate: JPEG, JPG, PNG'\"\n [defaultDragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [defaultReleaseText]=\"config[key]?.releaseText || 'Loslassen zum hochladen'\"\n [preButtonText]=\"config[key]?.preButtonText || 'or'\"\n [buttonText]=\"config[key]?.buttonText || 'browse'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png', 'image/webp']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [compressOptions]=\"config[key]?.compressOptions\"\n [maxSize]=\"config[key]?.maxSize\"\n [objectPath]=\"objectPath\"\n [mode]=\"'file'\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Reference'\">\n <base-refence-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [isList]=\"fields[key]?.isList\"\n [useParamAsArg]=\"config[key]?.useParamAsArg ?? false\"\n [param]=\"id\"\n [search]=\"config[key]?.searchable ?? true\"\n [placeholder]=\"config[key]?.placeholder || 'Bitte einen Wert ausw\u00E4hlen'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [method]=\"config[key]?.method || 'find'\"\n [fields]=\"config[key]?.requestFields || ['id', 'name']\"\n [valueField]=\"config[key]?.valueField || 'id'\"\n [nameField]=\"config[key]?.nameField || 'name'\"\n [creationLink]=\"config[key]?.creationLink || ''\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-refence-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Boolean'\">\n <base-checkbox\n [id]=\"key\"\n [name]=\"key\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'LongText'\">\n <base-textarea\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-textarea>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Float'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'number'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Password'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'password'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Color'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'color'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'URL'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'url'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Email'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'email'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'DateTime'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'datetime-local'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n </ng-container>\n </ng-container>\n </ng-container>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: InputComponent, selector: "base-input", inputs: ["id", "name", "infoText", "label", "placeholder", "autocomplete", "tabIndex", "control", "type", "required", "eyeButton", "objectPath"], outputs: ["enter"] }, { kind: "component", type: SelectComponent, selector: "base-select", inputs: ["id", "name", "infoText", "label", "placeholder", "objectPath", "control", "tabIndex", "required", "multiple", "search", "options"] }, { kind: "component", type: CheckboxComponent, selector: "base-checkbox", inputs: ["id", "name", "label", "value", "control", "required", "objectPath"] }, { kind: "component", type: TextareaComponent, selector: "base-textarea", inputs: ["id", "name", "infoText", "label", "placeholder", "control", "rows", "required", "autoHeight", "tabIndex", "objectPath"] }, { kind: "component", type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "infoText", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required", "objectPath", "validators"] }, { kind: "component", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: ["id", "parentKey", "fields", "form", "config"], outputs: ["imageChanged", "fileChanged"] }, { kind: "component", type: UploadImageComponent, selector: "base-upload-image", inputs: ["id", "name", "infoText", "label", "supportText", "required", "defaultDragText", "defaultReleaseText", "preButtonText", "buttonText", "validExtensions", "control", "url", "uploadPath", "deletePath", "path", "compressOptions", "maxSize", "uploadDirectly", "croppingImage", "croppingOptions", "objectPath", "mode"], outputs: ["imageUploaded", "imageDeleted", "fileChanged"] }, { kind: "component", type: RefenceInputComponent, selector: "base-refence-input", inputs: ["id", "name", "infoText", "label", "isList", "search", "useParamAsArg", "param", "placeholder", "autocomplete", "tabIndex", "control", "required", "method", "fields", "valueField", "objectPath", "nameField", "creationLink"] }] });
|
|
1399
1383
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ModelFormSubComponent, decorators: [{
|
|
1400
1384
|
type: Component,
|
|
1401
1385
|
args: [{ selector: 'base-model-form-sub', template: "<div class=\"mt-3\" *ngFor=\"let key of keys\">\n <ng-container\n *ngIf=\"checkFieldHasFields(fields[key]) && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\"\n >\n <fieldset class=\"border rounded-3 p-3 mt-3\">\n <legend class=\"float-none w-auto px-3\">\n {{ config[key]?.label ? config[key].label : capitalizeFirstLetter(key) }}\n </legend>\n <base-model-form-sub\n [parentKey]=\"key\"\n [fields]=\"fields[key].fields\"\n [config]=\"config[key]?.fields || {}\"\n [form]=\"form.get(key)\"\n (imageChanged)=\"imageChanged.emit($event)\"\n (fileChanged)=\"fileChanged.emit($event)\"\n ></base-model-form-sub>\n </fieldset>\n </ng-container>\n\n <ng-container\n *ngIf=\"!checkFieldHasFields(fields[key]) && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\"\n >\n <ng-container *ngIf=\"fields[key]?.isEnum && !config[key]?.exclude\">\n <base-select\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || 'Bitte einen Wert ausw\u00E4hlen'\"\n [options]=\"prepareEnumForSelect(fields[key]?.validEnums, config[key]?.enumValues)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\"\n [objectPath]=\"objectPath\"\n ></base-select>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isEnum && !config[key]?.exclude\">\n <ng-container [ngSwitch]=\"config[key]?.type ? config[key]?.type : fields[key]?.type\">\n <ng-container *ngSwitchCase=\"'String'\">\n <ng-container *ngIf=\"fields[key]?.isList && !config[key]?.exclude\">\n <base-tags\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [validators]=\"config[key]?.validators\"\n [objectPath]=\"objectPath\"\n ></base-tags>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isList && !config[key]?.exclude\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'text'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Image'\">\n <base-upload-image\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [url]=\"config[key]?.url\"\n [path]=\"config[key]?.path || '/files/'\"\n [uploadPath]=\"config[key]?.uploadPath || '/files/upload'\"\n [deletePath]=\"config[key]?.deletePath || '/files/'\"\n [supportText]=\"config[key]?.supportText || 'Unterst\u00FCtzte Formate: JPEG, JPG, PNG'\"\n [defaultDragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [defaultReleaseText]=\"config[key]?.releaseText || 'Loslassen zum hochladen'\"\n [preButtonText]=\"config[key]?.preButtonText || 'or'\"\n [buttonText]=\"config[key]?.buttonText || 'browse'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png', 'image/webp']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [compressOptions]=\"config[key]?.compressOptions\"\n [croppingOptions]=\"config[key]?.croppingOptions\"\n [croppingImage]=\"config[key]?.croppingImage\"\n [maxSize]=\"config[key]?.maxSize\"\n [uploadDirectly]=\"false\"\n [objectPath]=\"objectPath\"\n [mode]=\"config[key]?.imageMode || 'base64'\"\n (fileChanged)=\"fileChanged.emit($event)\"\n (imageDeleted)=\"imageChanged.emit(key)\"\n (imageUploaded)=\"imageChanged.emit(key)\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Upload'\">\n <base-upload-image\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [supportText]=\"config[key]?.supportText || 'Unterst\u00FCtzte Formate: JPEG, JPG, PNG'\"\n [defaultDragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [defaultReleaseText]=\"config[key]?.releaseText || 'Loslassen zum hochladen'\"\n [preButtonText]=\"config[key]?.preButtonText || 'or'\"\n [buttonText]=\"config[key]?.buttonText || 'browse'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png', 'image/webp']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [compressOptions]=\"config[key]?.compressOptions\"\n [maxSize]=\"config[key]?.maxSize\"\n [objectPath]=\"objectPath\"\n [mode]=\"'file'\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Reference'\">\n <base-refence-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [isList]=\"fields[key]?.isList\"\n [useParamAsArg]=\"config[key]?.useParamAsArg ?? false\"\n [param]=\"id\"\n [search]=\"config[key]?.searchable ?? true\"\n [placeholder]=\"config[key]?.placeholder || 'Bitte einen Wert ausw\u00E4hlen'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [method]=\"config[key]?.method || 'find'\"\n [fields]=\"config[key]?.requestFields || ['id', 'name']\"\n [valueField]=\"config[key]?.valueField || 'id'\"\n [nameField]=\"config[key]?.nameField || 'name'\"\n [creationLink]=\"config[key]?.creationLink || ''\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-refence-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Boolean'\">\n <base-checkbox\n [id]=\"key\"\n [name]=\"key\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'LongText'\">\n <base-textarea\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-textarea>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Float'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'number'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Password'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'password'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Color'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [type]=\"'color'\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'URL'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'url'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Email'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'email'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'DateTime'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\n [infoText]=\"config[key]?.infoText ? config[key].infoText : null\"\n [label]=\"config[key]?.label ? config[key].label : capitalizeFirstLetter(key)\"\n [placeholder]=\"config[key]?.placeholder || ''\"\n [type]=\"'datetime-local'\"\n [control]=\"transformToControl(form?.get(key))\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n [objectPath]=\"objectPath\"\n ></base-input>\n </ng-container>\n </ng-container>\n </ng-container>\n </ng-container>\n</div>\n" }]
|
|
@@ -2546,7 +2530,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
2546
2530
|
}] } });
|
|
2547
2531
|
|
|
2548
2532
|
// Modules
|
|
2549
|
-
const imports = [FormsModule, ReactiveFormsModule, CommonModule, RouterModule, ImageCropperModule];
|
|
2533
|
+
const imports = [FormsModule, ReactiveFormsModule, CommonModule, RouterModule, ImageCropperModule, NgbTooltipModule];
|
|
2550
2534
|
// Imported and exported elements
|
|
2551
2535
|
const elements = [
|
|
2552
2536
|
// Directives
|
|
@@ -2603,7 +2587,7 @@ BaseComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ve
|
|
|
2603
2587
|
DeleteAccountComponent,
|
|
2604
2588
|
FabButtonComponent,
|
|
2605
2589
|
// Pipes
|
|
2606
|
-
EllipsesPipe], imports: [FormsModule, ReactiveFormsModule, CommonModule, RouterModule, ImageCropperModule], exports: [
|
|
2590
|
+
EllipsesPipe], imports: [FormsModule, ReactiveFormsModule, CommonModule, RouterModule, ImageCropperModule, NgbTooltipModule], exports: [
|
|
2607
2591
|
// Directives
|
|
2608
2592
|
SortDirective,
|
|
2609
2593
|
BackButtonDirective,
|