@lenne.tech/ng-base 14.0.2 → 14.0.5
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/components/model-form/model-form.component.d.ts +7 -2
- package/base-components/components/model-form-sub/model-form-sub.component.d.ts +7 -3
- package/base-components/components/refence-input/refence-input.component.d.ts +10 -4
- package/base-components/components/upload-image/upload-image.component.d.ts +3 -1
- package/esm2020/base-components/components/model-form/model-form.component.mjs +56 -12
- package/esm2020/base-components/components/model-form-sub/model-form-sub.component.mjs +9 -3
- package/esm2020/base-components/components/model-table/model-table.component.mjs +4 -4
- package/esm2020/base-components/components/refence-input/refence-input.component.mjs +28 -22
- package/esm2020/base-components/components/tags/tags.component.mjs +2 -2
- package/esm2020/base-components/components/upload-image/upload-image.component.mjs +22 -9
- package/esm2020/shared/classes/graphql-meta.class.mjs +52 -28
- package/esm2020/shared/classes/graphql-type.class.mjs +2 -1
- package/esm2020/shared/services/graphql.service.mjs +30 -36
- package/fesm2015/lenne.tech-ng-base-base-components.mjs +127 -61
- package/fesm2015/lenne.tech-ng-base-base-components.mjs.map +1 -1
- package/fesm2015/lenne.tech-ng-base-shared.mjs +81 -61
- package/fesm2015/lenne.tech-ng-base-shared.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base-base-components.mjs +112 -45
- package/fesm2020/lenne.tech-ng-base-base-components.mjs.map +1 -1
- package/fesm2020/lenne.tech-ng-base-shared.mjs +81 -61
- package/fesm2020/lenne.tech-ng-base-shared.mjs.map +1 -1
- package/package.json +1 -1
- package/shared/classes/graphql-meta.class.d.ts +7 -4
- package/shared/classes/graphql-type.class.d.ts +1 -0
- package/shared/services/graphql.service.d.ts +4 -4
|
@@ -11,6 +11,7 @@ import { ToastType, GraphQLRequestType, BasicUser } from '@lenne.tech/ng-base/sh
|
|
|
11
11
|
import { __awaiter } from 'tslib';
|
|
12
12
|
import * as i2$1 from '@angular/router';
|
|
13
13
|
import * as i1$2 from '@angular/common/http';
|
|
14
|
+
import { HttpHeaders } from '@angular/common/http';
|
|
14
15
|
|
|
15
16
|
class InputComponent {
|
|
16
17
|
constructor() {
|
|
@@ -326,7 +327,7 @@ class TagsComponent {
|
|
|
326
327
|
*/
|
|
327
328
|
filterOptions() {
|
|
328
329
|
return this.options
|
|
329
|
-
? this.options.filter((e) => { var _a; return (!this.inputValue || ((_a = e === null || e === void 0 ? void 0 : e.text) === null || _a === void 0 ? void 0 : _a.includes(this.inputValue))) && !this.control.value.includes(e.value); })
|
|
330
|
+
? this.options.filter((e) => { var _a, _b; return (!this.inputValue || ((_a = e === null || e === void 0 ? void 0 : e.text) === null || _a === void 0 ? void 0 : _a.includes(this.inputValue))) && !((_b = this.control.value) === null || _b === void 0 ? void 0 : _b.includes(e.value)); })
|
|
330
331
|
: [];
|
|
331
332
|
}
|
|
332
333
|
/**
|
|
@@ -447,8 +448,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
|
|
|
447
448
|
}], ctorParameters: function () { return [{ type: i1$1.BreadcrumbService }]; } });
|
|
448
449
|
|
|
449
450
|
class UploadImageComponent {
|
|
450
|
-
constructor(httpClient) {
|
|
451
|
+
constructor(httpClient, authService) {
|
|
451
452
|
this.httpClient = httpClient;
|
|
453
|
+
this.authService = authService;
|
|
452
454
|
this.supportText = 'Supports: JPEG, JPG, PNG';
|
|
453
455
|
this.required = false;
|
|
454
456
|
this.dragText = 'Drag & Drop';
|
|
@@ -530,7 +532,12 @@ class UploadImageComponent {
|
|
|
530
532
|
upload() {
|
|
531
533
|
const data = new FormData();
|
|
532
534
|
data.append('file', this.selectedFile);
|
|
533
|
-
|
|
535
|
+
const httpOptions = {
|
|
536
|
+
headers: new HttpHeaders({
|
|
537
|
+
Authorization: 'Bearer ' + this.authService.token,
|
|
538
|
+
}),
|
|
539
|
+
};
|
|
540
|
+
this.httpClient.post(this.url + this.uploadPath, data, httpOptions).subscribe((result) => {
|
|
534
541
|
if (result === null || result === void 0 ? void 0 : result.id) {
|
|
535
542
|
this.control.setValue(result.id);
|
|
536
543
|
this.imageUploaded.emit(result.id);
|
|
@@ -548,7 +555,12 @@ class UploadImageComponent {
|
|
|
548
555
|
this.selectedFile = null;
|
|
549
556
|
this.fileUrl = null;
|
|
550
557
|
if (id) {
|
|
551
|
-
|
|
558
|
+
const httpOptions = {
|
|
559
|
+
headers: new HttpHeaders({
|
|
560
|
+
Authorization: 'Bearer ' + this.authService.token,
|
|
561
|
+
}),
|
|
562
|
+
};
|
|
563
|
+
this.httpClient.delete(this.url + this.deletePath + id, httpOptions).subscribe((result) => {
|
|
552
564
|
this.selectedFile = null;
|
|
553
565
|
this.fileUrl = null;
|
|
554
566
|
this.control.setValue('');
|
|
@@ -558,12 +570,12 @@ class UploadImageComponent {
|
|
|
558
570
|
}
|
|
559
571
|
}
|
|
560
572
|
}
|
|
561
|
-
UploadImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: UploadImageComponent, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
|
|
562
|
-
UploadImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: UploadImageComponent, selector: "base-upload-image", inputs: { id: "id", name: "name", label: "label", supportText: "supportText", required: "required", dragText: "dragText", validExtensions: "validExtensions", control: "control", url: "url", uploadPath: "uploadPath", deletePath: "deletePath", path: "path" }, outputs: { imageUploaded: "imageUploaded", imageDeleted: "imageDeleted" }, ngImport: i0, template: "<div class=\"form-group mt-3\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <div\n class=\"drag-area\"\n (dragover)=\"dragOver($event)\"\n (dragleave)=\"dragLeave($event)\"\n (drop)=\"drop($event)\"\n [ngClass]=\"{ active: dragActive }\"\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 && !control?.value && !loading\">\n <img [src]=\"fileUrl\" *ngIf=\"selectedFile\" />\n <button class=\"btn btn-danger\" (click)=\"deleteFile()\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"control?.value && !loading\">\n <img [src]=\"url + path + control?.value\" />\n <button class=\"btn btn-danger\" (click)=\"deleteFile(control?.value)\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"!selectedFile && !control?.value && !loading\">\n <div class=\"icon\">\n <i class=\"bi bi-images\"></i>\n </div>\n\n <span class=\"header\">{{ dragText }}</span>\n <span class=\"header\">or <span class=\"button\" (click)=\"fileInput.click()\">browse</span></span>\n <input type=\"file\" (change)=\"selectFile($event)\" hidden #fileInput />\n <span class=\"support\">{{ supportText }}</span>\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 *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: [":host{--base-upload-image-area-bg: #ffffff;--base-upload-image-area-border-color: #e1e1e1;--base-upload-image-area-height: 400px}.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:300px;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)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
573
|
+
UploadImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: UploadImageComponent, deps: [{ token: i1$2.HttpClient }, { token: i1$1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
|
|
574
|
+
UploadImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: UploadImageComponent, selector: "base-upload-image", inputs: { id: "id", name: "name", label: "label", supportText: "supportText", required: "required", dragText: "dragText", validExtensions: "validExtensions", control: "control", url: "url", uploadPath: "uploadPath", deletePath: "deletePath", path: "path" }, outputs: { imageUploaded: "imageUploaded", imageDeleted: "imageDeleted" }, ngImport: i0, template: "<div class=\"form-group mt-3\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <div\n class=\"drag-area\"\n (dragover)=\"dragOver($event)\"\n (dragleave)=\"dragLeave($event)\"\n (drop)=\"drop($event)\"\n [ngClass]=\"{ active: dragActive }\"\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 && !control?.value && !loading\">\n <img [src]=\"fileUrl\" *ngIf=\"selectedFile\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile()\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"control?.value && !loading\">\n <img [src]=\"url + path + control?.value\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile(control?.value)\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"!selectedFile && !control?.value && !loading\">\n <div class=\"icon\">\n <i class=\"bi bi-images\"></i>\n </div>\n\n <span class=\"header\">{{ dragText }}</span>\n <span class=\"header\">or <span class=\"button\" (click)=\"fileInput.click()\">browse</span></span>\n <input type=\"file\" (change)=\"selectFile($event)\" hidden #fileInput />\n <span class=\"support\">{{ supportText }}</span>\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 *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: [":host{--base-upload-image-area-bg: #ffffff;--base-upload-image-area-border-color: #e1e1e1;--base-upload-image-area-height: 400px}.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:300px;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)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
563
575
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: UploadImageComponent, decorators: [{
|
|
564
576
|
type: Component,
|
|
565
|
-
args: [{ selector: 'base-upload-image', template: "<div class=\"form-group mt-3\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <div\n class=\"drag-area\"\n (dragover)=\"dragOver($event)\"\n (dragleave)=\"dragLeave($event)\"\n (drop)=\"drop($event)\"\n [ngClass]=\"{ active: dragActive }\"\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 && !control?.value && !loading\">\n <img [src]=\"fileUrl\" *ngIf=\"selectedFile\" />\n <button class=\"btn btn-danger\" (click)=\"deleteFile()\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"control?.value && !loading\">\n <img [src]=\"url + path + control?.value\" />\n <button class=\"btn btn-danger\" (click)=\"deleteFile(control?.value)\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"!selectedFile && !control?.value && !loading\">\n <div class=\"icon\">\n <i class=\"bi bi-images\"></i>\n </div>\n\n <span class=\"header\">{{ dragText }}</span>\n <span class=\"header\">or <span class=\"button\" (click)=\"fileInput.click()\">browse</span></span>\n <input type=\"file\" (change)=\"selectFile($event)\" hidden #fileInput />\n <span class=\"support\">{{ supportText }}</span>\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 *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: [":host{--base-upload-image-area-bg: #ffffff;--base-upload-image-area-border-color: #e1e1e1;--base-upload-image-area-height: 400px}.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:300px;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)}\n"] }]
|
|
566
|
-
}], ctorParameters: function () { return [{ type: i1$2.HttpClient }]; }, propDecorators: { id: [{
|
|
577
|
+
args: [{ selector: 'base-upload-image', template: "<div class=\"form-group mt-3\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n <div\n class=\"drag-area\"\n (dragover)=\"dragOver($event)\"\n (dragleave)=\"dragLeave($event)\"\n (drop)=\"drop($event)\"\n [ngClass]=\"{ active: dragActive }\"\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 && !control?.value && !loading\">\n <img [src]=\"fileUrl\" *ngIf=\"selectedFile\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile()\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"control?.value && !loading\">\n <img [src]=\"url + path + control?.value\" />\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteFile(control?.value)\">L\u00F6schen</button>\n </ng-container>\n\n <ng-container *ngIf=\"!selectedFile && !control?.value && !loading\">\n <div class=\"icon\">\n <i class=\"bi bi-images\"></i>\n </div>\n\n <span class=\"header\">{{ dragText }}</span>\n <span class=\"header\">or <span class=\"button\" (click)=\"fileInput.click()\">browse</span></span>\n <input type=\"file\" (change)=\"selectFile($event)\" hidden #fileInput />\n <span class=\"support\">{{ supportText }}</span>\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 *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: [":host{--base-upload-image-area-bg: #ffffff;--base-upload-image-area-border-color: #e1e1e1;--base-upload-image-area-height: 400px}.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:300px;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)}\n"] }]
|
|
578
|
+
}], ctorParameters: function () { return [{ type: i1$2.HttpClient }, { type: i1$1.AuthService }]; }, propDecorators: { id: [{
|
|
567
579
|
type: Input
|
|
568
580
|
}], name: [{
|
|
569
581
|
type: Input
|
|
@@ -605,29 +617,39 @@ class RefenceInputComponent {
|
|
|
605
617
|
this.textField = 'name';
|
|
606
618
|
this.objects = [];
|
|
607
619
|
this.optionsForTagInput = [];
|
|
620
|
+
this.subscription = new Subscription();
|
|
608
621
|
}
|
|
609
622
|
ngOnInit() {
|
|
610
623
|
return __awaiter(this, void 0, void 0, function* () {
|
|
611
|
-
this.
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
})
|
|
616
|
-
.subscribe((result) => __awaiter(this, void 0, void 0, function* () {
|
|
617
|
-
if (result) {
|
|
618
|
-
this.objects = result;
|
|
619
|
-
this.setObjectsAsOptions();
|
|
620
|
-
yield this.setValue();
|
|
624
|
+
this.getReferences();
|
|
625
|
+
this.subscription.add(this.control.valueChanges.subscribe(() => {
|
|
626
|
+
if (!this.currentValue) {
|
|
627
|
+
this.setValue();
|
|
621
628
|
}
|
|
622
629
|
}));
|
|
623
630
|
});
|
|
624
631
|
}
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
632
|
+
ngOnDestroy() {
|
|
633
|
+
this.subscription.unsubscribe();
|
|
634
|
+
}
|
|
635
|
+
/**
|
|
636
|
+
* It gets the references from the GraphQL server and sets the value of the select
|
|
637
|
+
*/
|
|
638
|
+
getReferences() {
|
|
639
|
+
this.graphQLService
|
|
640
|
+
.graphQl(this.method, {
|
|
641
|
+
fields: this.fields,
|
|
642
|
+
type: GraphQLRequestType.QUERY,
|
|
643
|
+
})
|
|
644
|
+
.subscribe((result) => __awaiter(this, void 0, void 0, function* () {
|
|
645
|
+
if (result) {
|
|
646
|
+
this.objects = result;
|
|
647
|
+
this.setObjectsAsOptions();
|
|
648
|
+
if (!this.currentValue) {
|
|
649
|
+
this.setValue();
|
|
650
|
+
}
|
|
629
651
|
}
|
|
630
|
-
});
|
|
652
|
+
}));
|
|
631
653
|
}
|
|
632
654
|
/**
|
|
633
655
|
* If the current value is not valid, set the control to an invalid state
|
|
@@ -663,23 +685,16 @@ class RefenceInputComponent {
|
|
|
663
685
|
* the objects array is empty, then set the currentValue to the control's value
|
|
664
686
|
*/
|
|
665
687
|
setValue() {
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
if (((
|
|
669
|
-
|
|
670
|
-
if (foundElement) {
|
|
671
|
-
this.currentValue = foundElement[this.textField];
|
|
672
|
-
resolve(true);
|
|
673
|
-
}
|
|
674
|
-
else {
|
|
675
|
-
this.currentValue = this.control.value;
|
|
676
|
-
resolve(true);
|
|
677
|
-
}
|
|
688
|
+
var _a, _b, _c, _d;
|
|
689
|
+
if (((_a = this.control) === null || _a === void 0 ? void 0 : _a.value) && ((_b = this.objects) === null || _b === void 0 ? void 0 : _b.length) > 0) {
|
|
690
|
+
if ((_d = (_c = this.control) === null || _c === void 0 ? void 0 : _c.value) === null || _d === void 0 ? void 0 : _d.id) {
|
|
691
|
+
this.control.setValue(this.control.value.id);
|
|
678
692
|
}
|
|
679
|
-
|
|
680
|
-
|
|
693
|
+
const foundElement = this.objects.find((e) => e[this.valueField] === this.control.value);
|
|
694
|
+
if (foundElement) {
|
|
695
|
+
this.currentValue = foundElement[this.textField];
|
|
681
696
|
}
|
|
682
|
-
}
|
|
697
|
+
}
|
|
683
698
|
}
|
|
684
699
|
/**
|
|
685
700
|
* It sets the value of the control to the id of the selected option
|
|
@@ -730,7 +745,7 @@ class RefenceInputComponent {
|
|
|
730
745
|
}
|
|
731
746
|
}
|
|
732
747
|
RefenceInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: RefenceInputComponent, deps: [{ token: i1$1.GraphQLService }], target: i0.ɵɵFactoryTarget.Component });
|
|
733
|
-
RefenceInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: RefenceInputComponent, selector: "base-refence-input", inputs: { id: "id", name: "name", label: "label", isList: "isList", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", required: "required", method: "method", fields: "fields", valueField: "valueField", textField: "textField" },
|
|
748
|
+
RefenceInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: RefenceInputComponent, selector: "base-refence-input", inputs: { id: "id", name: "name", label: "label", isList: "isList", placeholder: "placeholder", autocomplete: "autocomplete", tabIndex: "tabIndex", control: "control", required: "required", method: "method", fields: "fields", valueField: "valueField", textField: "textField" }, ngImport: i0, template: "<ng-container *ngIf=\"!isList\">\n <div class=\"form-group mb-3\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n\n <div class=\"position-relative\">\n <input [formControl]=\"control\" hidden />\n <input\n [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 <div class=\"options\" *ngIf=\"objects && selectedElement\">\n <div class=\"option-item\" *ngFor=\"let object of filterOptions()\" (click)=\"set(object[valueField])\">\n {{ object[textField] }}\n </div>\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']\">Bitte w\u00E4hle einen g\u00FCltigen Wert aus.</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}.options .option-item{padding:10px;cursor:pointer}.options .option-item:hover{color:var(--bs-primary)}\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.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: "component", type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required"] }] });
|
|
734
749
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: RefenceInputComponent, decorators: [{
|
|
735
750
|
type: Component,
|
|
736
751
|
args: [{ selector: 'base-refence-input', template: "<ng-container *ngIf=\"!isList\">\n <div class=\"form-group mb-3\">\n <label [for]=\"id\" class=\"form-label\" [ngClass]=\"{ required: required }\" *ngIf=\"label\">{{ label }}</label>\n\n <div class=\"position-relative\">\n <input [formControl]=\"control\" hidden />\n <input\n [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 <div class=\"options\" *ngIf=\"objects && selectedElement\">\n <div class=\"option-item\" *ngFor=\"let object of filterOptions()\" (click)=\"set(object[valueField])\">\n {{ object[textField] }}\n </div>\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']\">Bitte w\u00E4hle einen g\u00FCltigen Wert aus.</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}.options .option-item{padding:10px;cursor:pointer}.options .option-item:hover{color:var(--bs-primary)}\n"] }]
|
|
@@ -780,6 +795,13 @@ class ModelFormSubComponent {
|
|
|
780
795
|
// Set user for roles check
|
|
781
796
|
this.user = BasicUser.map(this.authService.currentUser);
|
|
782
797
|
}
|
|
798
|
+
/**
|
|
799
|
+
* If the field has fields, return true, otherwise return false.
|
|
800
|
+
*/
|
|
801
|
+
checkFieldHasFields(field) {
|
|
802
|
+
var _a;
|
|
803
|
+
return ((_a = Object.keys(field.fields)) === null || _a === void 0 ? void 0 : _a.length) !== 0;
|
|
804
|
+
}
|
|
783
805
|
/**
|
|
784
806
|
* It takes a string, capitalizes the first letter, and returns the new string
|
|
785
807
|
*
|
|
@@ -821,10 +843,10 @@ class ModelFormSubComponent {
|
|
|
821
843
|
}
|
|
822
844
|
}
|
|
823
845
|
ModelFormSubComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ModelFormSubComponent, deps: [{ token: i1$1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
|
|
824
|
-
ModelFormSubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: { fields: "fields", form: "form", config: "config" }, outputs: { imageChanged: "imageChanged" }, ngImport: i0, template: "<div class=\"mt-3\" *ngFor=\"let key of keys\">\n <ng-container *ngIf=\"!fields[key]?.type && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\">\n <fieldset class=\"border rounded-3 p-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 [fields]=\"fields[key]\"\n [config]=\"config[key]?.fields || {}\"\n [form]=\"form.get(key)\"\n ></base-model-form-sub>\n </fieldset>\n </ng-container>\n\n <ng-container *ngIf=\"fields[key]?.type && (config[key]?.roles ? user?.hasAllRoles(config[key]?.roles) : true)\">\n <ng-container *ngIf=\"fields[key]?.isEnum\">\n <base-select\n [id]=\"key\"\n [name]=\"key\"\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 ></base-select>\n </ng-container>\n\n <ng-container *ngIf=\"!fields[key]?.isEnum\">\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 [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 ></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 [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 ></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 [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 [dragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n (imageDeleted)=\"imageChanged.emit()\"\n (imageUploaded)=\"imageChanged.emit()\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Reference'\">\n <base-refence-input\n [id]=\"key\"\n [name]=\"key\"\n [isList]=\"fields[key]?.isList\"\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]?.fields || ['id', 'name']\"\n [valueField]=\"config[key]?.valueField || 'id'\"\n [textField]=\"config[key]?.nameField || 'name'\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\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 ></base-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'LongText'\">\n <base-textarea\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 ></base-textarea>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Float'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Password'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Color'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'DateTime'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></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", "label", "placeholder", "autocomplete", "tabIndex", "control", "type", "required"], outputs: ["enter"] }, { kind: "component", type: SelectComponent, selector: "base-select", inputs: ["id", "name", "label", "placeholder", "control", "tabIndex", "required", "multiple", "search", "options"] }, { kind: "component", type: CheckboxComponent, selector: "base-checkbox", inputs: ["id", "name", "label", "value", "control", "required"] }, { kind: "component", type: TextareaComponent, selector: "base-textarea", inputs: ["id", "name", "label", "placeholder", "control", "rows", "required", "tabIndex"] }, { kind: "component", type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required"] }, { kind: "component", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: ["fields", "form", "config"], outputs: ["imageChanged"] }, { kind: "component", type: UploadImageComponent, selector: "base-upload-image", inputs: ["id", "name", "label", "supportText", "required", "dragText", "validExtensions", "control", "url", "uploadPath", "deletePath", "path"], outputs: ["imageUploaded", "imageDeleted"] }, { kind: "component", type: RefenceInputComponent, selector: "base-refence-input", inputs: ["id", "name", "label", "isList", "placeholder", "autocomplete", "tabIndex", "control", "required", "method", "fields", "valueField", "textField"] }] });
|
|
846
|
+
ModelFormSubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: { fields: "fields", form: "form", config: "config" }, outputs: { imageChanged: "imageChanged" }, 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 [fields]=\"fields[key].fields\"\n [config]=\"config[key]?.fields || {}\"\n [form]=\"form.get(key)\"\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 [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 ></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 [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 ></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 [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 ></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 [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 [dragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n (imageDeleted)=\"imageChanged.emit(key)\"\n (imageUploaded)=\"imageChanged.emit(key)\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Reference'\">\n <base-refence-input\n [id]=\"key\"\n [name]=\"key\"\n [isList]=\"fields[key]?.isList\"\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]?.fields || ['id', 'name']\"\n [valueField]=\"config[key]?.valueField || 'id'\"\n [textField]=\"config[key]?.nameField || 'name'\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\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 ></base-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'LongText'\">\n <base-textarea\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 ></base-textarea>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Float'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Password'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Color'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'URL'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Email'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'DateTime'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></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", "label", "placeholder", "autocomplete", "tabIndex", "control", "type", "required"], outputs: ["enter"] }, { kind: "component", type: SelectComponent, selector: "base-select", inputs: ["id", "name", "label", "placeholder", "control", "tabIndex", "required", "multiple", "search", "options"] }, { kind: "component", type: CheckboxComponent, selector: "base-checkbox", inputs: ["id", "name", "label", "value", "control", "required"] }, { kind: "component", type: TextareaComponent, selector: "base-textarea", inputs: ["id", "name", "label", "placeholder", "control", "rows", "required", "tabIndex"] }, { kind: "component", type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required"] }, { kind: "component", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: ["fields", "form", "config"], outputs: ["imageChanged"] }, { kind: "component", type: UploadImageComponent, selector: "base-upload-image", inputs: ["id", "name", "label", "supportText", "required", "dragText", "validExtensions", "control", "url", "uploadPath", "deletePath", "path"], outputs: ["imageUploaded", "imageDeleted"] }, { kind: "component", type: RefenceInputComponent, selector: "base-refence-input", inputs: ["id", "name", "label", "isList", "placeholder", "autocomplete", "tabIndex", "control", "required", "method", "fields", "valueField", "textField"] }] });
|
|
825
847
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ModelFormSubComponent, decorators: [{
|
|
826
848
|
type: Component,
|
|
827
|
-
args: [{ selector: 'base-model-form-sub', template: "<div class=\"mt-3\" *ngFor=\"let key of keys\">\n <ng-container
|
|
849
|
+
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 [fields]=\"fields[key].fields\"\n [config]=\"config[key]?.fields || {}\"\n [form]=\"form.get(key)\"\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 [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 ></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 [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 ></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 [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 ></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 [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 [dragText]=\"config[key]?.dragText || 'Drag & Drop'\"\n [validExtensions]=\"config[key]?.validExtensions || ['image/jpeg', 'image/jpg', 'image/png']\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\n (imageDeleted)=\"imageChanged.emit(key)\"\n (imageUploaded)=\"imageChanged.emit(key)\"\n ></base-upload-image>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Reference'\">\n <base-refence-input\n [id]=\"key\"\n [name]=\"key\"\n [isList]=\"fields[key]?.isList\"\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]?.fields || ['id', 'name']\"\n [valueField]=\"config[key]?.valueField || 'id'\"\n [textField]=\"config[key]?.nameField || 'name'\"\n [required]=\"\n config[key] && config[key]?.required !== undefined ? config[key]?.required : fields[key].isRequired\n \"\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 ></base-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'LongText'\">\n <base-textarea\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 ></base-textarea>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Float'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Password'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Color'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'URL'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'Email'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'DateTime'\">\n <base-input\n [id]=\"key\"\n [name]=\"key\"\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 ></base-input>\n </ng-container>\n </ng-container>\n </ng-container>\n </ng-container>\n</div>\n" }]
|
|
828
850
|
}], ctorParameters: function () { return [{ type: i1$1.AuthService }]; }, propDecorators: { fields: [{
|
|
829
851
|
type: Input
|
|
830
852
|
}], form: [{
|
|
@@ -875,8 +897,8 @@ class ModelFormComponent {
|
|
|
875
897
|
this.operation = this.id ? 'update' : 'create';
|
|
876
898
|
this.fields = this.meta.getArgs(this.operation + this.capitalizeFirstLetter(this.modelName), {
|
|
877
899
|
type: GraphQLRequestType.MUTATION,
|
|
878
|
-
});
|
|
879
|
-
this.fields = this.fields['input'];
|
|
900
|
+
}).fields;
|
|
901
|
+
this.fields = this.fields['input'].fields;
|
|
880
902
|
this.keys = Object.keys(this.fields);
|
|
881
903
|
if (this.logging) {
|
|
882
904
|
console.log('ModelFormComponent::init->fields', this.fields);
|
|
@@ -921,11 +943,11 @@ class ModelFormComponent {
|
|
|
921
943
|
for (const [key, value] of Object.entries(this.config)) {
|
|
922
944
|
// If it not an array
|
|
923
945
|
if (((_a = this.config[key]) === null || _a === void 0 ? void 0 : _a.patchField) && !((_b = this.fields[key]) === null || _b === void 0 ? void 0 : _b.isList)) {
|
|
924
|
-
this.form.get(key).
|
|
946
|
+
this.form.get(key).setValue((_d = response[(_c = this.config[key]) === null || _c === void 0 ? void 0 : _c.patchField]) === null || _d === void 0 ? void 0 : _d.id);
|
|
925
947
|
}
|
|
926
948
|
// If value is an array
|
|
927
949
|
if (((_e = this.config[key]) === null || _e === void 0 ? void 0 : _e.patchField) && ((_f = this.fields[key]) === null || _f === void 0 ? void 0 : _f.isList)) {
|
|
928
|
-
this.form.get(key).
|
|
950
|
+
this.form.get(key).setValue((_h = response[(_g = this.config[key]) === null || _g === void 0 ? void 0 : _g.patchField]) === null || _h === void 0 ? void 0 : _h.map((e) => e === null || e === void 0 ? void 0 : e.id));
|
|
929
951
|
}
|
|
930
952
|
}
|
|
931
953
|
if (this.logging) {
|
|
@@ -946,19 +968,19 @@ class ModelFormComponent {
|
|
|
946
968
|
* @returns An array of strings and objects.
|
|
947
969
|
*/
|
|
948
970
|
createRequestObject(fields) {
|
|
949
|
-
var _a, _b, _c;
|
|
971
|
+
var _a, _b, _c, _d;
|
|
950
972
|
const requestFields = [];
|
|
951
973
|
for (const [key, value] of Object.entries(fields)) {
|
|
952
|
-
if ((_a = fields[key]) === null || _a === void 0 ? void 0 : _a.
|
|
953
|
-
if (!((
|
|
974
|
+
if (((_b = Object.keys((_a = fields[key]) === null || _a === void 0 ? void 0 : _a.fields)) === null || _b === void 0 ? void 0 : _b.length) === 0) {
|
|
975
|
+
if (!((_c = this.config[key]) === null || _c === void 0 ? void 0 : _c.patchField)) {
|
|
954
976
|
requestFields.push(key);
|
|
955
977
|
}
|
|
956
978
|
else {
|
|
957
|
-
requestFields.push({ [(
|
|
979
|
+
requestFields.push({ [(_d = this.config[key]) === null || _d === void 0 ? void 0 : _d.patchField]: ['id'] });
|
|
958
980
|
}
|
|
959
981
|
}
|
|
960
982
|
else {
|
|
961
|
-
const subkeys = this.createRequestObject(fields[key]);
|
|
983
|
+
const subkeys = this.createRequestObject(fields[key].fields);
|
|
962
984
|
const resultObject = {};
|
|
963
985
|
resultObject[key] = subkeys;
|
|
964
986
|
requestFields.push(resultObject);
|
|
@@ -975,16 +997,16 @@ class ModelFormComponent {
|
|
|
975
997
|
* @param fields - IGraphQLTypeCollection
|
|
976
998
|
*/
|
|
977
999
|
createForm(fields) {
|
|
978
|
-
var _a, _b;
|
|
1000
|
+
var _a, _b, _c;
|
|
979
1001
|
const group = {};
|
|
980
1002
|
for (const [key, value] of Object.entries(fields)) {
|
|
981
|
-
if (value === null || value === void 0 ? void 0 : value.
|
|
982
|
-
group[key] = new UntypedFormControl(
|
|
1003
|
+
if (((_a = Object.keys(value === null || value === void 0 ? void 0 : value.fields)) === null || _a === void 0 ? void 0 : _a.length) === 0) {
|
|
1004
|
+
group[key] = new UntypedFormControl(null, (this.config[key] && ((_b = this.config[key]) === null || _b === void 0 ? void 0 : _b.required) !== undefined ? (_c = this.config[key]) === null || _c === void 0 ? void 0 : _c.required : value.isRequired)
|
|
983
1005
|
? Validators.required
|
|
984
1006
|
: []);
|
|
985
1007
|
}
|
|
986
1008
|
else {
|
|
987
|
-
group[key] = this.createForm(fields[key]);
|
|
1009
|
+
group[key] = this.createForm(fields[key].fields);
|
|
988
1010
|
}
|
|
989
1011
|
}
|
|
990
1012
|
if (this.logging) {
|
|
@@ -1060,6 +1082,39 @@ class ModelFormComponent {
|
|
|
1060
1082
|
transformToControl(control) {
|
|
1061
1083
|
return control;
|
|
1062
1084
|
}
|
|
1085
|
+
/**
|
|
1086
|
+
* It takes the key of the form control that has changed, gets the value of that form control, creates an object with the
|
|
1087
|
+
* key and value, and then sends that object to the GraphQL server to update the database
|
|
1088
|
+
*/
|
|
1089
|
+
imageChanged(key) {
|
|
1090
|
+
const data = {};
|
|
1091
|
+
data[key] = this.form.get(key).value;
|
|
1092
|
+
if (this.logging) {
|
|
1093
|
+
console.log('ModelFormComponent::imageChanged->body', data);
|
|
1094
|
+
}
|
|
1095
|
+
if (this.id) {
|
|
1096
|
+
try {
|
|
1097
|
+
this.graphQLService
|
|
1098
|
+
.graphQl('update' + this.capitalizeFirstLetter(this.modelName), {
|
|
1099
|
+
arguments: { id: this.id, input: data },
|
|
1100
|
+
fields: ['id'],
|
|
1101
|
+
type: GraphQLRequestType.MUTATION,
|
|
1102
|
+
})
|
|
1103
|
+
.subscribe({
|
|
1104
|
+
next: (value) => {
|
|
1105
|
+
if (this.logging) {
|
|
1106
|
+
console.log('ModelFormComponent::imageChanged->success', value);
|
|
1107
|
+
}
|
|
1108
|
+
},
|
|
1109
|
+
});
|
|
1110
|
+
}
|
|
1111
|
+
catch (e) {
|
|
1112
|
+
if (this.logging) {
|
|
1113
|
+
console.log('ModelFormComponent::imageChanged->error', e);
|
|
1114
|
+
}
|
|
1115
|
+
}
|
|
1116
|
+
}
|
|
1117
|
+
}
|
|
1063
1118
|
/**
|
|
1064
1119
|
* It takes the form, validates it, and then sends it to the GraphQL server
|
|
1065
1120
|
*
|
|
@@ -1067,7 +1122,7 @@ class ModelFormComponent {
|
|
|
1067
1122
|
*/
|
|
1068
1123
|
submit(secret = false) {
|
|
1069
1124
|
return new Promise((resolve, reject) => {
|
|
1070
|
-
var _a, _b, _c, _d;
|
|
1125
|
+
var _a, _b, _c, _d, _e;
|
|
1071
1126
|
if (!secret) {
|
|
1072
1127
|
this.loading = true;
|
|
1073
1128
|
}
|
|
@@ -1092,8 +1147,19 @@ class ModelFormComponent {
|
|
|
1092
1147
|
((_c = this.config[key]) === null || _c === void 0 ? void 0 : _c.exclude)) {
|
|
1093
1148
|
delete data[key];
|
|
1094
1149
|
}
|
|
1150
|
+
if (value && typeof value === 'object' && !Array.isArray(value)) {
|
|
1151
|
+
data[key] = Object.keys(data[key])
|
|
1152
|
+
.filter((k) => data[key][k] != null)
|
|
1153
|
+
.reduce((a, k) => (Object.assign(Object.assign({}, a), { [k]: data[key][k] })), {});
|
|
1154
|
+
if (((_d = Object.keys(data[key])) === null || _d === void 0 ? void 0 : _d.length) === 0) {
|
|
1155
|
+
if (this.logging) {
|
|
1156
|
+
console.log('Object is empty from result');
|
|
1157
|
+
}
|
|
1158
|
+
data[key] = null;
|
|
1159
|
+
}
|
|
1160
|
+
}
|
|
1095
1161
|
// Set type for graphql method
|
|
1096
|
-
if (((
|
|
1162
|
+
if (((_e = this.fields[key]) === null || _e === void 0 ? void 0 : _e.type) === 'Float') {
|
|
1097
1163
|
data[key] = Number(value);
|
|
1098
1164
|
}
|
|
1099
1165
|
}
|
|
@@ -1126,10 +1192,10 @@ class ModelFormComponent {
|
|
|
1126
1192
|
}
|
|
1127
1193
|
}
|
|
1128
1194
|
ModelFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ModelFormComponent, deps: [{ token: i1$1.GraphQLMetaService }, { token: i1$1.GraphQLService }, { token: i1$1.FormsService }, { token: i1$1.AuthService }, { token: i2$1.Router }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
1129
|
-
ModelFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ModelFormComponent, selector: "base-model-form", inputs: { modelName: "modelName", label: "label", id: "id", delete: "delete", duplicate: "duplicate", logging: "logging", config: "config" }, outputs: { finished: "finished" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"w-100\" *ngIf=\"form\">\n <div class=\"d-flex flex-row justify-content-between mt-3\">\n <h2>\n {{ label ? label : capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}\n </h2>\n\n <div>\n <button class=\"btn btn-outline-primary me-2\" *ngIf=\"id && duplicate && !loading\" (click)=\"duplicateObject()\">\n Duplizieren\n </button>\n <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit(false)\" *ngIf=\"!loading\">\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n </button>\n <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n </button>\n </div>\n </div>\n\n <form [formGroup]=\"form\">\n <base-model-form-sub
|
|
1195
|
+
ModelFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ModelFormComponent, selector: "base-model-form", inputs: { modelName: "modelName", label: "label", id: "id", delete: "delete", duplicate: "duplicate", logging: "logging", config: "config" }, outputs: { finished: "finished" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"w-100\" *ngIf=\"form\">\n <div class=\"d-flex flex-row justify-content-between mt-3\">\n <h2 class=\"mb-0\">\n {{ label ? label : capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}\n </h2>\n\n <div class=\"d-flex flex-row align-items-center justify-content-end\">\n <button class=\"btn btn-outline-primary me-2\" *ngIf=\"id && duplicate && !loading\" (click)=\"duplicateObject()\">\n Duplizieren\n </button>\n <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit(false)\" *ngIf=\"!loading\">\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n </button>\n <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n </button>\n </div>\n </div>\n\n <form [formGroup]=\"form\">\n <base-model-form-sub\n [fields]=\"fields\"\n [config]=\"config\"\n [form]=\"form\"\n (imageChanged)=\"imageChanged($event)\"\n ></base-model-form-sub>\n\n <div class=\"d-flex mt-4\" [ngClass]=\"id && delete ? 'justify-content-between' : 'justify-content-end'\">\n <div *ngIf=\"id && delete\">\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteObject()\">L\u00F6schen</button>\n </div>\n <div>\n <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit(false)\" *ngIf=\"!loading\">\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n </button>\n <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n </button>\n </div>\n </div>\n </form>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ModelFormSubComponent, selector: "base-model-form-sub", inputs: ["fields", "form", "config"], outputs: ["imageChanged"] }] });
|
|
1130
1196
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ModelFormComponent, decorators: [{
|
|
1131
1197
|
type: Component,
|
|
1132
|
-
args: [{ selector: 'base-model-form', template: "<div class=\"w-100\" *ngIf=\"form\">\n <div class=\"d-flex flex-row justify-content-between mt-3\">\n <h2>\n {{ label ? label : capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}\n </h2>\n\n <div>\n <button class=\"btn btn-outline-primary me-2\" *ngIf=\"id && duplicate && !loading\" (click)=\"duplicateObject()\">\n Duplizieren\n </button>\n <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit(false)\" *ngIf=\"!loading\">\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n </button>\n <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n </button>\n </div>\n </div>\n\n <form [formGroup]=\"form\">\n <base-model-form-sub
|
|
1198
|
+
args: [{ selector: 'base-model-form', template: "<div class=\"w-100\" *ngIf=\"form\">\n <div class=\"d-flex flex-row justify-content-between mt-3\">\n <h2 class=\"mb-0\">\n {{ label ? label : capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}\n </h2>\n\n <div class=\"d-flex flex-row align-items-center justify-content-end\">\n <button class=\"btn btn-outline-primary me-2\" *ngIf=\"id && duplicate && !loading\" (click)=\"duplicateObject()\">\n Duplizieren\n </button>\n <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit(false)\" *ngIf=\"!loading\">\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n </button>\n <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n </button>\n </div>\n </div>\n\n <form [formGroup]=\"form\">\n <base-model-form-sub\n [fields]=\"fields\"\n [config]=\"config\"\n [form]=\"form\"\n (imageChanged)=\"imageChanged($event)\"\n ></base-model-form-sub>\n\n <div class=\"d-flex mt-4\" [ngClass]=\"id && delete ? 'justify-content-between' : 'justify-content-end'\">\n <div *ngIf=\"id && delete\">\n <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteObject()\">L\u00F6schen</button>\n </div>\n <div>\n <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit(false)\" *ngIf=\"!loading\">\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n </button>\n <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n </button>\n </div>\n </div>\n </form>\n</div>\n" }]
|
|
1133
1199
|
}], ctorParameters: function () { return [{ type: i1$1.GraphQLMetaService }, { type: i1$1.GraphQLService }, { type: i1$1.FormsService }, { type: i1$1.AuthService }, { type: i2$1.Router }, { type: i2$1.ActivatedRoute }]; }, propDecorators: { modelName: [{
|
|
1134
1200
|
type: Input
|
|
1135
1201
|
}], label: [{
|
|
@@ -1217,7 +1283,7 @@ class ModelTableComponent {
|
|
|
1217
1283
|
if ((_c = this.config) === null || _c === void 0 ? void 0 : _c.tableFields) {
|
|
1218
1284
|
this.tableFields = this.config.tableFields;
|
|
1219
1285
|
}
|
|
1220
|
-
const possibleFields = this.meta.getFields(this.queryName);
|
|
1286
|
+
const possibleFields = this.meta.getFields(this.queryName).fields;
|
|
1221
1287
|
const keys = Object.keys(possibleFields);
|
|
1222
1288
|
const tableFieldKeys = Object.keys(this.tableFields);
|
|
1223
1289
|
tableFieldKeys === null || tableFieldKeys === void 0 ? void 0 : tableFieldKeys.forEach((field) => {
|
|
@@ -1294,10 +1360,10 @@ class ModelTableComponent {
|
|
|
1294
1360
|
}
|
|
1295
1361
|
}
|
|
1296
1362
|
ModelTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ModelTableComponent, deps: [{ token: i1$1.GraphQLMetaService }, { token: i1$1.GraphQLService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1297
|
-
ModelTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ModelTableComponent, selector: "base-model-table", inputs: { modelName: "modelName", objectId: "objectId", createMode: "createMode", logging: "logging", create: "create", update: "update", delete: "delete", duplicate: "duplicate", config: "config", fieldConfig: "fieldConfig" }, outputs: { idSelected: "idSelected", createModeChanged: "createModeChanged" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!selectedId && !createMode\">\n <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n <h2 *ngIf=\"modelName\">\n {{ config?.plural ? config?.plural : config?.label ? config?.label : capitalizeFirstLetter(modelName) + 's' }}\n </h2>\n <div class=\"d-flex align-items-center\">\n <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n </div>\n </div>\n <table class=\"table table-hover table-responsive bg-white\">\n <thead>\n <tr>\n <th scope=\"col\" *ngFor=\"let field of availableFields\">\n {{ tableFields[field]?.label ? tableFields[field]?.label : capitalizeFirstLetter(field) }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let object of objects\">\n <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n <ng-container *ngIf=\"tableFields[field]?.dateFormat\">\n {{ object[field] | date: tableFields[field]?.dateFormat }} Uhr\n </ng-container>\n\n <ng-container *ngIf=\"!tableFields[field]?.dateFormat\">\n {{ object[field] }}\n </ng-container>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n <base-model-form\n [modelName]=\"modelName\"\n [label]=\"config?.label\"\n [config]=\"fieldConfig\"\n [logging]=\"logging\"\n [id]=\"selectedId\"\n (finished)=\"selectId('')\"\n [delete]=\"delete\"\n [duplicate]=\"duplicate\"\n ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"], 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: "component", type: ModelFormComponent, selector: "base-model-form", inputs: ["modelName", "label", "id", "delete", "duplicate", "logging", "config"], outputs: ["finished"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
|
|
1363
|
+
ModelTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ModelTableComponent, selector: "base-model-table", inputs: { modelName: "modelName", objectId: "objectId", createMode: "createMode", logging: "logging", create: "create", update: "update", delete: "delete", duplicate: "duplicate", config: "config", fieldConfig: "fieldConfig" }, outputs: { idSelected: "idSelected", createModeChanged: "createModeChanged" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!selectedId && !createMode\">\n <div class=\"w-100 d-flex flex-row justify-content-between align-items-center mb-4\">\n <h2 class=\"mb-0\" *ngIf=\"modelName\">\n {{ config?.plural ? config?.plural : config?.label ? config?.label : capitalizeFirstLetter(modelName) + 's' }}\n </h2>\n <div class=\"d-flex align-items-center\">\n <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n </div>\n </div>\n <table class=\"table table-hover table-responsive bg-white\">\n <thead>\n <tr>\n <th scope=\"col\" *ngFor=\"let field of availableFields\">\n {{ tableFields[field]?.label ? tableFields[field]?.label : capitalizeFirstLetter(field) }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let object of objects\">\n <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n <ng-container *ngIf=\"tableFields[field]?.dateFormat\">\n {{ object[field] | date: tableFields[field]?.dateFormat }} Uhr\n </ng-container>\n\n <ng-container *ngIf=\"!tableFields[field]?.dateFormat\">\n {{ object[field] }}\n </ng-container>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n <base-model-form\n [modelName]=\"modelName\"\n [label]=\"config?.label\"\n [config]=\"fieldConfig\"\n [logging]=\"logging\"\n [id]=\"selectedId\"\n (finished)=\"selectId('')\"\n [delete]=\"delete\"\n [duplicate]=\"duplicate\"\n ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"], 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: "component", type: ModelFormComponent, selector: "base-model-form", inputs: ["modelName", "label", "id", "delete", "duplicate", "logging", "config"], outputs: ["finished"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
|
|
1298
1364
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ModelTableComponent, decorators: [{
|
|
1299
1365
|
type: Component,
|
|
1300
|
-
args: [{ selector: 'base-model-table', template: "<div *ngIf=\"!selectedId && !createMode\">\n <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n <h2 *ngIf=\"modelName\">\n {{ config?.plural ? config?.plural : config?.label ? config?.label : capitalizeFirstLetter(modelName) + 's' }}\n </h2>\n <div class=\"d-flex align-items-center\">\n <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n </div>\n </div>\n <table class=\"table table-hover table-responsive bg-white\">\n <thead>\n <tr>\n <th scope=\"col\" *ngFor=\"let field of availableFields\">\n {{ tableFields[field]?.label ? tableFields[field]?.label : capitalizeFirstLetter(field) }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let object of objects\">\n <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n <ng-container *ngIf=\"tableFields[field]?.dateFormat\">\n {{ object[field] | date: tableFields[field]?.dateFormat }} Uhr\n </ng-container>\n\n <ng-container *ngIf=\"!tableFields[field]?.dateFormat\">\n {{ object[field] }}\n </ng-container>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n <base-model-form\n [modelName]=\"modelName\"\n [label]=\"config?.label\"\n [config]=\"fieldConfig\"\n [logging]=\"logging\"\n [id]=\"selectedId\"\n (finished)=\"selectId('')\"\n [delete]=\"delete\"\n [duplicate]=\"duplicate\"\n ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"] }]
|
|
1366
|
+
args: [{ selector: 'base-model-table', template: "<div *ngIf=\"!selectedId && !createMode\">\n <div class=\"w-100 d-flex flex-row justify-content-between align-items-center mb-4\">\n <h2 class=\"mb-0\" *ngIf=\"modelName\">\n {{ config?.plural ? config?.plural : config?.label ? config?.label : capitalizeFirstLetter(modelName) + 's' }}\n </h2>\n <div class=\"d-flex align-items-center\">\n <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n </div>\n </div>\n <table class=\"table table-hover table-responsive bg-white\">\n <thead>\n <tr>\n <th scope=\"col\" *ngFor=\"let field of availableFields\">\n {{ tableFields[field]?.label ? tableFields[field]?.label : capitalizeFirstLetter(field) }}\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let object of objects\">\n <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n <ng-container *ngIf=\"tableFields[field]?.dateFormat\">\n {{ object[field] | date: tableFields[field]?.dateFormat }} Uhr\n </ng-container>\n\n <ng-container *ngIf=\"!tableFields[field]?.dateFormat\">\n {{ object[field] }}\n </ng-container>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n <base-model-form\n [modelName]=\"modelName\"\n [label]=\"config?.label\"\n [config]=\"fieldConfig\"\n [logging]=\"logging\"\n [id]=\"selectedId\"\n (finished)=\"selectId('')\"\n [delete]=\"delete\"\n [duplicate]=\"duplicate\"\n ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"] }]
|
|
1301
1367
|
}], ctorParameters: function () { return [{ type: i1$1.GraphQLMetaService }, { type: i1$1.GraphQLService }]; }, propDecorators: { modelName: [{
|
|
1302
1368
|
type: Input
|
|
1303
1369
|
}], objectId: [{
|