ngx-material-entity 0.1.1 → 0.1.4
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/CONTRIBUTING.md +7 -1
- package/README.md +536 -328
- package/classes/base.builder.d.ts +35 -0
- package/classes/date.utilities.d.ts +58 -0
- package/classes/entity.model.d.ts +13 -0
- package/classes/{entity-service.class.d.ts → entity.service.d.ts} +35 -20
- package/classes/entity.utilities.d.ts +153 -0
- package/components/confirm-dialog/confirm-dialog-data.builder.d.ts +23 -0
- package/components/confirm-dialog/confirm-dialog-data.d.ts +18 -8
- package/components/confirm-dialog/confirm-dialog.component.d.ts +15 -5
- package/components/get-validation-error-message.function.d.ts +3 -2
- package/components/input/add-array-item-dialog-data.builder.d.ts +20 -0
- package/components/input/add-array-item-dialog-data.d.ts +19 -0
- package/components/input/input.component.d.ts +151 -30
- package/components/input/input.module.d.ts +7 -4
- package/components/table/create-dialog/create-dialog-data.builder.d.ts +21 -0
- package/components/table/create-dialog/create-entity-dialog-data.builder.d.ts +21 -0
- package/components/table/create-dialog/create-entity-dialog-data.d.ts +4 -5
- package/components/table/create-dialog/create-entity-dialog.component.d.ts +21 -8
- package/components/table/edit-dialog/edit-dialog-data.builder.d.ts +24 -0
- package/components/table/edit-dialog/edit-entity-dialog-data.d.ts +7 -8
- package/components/table/edit-dialog/edit-entity-dialog.builder.d.ts +22 -0
- package/components/table/edit-dialog/edit-entity-dialog.component.d.ts +25 -8
- package/components/table/table-data.builder.d.ts +51 -0
- package/components/table/table-data.d.ts +46 -30
- package/components/table/table.component.d.ts +53 -7
- package/components/table/table.module.d.ts +3 -1
- package/decorators/array/array-decorator-internal.data.d.ts +45 -0
- package/decorators/array/array-decorator.data.d.ts +129 -0
- package/decorators/array/array.decorator.d.ts +9 -0
- package/decorators/base/base-property.decorator.d.ts +7 -6
- package/decorators/base/decorator-types.enum.d.ts +12 -9
- package/decorators/base/dropdown-value.interface.d.ts +14 -0
- package/decorators/base/property-decorator-internal.data.d.ts +24 -0
- package/decorators/base/property-decorator.data.d.ts +70 -0
- package/decorators/boolean/boolean-decorator-internal.data.d.ts +25 -0
- package/decorators/boolean/boolean-decorator.data.d.ts +37 -0
- package/decorators/boolean/boolean.decorator.d.ts +8 -0
- package/decorators/date/date-decorator-internal.data.d.ts +44 -0
- package/decorators/date/date-decorator.data.d.ts +129 -0
- package/decorators/number/number-decorator-internal.data.d.ts +20 -0
- package/decorators/number/number-decorator.data.d.ts +36 -0
- package/decorators/number/number.decorator.d.ts +8 -0
- package/decorators/object/object-decorator-internal.data.d.ts +11 -0
- package/decorators/object/object-decorator.data.d.ts +25 -0
- package/decorators/object/object.decorator.d.ts +8 -0
- package/decorators/string/string-decorator-internal.data.d.ts +41 -0
- package/decorators/string/string-decorator.data.d.ts +77 -0
- package/decorators/string/string.decorator.d.ts +8 -0
- package/esm2020/classes/base.builder.mjs +43 -0
- package/esm2020/classes/date.utilities.mjs +138 -0
- package/esm2020/classes/entity.model.mjs +19 -0
- package/esm2020/classes/entity.service.mjs +83 -0
- package/esm2020/classes/entity.utilities.mjs +538 -0
- package/esm2020/components/confirm-dialog/confirm-dialog-data.builder.mjs +44 -0
- package/esm2020/components/confirm-dialog/confirm-dialog-data.mjs +1 -1
- package/esm2020/components/confirm-dialog/confirm-dialog.component.mjs +18 -22
- package/esm2020/components/get-validation-error-message.function.mjs +8 -3
- package/esm2020/components/input/add-array-item-dialog-data.builder.mjs +30 -0
- package/esm2020/components/input/add-array-item-dialog-data.mjs +2 -0
- package/esm2020/components/input/input.component.mjs +240 -36
- package/esm2020/components/input/input.module.mjs +23 -9
- package/esm2020/components/table/create-dialog/create-dialog-data.builder.mjs +32 -0
- package/esm2020/components/table/create-dialog/create-entity-dialog-data.builder.mjs +26 -0
- package/esm2020/components/table/create-dialog/create-entity-dialog-data.mjs +1 -1
- package/esm2020/components/table/create-dialog/create-entity-dialog.component.mjs +31 -31
- package/esm2020/components/table/create-dialog/create-entity-dialog.module.mjs +20 -4
- package/esm2020/components/table/edit-dialog/edit-dialog-data.builder.mjs +41 -0
- package/esm2020/components/table/edit-dialog/edit-entity-dialog-data.mjs +1 -1
- package/esm2020/components/table/edit-dialog/edit-entity-dialog.builder.mjs +27 -0
- package/esm2020/components/table/edit-dialog/edit-entity-dialog.component.mjs +45 -49
- package/esm2020/components/table/table-data.builder.mjs +105 -0
- package/esm2020/components/table/table-data.mjs +1 -1
- package/esm2020/components/table/table.component.mjs +91 -83
- package/esm2020/components/table/table.module.mjs +12 -4
- package/esm2020/decorators/array/array-decorator-internal.data.mjs +51 -0
- package/esm2020/decorators/array/array-decorator.data.mjs +7 -0
- package/esm2020/decorators/array/array.decorator.mjs +24 -0
- package/esm2020/decorators/base/base-property.decorator.mjs +6 -5
- package/esm2020/decorators/base/decorator-types.enum.mjs +4 -1
- package/esm2020/decorators/base/dropdown-value.interface.mjs +2 -0
- package/esm2020/decorators/base/property-decorator-internal.data.mjs +38 -0
- package/esm2020/decorators/base/property-decorator.data.mjs +6 -0
- package/esm2020/decorators/boolean/boolean-decorator-internal.data.mjs +33 -0
- package/esm2020/decorators/boolean/boolean-decorator.data.mjs +7 -0
- package/esm2020/decorators/boolean/boolean.decorator.mjs +21 -0
- package/esm2020/decorators/date/date-decorator-internal.data.mjs +48 -0
- package/esm2020/decorators/date/date-decorator.data.mjs +7 -0
- package/esm2020/decorators/number/number-decorator-internal.data.mjs +23 -0
- package/esm2020/decorators/number/number-decorator.data.mjs +7 -0
- package/esm2020/decorators/number/number.decorator.mjs +18 -0
- package/esm2020/decorators/object/object-decorator-internal.data.mjs +12 -0
- package/esm2020/decorators/object/object-decorator.data.mjs +7 -0
- package/esm2020/decorators/object/object.decorator.mjs +13 -0
- package/esm2020/decorators/string/string-decorator-internal.data.mjs +48 -0
- package/esm2020/decorators/string/string-decorator.data.mjs +7 -0
- package/esm2020/decorators/string/string.decorator.mjs +24 -0
- package/esm2020/public-api.mjs +20 -13
- package/fesm2015/ngx-material-entity.mjs +1664 -944
- package/fesm2015/ngx-material-entity.mjs.map +1 -1
- package/fesm2020/ngx-material-entity.mjs +1667 -941
- package/fesm2020/ngx-material-entity.mjs.map +1 -1
- package/package.json +7 -1
- package/public-api.d.ts +21 -10
- package/classes/entity-model.class.d.ts +0 -9
- package/classes/entity-utilities.class.d.ts +0 -95
- package/components/input/array-table/add-array-item-dialog/add-array-item-dialog.component.d.ts +0 -35
- package/components/input/array-table/add-array-item-dialog/add-array-item-dialog.module.d.ts +0 -12
- package/components/input/array-table/array-table.component.d.ts +0 -34
- package/components/input/array-table/array-table.module.d.ts +0 -19
- package/components/input/internal-input/internal-input.component.d.ts +0 -57
- package/components/input/internal-input/internal-input.module.d.ts +0 -16
- package/decorators/array.decorator.d.ts +0 -125
- package/decorators/base/property-decorator-config.interface.d.ts +0 -50
- package/decorators/boolean.decorator.d.ts +0 -42
- package/decorators/number.decorator.d.ts +0 -40
- package/decorators/object.decorator.d.ts +0 -27
- package/decorators/string.decorator.d.ts +0 -76
- package/esm2020/classes/entity-model.class.mjs +0 -19
- package/esm2020/classes/entity-service.class.mjs +0 -70
- package/esm2020/classes/entity-utilities.class.mjs +0 -296
- package/esm2020/components/input/array-table/add-array-item-dialog/add-array-item-dialog.component.mjs +0 -43
- package/esm2020/components/input/array-table/add-array-item-dialog/add-array-item-dialog.module.mjs +0 -22
- package/esm2020/components/input/array-table/array-table.component.mjs +0 -116
- package/esm2020/components/input/array-table/array-table.module.mjs +0 -66
- package/esm2020/components/input/internal-input/internal-input.component.mjs +0 -73
- package/esm2020/components/input/internal-input/internal-input.module.mjs +0 -54
- package/esm2020/decorators/array.decorator.mjs +0 -70
- package/esm2020/decorators/base/property-decorator-config.interface.mjs +0 -31
- package/esm2020/decorators/boolean.decorator.mjs +0 -44
- package/esm2020/decorators/number.decorator.mjs +0 -36
- package/esm2020/decorators/object.decorator.mjs +0 -23
- package/esm2020/decorators/string.decorator.mjs +0 -61
|
@@ -1,80 +1,51 @@
|
|
|
1
1
|
import 'reflect-metadata';
|
|
2
2
|
import { __decorate, __metadata, __awaiter } from 'tslib';
|
|
3
3
|
import { BehaviorSubject, firstValueFrom, Subject, takeUntil } from 'rxjs';
|
|
4
|
-
import { isEqual, omit, omitBy, isNil
|
|
4
|
+
import { cloneDeep, isEqual, omit, omitBy, isNil } from 'lodash';
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
6
|
import { Component, Inject, NgModule, Input, ViewChild } from '@angular/core';
|
|
7
7
|
import * as i1 from '@angular/material/dialog';
|
|
8
8
|
import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
|
9
|
-
import * as
|
|
9
|
+
import * as i6 from '@angular/material/checkbox';
|
|
10
10
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
11
11
|
import * as i3 from '@angular/material/button';
|
|
12
12
|
import { MatButtonModule } from '@angular/material/button';
|
|
13
|
-
import * as
|
|
13
|
+
import * as i12 from '@angular/common';
|
|
14
14
|
import { CommonModule } from '@angular/common';
|
|
15
|
-
import * as
|
|
15
|
+
import * as i14 from '@angular/forms';
|
|
16
16
|
import { FormsModule } from '@angular/forms';
|
|
17
|
-
import * as
|
|
18
|
-
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
|
19
|
-
import { MatSort } from '@angular/material/sort';
|
|
20
|
-
import * as i4$1 from '@angular/material/table';
|
|
17
|
+
import * as i9 from '@angular/material/table';
|
|
21
18
|
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
|
|
22
19
|
import { SelectionModel } from '@angular/cdk/collections';
|
|
23
|
-
import * as
|
|
20
|
+
import * as i2 from '@angular/material/form-field';
|
|
24
21
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
25
|
-
import * as
|
|
22
|
+
import * as i3$1 from '@angular/material/autocomplete';
|
|
26
23
|
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
|
27
|
-
import * as
|
|
28
|
-
import * as
|
|
24
|
+
import * as i4 from '@angular/material/core';
|
|
25
|
+
import * as i5 from '@angular/material/select';
|
|
29
26
|
import { MatSelectModule } from '@angular/material/select';
|
|
30
|
-
import * as
|
|
27
|
+
import * as i7 from '@angular/material/slide-toggle';
|
|
31
28
|
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
|
|
32
|
-
import * as
|
|
33
|
-
import { MatInputModule } from '@angular/material/input';
|
|
34
|
-
import * as i10 from '@angular/cdk/text-field';
|
|
35
|
-
import * as i8$1 from '@angular/material/chips';
|
|
29
|
+
import * as i10 from '@angular/material/chips';
|
|
36
30
|
import { MatChipsModule } from '@angular/material/chips';
|
|
37
|
-
import * as
|
|
31
|
+
import * as i11 from '@angular/material/datepicker';
|
|
32
|
+
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
33
|
+
import * as i13 from '@angular/material/input';
|
|
34
|
+
import { MatInputModule } from '@angular/material/input';
|
|
35
|
+
import * as i15 from '@angular/cdk/text-field';
|
|
38
36
|
import { MatIconModule } from '@angular/material/icon';
|
|
39
|
-
import * as
|
|
37
|
+
import * as i7$1 from '@angular/material/paginator';
|
|
38
|
+
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
|
39
|
+
import { MatSort } from '@angular/material/sort';
|
|
40
|
+
import * as i4$1 from '@angular/material/menu';
|
|
40
41
|
import { MatMenuModule } from '@angular/material/menu';
|
|
41
42
|
|
|
42
43
|
/**
|
|
43
|
-
* The base
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
* Is used inside the default create and edit dialogs.
|
|
49
|
-
*/
|
|
50
|
-
// lineBreakAfter?: boolean;
|
|
51
|
-
constructor(displayName, display = true, required = true, omitForCreate = false, omitForUpdate = false, defaultWidths = [6, 6, 12], order
|
|
52
|
-
// lineBreakAfter: boolean = false
|
|
53
|
-
) {
|
|
54
|
-
this.displayName = displayName;
|
|
55
|
-
this.display = display;
|
|
56
|
-
this.required = required;
|
|
57
|
-
this.omitForCreate = omitForCreate;
|
|
58
|
-
this.omitForUpdate = omitForUpdate;
|
|
59
|
-
this.defaultWidths = defaultWidths;
|
|
60
|
-
if (order) {
|
|
61
|
-
if (order < 0) {
|
|
62
|
-
throw new Error('order must be at least 0');
|
|
63
|
-
}
|
|
64
|
-
this.order = order;
|
|
65
|
-
}
|
|
66
|
-
else {
|
|
67
|
-
this.order = -1;
|
|
68
|
-
}
|
|
69
|
-
// this.lineBreakAfter = lineBreakAfter;
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* The base decorator for setting metadata on properties
|
|
75
|
-
* @param metadata The metadata to define
|
|
76
|
-
* @param type The type of metadata
|
|
77
|
-
* @returns The function that sets the metadata
|
|
44
|
+
* The base decorator for setting metadata on properties.
|
|
45
|
+
*
|
|
46
|
+
* @param metadata - The metadata to define.
|
|
47
|
+
* @param type - The type of metadata.
|
|
48
|
+
* @returns The method that sets the metadata.
|
|
78
49
|
*/
|
|
79
50
|
function baseProperty(metadata, type) {
|
|
80
51
|
return function (target, propertyKey) {
|
|
@@ -101,68 +72,119 @@ var DecoratorTypes;
|
|
|
101
72
|
DecoratorTypes["ARRAY"] = "array";
|
|
102
73
|
DecoratorTypes["ARRAY_STRING_CHIPS"] = "arrayStringChips";
|
|
103
74
|
DecoratorTypes["ARRAY_STRING_AUTOCOMPLETE_CHIPS"] = "arrayStringAutocompleteChips";
|
|
75
|
+
DecoratorTypes["DATE"] = "date";
|
|
76
|
+
DecoratorTypes["DATE_RANGE"] = "dateRange";
|
|
77
|
+
DecoratorTypes["DATE_TIME"] = "dateTime";
|
|
104
78
|
})(DecoratorTypes || (DecoratorTypes = {}));
|
|
105
79
|
|
|
106
80
|
/**
|
|
107
|
-
*
|
|
108
|
-
* @param metadata The metadata of the string property
|
|
81
|
+
* The internal Position. Sets default values and validates user input.
|
|
109
82
|
*/
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
83
|
+
class PositionInternal {
|
|
84
|
+
constructor(data) {
|
|
85
|
+
this.validateInput(data);
|
|
86
|
+
this.row = (data === null || data === void 0 ? void 0 : data.row) ? data.row : -1;
|
|
87
|
+
this.order = (data === null || data === void 0 ? void 0 : data.order) ? data.order : -1;
|
|
88
|
+
}
|
|
89
|
+
validateInput(data) {
|
|
90
|
+
if (data === null || data === void 0 ? void 0 : data.order) {
|
|
91
|
+
if (data.order < 1) {
|
|
92
|
+
throw new Error('order must be at least 1');
|
|
93
|
+
}
|
|
94
|
+
if (data.order > 12) {
|
|
95
|
+
throw new Error('order cannot be bigger than 12 (the minimum value for a bootstrap column)');
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
if ((data === null || data === void 0 ? void 0 : data.row) && (data.row < 1)) {
|
|
99
|
+
throw new Error('row must be at least 1');
|
|
100
|
+
}
|
|
119
101
|
}
|
|
120
|
-
|
|
121
|
-
|
|
102
|
+
}
|
|
103
|
+
/**
|
|
104
|
+
* The internal PropertyDecoratorConfig. Sets default values.
|
|
105
|
+
*/
|
|
106
|
+
class PropertyDecoratorConfigInternal {
|
|
107
|
+
constructor(data) {
|
|
108
|
+
this.display = data.display != undefined ? data.display : true;
|
|
109
|
+
this.displayName = data.displayName;
|
|
110
|
+
this.required = data.required != undefined ? data.required : true;
|
|
111
|
+
this.omitForCreate = data.omitForCreate != undefined ? data.omitForCreate : false;
|
|
112
|
+
this.omitForUpdate = data.omitForUpdate != undefined ? data.omitForUpdate : false;
|
|
113
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 6, 12];
|
|
114
|
+
this.position = new PositionInternal(data.position);
|
|
122
115
|
}
|
|
123
116
|
}
|
|
117
|
+
|
|
124
118
|
/**
|
|
125
|
-
*
|
|
119
|
+
* The internal DropdownStringDecoratorConfig. Sets default values.
|
|
126
120
|
*/
|
|
127
|
-
class
|
|
121
|
+
class DropdownStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
122
|
+
constructor(data) {
|
|
123
|
+
super(data);
|
|
124
|
+
this.displayStyle = data.displayStyle;
|
|
125
|
+
this.dropdownValues = data.dropdownValues;
|
|
126
|
+
}
|
|
128
127
|
}
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
128
|
+
/**
|
|
129
|
+
* The internal DefaultStringDecoratorConfig. Sets default values.
|
|
130
|
+
*/
|
|
131
|
+
class DefaultStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
132
|
+
constructor(data) {
|
|
133
|
+
super(data);
|
|
134
|
+
this.displayStyle = data.displayStyle;
|
|
135
|
+
this.minLength = data.minLength;
|
|
136
|
+
this.maxLength = data.maxLength;
|
|
137
|
+
this.regex = data.regex;
|
|
134
138
|
}
|
|
135
139
|
}
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
this.
|
|
140
|
+
/**
|
|
141
|
+
* The internal TextboxStringDecoratorConfig. Sets default values.
|
|
142
|
+
*/
|
|
143
|
+
class TextboxStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
144
|
+
constructor(data) {
|
|
145
|
+
super(data);
|
|
146
|
+
this.displayStyle = data.displayStyle;
|
|
147
|
+
this.minLength = data.minLength;
|
|
148
|
+
this.maxLength = data.maxLength;
|
|
143
149
|
}
|
|
144
150
|
}
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
+
/**
|
|
152
|
+
* The internal AutocompleteStringDecoratorConfig. Sets default values.
|
|
153
|
+
*/
|
|
154
|
+
class AutocompleteStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
155
|
+
constructor(data) {
|
|
156
|
+
super(data);
|
|
157
|
+
this.displayStyle = data.displayStyle;
|
|
158
|
+
this.autocompleteValues = data.autocompleteValues;
|
|
159
|
+
this.minLength = data.minLength;
|
|
160
|
+
this.maxLength = data.maxLength;
|
|
161
|
+
this.regex = data.regex;
|
|
151
162
|
}
|
|
152
163
|
}
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
164
|
+
|
|
165
|
+
/**
|
|
166
|
+
* Decorator for setting and getting string Property metadata.
|
|
167
|
+
*
|
|
168
|
+
* @param metadata - The metadata of the string property.
|
|
169
|
+
* @returns The method that defines the metadata.
|
|
170
|
+
*/
|
|
171
|
+
function string(metadata) {
|
|
172
|
+
if (metadata.displayStyle === 'dropdown') {
|
|
173
|
+
return baseProperty(new DropdownStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_DROPDOWN);
|
|
174
|
+
}
|
|
175
|
+
else if (metadata.displayStyle === 'autocomplete') {
|
|
176
|
+
return baseProperty(new AutocompleteStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_AUTOCOMPLETE);
|
|
177
|
+
}
|
|
178
|
+
else if (metadata.displayStyle === 'textbox') {
|
|
179
|
+
return baseProperty(new TextboxStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_TEXTBOX);
|
|
180
|
+
}
|
|
181
|
+
else {
|
|
182
|
+
return baseProperty(new DefaultStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING);
|
|
161
183
|
}
|
|
162
184
|
}
|
|
163
185
|
|
|
164
186
|
/**
|
|
165
|
-
*
|
|
187
|
+
* A base Entity class with a builtin id.
|
|
166
188
|
*/
|
|
167
189
|
class Entity {
|
|
168
190
|
}
|
|
@@ -178,19 +200,157 @@ __decorate([
|
|
|
178
200
|
__metadata("design:type", String)
|
|
179
201
|
], Entity.prototype, "id", void 0);
|
|
180
202
|
|
|
181
|
-
|
|
203
|
+
const DAY_IN_MS = 1000 * 60 * 60 * 24;
|
|
204
|
+
/**
|
|
205
|
+
* Contains Helper Functions for handling date properties.
|
|
206
|
+
*/
|
|
207
|
+
class DateUtilities {
|
|
208
|
+
/**
|
|
209
|
+
* Gets the given value as a date value.
|
|
210
|
+
*
|
|
211
|
+
* @param value - The value to get as a date.
|
|
212
|
+
* @returns The given value as a date.
|
|
213
|
+
*/
|
|
214
|
+
static asDate(value) {
|
|
215
|
+
return value;
|
|
216
|
+
}
|
|
217
|
+
/**
|
|
218
|
+
* Gets the default times used by the DateTime picker when nothing is specified by the user.
|
|
219
|
+
*
|
|
220
|
+
* @param format - The time format. Defaults to 24.
|
|
221
|
+
* @param minuteSteps - The steps from one time value to the next. Defaults to 30.
|
|
222
|
+
* @returns Times in the 24 hour format from 0:00 until 23:30 in 30 minute steps.
|
|
223
|
+
*/
|
|
224
|
+
static getDefaultTimes(format = 24, minuteSteps = 30) {
|
|
225
|
+
const res = [{ displayName: '-', value: undefined }];
|
|
226
|
+
for (let hour = 0; hour < 24; hour++) {
|
|
227
|
+
for (let minute = 0; minute < 60; minute += minuteSteps) {
|
|
228
|
+
res.push(this.getTimeDropdownValue(format, hour, minute));
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
return res;
|
|
232
|
+
}
|
|
233
|
+
static getTimeDropdownValue(format, hour, minute) {
|
|
234
|
+
const displayHour = this.getFormattedHour(format, cloneDeep(hour));
|
|
235
|
+
const displayMinute = this.getFormattedMinute(format, hour, minute);
|
|
236
|
+
return {
|
|
237
|
+
displayName: `${displayHour}:${displayMinute}`,
|
|
238
|
+
value: {
|
|
239
|
+
hours: hour,
|
|
240
|
+
minutes: minute
|
|
241
|
+
}
|
|
242
|
+
};
|
|
243
|
+
}
|
|
244
|
+
static getFormattedHour(format, hour) {
|
|
245
|
+
if (format === 12 && hour > 12) {
|
|
246
|
+
hour -= 12;
|
|
247
|
+
}
|
|
248
|
+
return hour;
|
|
249
|
+
}
|
|
250
|
+
static getFormattedMinute(format, hour, minute) {
|
|
251
|
+
let res = `${minute}`;
|
|
252
|
+
if (format === 12) {
|
|
253
|
+
if (hour > 12) {
|
|
254
|
+
res = `${minute} PM`;
|
|
255
|
+
}
|
|
256
|
+
else {
|
|
257
|
+
res = `${minute} AM`;
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
if (minute.toString().length === 1) {
|
|
261
|
+
res = '0'.concat(res);
|
|
262
|
+
}
|
|
263
|
+
return res;
|
|
264
|
+
}
|
|
265
|
+
/**
|
|
266
|
+
* Gets the Time object from the given date.
|
|
267
|
+
*
|
|
268
|
+
* @param value - The date to get the time object from.
|
|
269
|
+
* @returns The Time object build from the date value.
|
|
270
|
+
*/
|
|
271
|
+
static getTimeFromDate(value) {
|
|
272
|
+
if (!value) {
|
|
273
|
+
return {
|
|
274
|
+
hours: undefined,
|
|
275
|
+
minutes: undefined
|
|
276
|
+
};
|
|
277
|
+
}
|
|
278
|
+
else {
|
|
279
|
+
return {
|
|
280
|
+
hours: new Date(value).getHours(),
|
|
281
|
+
minutes: new Date(value).getMinutes()
|
|
282
|
+
};
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
/**
|
|
286
|
+
* Gets the dates between the two given gates. Does additional filtering based on the provided DateRange metadata.
|
|
287
|
+
*
|
|
288
|
+
* @param startDate - The start date.
|
|
289
|
+
* @param endDate - The end date.
|
|
290
|
+
* @param metadataDateRangeDate - The metadata.
|
|
291
|
+
* @returns All dates between the two provided dates. Includes start and end date.
|
|
292
|
+
*/
|
|
293
|
+
static getDatesBetween(startDate, endDate, metadataDateRangeDate) {
|
|
294
|
+
const res = [];
|
|
295
|
+
while (startDate.getFullYear() < endDate.getFullYear()
|
|
296
|
+
|| startDate.getMonth() < endDate.getMonth()
|
|
297
|
+
|| startDate.getDate() <= endDate.getDate()) {
|
|
298
|
+
res.push(new Date(startDate));
|
|
299
|
+
startDate.setTime(startDate.getTime() + DAY_IN_MS);
|
|
300
|
+
}
|
|
301
|
+
if (metadataDateRangeDate.filter) {
|
|
302
|
+
return res.filter(d => { var _a; return (_a = metadataDateRangeDate.filter) === null || _a === void 0 ? void 0 : _a.call(metadataDateRangeDate, d); });
|
|
303
|
+
}
|
|
304
|
+
else {
|
|
305
|
+
return res;
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
/**
|
|
309
|
+
* Get all valid times for the dropdown of a datetime property.
|
|
310
|
+
*
|
|
311
|
+
* @param date - The date of the datetime.
|
|
312
|
+
* @param times - All given times to filter.
|
|
313
|
+
* @param min - The function that defines the minimum time.
|
|
314
|
+
* @param max - The function that defines the maximum time.
|
|
315
|
+
* @param filter - A filter function to do more specific time filtering. This could be e.g. The removal of lunch breaks.
|
|
316
|
+
* @returns All valid dropdown values for the datetime property.
|
|
317
|
+
*/
|
|
318
|
+
static getValidTimesForDropdown(date, times, min, max, filter) {
|
|
319
|
+
if (min) {
|
|
320
|
+
const minTime = min(date);
|
|
321
|
+
times = times.filter(t => !t.value
|
|
322
|
+
|| t.value.hours > minTime.hours
|
|
323
|
+
|| (t.value.hours === minTime.hours
|
|
324
|
+
&& t.value.minutes >= minTime.minutes));
|
|
325
|
+
}
|
|
326
|
+
if (max) {
|
|
327
|
+
const maxTime = max(date);
|
|
328
|
+
times = times.filter(t => !t.value
|
|
329
|
+
|| t.value.hours < maxTime.hours
|
|
330
|
+
|| (t.value.hours === maxTime.hours
|
|
331
|
+
&& t.value.minutes <= maxTime.minutes));
|
|
332
|
+
}
|
|
333
|
+
if (filter) {
|
|
334
|
+
times = times.filter(t => !t.value || filter(t.value));
|
|
335
|
+
}
|
|
336
|
+
return times;
|
|
337
|
+
}
|
|
338
|
+
}
|
|
339
|
+
|
|
182
340
|
/**
|
|
183
|
-
* Contains HelperMethods around handling Entities and their property-metadata
|
|
341
|
+
* Contains HelperMethods around handling Entities and their property-metadata.
|
|
184
342
|
*/
|
|
185
343
|
class EntityUtilities {
|
|
186
344
|
/**
|
|
187
|
-
* Gets the properties to omit when updating the entity
|
|
188
|
-
*
|
|
345
|
+
* Gets the properties to omit when updating the entity.
|
|
346
|
+
*
|
|
347
|
+
* @param entity - The entity to get the properties which should be left out for updating from.
|
|
348
|
+
* @returns The properties which should be left out for updating an Entity.
|
|
189
349
|
*/
|
|
190
350
|
static getOmitForUpdate(entity) {
|
|
191
351
|
const res = [];
|
|
192
|
-
for (const key of
|
|
193
|
-
const metadata =
|
|
352
|
+
for (const key of EntityUtilities.keysOf(entity)) {
|
|
353
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key);
|
|
194
354
|
if (metadata.omitForUpdate) {
|
|
195
355
|
res.push(key);
|
|
196
356
|
}
|
|
@@ -198,13 +358,15 @@ class EntityUtilities {
|
|
|
198
358
|
return res;
|
|
199
359
|
}
|
|
200
360
|
/**
|
|
201
|
-
* Gets the properties to omit when creating new entities
|
|
202
|
-
*
|
|
361
|
+
* Gets the properties to omit when creating new entities.
|
|
362
|
+
*
|
|
363
|
+
* @param entity - The entity to get the properties which should be left out for creating from.
|
|
364
|
+
* @returns The properties which should be left out for creating a new Entity.
|
|
203
365
|
*/
|
|
204
366
|
static getOmitForCreate(entity) {
|
|
205
367
|
const res = [];
|
|
206
|
-
for (const key of
|
|
207
|
-
const metadata =
|
|
368
|
+
for (const key of EntityUtilities.keysOf(entity)) {
|
|
369
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key);
|
|
208
370
|
if (metadata.omitForCreate) {
|
|
209
371
|
res.push(key);
|
|
210
372
|
}
|
|
@@ -212,11 +374,13 @@ class EntityUtilities {
|
|
|
212
374
|
return res;
|
|
213
375
|
}
|
|
214
376
|
/**
|
|
215
|
-
* Gets the metadata included in an property
|
|
216
|
-
*
|
|
217
|
-
* @param
|
|
218
|
-
* @param
|
|
219
|
-
* @
|
|
377
|
+
* Gets the metadata included in an property.
|
|
378
|
+
*
|
|
379
|
+
* @param entity - The entity with the property to get the metadata from.
|
|
380
|
+
* @param propertyKey - The property on the given Entity to get the metadata from.
|
|
381
|
+
* @param type - For secure Typing, defines the returned PropertyConfig.
|
|
382
|
+
* @returns The metadata of the property.
|
|
383
|
+
* @throws When no metadata can be found for the given property.
|
|
220
384
|
*/
|
|
221
385
|
static getPropertyMetadata(entity, propertyKey,
|
|
222
386
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
@@ -224,143 +388,144 @@ class EntityUtilities {
|
|
|
224
388
|
try {
|
|
225
389
|
const metadata = Reflect.getMetadata('metadata', entity, propertyKey);
|
|
226
390
|
if (!metadata) {
|
|
227
|
-
throw new Error(`Could not find metadata for property ${String(propertyKey)}
|
|
228
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
391
|
+
throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
229
392
|
}
|
|
230
393
|
return metadata;
|
|
231
394
|
}
|
|
232
395
|
catch (error) {
|
|
233
|
-
throw new Error(`Could not find metadata for property ${String(propertyKey)}
|
|
234
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
396
|
+
throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
235
397
|
}
|
|
236
398
|
}
|
|
237
399
|
/**
|
|
238
400
|
* Gets the type of the property-metadata.
|
|
239
|
-
*
|
|
240
|
-
* @param
|
|
241
|
-
* @
|
|
401
|
+
*
|
|
402
|
+
* @param entity - The entity with the property to get the type from.
|
|
403
|
+
* @param propertyKey - The property on the given Entity to get the type from.
|
|
404
|
+
* @returns The type of the metadata.
|
|
405
|
+
* @throws Will throw an error if no metadata can be found for the given property.
|
|
242
406
|
*/
|
|
243
407
|
static getPropertyType(entity, propertyKey) {
|
|
244
408
|
try {
|
|
245
409
|
const propertyType = Reflect.getMetadata('type', entity, propertyKey);
|
|
246
410
|
if (!propertyType) {
|
|
247
|
-
throw new Error(`Could not find type metadata for property ${String(propertyKey)}
|
|
248
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
411
|
+
throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
249
412
|
}
|
|
250
413
|
return propertyType;
|
|
251
414
|
}
|
|
252
415
|
catch (error) {
|
|
253
|
-
throw new Error(`Could not find type metadata for property ${String(propertyKey)}
|
|
254
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
416
|
+
throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
255
417
|
}
|
|
256
418
|
}
|
|
257
419
|
/**
|
|
258
420
|
* Sets all property values based on a given entity data-object.
|
|
259
|
-
*
|
|
260
|
-
* @param target
|
|
261
|
-
*
|
|
262
|
-
* (if called inside a Entity constructor its usually this)
|
|
421
|
+
*
|
|
422
|
+
* @param target - The target object that needs to be constructed (if called inside an Entity constructor its usually this).
|
|
423
|
+
* @param entity - The data object to get the property values from.
|
|
263
424
|
* @alias new
|
|
264
425
|
* @alias build
|
|
265
426
|
* @alias construct
|
|
266
427
|
*/
|
|
267
428
|
static new(target, entity) {
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
429
|
+
for (const key in target) {
|
|
430
|
+
const type = EntityUtilities.getPropertyType(target, key);
|
|
431
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
432
|
+
let value = entity ? Reflect.get(entity, key) : undefined;
|
|
433
|
+
switch (type) {
|
|
434
|
+
case DecoratorTypes.OBJECT:
|
|
435
|
+
const objectMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.OBJECT);
|
|
436
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
|
|
437
|
+
value = new objectMetadata.EntityClass(value);
|
|
438
|
+
break;
|
|
439
|
+
case DecoratorTypes.ARRAY:
|
|
440
|
+
const inputArray = value;
|
|
441
|
+
const resArray = [];
|
|
442
|
+
if (inputArray) {
|
|
443
|
+
const arrayMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.ARRAY);
|
|
444
|
+
for (const item of inputArray) {
|
|
445
|
+
const itemWithMetadata = new arrayMetadata.EntityClass(item);
|
|
446
|
+
resArray.push(itemWithMetadata);
|
|
447
|
+
}
|
|
448
|
+
}
|
|
449
|
+
value = resArray;
|
|
450
|
+
break;
|
|
451
|
+
default:
|
|
452
|
+
break;
|
|
271
453
|
}
|
|
454
|
+
Reflect.set(target, key, value);
|
|
272
455
|
}
|
|
273
456
|
}
|
|
274
457
|
/**
|
|
275
458
|
* Checks if the values on an entity are valid.
|
|
276
|
-
* Also checks all the validators given by the metadata ("required", "maxLength" etc.)
|
|
277
|
-
*
|
|
278
|
-
* @param
|
|
459
|
+
* Also checks all the validators given by the metadata ("required", "maxLength" etc.).
|
|
460
|
+
*
|
|
461
|
+
* @param entity - The entity to validate.
|
|
462
|
+
* @param omit - Whether to check for creating or editing validity.
|
|
279
463
|
* @returns Whether or not the entity is valid.
|
|
280
464
|
*/
|
|
281
465
|
static isEntityValid(entity, omit) {
|
|
282
466
|
for (const key in entity) {
|
|
283
|
-
if (!
|
|
467
|
+
if (!EntityUtilities.isPropertyValid(entity, key, omit)) {
|
|
284
468
|
return false;
|
|
285
469
|
}
|
|
286
470
|
}
|
|
287
471
|
return true;
|
|
288
472
|
}
|
|
289
473
|
/**
|
|
290
|
-
* Checks if a single property value is valid
|
|
291
|
-
*
|
|
292
|
-
* @param
|
|
293
|
-
* @
|
|
474
|
+
* Checks if a single property value is valid.
|
|
475
|
+
*
|
|
476
|
+
* @param entity - The entity where the property is from.
|
|
477
|
+
* @param key - The name of the property.
|
|
478
|
+
* @param omit - Whether to check if the given entity is valid for creation or updating.
|
|
479
|
+
* @returns Whether or not the property value is valid.
|
|
480
|
+
* @throws Throws when it extracts an unknown metadata type.
|
|
294
481
|
*/
|
|
295
482
|
static isPropertyValid(entity, key, omit) {
|
|
296
|
-
const type =
|
|
297
|
-
const metadata =
|
|
298
|
-
const metadataDefaultString = metadata;
|
|
299
|
-
const metadataTextboxString = metadata;
|
|
300
|
-
const metadataAutocompleteString = metadata;
|
|
301
|
-
const metadataDefaultNumber = metadata;
|
|
302
|
-
const objectProperty = entity[key];
|
|
303
|
-
const metadataEntityArray = metadata;
|
|
304
|
-
const arrayItems = entity[key];
|
|
483
|
+
const type = EntityUtilities.getPropertyType(entity, key);
|
|
484
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key, type);
|
|
305
485
|
if (metadata.omitForCreate && omit === 'create') {
|
|
306
486
|
return true;
|
|
307
487
|
}
|
|
308
|
-
if (metadata.omitForUpdate && omit === '
|
|
488
|
+
if (metadata.omitForUpdate && omit === 'update') {
|
|
309
489
|
return true;
|
|
310
490
|
}
|
|
311
491
|
if (metadata.required && !entity[key]) {
|
|
312
492
|
return false;
|
|
313
493
|
}
|
|
314
494
|
switch (type) {
|
|
495
|
+
case DecoratorTypes.BOOLEAN_DROPDOWN:
|
|
496
|
+
case DecoratorTypes.BOOLEAN_CHECKBOX:
|
|
497
|
+
case DecoratorTypes.BOOLEAN_TOGGLE:
|
|
498
|
+
return true;
|
|
499
|
+
case DecoratorTypes.STRING_DROPDOWN:
|
|
500
|
+
return true;
|
|
315
501
|
case DecoratorTypes.STRING:
|
|
316
|
-
if (metadataDefaultString.maxLength
|
|
317
|
-
&& entity[key].length > metadataDefaultString.maxLength) {
|
|
318
|
-
return false;
|
|
319
|
-
}
|
|
320
|
-
if (metadataDefaultString.minLength
|
|
321
|
-
&& entity[key].length < metadataDefaultString.minLength) {
|
|
322
|
-
return false;
|
|
323
|
-
}
|
|
324
|
-
if (metadataDefaultString.regex
|
|
325
|
-
&& !entity[key].match(metadataDefaultString.regex)) {
|
|
326
|
-
return false;
|
|
327
|
-
}
|
|
328
|
-
break;
|
|
329
502
|
case DecoratorTypes.STRING_AUTOCOMPLETE:
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
}
|
|
334
|
-
if (metadataAutocompleteString.minLength
|
|
335
|
-
&& entity[key].length < metadataAutocompleteString.minLength) {
|
|
336
|
-
return false;
|
|
337
|
-
}
|
|
338
|
-
if (metadataAutocompleteString.regex
|
|
339
|
-
&& entity[key].match(metadataAutocompleteString.regex)) {
|
|
503
|
+
const entityString = entity[key];
|
|
504
|
+
const stringMetadata = metadata;
|
|
505
|
+
if (!this.isStringValid(entityString, stringMetadata)) {
|
|
340
506
|
return false;
|
|
341
507
|
}
|
|
342
508
|
break;
|
|
343
509
|
case DecoratorTypes.STRING_TEXTBOX:
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
}
|
|
348
|
-
if (metadataTextboxString.minLength
|
|
349
|
-
&& entity[key].length < metadataTextboxString.minLength) {
|
|
510
|
+
const entityTextbox = entity[key];
|
|
511
|
+
const textboxMetadata = metadata;
|
|
512
|
+
if (!this.isTextboxValid(entityTextbox, textboxMetadata)) {
|
|
350
513
|
return false;
|
|
351
514
|
}
|
|
352
515
|
break;
|
|
516
|
+
case DecoratorTypes.NUMBER_DROPDOWN:
|
|
517
|
+
return true;
|
|
353
518
|
case DecoratorTypes.NUMBER:
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
if (metadataDefaultNumber.min && entity[key] > metadataDefaultNumber.min) {
|
|
519
|
+
const entityNumber = entity[key];
|
|
520
|
+
const numberMetadata = metadata;
|
|
521
|
+
if (!this.isNumberValid(entityNumber, numberMetadata)) {
|
|
358
522
|
return false;
|
|
359
523
|
}
|
|
360
524
|
break;
|
|
361
525
|
case DecoratorTypes.OBJECT:
|
|
362
|
-
|
|
363
|
-
|
|
526
|
+
const entityObject = entity[key];
|
|
527
|
+
for (const parameterKey in entityObject) {
|
|
528
|
+
if (!EntityUtilities.isPropertyValid(entityObject, parameterKey, omit)) {
|
|
364
529
|
return false;
|
|
365
530
|
}
|
|
366
531
|
}
|
|
@@ -368,7 +533,30 @@ class EntityUtilities {
|
|
|
368
533
|
case DecoratorTypes.ARRAY_STRING_CHIPS:
|
|
369
534
|
case DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS:
|
|
370
535
|
case DecoratorTypes.ARRAY:
|
|
371
|
-
|
|
536
|
+
const entityArray = entity[key];
|
|
537
|
+
const arrayMetadata = metadata;
|
|
538
|
+
if (arrayMetadata.required && !entityArray.length) {
|
|
539
|
+
return false;
|
|
540
|
+
}
|
|
541
|
+
break;
|
|
542
|
+
case DecoratorTypes.DATE:
|
|
543
|
+
const entityDate = new Date(entity[key]);
|
|
544
|
+
const dateMetadata = metadata;
|
|
545
|
+
if (!this.isDateValid(entityDate, dateMetadata)) {
|
|
546
|
+
return false;
|
|
547
|
+
}
|
|
548
|
+
break;
|
|
549
|
+
case DecoratorTypes.DATE_RANGE:
|
|
550
|
+
const entityDateRange = cloneDeep(entity[key]);
|
|
551
|
+
const dateRangeMetadata = metadata;
|
|
552
|
+
if (!this.isDateRangeValid(entityDateRange, dateRangeMetadata)) {
|
|
553
|
+
return false;
|
|
554
|
+
}
|
|
555
|
+
break;
|
|
556
|
+
case DecoratorTypes.DATE_TIME:
|
|
557
|
+
const entityDateTime = new Date(entity[key]);
|
|
558
|
+
const dateTimeMetadata = metadata;
|
|
559
|
+
if (!this.isDateTimeValid(entityDateTime, dateTimeMetadata)) {
|
|
372
560
|
return false;
|
|
373
561
|
}
|
|
374
562
|
break;
|
|
@@ -377,100 +565,312 @@ class EntityUtilities {
|
|
|
377
565
|
}
|
|
378
566
|
return true;
|
|
379
567
|
}
|
|
568
|
+
static isStringValid(value, metadata) {
|
|
569
|
+
if (metadata.maxLength && value.length > metadata.maxLength) {
|
|
570
|
+
return false;
|
|
571
|
+
}
|
|
572
|
+
if (metadata.minLength && value.length < metadata.minLength) {
|
|
573
|
+
return false;
|
|
574
|
+
}
|
|
575
|
+
if (metadata.regex && !value.match(metadata.regex)) {
|
|
576
|
+
return false;
|
|
577
|
+
}
|
|
578
|
+
return true;
|
|
579
|
+
}
|
|
580
|
+
static isTextboxValid(value, metadata) {
|
|
581
|
+
if (metadata.maxLength && value.length > metadata.maxLength) {
|
|
582
|
+
return false;
|
|
583
|
+
}
|
|
584
|
+
if (metadata.minLength && value.length < metadata.minLength) {
|
|
585
|
+
return false;
|
|
586
|
+
}
|
|
587
|
+
return true;
|
|
588
|
+
}
|
|
589
|
+
static isNumberValid(value, metadata) {
|
|
590
|
+
if (metadata.max && value > metadata.max) {
|
|
591
|
+
return false;
|
|
592
|
+
}
|
|
593
|
+
if (metadata.min && value < metadata.min) {
|
|
594
|
+
return false;
|
|
595
|
+
}
|
|
596
|
+
return true;
|
|
597
|
+
}
|
|
598
|
+
static isDateValid(value, metadata) {
|
|
599
|
+
if (metadata.min && value.getTime() < metadata.min(value).getTime()) {
|
|
600
|
+
return false;
|
|
601
|
+
}
|
|
602
|
+
if (metadata.max && value.getTime() > metadata.max(value).getTime()) {
|
|
603
|
+
return false;
|
|
604
|
+
}
|
|
605
|
+
if (metadata.filter && !metadata.filter(value)) {
|
|
606
|
+
return false;
|
|
607
|
+
}
|
|
608
|
+
return true;
|
|
609
|
+
}
|
|
610
|
+
static isDateRangeValid(value, metadata) {
|
|
611
|
+
if (metadata.required && (!value.start || !value.end)) {
|
|
612
|
+
return false;
|
|
613
|
+
}
|
|
614
|
+
value.start = new Date(value.start);
|
|
615
|
+
value.end = new Date(value.end);
|
|
616
|
+
if (metadata.minStart && value.start.getTime() < metadata.minStart(value.start).getTime()) {
|
|
617
|
+
return false;
|
|
618
|
+
}
|
|
619
|
+
if (metadata.maxStart && value.start.getTime() > metadata.maxStart(value.start).getTime()) {
|
|
620
|
+
return false;
|
|
621
|
+
}
|
|
622
|
+
if (metadata.minEnd && value.end.getTime() < metadata.minEnd(value.end).getTime()) {
|
|
623
|
+
return false;
|
|
624
|
+
}
|
|
625
|
+
if (metadata.maxEnd && value.end.getTime() > metadata.maxEnd(value.end).getTime()) {
|
|
626
|
+
return false;
|
|
627
|
+
}
|
|
628
|
+
if (metadata.filter) {
|
|
629
|
+
if (!metadata.filter(value.start)) {
|
|
630
|
+
return false;
|
|
631
|
+
}
|
|
632
|
+
if (!metadata.filter(value.end)) {
|
|
633
|
+
return false;
|
|
634
|
+
}
|
|
635
|
+
if (value.values) {
|
|
636
|
+
for (const date of value.values) {
|
|
637
|
+
if (!metadata.filter(date)) {
|
|
638
|
+
return false;
|
|
639
|
+
}
|
|
640
|
+
}
|
|
641
|
+
}
|
|
642
|
+
}
|
|
643
|
+
return true;
|
|
644
|
+
}
|
|
645
|
+
static isDateTimeValid(value, metadata) {
|
|
646
|
+
if (metadata.minDate && value.getTime() < metadata.minDate(value).getTime()) {
|
|
647
|
+
return false;
|
|
648
|
+
}
|
|
649
|
+
if (metadata.maxDate && value.getTime() > metadata.maxDate(value).getTime()) {
|
|
650
|
+
return false;
|
|
651
|
+
}
|
|
652
|
+
if (metadata.filterDate && !metadata.filterDate(value)) {
|
|
653
|
+
return false;
|
|
654
|
+
}
|
|
655
|
+
const time = {
|
|
656
|
+
hours: value.getHours(),
|
|
657
|
+
minutes: value.getMinutes()
|
|
658
|
+
};
|
|
659
|
+
if (metadata.minTime) {
|
|
660
|
+
const minTime = metadata.minTime(value);
|
|
661
|
+
if (!(time.hours > minTime.hours
|
|
662
|
+
|| (time.hours === minTime.hours
|
|
663
|
+
&& time.minutes >= minTime.minutes))) {
|
|
664
|
+
return false;
|
|
665
|
+
}
|
|
666
|
+
}
|
|
667
|
+
if (metadata.maxTime) {
|
|
668
|
+
const maxTime = metadata.maxTime(value);
|
|
669
|
+
if (!(time.hours < maxTime.hours
|
|
670
|
+
|| (time.hours === maxTime.hours
|
|
671
|
+
&& time.minutes <= maxTime.minutes))) {
|
|
672
|
+
return false;
|
|
673
|
+
}
|
|
674
|
+
}
|
|
675
|
+
if (metadata.filterTime) {
|
|
676
|
+
if (!metadata.filterTime(time)) {
|
|
677
|
+
return false;
|
|
678
|
+
}
|
|
679
|
+
}
|
|
680
|
+
return true;
|
|
681
|
+
}
|
|
380
682
|
/**
|
|
381
|
-
* Checks if an entity is "dirty" (if its values have changed)
|
|
382
|
-
*
|
|
383
|
-
* @param
|
|
384
|
-
* @
|
|
683
|
+
* Checks if an entity is "dirty" (if its values have changed).
|
|
684
|
+
*
|
|
685
|
+
* @param entity - The entity after all changes.
|
|
686
|
+
* @param entityPriorChanges - The entity before the changes.
|
|
687
|
+
* @returns Whether or not the entity is dirty.
|
|
385
688
|
*/
|
|
386
689
|
static dirty(entity, entityPriorChanges) {
|
|
387
690
|
if (!entityPriorChanges) {
|
|
388
691
|
return false;
|
|
389
692
|
}
|
|
390
693
|
else {
|
|
391
|
-
const
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
694
|
+
const differences = this.differencesForDirty(entity, entityPriorChanges);
|
|
695
|
+
return differences.length ? true : false;
|
|
696
|
+
}
|
|
697
|
+
}
|
|
698
|
+
static differencesForDirty(entity, entityPriorChanges) {
|
|
699
|
+
const res = [];
|
|
700
|
+
for (const key in entity) {
|
|
701
|
+
if (!this.isEqual(entity[key], entityPriorChanges[key], EntityUtilities.getPropertyMetadata(entity, key))) {
|
|
702
|
+
res.push({
|
|
703
|
+
key: key,
|
|
704
|
+
before: entityPriorChanges[key],
|
|
705
|
+
after: entity[key]
|
|
706
|
+
});
|
|
397
707
|
}
|
|
398
708
|
}
|
|
709
|
+
return res;
|
|
399
710
|
}
|
|
400
711
|
/**
|
|
401
|
-
* Compares two Entities and returns their difference in an object
|
|
402
|
-
*
|
|
403
|
-
* @param
|
|
404
|
-
* @
|
|
712
|
+
* Compares two Entities and returns their difference in an object.
|
|
713
|
+
*
|
|
714
|
+
* @param entity - The first entity to compare.
|
|
715
|
+
* @param entityPriorChanges - The second entity to compare.
|
|
716
|
+
* @returns The difference between the two Entities in form of a Partial.
|
|
405
717
|
*/
|
|
406
718
|
static difference(entity, entityPriorChanges) {
|
|
407
719
|
const res = {};
|
|
408
720
|
for (const key in entity) {
|
|
409
|
-
if (!isEqual(entity[key], entityPriorChanges[key])) {
|
|
721
|
+
if (!this.isEqual(entity[key], entityPriorChanges[key], EntityUtilities.getPropertyMetadata(entity, key))) {
|
|
410
722
|
res[key] = entity[key];
|
|
411
723
|
}
|
|
412
724
|
}
|
|
413
725
|
return res;
|
|
414
726
|
}
|
|
727
|
+
static isEqual(value, valuePriorChanges, metadata) {
|
|
728
|
+
if (this.isDateRange(value) && this.isDateRange(valuePriorChanges)) {
|
|
729
|
+
const dateRange = cloneDeep(value);
|
|
730
|
+
dateRange.start = new Date(value.start);
|
|
731
|
+
dateRange.end = new Date(value.end);
|
|
732
|
+
dateRange.values = DateUtilities.getDatesBetween(dateRange.start, dateRange.end, metadata);
|
|
733
|
+
const dateRangePriorChanges = cloneDeep(valuePriorChanges);
|
|
734
|
+
dateRangePriorChanges.start = new Date(valuePriorChanges.start);
|
|
735
|
+
dateRangePriorChanges.end = new Date(valuePriorChanges.end);
|
|
736
|
+
dateRangePriorChanges.values = DateUtilities.getDatesBetween(dateRangePriorChanges.start, dateRangePriorChanges.end, metadata);
|
|
737
|
+
return isEqual(dateRange, dateRangePriorChanges);
|
|
738
|
+
}
|
|
739
|
+
if (metadata.displayStyle === 'date') {
|
|
740
|
+
const date = new Date(DateUtilities.asDate(value));
|
|
741
|
+
const datePriorChanges = new Date(DateUtilities.asDate(valuePriorChanges));
|
|
742
|
+
date.setHours(0, 0, 0, 0);
|
|
743
|
+
datePriorChanges.setHours(0, 0, 0, 0);
|
|
744
|
+
return isEqual(date, datePriorChanges);
|
|
745
|
+
}
|
|
746
|
+
return isEqual(value, valuePriorChanges);
|
|
747
|
+
}
|
|
748
|
+
static isDateRange(value) {
|
|
749
|
+
const dateRange = value;
|
|
750
|
+
if (dateRange.start && dateRange.end) {
|
|
751
|
+
try {
|
|
752
|
+
new Date(dateRange.start);
|
|
753
|
+
new Date(dateRange.end);
|
|
754
|
+
return true;
|
|
755
|
+
}
|
|
756
|
+
catch (error) { }
|
|
757
|
+
;
|
|
758
|
+
}
|
|
759
|
+
return false;
|
|
760
|
+
}
|
|
415
761
|
/**
|
|
416
|
-
*
|
|
417
|
-
*
|
|
418
|
-
* @param
|
|
419
|
-
* @param
|
|
762
|
+
* Compare function for sorting entity keys by their order value.
|
|
763
|
+
*
|
|
764
|
+
* @param a - First key of entity.
|
|
765
|
+
* @param b - Second key of entity.
|
|
766
|
+
* @param entity - Current entity (used to get metadata of entity keys).
|
|
767
|
+
* @returns 0 if both values have the same order, a negative value if 'a' comes before 'b', a positive value if 'a' comes behind 'b'.
|
|
420
768
|
*/
|
|
421
769
|
static compareOrder(a, b, entity) {
|
|
422
|
-
const metadataA = EntityUtilities.getPropertyMetadata(entity, a
|
|
423
|
-
const metadataB = EntityUtilities.getPropertyMetadata(entity, b
|
|
424
|
-
if (metadataA.order === -1) {
|
|
770
|
+
const metadataA = EntityUtilities.getPropertyMetadata(entity, a);
|
|
771
|
+
const metadataB = EntityUtilities.getPropertyMetadata(entity, b);
|
|
772
|
+
if (metadataA.position.order === -1) {
|
|
773
|
+
if (metadataB.position.order === -1) {
|
|
774
|
+
return 0;
|
|
775
|
+
}
|
|
425
776
|
return 1;
|
|
426
777
|
}
|
|
427
|
-
else if (metadataB.order === -1) {
|
|
428
|
-
return
|
|
778
|
+
else if (metadataB.position.order === -1) {
|
|
779
|
+
return -1;
|
|
429
780
|
}
|
|
430
|
-
return (metadataA.order - metadataB.order);
|
|
781
|
+
return ((metadataA.position.order) - (metadataB.position.order));
|
|
431
782
|
}
|
|
432
783
|
/**
|
|
433
|
-
*
|
|
434
|
-
*
|
|
435
|
-
* @param
|
|
436
|
-
* @param
|
|
437
|
-
* @
|
|
784
|
+
* Gets the bootstrap column values for "lg", "md", "sm".
|
|
785
|
+
*
|
|
786
|
+
* @param entity - Entity to get the bootstrap column values of the key.
|
|
787
|
+
* @param key - Key of the property to get bootstrap column values from.
|
|
788
|
+
* @param type - Defines for which screen size the column values should be returned.
|
|
789
|
+
* @returns Bootstrap column value.
|
|
438
790
|
*/
|
|
439
791
|
static getWidth(entity, key, type) {
|
|
440
|
-
const
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
case 'sm':
|
|
449
|
-
return metadata.defaultWidths[2];
|
|
450
|
-
default:
|
|
451
|
-
throw new Error('Something went wrong getting the width');
|
|
452
|
-
}
|
|
453
|
-
}
|
|
454
|
-
else {
|
|
455
|
-
throw new Error('Something went wrong getting the width');
|
|
792
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key);
|
|
793
|
+
switch (type) {
|
|
794
|
+
case 'lg':
|
|
795
|
+
return metadata.defaultWidths[0];
|
|
796
|
+
case 'md':
|
|
797
|
+
return metadata.defaultWidths[1];
|
|
798
|
+
case 'sm':
|
|
799
|
+
return metadata.defaultWidths[2];
|
|
456
800
|
}
|
|
457
801
|
}
|
|
458
802
|
/**
|
|
459
|
-
* Resets all changes on an entity
|
|
460
|
-
*
|
|
461
|
-
* @param
|
|
803
|
+
* Resets all changes on an entity.
|
|
804
|
+
*
|
|
805
|
+
* @param entity - The entity to reset.
|
|
806
|
+
* @param entityPriorChanges - The entity before any changes.
|
|
462
807
|
*/
|
|
463
808
|
static resetChangesOnEntity(entity, entityPriorChanges) {
|
|
464
809
|
for (const key in entityPriorChanges) {
|
|
465
810
|
Reflect.set(entity, key, Reflect.get(entityPriorChanges, key));
|
|
466
811
|
}
|
|
467
812
|
}
|
|
813
|
+
/**
|
|
814
|
+
* Gets the rows that are used to display the given entity.
|
|
815
|
+
*
|
|
816
|
+
* @param entity - The entity to get the rows from.
|
|
817
|
+
* @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
|
|
818
|
+
* @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
|
|
819
|
+
* @returns The sorted Rows containing the row number and the keys to display in that row.
|
|
820
|
+
*/
|
|
821
|
+
static getEntityRows(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
|
|
822
|
+
const res = [];
|
|
823
|
+
const keys = EntityUtilities.keysOf(entity, hideOmitForCreate, hideOmitForEdit);
|
|
824
|
+
const numberOfRows = this.getNumberOfRows(keys, entity);
|
|
825
|
+
for (let i = 1; i <= numberOfRows; i++) {
|
|
826
|
+
const row = {
|
|
827
|
+
row: i,
|
|
828
|
+
keys: this.getKeysForRow(keys, entity, i)
|
|
829
|
+
};
|
|
830
|
+
res.push(row);
|
|
831
|
+
}
|
|
832
|
+
const lastRow = {
|
|
833
|
+
row: numberOfRows + 1,
|
|
834
|
+
keys: this.getKeysForRow(keys, entity, -1)
|
|
835
|
+
};
|
|
836
|
+
res.push(lastRow);
|
|
837
|
+
return res;
|
|
838
|
+
}
|
|
839
|
+
static getKeysForRow(keys, entity, i) {
|
|
840
|
+
return keys
|
|
841
|
+
.filter(k => EntityUtilities.getPropertyMetadata(entity, k).position.row === i)
|
|
842
|
+
.sort((a, b) => EntityUtilities.compareOrder(a, b, entity));
|
|
843
|
+
}
|
|
844
|
+
static getNumberOfRows(keys, entity) {
|
|
845
|
+
return keys
|
|
846
|
+
.map(k => EntityUtilities.getPropertyMetadata(entity, k).position.row)
|
|
847
|
+
.sort((a, b) => (a > b ? -1 : 1))[0];
|
|
848
|
+
}
|
|
849
|
+
/**
|
|
850
|
+
* Gets the keys of the provided entity correctly typed.
|
|
851
|
+
*
|
|
852
|
+
* @param entity - The entity to get the keys of.
|
|
853
|
+
* @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
|
|
854
|
+
* @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
|
|
855
|
+
* @returns An array of keys of the entity.
|
|
856
|
+
*/
|
|
857
|
+
static keysOf(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
|
|
858
|
+
let keys = Reflect.ownKeys(entity);
|
|
859
|
+
if (hideOmitForCreate) {
|
|
860
|
+
const omitForCreateKeys = EntityUtilities.getOmitForCreate(entity);
|
|
861
|
+
keys = keys.filter(k => !omitForCreateKeys.includes(k));
|
|
862
|
+
}
|
|
863
|
+
if (hideOmitForEdit) {
|
|
864
|
+
const omitForUpdateKeys = EntityUtilities.getOmitForUpdate(entity);
|
|
865
|
+
keys = keys.filter(k => !omitForUpdateKeys.includes(k));
|
|
866
|
+
}
|
|
867
|
+
return keys;
|
|
868
|
+
}
|
|
468
869
|
}
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
EntityUtilities.build = _a.new;
|
|
870
|
+
// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
|
|
871
|
+
EntityUtilities.construct = EntityUtilities.new;
|
|
872
|
+
// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
|
|
873
|
+
EntityUtilities.build = EntityUtilities.new;
|
|
474
874
|
|
|
475
875
|
/**
|
|
476
876
|
* A generic EntityService class.
|
|
@@ -482,22 +882,31 @@ class EntityService {
|
|
|
482
882
|
constructor(http) {
|
|
483
883
|
this.http = http;
|
|
484
884
|
/**
|
|
485
|
-
*
|
|
885
|
+
* The key which holds the id value.
|
|
886
|
+
*
|
|
887
|
+
* @default 'id'
|
|
888
|
+
*/
|
|
889
|
+
this.idKey = 'id';
|
|
890
|
+
/**
|
|
891
|
+
* A subject of all the entity values.
|
|
486
892
|
* Can be subscribed to when you want to do a specific thing whenever the entities change.
|
|
487
893
|
*/
|
|
488
894
|
this.entitiesSubject = new BehaviorSubject([]);
|
|
489
895
|
}
|
|
490
896
|
/**
|
|
491
|
-
*
|
|
897
|
+
* Gets the entities in an array from the internal entitiesSubject.
|
|
898
|
+
*
|
|
899
|
+
* @returns The current entities in form of an array.
|
|
492
900
|
*/
|
|
493
901
|
get entities() {
|
|
494
902
|
return this.entitiesSubject.value;
|
|
495
903
|
}
|
|
496
904
|
/**
|
|
497
|
-
* Creates a new Entity and pushes it to the entities array
|
|
498
|
-
*
|
|
905
|
+
* Creates a new Entity and pushes it to the entities array.
|
|
906
|
+
*
|
|
907
|
+
* @param entity - The data of the entity to create.
|
|
499
908
|
* All values that should be omitted will be removed from it inside this method.
|
|
500
|
-
* @returns A Promise of the created entity
|
|
909
|
+
* @returns A Promise of the created entity.
|
|
501
910
|
*/
|
|
502
911
|
create(entity) {
|
|
503
912
|
return __awaiter(this, void 0, void 0, function* () {
|
|
@@ -509,8 +918,9 @@ class EntityService {
|
|
|
509
918
|
});
|
|
510
919
|
}
|
|
511
920
|
/**
|
|
512
|
-
* Gets all existing entities and pushes them to the
|
|
513
|
-
*
|
|
921
|
+
* Gets all existing entities and pushes them to the entities array.
|
|
922
|
+
*
|
|
923
|
+
* @returns A Promise of all received Entities.
|
|
514
924
|
*/
|
|
515
925
|
read() {
|
|
516
926
|
return __awaiter(this, void 0, void 0, function* () {
|
|
@@ -520,71 +930,155 @@ class EntityService {
|
|
|
520
930
|
});
|
|
521
931
|
}
|
|
522
932
|
/**
|
|
523
|
-
* Updates a specific Entity
|
|
524
|
-
*
|
|
933
|
+
* Updates a specific Entity.
|
|
934
|
+
*
|
|
935
|
+
* @param entity - The updated Entity
|
|
525
936
|
* All values that should be omitted will be removed from it inside this method.
|
|
526
|
-
* @param entityPriorChanges The current Entity.
|
|
527
|
-
* It Is used to get changed values and only update them instead of sending the whole entity data
|
|
937
|
+
* @param entityPriorChanges - The current Entity.
|
|
938
|
+
* It Is used to get changed values and only update them instead of sending the whole entity data.
|
|
528
939
|
*/
|
|
529
940
|
update(entity, entityPriorChanges) {
|
|
530
941
|
return __awaiter(this, void 0, void 0, function* () {
|
|
531
942
|
const reqBody = omit(EntityUtilities.difference(entity, entityPriorChanges), EntityUtilities.getOmitForUpdate(entity));
|
|
532
|
-
const updatedEntity = yield firstValueFrom(this.http.patch(`${this.baseUrl}/${entityPriorChanges.
|
|
533
|
-
this.entities[this.entities.findIndex(
|
|
943
|
+
const updatedEntity = yield firstValueFrom(this.http.patch(`${this.baseUrl}/${entityPriorChanges[this.idKey]}`, omitBy(reqBody, isNil)));
|
|
944
|
+
this.entities[this.entities.findIndex(e => e[this.idKey] === entityPriorChanges[this.idKey])] = updatedEntity;
|
|
534
945
|
this.entitiesSubject.next(this.entities);
|
|
535
946
|
});
|
|
536
947
|
}
|
|
537
948
|
/**
|
|
538
|
-
*
|
|
539
|
-
*
|
|
949
|
+
* Deletes a specific Entity.
|
|
950
|
+
*
|
|
951
|
+
* @param entity - The entity to delete.
|
|
540
952
|
*/
|
|
541
|
-
delete(
|
|
953
|
+
delete(entity) {
|
|
542
954
|
return __awaiter(this, void 0, void 0, function* () {
|
|
543
|
-
yield firstValueFrom(this.http.delete(`${this.baseUrl}/${
|
|
544
|
-
|
|
955
|
+
yield firstValueFrom(this.http.delete(`${this.baseUrl}/${entity[this.idKey]}`));
|
|
956
|
+
// the == comparison instead of === is to catch ids that are numbers.
|
|
957
|
+
this.entities.splice(this.entities.findIndex(e => e[this.idKey] === entity[this.idKey]), 1);
|
|
545
958
|
this.entitiesSubject.next(this.entities);
|
|
546
959
|
});
|
|
547
960
|
}
|
|
548
961
|
}
|
|
549
962
|
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
this.
|
|
963
|
+
/**
|
|
964
|
+
* The abstract BaseBuilder class.
|
|
965
|
+
*/
|
|
966
|
+
class BaseBuilder {
|
|
967
|
+
constructor(data) {
|
|
968
|
+
this.validateInput(data);
|
|
969
|
+
this.inputData = data;
|
|
970
|
+
this.data = this.generateBaseData(data);
|
|
971
|
+
return this;
|
|
558
972
|
}
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
973
|
+
/**
|
|
974
|
+
* Used to validate the user input in the constructor.
|
|
975
|
+
*
|
|
976
|
+
* @param data - The user input.
|
|
977
|
+
*/
|
|
978
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
979
|
+
validateInput(data) {
|
|
980
|
+
// By default, no validation is done
|
|
981
|
+
}
|
|
982
|
+
;
|
|
983
|
+
/**
|
|
984
|
+
* Sets the value for the given key if no user value was provided.
|
|
985
|
+
*
|
|
986
|
+
* @param key - The key to set the default value for.
|
|
987
|
+
* @param value - The value to set when nothing was provided.
|
|
988
|
+
* @returns The Builder.
|
|
989
|
+
*/
|
|
990
|
+
withDefault(key, value) {
|
|
991
|
+
if (!this.inputData || !this.inputData[key]) {
|
|
992
|
+
this.data[key] = value;
|
|
573
993
|
}
|
|
574
|
-
this
|
|
994
|
+
return this;
|
|
575
995
|
}
|
|
576
|
-
|
|
577
|
-
|
|
996
|
+
/**
|
|
997
|
+
* Method used to get the final build value after applying all chaining.
|
|
998
|
+
*
|
|
999
|
+
* @returns The build value.
|
|
1000
|
+
*/
|
|
1001
|
+
getResult() {
|
|
1002
|
+
return this.data;
|
|
1003
|
+
}
|
|
1004
|
+
}
|
|
1005
|
+
|
|
1006
|
+
/**
|
|
1007
|
+
* The internal ConfirmDialogData. Requires all default values the user can leave out.
|
|
1008
|
+
*/
|
|
1009
|
+
class ConfirmDialogDataInternal {
|
|
1010
|
+
constructor(text, type, confirmButtonLabel, cancelButtonLabel, title, requireConfirmation, confirmationText) {
|
|
1011
|
+
this.text = text;
|
|
1012
|
+
this.type = type;
|
|
1013
|
+
this.confirmButtonLabel = confirmButtonLabel;
|
|
1014
|
+
this.cancelButtonLabel = cancelButtonLabel;
|
|
1015
|
+
this.title = title;
|
|
1016
|
+
this.requireConfirmation = requireConfirmation;
|
|
1017
|
+
this.confirmationText = confirmationText;
|
|
578
1018
|
}
|
|
1019
|
+
}
|
|
1020
|
+
/**
|
|
1021
|
+
* The Builder for the ConfirmDialogData. Sets default values.
|
|
1022
|
+
*/
|
|
1023
|
+
class ConfirmDialogDataBuilder extends BaseBuilder {
|
|
1024
|
+
constructor(data) {
|
|
1025
|
+
super(data);
|
|
1026
|
+
}
|
|
1027
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1028
|
+
generateBaseData(data) {
|
|
1029
|
+
return new ConfirmDialogDataInternal((data === null || data === void 0 ? void 0 : data.text) ? data.text : ['Do you really want to do this?'], (data === null || data === void 0 ? void 0 : data.type) ? data.type : 'default', (data === null || data === void 0 ? void 0 : data.confirmButtonLabel) ? data.confirmButtonLabel : 'Confirm', (data === null || data === void 0 ? void 0 : data.cancelButtonLabel) ? data.cancelButtonLabel : 'Cancel', (data === null || data === void 0 ? void 0 : data.title) ? data.title : 'Confirmation', (data === null || data === void 0 ? void 0 : data.requireConfirmation) ? data.requireConfirmation : false, data === null || data === void 0 ? void 0 : data.confirmationText);
|
|
1030
|
+
}
|
|
1031
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1032
|
+
validateInput(data) {
|
|
1033
|
+
if (!data) {
|
|
1034
|
+
return;
|
|
1035
|
+
}
|
|
1036
|
+
if (data.requireConfirmation && !data.confirmationText) {
|
|
1037
|
+
throw new Error(`Missing required Input data "confirmationText".
|
|
1038
|
+
You can only omit this value when "requireConfirmation" is false.`);
|
|
1039
|
+
}
|
|
1040
|
+
if (!data.requireConfirmation && data.confirmationText) {
|
|
1041
|
+
throw new Error('The "confirmationText" will never be shown because "requireConfirmation" is not set to true');
|
|
1042
|
+
}
|
|
1043
|
+
if (data.type === 'info-only' && data.cancelButtonLabel) {
|
|
1044
|
+
throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
|
|
1045
|
+
}
|
|
1046
|
+
}
|
|
1047
|
+
}
|
|
1048
|
+
|
|
1049
|
+
/**
|
|
1050
|
+
* The Dialog used whenever confirmation by the user is required (e.g. When the user tries to delete an entity).
|
|
1051
|
+
*
|
|
1052
|
+
* Can be customized with the MAT_DIALOG_DATA "inputData". Customization options are defined in "ConfirmDialogData".
|
|
1053
|
+
*/
|
|
1054
|
+
class NgxMatEntityConfirmDialogComponent {
|
|
1055
|
+
constructor(dialogRef, inputData) {
|
|
1056
|
+
this.dialogRef = dialogRef;
|
|
1057
|
+
this.inputData = inputData;
|
|
1058
|
+
this.confirm = false;
|
|
1059
|
+
}
|
|
1060
|
+
ngOnInit() {
|
|
1061
|
+
this.data = new ConfirmDialogDataBuilder(this.inputData).getResult();
|
|
1062
|
+
this.dialogRef.disableClose = true;
|
|
1063
|
+
}
|
|
1064
|
+
/**
|
|
1065
|
+
* Closes the dialog with value 1 to signal that the action should be run.
|
|
1066
|
+
*/
|
|
1067
|
+
confirmAction() {
|
|
1068
|
+
this.dialogRef.close(1);
|
|
1069
|
+
}
|
|
1070
|
+
/**
|
|
1071
|
+
* Closes the dialog.
|
|
1072
|
+
*/
|
|
579
1073
|
cancel() {
|
|
580
1074
|
this.dialogRef.close();
|
|
581
1075
|
}
|
|
582
1076
|
}
|
|
583
1077
|
NgxMatEntityConfirmDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityConfirmDialogComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
584
|
-
NgxMatEntityConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityConfirmDialogComponent, selector: "ngx-mat-entity-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel
|
|
1078
|
+
NgxMatEntityConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityConfirmDialogComponent, selector: "ngx-mat-entity-confirm-dialog", ngImport: i0, template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
585
1079
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityConfirmDialogComponent, decorators: [{
|
|
586
1080
|
type: Component,
|
|
587
|
-
args: [{ selector: 'ngx-mat-entity-confirm-dialog', template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel
|
|
1081
|
+
args: [{ selector: 'ngx-mat-entity-confirm-dialog', template: "<h2 mat-dialog-title *ngIf=\"data.title\">{{data.title}}</h2>\n\n<mat-dialog-content>\n <p *ngFor=\"let paragraph of data.text\">{{paragraph}}</p>\n <div *ngIf=\"data.requireConfirmation\" class=\"checkbox-wrapper\">\n <mat-checkbox [(ngModel)]=\"confirm\" name=\"confirm\">\n {{data.confirmationText}}\n </mat-checkbox>\n </div>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button *ngIf=\"data.type === 'delete'\" mat-raised-button color=\"warn\" (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button *ngIf=\"data.type !== 'delete'\" mat-raised-button (click)=\"confirmAction()\" [disabled]=\"data.requireConfirmation && !confirm\" class=\"confirm-button\">\n {{data.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: [".checkbox-wrapper{min-height:50px;display:flex}.checkbox-wrapper>mat-checkbox{align-self:center}mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
|
|
588
1082
|
}], ctorParameters: function () {
|
|
589
1083
|
return [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
|
|
590
1084
|
type: Inject,
|
|
@@ -608,8 +1102,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
608
1102
|
|
|
609
1103
|
/**
|
|
610
1104
|
* Generates a default error message for most validation errors.
|
|
611
|
-
*
|
|
612
|
-
* @
|
|
1105
|
+
*
|
|
1106
|
+
* @param model - The ngModel to get the error from.
|
|
1107
|
+
* @returns The Validation Error Message to display.
|
|
613
1108
|
*/
|
|
614
1109
|
function getValidationErrorMessage(model) {
|
|
615
1110
|
if (model.hasError('matDatepickerParse')) {
|
|
@@ -633,214 +1128,95 @@ function getValidationErrorMessage(model) {
|
|
|
633
1128
|
else if (model.hasError('required')) {
|
|
634
1129
|
return 'required';
|
|
635
1130
|
}
|
|
1131
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
1132
|
+
else if (model.hasError('pattern') && model.getError('pattern').requiredPattern === '^true$') {
|
|
1133
|
+
return 'needs to be selected';
|
|
1134
|
+
}
|
|
636
1135
|
else {
|
|
637
1136
|
return 'invalid input';
|
|
638
1137
|
}
|
|
639
1138
|
}
|
|
640
1139
|
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
}
|
|
652
|
-
ngOnInit() {
|
|
653
|
-
if (!this.entity) {
|
|
654
|
-
throw new Error('Missing required Input data "entity"');
|
|
655
|
-
}
|
|
656
|
-
if (!this.propertyKey) {
|
|
657
|
-
throw new Error('Missing required Input data "propertyKey"');
|
|
658
|
-
}
|
|
659
|
-
this.type = EntityUtilities.getPropertyType(this.entity, this.propertyKey);
|
|
660
|
-
this.metadata = EntityUtilities.getPropertyMetadata(this.entity, this.propertyKey, this.type);
|
|
661
|
-
this.metadataDefaultString = this.metadata;
|
|
662
|
-
this.metadataTextboxString = this.metadata;
|
|
663
|
-
this.metadataAutocompleteString = this.metadata;
|
|
664
|
-
this.metadataDropdownString = this.metadata;
|
|
665
|
-
this.metadataDropdownBoolean = this.metadata;
|
|
666
|
-
this.metadataDefaultNumber = this.metadata;
|
|
667
|
-
this.metadataDropdownNumber = this.metadata;
|
|
668
|
-
this.metadataDefaultObject = this.metadata;
|
|
669
|
-
this.objectProperty = this.entity[this.propertyKey];
|
|
670
|
-
}
|
|
671
|
-
getObjectProperties() {
|
|
672
|
-
const res = [];
|
|
673
|
-
for (const property in this.objectProperty) {
|
|
674
|
-
const metadata = EntityUtilities.getPropertyMetadata(this.objectProperty, property, EntityUtilities.getPropertyType(this.objectProperty, property));
|
|
675
|
-
if (!(this.hideOmitForCreate && metadata.omitForCreate)
|
|
676
|
-
&& !(this.hideOmitForEdit && metadata.omitForUpdate)) {
|
|
677
|
-
res.push(property);
|
|
678
|
-
}
|
|
679
|
-
}
|
|
680
|
-
return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
|
|
1140
|
+
/**
|
|
1141
|
+
* The internal CreateDialogData. Requires all default values the user can leave out.
|
|
1142
|
+
*/
|
|
1143
|
+
class CreateDialogDataInternal {
|
|
1144
|
+
constructor(title, createButtonLabel, cancelButtonLabel, createRequiresConfirmDialog, confirmCreateDialogData) {
|
|
1145
|
+
this.title = title;
|
|
1146
|
+
this.createButtonLabel = createButtonLabel;
|
|
1147
|
+
this.cancelButtonLabel = cancelButtonLabel;
|
|
1148
|
+
this.createRequiresConfirmDialog = createRequiresConfirmDialog;
|
|
1149
|
+
this.confirmCreateDialogData = confirmCreateDialogData;
|
|
681
1150
|
}
|
|
682
1151
|
}
|
|
683
|
-
|
|
684
|
-
NgxMatEntityInternalInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: { entity: "entity", propertyKey: "propertyKey", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit", getValidationErrorMessage: "getValidationErrorMessage" }, ngImport: i0, template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of metadataAutocompleteString.autocompleteValues\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i12.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i12.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i12.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1$1.MatError, selector: "mat-error", inputs: ["id"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i12.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i12.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i7.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
}] } });
|
|
699
|
-
|
|
700
|
-
class NgxMatEntityAddArrayItemDialogComponent {
|
|
701
|
-
constructor(data, dialogRef) {
|
|
702
|
-
this.data = data;
|
|
703
|
-
this.dialogRef = dialogRef;
|
|
704
|
-
this.EntityUtilities = EntityUtilities;
|
|
705
|
-
this.getWidth = EntityUtilities.getWidth;
|
|
706
|
-
}
|
|
707
|
-
ngOnInit() {
|
|
708
|
-
this.dialogRef.disableClose = true;
|
|
709
|
-
this.setEntityKeys();
|
|
710
|
-
}
|
|
711
|
-
setEntityKeys() {
|
|
712
|
-
this.entityKeys = Reflect.ownKeys(this.data.entity);
|
|
713
|
-
const omitCreateKeys = EntityUtilities.getOmitForCreate(this.data.entity);
|
|
714
|
-
this.entityKeys = this.entityKeys.filter((k) => !omitCreateKeys.includes(k))
|
|
715
|
-
.sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
|
|
716
|
-
}
|
|
717
|
-
create() {
|
|
718
|
-
this.dialogRef.close(1);
|
|
719
|
-
}
|
|
720
|
-
cancel() {
|
|
721
|
-
this.dialogRef.close();
|
|
1152
|
+
/**
|
|
1153
|
+
* The Builder for the CreateDialogData. Sets default values.
|
|
1154
|
+
*/
|
|
1155
|
+
class CreateDialogDataBuilder extends BaseBuilder {
|
|
1156
|
+
constructor(data) {
|
|
1157
|
+
super(data);
|
|
1158
|
+
}
|
|
1159
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1160
|
+
generateBaseData(data) {
|
|
1161
|
+
const confirmCreateDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmCreateDialogData)
|
|
1162
|
+
.withDefault('confirmButtonLabel', 'create')
|
|
1163
|
+
.withDefault('text', ['Do you really want to create this entity?'])
|
|
1164
|
+
.withDefault('title', 'Create')
|
|
1165
|
+
.getResult();
|
|
1166
|
+
return new CreateDialogDataInternal((data === null || data === void 0 ? void 0 : data.title) ? data.title : 'Create', (data === null || data === void 0 ? void 0 : data.createButtonLabel) ? data.createButtonLabel : 'Create', (data === null || data === void 0 ? void 0 : data.cancelButtonLabel) ? data.cancelButtonLabel : 'Cancel', (data === null || data === void 0 ? void 0 : data.createRequiresConfirmDialog) ? data.createRequiresConfirmDialog : false, confirmCreateDialogData);
|
|
722
1167
|
}
|
|
723
1168
|
}
|
|
724
|
-
NgxMatEntityAddArrayItemDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
725
|
-
NgxMatEntityAddArrayItemDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityAddArrayItemDialogComponent, selector: "ngx-mat-entity-add-array-item-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"data.getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel ? data.createDialogData.createButtonLabel : 'Add'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i12.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i12.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i12.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
726
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogComponent, decorators: [{
|
|
727
|
-
type: Component,
|
|
728
|
-
args: [{ selector: 'ngx-mat-entity-add-array-item-dialog', template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of entityKeys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"data.getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel ? data.createDialogData.createButtonLabel : 'Add'}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel ? data.createDialogData.cancelButtonLabel : 'Cancel'}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
|
|
729
|
-
}], ctorParameters: function () {
|
|
730
|
-
return [{ type: undefined, decorators: [{
|
|
731
|
-
type: Inject,
|
|
732
|
-
args: [MAT_DIALOG_DATA]
|
|
733
|
-
}] }, { type: i1.MatDialogRef }];
|
|
734
|
-
} });
|
|
735
1169
|
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
this.
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
return index;
|
|
745
|
-
}
|
|
746
|
-
ngOnInit() {
|
|
747
|
-
this.validateInput();
|
|
748
|
-
const givenDisplayColumns = this.metadata.displayColumns.map((v) => v.displayName);
|
|
749
|
-
if (givenDisplayColumns.find((s) => s === 'select')) {
|
|
750
|
-
throw new Error(`The name "select" for a display column is reserved.
|
|
751
|
-
Please choose a different name.`);
|
|
752
|
-
}
|
|
753
|
-
this.displayedColumns = ['select'].concat(givenDisplayColumns);
|
|
754
|
-
this.dataSource = new MatTableDataSource();
|
|
755
|
-
this.dataSource.data = this.arrayItems;
|
|
756
|
-
this.arrayItem = new this.metadata.EntityClass();
|
|
757
|
-
this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
|
|
758
|
-
}
|
|
759
|
-
validateInput() {
|
|
760
|
-
if (!this.metadata.createInline && !this.metadata.createDialogData) {
|
|
761
|
-
throw new Error(`Missing required Input data "createDialogData".
|
|
762
|
-
You can only omit this value when the creation is inline.`);
|
|
763
|
-
}
|
|
764
|
-
}
|
|
765
|
-
add() {
|
|
766
|
-
if (this.metadata.createInline) {
|
|
767
|
-
this.arrayItems.push(cloneDeep(this.arrayItem));
|
|
768
|
-
this.dataSource.data = this.arrayItems;
|
|
769
|
-
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
770
|
-
}
|
|
771
|
-
else {
|
|
772
|
-
const dialogData = {
|
|
773
|
-
entity: this.arrayItem,
|
|
774
|
-
createDialogData: this.metadata.createDialogData,
|
|
775
|
-
getValidationErrorMessage: this.getValidationErrorMessage
|
|
776
|
-
};
|
|
777
|
-
firstValueFrom(this.dialog.open(NgxMatEntityAddArrayItemDialogComponent, {
|
|
778
|
-
data: dialogData,
|
|
779
|
-
autoFocus: false,
|
|
780
|
-
restoreFocus: false
|
|
781
|
-
}).afterClosed()).then((res) => {
|
|
782
|
-
if (res === 1) {
|
|
783
|
-
this.arrayItems.push(cloneDeep(this.arrayItem));
|
|
784
|
-
this.dataSource.data = this.arrayItems;
|
|
785
|
-
}
|
|
786
|
-
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
787
|
-
});
|
|
788
|
-
}
|
|
789
|
-
}
|
|
790
|
-
remove() {
|
|
791
|
-
this.selection.selected.forEach(s => {
|
|
792
|
-
this.arrayItems.splice(this.arrayItems.indexOf(s), 1);
|
|
793
|
-
});
|
|
794
|
-
this.dataSource.data = this.arrayItems;
|
|
795
|
-
this.selection.clear();
|
|
796
|
-
}
|
|
797
|
-
getObjectProperties() {
|
|
798
|
-
const res = [];
|
|
799
|
-
for (const property in this.arrayItem) {
|
|
800
|
-
const metadata = EntityUtilities.getPropertyMetadata(this.arrayItem, property, EntityUtilities.getPropertyType(this.arrayItem, property));
|
|
801
|
-
if (!(metadata.omitForCreate)) {
|
|
802
|
-
res.push(property);
|
|
803
|
-
}
|
|
804
|
-
}
|
|
805
|
-
return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.arrayItem));
|
|
806
|
-
}
|
|
807
|
-
masterToggle() {
|
|
808
|
-
if (this.isAllSelected()) {
|
|
809
|
-
this.selection.clear();
|
|
810
|
-
}
|
|
811
|
-
else {
|
|
812
|
-
this.dataSource.data.forEach((row) => this.selection.select(row));
|
|
813
|
-
}
|
|
1170
|
+
/**
|
|
1171
|
+
* The internal AddArrayItemDialogData. Requires all default values the user can leave out.
|
|
1172
|
+
*/
|
|
1173
|
+
class AddArrayItemDialogDataInternal {
|
|
1174
|
+
constructor(entity, createDialogData, getValidationErrorMessage) {
|
|
1175
|
+
this.entity = entity;
|
|
1176
|
+
this.createDialogData = createDialogData;
|
|
1177
|
+
this.getValidationErrorMessage = getValidationErrorMessage;
|
|
814
1178
|
}
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
1179
|
+
}
|
|
1180
|
+
/**
|
|
1181
|
+
* The Builder for the AddArrayItemDialogData. Sets default values.
|
|
1182
|
+
*/
|
|
1183
|
+
class AddArrayItemDialogDataBuilder extends BaseBuilder {
|
|
1184
|
+
constructor(data) {
|
|
1185
|
+
super(data);
|
|
1186
|
+
}
|
|
1187
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1188
|
+
generateBaseData(data) {
|
|
1189
|
+
const createDialogData = new CreateDialogDataBuilder(data.createDialogData)
|
|
1190
|
+
.withDefault('createButtonLabel', 'Add')
|
|
1191
|
+
.withDefault('title', 'Add to array')
|
|
1192
|
+
.getResult();
|
|
1193
|
+
return new AddArrayItemDialogDataInternal(data.entity, createDialogData, data.getValidationErrorMessage ? data.getValidationErrorMessage : getValidationErrorMessage);
|
|
819
1194
|
}
|
|
820
1195
|
}
|
|
821
|
-
NgxMatEntityArrayTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
822
|
-
NgxMatEntityArrayTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityArrayTableComponent, selector: "ngx-mat-entity-array-table", inputs: { arrayItems: "arrayItems", metadata: "metadata", getValidationErrorMessage: "getValidationErrorMessage", omit: "omit" }, ngImport: i0, template: "<div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadata.displayName}}</b>\n </div>\n <div class=\"row\" *ngIf=\"metadata.createInline\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadata.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n Add\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n Remove\n </button>\n </div>\n\n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadata.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <div class=\"array-error\" *ngIf=\"metadata.required && !dataSource.data.length\">\n {{metadata.missingErrorMessage ? metadata.missingErrorMessage : 'Needs to have at least one value'}}\n </div>\n</div>", styles: [".buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.mat-column-select{flex:0 0 75px}.array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.5px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"], components: [{ type: NgxMatEntityInternalInputComponent, selector: "ngx-mat-entity-internal-input", inputs: ["entity", "propertyKey", "hideOmitForCreate", "hideOmitForEdit", "getValidationErrorMessage"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i4$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i4$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i4$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i4$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i4$1.MatCellDef, selector: "[matCellDef]" }, { type: i4$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i4$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i4$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
|
|
823
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, decorators: [{
|
|
824
|
-
type: Component,
|
|
825
|
-
args: [{ selector: 'ngx-mat-entity-array-table', template: "<div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadata.displayName}}</b>\n </div>\n <div class=\"row\" *ngIf=\"metadata.createInline\">\n <ngx-mat-entity-internal-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-internal-input>\n </div>\n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadata.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n Add\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n Remove\n </button>\n </div>\n\n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadata.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <div class=\"array-error\" *ngIf=\"metadata.required && !dataSource.data.length\">\n {{metadata.missingErrorMessage ? metadata.missingErrorMessage : 'Needs to have at least one value'}}\n </div>\n</div>", styles: [".buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.mat-column-select{flex:0 0 75px}.array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.5px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}\n"] }]
|
|
826
|
-
}], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { arrayItems: [{
|
|
827
|
-
type: Input
|
|
828
|
-
}], metadata: [{
|
|
829
|
-
type: Input
|
|
830
|
-
}], getValidationErrorMessage: [{
|
|
831
|
-
type: Input
|
|
832
|
-
}], omit: [{
|
|
833
|
-
type: Input
|
|
834
|
-
}] } });
|
|
835
1196
|
|
|
1197
|
+
/**
|
|
1198
|
+
* The default input component. It gets the metadata of the property from the given @Input "entity" and @Input "propertyKey"
|
|
1199
|
+
* and displays the input field accordingly.
|
|
1200
|
+
*
|
|
1201
|
+
* You can also define a method that generates error-messages and if the input should be hidden when its metadata says
|
|
1202
|
+
* that it should be omitted for creating or updating.
|
|
1203
|
+
* The last part being mostly relevant if you want to use this component inside an ngFor.
|
|
1204
|
+
*/
|
|
836
1205
|
class NgxMatEntityInputComponent {
|
|
837
|
-
constructor() {
|
|
1206
|
+
constructor(dialog) {
|
|
1207
|
+
this.dialog = dialog;
|
|
838
1208
|
this.chipsInput = '';
|
|
1209
|
+
this.selection = new SelectionModel(true, []);
|
|
839
1210
|
this.DecoratorTypes = DecoratorTypes;
|
|
840
|
-
this.
|
|
1211
|
+
this.EntityUtilities = EntityUtilities;
|
|
1212
|
+
this.DateUtilities = DateUtilities;
|
|
1213
|
+
this.defaultDateFilter = () => true;
|
|
841
1214
|
}
|
|
842
1215
|
/**
|
|
843
|
-
*
|
|
1216
|
+
* This is needed for the inputs to work inside an ngFor.
|
|
1217
|
+
*
|
|
1218
|
+
* @param index - The index of the element in the ngFor.
|
|
1219
|
+
* @returns The index.
|
|
844
1220
|
*/
|
|
845
1221
|
trackByFn(index) {
|
|
846
1222
|
return index;
|
|
@@ -862,12 +1238,19 @@ class NgxMatEntityInputComponent {
|
|
|
862
1238
|
this.filteredAutocompleteStrings = cloneDeep(this.autocompleteStrings);
|
|
863
1239
|
this.metadataDropdownString = this.metadata;
|
|
864
1240
|
this.metadataDropdownBoolean = this.metadata;
|
|
1241
|
+
if ((this.type === DecoratorTypes.BOOLEAN_CHECKBOX || this.type === DecoratorTypes.BOOLEAN_TOGGLE)
|
|
1242
|
+
&& this.entity[this.propertyKey] === undefined) {
|
|
1243
|
+
this.entity[this.propertyKey] = false;
|
|
1244
|
+
}
|
|
865
1245
|
this.metadataDefaultNumber = this.metadata;
|
|
866
1246
|
this.metadataDropdownNumber = this.metadata;
|
|
867
1247
|
this.metadataDefaultObject = this.metadata;
|
|
868
1248
|
this.objectProperty = this.entity[this.propertyKey];
|
|
1249
|
+
if (this.type === DecoratorTypes.OBJECT) {
|
|
1250
|
+
this.objectPropertyRows = EntityUtilities.getEntityRows(this.objectProperty, this.hideOmitForCreate, this.hideOmitForEdit);
|
|
1251
|
+
}
|
|
869
1252
|
this.metadataEntityArray = this.metadata;
|
|
870
|
-
if (this.
|
|
1253
|
+
if (this.type === DecoratorTypes.ARRAY) {
|
|
871
1254
|
if (!this.entity[this.propertyKey]) {
|
|
872
1255
|
this.entity[this.propertyKey] = [];
|
|
873
1256
|
}
|
|
@@ -880,9 +1263,27 @@ class NgxMatEntityInputComponent {
|
|
|
880
1263
|
title: 'Add'
|
|
881
1264
|
};
|
|
882
1265
|
}
|
|
1266
|
+
const givenDisplayColumns = this.metadataEntityArray.displayColumns.map((v) => v.displayName);
|
|
1267
|
+
if (givenDisplayColumns.find(s => s === 'select')) {
|
|
1268
|
+
throw new Error(`The name "select" for a display column is reserved.
|
|
1269
|
+
Please choose a different name.`);
|
|
1270
|
+
}
|
|
1271
|
+
this.displayedColumns = ['select'].concat(givenDisplayColumns);
|
|
1272
|
+
this.dataSource = new MatTableDataSource();
|
|
1273
|
+
this.dataSource.data = this.entityArrayValues;
|
|
1274
|
+
this.arrayItem = new this.metadataEntityArray.EntityClass();
|
|
1275
|
+
this.arrayItemInlineRows = EntityUtilities.getEntityRows(this.arrayItem, this.hideOmitForCreate === false ? false : true, this.hideOmitForEdit ? true : false);
|
|
1276
|
+
this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
|
|
1277
|
+
this.dialogInputData = {
|
|
1278
|
+
entity: this.arrayItem,
|
|
1279
|
+
createDialogData: this.metadataEntityArray.createDialogData,
|
|
1280
|
+
getValidationErrorMessage: this.getValidationErrorMessage
|
|
1281
|
+
};
|
|
1282
|
+
this.dialogData = new AddArrayItemDialogDataBuilder(this.dialogInputData).getResult();
|
|
1283
|
+
this.arrayItemDialogRows = EntityUtilities.getEntityRows(this.dialogData.entity, true);
|
|
883
1284
|
}
|
|
884
1285
|
this.metadataStringChipsArray = this.metadata;
|
|
885
|
-
if (this.
|
|
1286
|
+
if ((this.type === DecoratorTypes.ARRAY_STRING_CHIPS || this.type === DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS)
|
|
886
1287
|
&& ((_a = this.entity[this.propertyKey]) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
887
1288
|
this.stringChipsArrayValues = this.entity[this.propertyKey];
|
|
888
1289
|
}
|
|
@@ -890,18 +1291,150 @@ class NgxMatEntityInputComponent {
|
|
|
890
1291
|
if (!this.getValidationErrorMessage) {
|
|
891
1292
|
this.getValidationErrorMessage = getValidationErrorMessage;
|
|
892
1293
|
}
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
if (!
|
|
899
|
-
|
|
900
|
-
|
|
1294
|
+
this.metadataDefaultDate = this.metadata;
|
|
1295
|
+
this.metadataDateRangeDate = this.metadata;
|
|
1296
|
+
this.metadataDateTimeDate = this.metadata;
|
|
1297
|
+
if (this.type === DecoratorTypes.DATE_RANGE) {
|
|
1298
|
+
this.dateRange = cloneDeep(this.entity[this.propertyKey]);
|
|
1299
|
+
if (!this.dateRange) {
|
|
1300
|
+
this.dateRange = {
|
|
1301
|
+
start: undefined,
|
|
1302
|
+
end: undefined,
|
|
1303
|
+
values: undefined
|
|
1304
|
+
};
|
|
1305
|
+
}
|
|
1306
|
+
this.dateRangeStart = new Date(this.dateRange.start);
|
|
1307
|
+
this.dateRangeEnd = new Date(this.dateRange.end);
|
|
1308
|
+
this.setDateRangeValues();
|
|
1309
|
+
}
|
|
1310
|
+
if (this.type === DecoratorTypes.DATE_TIME) {
|
|
1311
|
+
this.time = DateUtilities.getTimeFromDate(DateUtilities.asDate(this.entity[this.propertyKey]));
|
|
1312
|
+
this.timeDropdownValues = this.metadataDateTimeDate.times;
|
|
1313
|
+
if (this.entity[this.propertyKey]) {
|
|
1314
|
+
this.dateTime = new Date(this.entity[this.propertyKey]);
|
|
901
1315
|
}
|
|
902
1316
|
}
|
|
903
|
-
return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
|
|
904
1317
|
}
|
|
1318
|
+
/**
|
|
1319
|
+
* Checks if two times are equal. Is needed for the dropdown.
|
|
1320
|
+
*
|
|
1321
|
+
* @param time1 - The first time to compare.
|
|
1322
|
+
* @param time2 - The second time to compare.
|
|
1323
|
+
* @returns Whether or not the time objects are the same.
|
|
1324
|
+
*/
|
|
1325
|
+
compareTimes(time1, time2) {
|
|
1326
|
+
return time1 && time2 && time1.hours === time2.hours && time1.minutes === time2.minutes;
|
|
1327
|
+
}
|
|
1328
|
+
/**
|
|
1329
|
+
* Updates the date range values based on the start and end date.
|
|
1330
|
+
*/
|
|
1331
|
+
setDateRangeValues() {
|
|
1332
|
+
if (this.dateRangeStart && this.dateRangeEnd) {
|
|
1333
|
+
this.dateRange.start = new Date(this.dateRangeStart);
|
|
1334
|
+
this.dateRange.end = new Date(this.dateRangeEnd);
|
|
1335
|
+
const values = DateUtilities.getDatesBetween(new Date(this.dateRange.start), new Date(this.dateRange.end), this.metadataDateRangeDate);
|
|
1336
|
+
this.dateRange.values = values.length ? values : undefined;
|
|
1337
|
+
}
|
|
1338
|
+
else {
|
|
1339
|
+
this.dateRange.values = undefined;
|
|
1340
|
+
}
|
|
1341
|
+
this.entity[this.propertyKey] = this.dateRange;
|
|
1342
|
+
}
|
|
1343
|
+
/**
|
|
1344
|
+
* Sets the time on a datetime property.
|
|
1345
|
+
*/
|
|
1346
|
+
setTime() {
|
|
1347
|
+
var _a, _b;
|
|
1348
|
+
if (!this.dateTime) {
|
|
1349
|
+
this.entity[this.propertyKey] = undefined;
|
|
1350
|
+
return;
|
|
1351
|
+
}
|
|
1352
|
+
this.entity[this.propertyKey] = new Date(this.dateTime);
|
|
1353
|
+
if (((_a = this.time) === null || _a === void 0 ? void 0 : _a.hours) != null && ((_b = this.time) === null || _b === void 0 ? void 0 : _b.minutes) != null) {
|
|
1354
|
+
DateUtilities.asDate(this.entity[this.propertyKey]).setHours(this.time.hours, this.time.minutes, 0, 0);
|
|
1355
|
+
}
|
|
1356
|
+
else {
|
|
1357
|
+
DateUtilities.asDate(this.entity[this.propertyKey]).setHours(0, 0, 0, 0);
|
|
1358
|
+
}
|
|
1359
|
+
}
|
|
1360
|
+
/**
|
|
1361
|
+
* Tries to add an item to the array.
|
|
1362
|
+
* Does this either inline if the "createInline"-metadata is set to true
|
|
1363
|
+
* or in a separate dialog if it is set to false.
|
|
1364
|
+
*/
|
|
1365
|
+
add() {
|
|
1366
|
+
if (this.metadataEntityArray.createInline) {
|
|
1367
|
+
this.entityArrayValues.push(cloneDeep(this.arrayItem));
|
|
1368
|
+
this.dataSource.data = this.entityArrayValues;
|
|
1369
|
+
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
1370
|
+
}
|
|
1371
|
+
else {
|
|
1372
|
+
this.addArrayItemDialogRef = this.dialog.open(this.addArrayItemDialog, {
|
|
1373
|
+
data: this.dialogData,
|
|
1374
|
+
autoFocus: false,
|
|
1375
|
+
restoreFocus: false
|
|
1376
|
+
});
|
|
1377
|
+
}
|
|
1378
|
+
}
|
|
1379
|
+
/**
|
|
1380
|
+
* Adds the array item defined in the dialog.
|
|
1381
|
+
*/
|
|
1382
|
+
addArrayItem() {
|
|
1383
|
+
this.addArrayItemDialogRef.close();
|
|
1384
|
+
this.entityArrayValues.push(cloneDeep(this.arrayItem));
|
|
1385
|
+
this.dataSource.data = this.entityArrayValues;
|
|
1386
|
+
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
1387
|
+
}
|
|
1388
|
+
/**
|
|
1389
|
+
* Cancels adding the array item defined in the dialog.
|
|
1390
|
+
*/
|
|
1391
|
+
cancelAddArrayItem() {
|
|
1392
|
+
this.addArrayItemDialogRef.close();
|
|
1393
|
+
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
1394
|
+
}
|
|
1395
|
+
/**
|
|
1396
|
+
* Removes all selected entries from the array.
|
|
1397
|
+
*/
|
|
1398
|
+
remove() {
|
|
1399
|
+
this.selection.selected.forEach(s => {
|
|
1400
|
+
this.entityArrayValues.splice(this.entityArrayValues.indexOf(s), 1);
|
|
1401
|
+
});
|
|
1402
|
+
this.dataSource.data = this.entityArrayValues;
|
|
1403
|
+
this.selection.clear();
|
|
1404
|
+
}
|
|
1405
|
+
/**
|
|
1406
|
+
* Toggles all array-items in the table.
|
|
1407
|
+
*/
|
|
1408
|
+
masterToggle() {
|
|
1409
|
+
if (this.isAllSelected()) {
|
|
1410
|
+
this.selection.clear();
|
|
1411
|
+
}
|
|
1412
|
+
else {
|
|
1413
|
+
this.dataSource.data.forEach(row => this.selection.select(row));
|
|
1414
|
+
}
|
|
1415
|
+
}
|
|
1416
|
+
/**
|
|
1417
|
+
* Checks if all array-items in the table have been selected.
|
|
1418
|
+
* This is needed to display the "masterToggle"-checkbox correctly.
|
|
1419
|
+
*
|
|
1420
|
+
* @returns Whether or not all array-items in the table have been selected.
|
|
1421
|
+
*/
|
|
1422
|
+
isAllSelected() {
|
|
1423
|
+
const numSelected = this.selection.selected.length;
|
|
1424
|
+
const numRows = this.dataSource.data.length;
|
|
1425
|
+
return numSelected === numRows;
|
|
1426
|
+
}
|
|
1427
|
+
/**
|
|
1428
|
+
* Handles adding strings to the chipsArray.
|
|
1429
|
+
* Checks validation and also creates a new array if it is undefined.
|
|
1430
|
+
* This is needed because two things are validated: The array itself
|
|
1431
|
+
* and the contents of the array. And we need a way to display an
|
|
1432
|
+
* mat-error. As the only validation for the array is whether or not
|
|
1433
|
+
* it contains values, we can set it to undefined when the last element is removed
|
|
1434
|
+
* (removeStringChipArrayValue). That way we can use the "required" validator.
|
|
1435
|
+
*
|
|
1436
|
+
* @param event - The event that fires when a new chip is completed.
|
|
1437
|
+
*/
|
|
905
1438
|
addStringChipArrayValue(event) {
|
|
906
1439
|
const value = (event.value || '').trim();
|
|
907
1440
|
if (value) {
|
|
@@ -924,6 +1457,16 @@ class NgxMatEntityInputComponent {
|
|
|
924
1457
|
}
|
|
925
1458
|
event.chipInput.clear();
|
|
926
1459
|
}
|
|
1460
|
+
/**
|
|
1461
|
+
* Removes the given value from the array.
|
|
1462
|
+
* Sets the array to undefined if it is now empty.
|
|
1463
|
+
* This is needed because two things are validated: The array itself
|
|
1464
|
+
* and the contents of the array. And we need a way to display an
|
|
1465
|
+
* mat-error. As the only validation for the array is whether or not
|
|
1466
|
+
* it is empty, setting it to undefined here enables us to use the "required" validator.
|
|
1467
|
+
*
|
|
1468
|
+
* @param value - The string to remove from the array.
|
|
1469
|
+
*/
|
|
927
1470
|
removeStringChipArrayValue(value) {
|
|
928
1471
|
this.stringChipsArrayValues.splice(this.stringChipsArrayValues.indexOf(value), 1);
|
|
929
1472
|
if (!this.stringChipsArrayValues.length) {
|
|
@@ -931,6 +1474,12 @@ class NgxMatEntityInputComponent {
|
|
|
931
1474
|
this.stringChipsArrayValues = this.entity[this.propertyKey];
|
|
932
1475
|
}
|
|
933
1476
|
}
|
|
1477
|
+
/**
|
|
1478
|
+
* Handles adding a string to the array when an autocomplete value has been selected.
|
|
1479
|
+
*
|
|
1480
|
+
* @param event - The autocomplete selected event.
|
|
1481
|
+
* @param chipsInput - The element where the user typed the value.
|
|
1482
|
+
*/
|
|
934
1483
|
selected(event, chipsInput) {
|
|
935
1484
|
const value = (event.option.viewValue || '').trim();
|
|
936
1485
|
if (this.metadataStringChipsArray.minLength && value.length < this.metadataStringChipsArray.minLength) {
|
|
@@ -951,17 +1500,24 @@ class NgxMatEntityInputComponent {
|
|
|
951
1500
|
this.stringChipsArrayValues.push(value);
|
|
952
1501
|
chipsInput.value = '';
|
|
953
1502
|
}
|
|
1503
|
+
/**
|
|
1504
|
+
* Dynamically filters the Autocomplete options when the user inputs something.
|
|
1505
|
+
*
|
|
1506
|
+
* @param input - The input of the user.
|
|
1507
|
+
*/
|
|
954
1508
|
filterAutocompleteStrings(input) {
|
|
955
|
-
|
|
956
|
-
|
|
1509
|
+
if (input) {
|
|
1510
|
+
const filterValue = input.toLowerCase();
|
|
1511
|
+
this.filteredAutocompleteStrings = this.autocompleteStrings.filter(s => s.toLowerCase().includes(filterValue));
|
|
1512
|
+
}
|
|
957
1513
|
}
|
|
958
1514
|
}
|
|
959
|
-
NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
960
|
-
NgxMatEntityInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: { entity: "entity", propertyKey: "propertyKey", getValidationErrorMessage: "getValidationErrorMessage", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit" }, ngImport: i0, template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <ngx-mat-entity-array-table\n [arrayItems]=\"entityArrayValues\"\n [metadata]=\"metadataEntityArray\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [omit]=\"hideOmitForCreate ? 'create' : 'edit'\"\n >\n </ngx-mat-entity-array-table>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"], components: [{ type: i1$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i6.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: NgxMatEntityArrayTableComponent, selector: "ngx-mat-entity-array-table", inputs: ["arrayItems", "metadata", "getValidationErrorMessage", "omit"] }, { type: i8$1.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1$1.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i12.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i12.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i12.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i12.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i12.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1$1.MatError, selector: "mat-error", inputs: ["id"] }, { type: i10.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i2.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.MatCheckboxRequiredValidator, selector: "mat-checkbox[required][formControlName], mat-checkbox[required][formControl], mat-checkbox[required][ngModel]" }, { type: i6.MatSlideToggleRequiredValidator, selector: "mat-slide-toggle[required][formControlName], mat-slide-toggle[required][formControl], mat-slide-toggle[required][ngModel]" }, { type: i12.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i12.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i12.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i8$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i8$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i8$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i7.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
|
|
1515
|
+
NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
1516
|
+
NgxMatEntityInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: { entity: "entity", propertyKey: "propertyKey", getValidationErrorMessage: "getValidationErrorMessage", hideOmitForCreate: "hideOmitForCreate", hideOmitForEdit: "hideOmitForEdit" }, viewQueries: [{ propertyName: "addArrayItemDialog", first: true, predicate: ["addArrayItemDialog"], descendants: true }], ngImport: i0, template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-checkbox (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-slide-toggle (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n\n <div class=\"row\" *ngFor=\"let row of objectPropertyRows\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{EntityUtilities.getWidth(objectProperty, key, 'lg')}} col-md-{{EntityUtilities.getWidth(objectProperty, key, 'md')}} col-sm-{{EntityUtilities.getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div class=\"entityArray\" *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadataEntityArray.displayName}}</b>\n </div>\n <div *ngIf=\"metadataEntityArray.createInline\">\n <div class=\"row\" *ngFor=\"let row of arrayItemInlineRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(arrayItem, key, 'lg')}} col-md-{{EntityUtilities.getWidth(arrayItem, key, 'md')}} col-sm-{{EntityUtilities.getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n \n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadataEntityArray.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n {{metadataEntityArray.addButtonLabel}}\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n {{metadataEntityArray.removeButtonLabel}}\n </button>\n </div>\n \n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox [disabled]=\"!dataSource.data.length\" (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadataEntityArray.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n \n <div class=\"array-error\" *ngIf=\"metadataEntityArray.required && !dataSource.data.length\">\n {{metadataEntityArray.missingErrorMessage}}\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Dates-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.DATE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultDate.min ? metadataDefaultDate.min(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [max]=\"metadataDefaultDate.max ? metadataDefaultDate.max(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [matDatepickerFilter]=\"metadataDefaultDate.filter ? metadataDefaultDate.filter : defaultDateFilter\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_RANGE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n \n <mat-date-range-input [rangePicker]=\"picker\" [required]=\"metadata.required\" [dateFilter]=\"metadataDateRangeDate.filter ? metadataDateRangeDate.filter : defaultDateFilter\">\n <input matStartDate\n [(ngModel)]=\"dateRangeStart\"\n [name]=\"propertyKey.toString() + 'start'\"\n #startModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minStart ? metadataDateRangeDate.minStart(dateRange.start) : undefined\"\n [max]=\"metadataDateRangeDate.maxStart ? metadataDateRangeDate.maxStart(dateRange.start) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderStart ? metadataDateRangeDate.placeholderStart : 'Start'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n <input matEndDate\n [(ngModel)]=\"dateRangeEnd\"\n [name]=\"propertyKey.toString() + 'end'\"\n #endModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minEnd ? metadataDateRangeDate.minEnd(dateRange.end) : undefined\"\n [max]=\"metadataDateRangeDate.maxEnd ? metadataDateRangeDate.maxEnd(dateRange.end) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderEnd ? metadataDateRangeDate.placeholderEnd : 'End'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n </mat-date-range-input>\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-date-range-picker #picker></mat-date-range-picker>\n\n <mat-error *ngIf=\"startModel.errors\">{{getValidationErrorMessage(startModel)}}</mat-error>\n <mat-error *ngIf=\"!startModel.errors && endModel.errors\">{{getValidationErrorMessage(endModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_TIME\" class=\"date-time\">\n <mat-form-field appearance=\"standard\" class=\"datepicker\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"dateTime\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateTimeDate.minDate ? metadataDateTimeDate.minDate(dateTime) : undefined\"\n [max]=\"metadataDateTimeDate.maxDate ? metadataDateTimeDate.maxDate(dateTime) : undefined\"\n [matDatepickerFilter]=\"metadataDateTimeDate.filterDate ? metadataDateTimeDate.filterDate : defaultDateFilter\"\n (dateInput)=\"setTime()\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n <mat-form-field class=\"timepicker\">\n <mat-label>{{metadataDateTimeDate.timeDisplayName}}</mat-label>\n <mat-select\n [(ngModel)]=\"time\"\n [name]=\"propertyKey.toString() + 'time'\"\n #timeModel=\"ngModel\"\n [required]=\"metadata.required\"\n [compareWith]=\"compareTimes\"\n (ngModelChange)=\"setTime()\"\n >\n <mat-option *ngFor=\"let validTime of DateUtilities.getValidTimesForDropdown(\n DateUtilities.asDate(entity[propertyKey]),\n metadataDateTimeDate.times,\n metadataDateTimeDate.minTime,\n metadataDateTimeDate.maxTime,\n metadataDateTimeDate.filterTime\n )\"\n [value]=\"validTime.value\"\n >\n {{validTime.displayName}}\n </mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(timeModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}} is not known.</div>\n</div>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n <h2 mat-dialog-title>{{dialogData.createDialogData.title}}</h2>\n\n <mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of arrayItemDialogRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"dialogData.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"dialogData.getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(dialogData.entity, key, 'lg')}} col-md-{{EntityUtilities.getWidth(dialogData.entity, key, 'md')}} col-sm-{{EntityUtilities.getWidth(dialogData.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n </mat-dialog-content>\n\n <mat-dialog-actions>\n <button mat-raised-button (click)=\"addArrayItem()\" [disabled]=\"!EntityUtilities.isEntityValid(dialogData.entity, 'create')\">\n {{dialogData.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancelAddArrayItem()\" class=\"cancel-button\">\n {{dialogData.createDialogData.cancelButtonLabel}}\n </button>\n </mat-dialog-actions>\n\n</ng-template>", styles: ["mat-form-field{width:100%}::ng-deep .hideUnderline .mat-form-field-underline{opacity:0%}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}.entityArray mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.entityArray .mat-column-select{flex:0 0 75px}.entityArray .array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.date-time{display:flex;align-items:baseline}.date-time .timepicker{margin-left:10px}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i4.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i7.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i10.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i11.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i11.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { type: i11.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { type: i11.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }], directives: [{ type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i12.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i12.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2.MatLabel, selector: "mat-label" }, { type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i14.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i14.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i14.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i14.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i14.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i14.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i14.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i2.MatError, selector: "mat-error", inputs: ["id"] }, { type: i15.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i3$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i14.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i14.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i9.MatCellDef, selector: "[matCellDef]" }, { type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i10.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i10.MatChipRemove, selector: "[matChipRemove]" }, { type: i10.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { type: i11.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i2.MatSuffix, selector: "[matSuffix]" }, { type: i11.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { type: i11.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { type: i12.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
961
1517
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, decorators: [{
|
|
962
1518
|
type: Component,
|
|
963
|
-
args: [{ selector: 'ngx-mat-entity-input', template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required ? metadata.required : false\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field>\n <mat-checkbox [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field>\n <mat-slide-toggle [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n {{metadata.displayName}}\n </mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <textarea matInput hidden></textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required ? metadata.required : false\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n <div class=\"row\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of getObjectProperties(); let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{getWidth(objectProperty, key, 'lg')}} col-md-{{getWidth(objectProperty, key, 'md')}} col-sm-{{getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <ngx-mat-entity-array-table\n [arrayItems]=\"entityArrayValues\"\n [metadata]=\"metadataEntityArray\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [omit]=\"hideOmitForCreate ? 'create' : 'edit'\"\n >\n </ngx-mat-entity-array-table>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required ? metadata.required : false\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove *ngIf=\"metadataStringChipsArray.deleteHtml\" [innerHtml]=\"metadataStringChipsArray.deleteHtml\">\n </button>\n <button matChipRemove *ngIf=\"!metadataStringChipsArray.deleteHtml\">\n <mat-icon>cancel</mat-icon>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}}is not known.</div>\n</div>", styles: ["mat-form-field{width:100%}\n"] }]
|
|
964
|
-
}], ctorParameters: function () { return []; }, propDecorators: { entity: [{
|
|
1519
|
+
args: [{ selector: 'ngx-mat-entity-input', template: "<div [ngSwitch]=\"type\" *ngIf=\"!(hideOmitForCreate && metadata.omitForCreate) && !(hideOmitForEdit && metadata.omitForUpdate)\">\n <!-------------------------------------------->\n <!-----------------Strings-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.STRING\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [pattern]=\"metadataDefaultString.regex ? metadataDefaultString.regex : '[\\\\s\\\\S]*'\"\n [minlength]=\"metadataDefaultString.minLength ? metadataDefaultString.minLength : null\"\n [maxlength]=\"metadataDefaultString.maxLength ? metadataDefaultString.maxLength : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_TEXTBOX\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <textarea\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"10\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataTextboxString.minLength ? metadataTextboxString.minLength : null\"\n [maxlength]=\"metadataTextboxString.maxLength ? metadataTextboxString.maxLength : null\"\n >\n </textarea>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_AUTOCOMPLETE\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matAutocomplete]=\"auto\"\n (keyup)=\"filterAutocompleteStrings(entity[propertyKey])\"\n [required]=\"metadata.required\"\n [minlength]=\"metadataAutocompleteString.minLength ? metadataAutocompleteString.minLength : null\"\n [maxlength]=\"metadataAutocompleteString.maxLength ? metadataAutocompleteString.maxLength : null\"\n [pattern]=\"metadataAutocompleteString.regex ? metadataAutocompleteString.regex : '[\\\\s\\\\S]*'\"\n />\n <mat-autocomplete #auto=\"matAutocomplete\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.STRING_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownString.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-----------------Booleans------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_CHECKBOX\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-checkbox (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-checkbox>\n <!-- hidden input is needed so that the checkbox can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_TOGGLE\">\n <mat-form-field class=\"hideUnderline\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-slide-toggle (click)=\"model.control.markAsTouched()\" [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\"></mat-slide-toggle>\n <!-- hidden input is needed so that the toggle can be used inside a mat-form-field -->\n <input matInput hidden\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString() + 'Helper'\"\n #model=\"ngModel\"\n [pattern]=\"metadata.required ? 'true' : '[\\\\s\\\\S]*'\"\n [required]=\"metadata.required\">\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.BOOLEAN_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option [value]=\"undefined\">-</mat-option>\n <mat-option [value]=\"true\">{{metadataDropdownBoolean.dropdownTrue}}</mat-option>\n <mat-option [value]=\"false\">{{metadataDropdownBoolean.dropdownFalse}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!------------------Numbers------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n type=\"number\"\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultNumber.min ? metadataDefaultNumber.min : null\"\n [max]=\"metadataDefaultNumber.max ? metadataDefaultNumber.max : null\"\n />\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.NUMBER_DROPDOWN\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-select [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\" [required]=\"metadata.required\">\n <mat-option *ngFor=\"let value of metadataDropdownNumber.dropdownValues\" [value]=\"value.value\">{{value.displayName}}</mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Object------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.OBJECT\">\n <b>{{metadataDefaultObject.displayName}}</b>\n <!-- iterates over the object properties -->\n\n <div class=\"row\" *ngFor=\"let row of objectPropertyRows\">\n <!--\n displays another ngx-material-entity with the:\n object as the entity,\n the current key in the loop received by the keyvalue direction as the propertyKey\n and the getValidationErrorMessage of the current component\n -->\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"objectProperty\"\n [propertyKey]=\"key\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n [hideOmitForCreate]=\"hideOmitForCreate\"\n [hideOmitForEdit]=\"hideOmitForEdit\"\n class=\"col-lg-{{EntityUtilities.getWidth(objectProperty, key, 'lg')}} col-md-{{EntityUtilities.getWidth(objectProperty, key, 'md')}} col-sm-{{EntityUtilities.getWidth(objectProperty, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Array-------------------->\n <!-------------------------------------------->\n <div class=\"entityArray\" *ngSwitchCase=\"DecoratorTypes.ARRAY\">\n <div class=\"mat-elevation-z8\" style=\"border-radius: 5px;padding: 15px;margin-bottom: 15px;margin-top: 15px;\">\n\n <div style=\"padding-bottom: 10px\">\n <b>{{metadataEntityArray.displayName}}</b>\n </div>\n <div *ngIf=\"metadataEntityArray.createInline\">\n <div class=\"row\" *ngFor=\"let row of arrayItemInlineRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys; let i = index; trackBy: trackByFn\"\n [entity]=\"arrayItem\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(arrayItem, key, 'lg')}} col-md-{{EntityUtilities.getWidth(arrayItem, key, 'md')}} col-sm-{{EntityUtilities.getWidth(arrayItem, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </div>\n \n <div class=\"buttons\">\n <button mat-raised-button\n [disabled]=\"metadataEntityArray.createInline && !EntityUtilities.isEntityValid(arrayItem, 'create')\"\n (click)=\"add()\">\n {{metadataEntityArray.addButtonLabel}}\n </button>\n <button mat-raised-button\n [disabled]=\"!selection.selected.length\"\n (click)=\"remove()\">\n {{metadataEntityArray.removeButtonLabel}}\n </button>\n </div>\n \n <mat-table [dataSource]=\"dataSource\">\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox [disabled]=\"!dataSource.data.length\" (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"></mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"></mat-checkbox>\n </mat-cell>\n </ng-container>\n \n <ng-container *ngFor=\"let dCol of metadataEntityArray.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n \n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n \n <div class=\"array-error\" *ngIf=\"metadataEntityArray.required && !dataSource.data.length\">\n {{metadataEntityArray.missingErrorMessage}}\n </div>\n </div>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS\">\n <mat-form-field>\n <mat-label>{{metadata.displayName}}</mat-label>\n <mat-chip-list #chipList\n [(ngModel)]=\"entity[propertyKey]\" [name]=\"propertyKey.toString()\" #model=\"ngModel\"\n [required]=\"metadata.required\"\n >\n <mat-chip *ngFor=\"let value of stringChipsArrayValues\" (removed)=\"removeStringChipArrayValue(value)\">\n {{value}}\n <button matChipRemove>\n <i class=\"{{metadataStringChipsArray.deleteIcon}}\"></i>\n </button>\n </mat-chip>\n <input matInput\n [matChipInputFor]=\"chipList\"\n [matAutocomplete]=\"auto\"\n [matChipInputAddOnBlur]=\"true\"\n (matChipInputTokenEnd)=\"addStringChipArrayValue($event)\"\n (keyup)=\"filterAutocompleteStrings(chipsInput)\"\n [(ngModel)]=\"chipsInput\" [name]=\"propertyKey.toString()\" #chipsModel=\"ngModel\"\n #chipsElement\n [minlength]='metadataStringChipsArray.minLength ? metadataStringChipsArray.minLength : null'\n [maxlength]='metadataStringChipsArray.maxLength ? metadataStringChipsArray.maxLength : null'\n [pattern]=\"metadataStringChipsArray.regex ? metadataStringChipsArray.regex : '[\\\\s\\\\S]*'\"\n >\n <mat-error *ngIf=\"chipsModel.errors\">{{getValidationErrorMessage(chipsModel)}}</mat-error>\n </mat-chip-list>\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"selected($event, chipsElement)\">\n <mat-option *ngFor=\"let value of filteredAutocompleteStrings\" [value]=\"value\">\n {{value}}\n </mat-option>\n </mat-autocomplete>\n <mat-error *ngIf=\"!chipsModel.errors\">{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <!-------------------------------------------->\n <!-------------------Dates-------------------->\n <!-------------------------------------------->\n <div *ngSwitchCase=\"DecoratorTypes.DATE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"entity[propertyKey]\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDefaultDate.min ? metadataDefaultDate.min(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [max]=\"metadataDefaultDate.max ? metadataDefaultDate.max(DateUtilities.asDate(entity[propertyKey])) : undefined\"\n [matDatepickerFilter]=\"metadataDefaultDate.filter ? metadataDefaultDate.filter : defaultDateFilter\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_RANGE\">\n <mat-form-field appearance=\"standard\">\n <mat-label>{{metadata.displayName}}</mat-label>\n \n <mat-date-range-input [rangePicker]=\"picker\" [required]=\"metadata.required\" [dateFilter]=\"metadataDateRangeDate.filter ? metadataDateRangeDate.filter : defaultDateFilter\">\n <input matStartDate\n [(ngModel)]=\"dateRangeStart\"\n [name]=\"propertyKey.toString() + 'start'\"\n #startModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minStart ? metadataDateRangeDate.minStart(dateRange.start) : undefined\"\n [max]=\"metadataDateRangeDate.maxStart ? metadataDateRangeDate.maxStart(dateRange.start) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderStart ? metadataDateRangeDate.placeholderStart : 'Start'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n <input matEndDate\n [(ngModel)]=\"dateRangeEnd\"\n [name]=\"propertyKey.toString() + 'end'\"\n #endModel=\"ngModel\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateRangeDate.minEnd ? metadataDateRangeDate.minEnd(dateRange.end) : undefined\"\n [max]=\"metadataDateRangeDate.maxEnd ? metadataDateRangeDate.maxEnd(dateRange.end) : undefined\"\n [placeholder]=\"metadataDateRangeDate.placeholderEnd ? metadataDateRangeDate.placeholderEnd : 'End'\"\n (ngModelChange)=\"setDateRangeValues()\"\n >\n </mat-date-range-input>\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-date-range-picker #picker></mat-date-range-picker>\n\n <mat-error *ngIf=\"startModel.errors\">{{getValidationErrorMessage(startModel)}}</mat-error>\n <mat-error *ngIf=\"!startModel.errors && endModel.errors\">{{getValidationErrorMessage(endModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchCase=\"DecoratorTypes.DATE_TIME\" class=\"date-time\">\n <mat-form-field appearance=\"standard\" class=\"datepicker\">\n <mat-label>{{metadata.displayName}}</mat-label>\n <input\n matInput\n [(ngModel)]=\"dateTime\"\n [name]=\"propertyKey.toString()\"\n #model=\"ngModel\"\n [matDatepicker]=\"picker\"\n [required]=\"metadata.required\"\n [min]=\"metadataDateTimeDate.minDate ? metadataDateTimeDate.minDate(dateTime) : undefined\"\n [max]=\"metadataDateTimeDate.maxDate ? metadataDateTimeDate.maxDate(dateTime) : undefined\"\n [matDatepickerFilter]=\"metadataDateTimeDate.filterDate ? metadataDateTimeDate.filterDate : defaultDateFilter\"\n (dateInput)=\"setTime()\"\n >\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n <mat-error>{{getValidationErrorMessage(model)}}</mat-error>\n </mat-form-field>\n <mat-form-field class=\"timepicker\">\n <mat-label>{{metadataDateTimeDate.timeDisplayName}}</mat-label>\n <mat-select\n [(ngModel)]=\"time\"\n [name]=\"propertyKey.toString() + 'time'\"\n #timeModel=\"ngModel\"\n [required]=\"metadata.required\"\n [compareWith]=\"compareTimes\"\n (ngModelChange)=\"setTime()\"\n >\n <mat-option *ngFor=\"let validTime of DateUtilities.getValidTimesForDropdown(\n DateUtilities.asDate(entity[propertyKey]),\n metadataDateTimeDate.times,\n metadataDateTimeDate.minTime,\n metadataDateTimeDate.maxTime,\n metadataDateTimeDate.filterTime\n )\"\n [value]=\"validTime.value\"\n >\n {{validTime.displayName}}\n </mat-option>\n </mat-select>\n <mat-error>{{getValidationErrorMessage(timeModel)}}</mat-error>\n </mat-form-field>\n </div>\n\n <div *ngSwitchDefault>ERROR: The type {{type}} is not known.</div>\n</div>\n\n<!--------------------------------------------------------->\n<!--------------------Add Array Item Dialog---------------->\n<!--------------------------------------------------------->\n<ng-template #addArrayItemDialog>\n <h2 mat-dialog-title>{{dialogData.createDialogData.title}}</h2>\n\n <mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of arrayItemDialogRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"dialogData.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n [getValidationErrorMessage]=\"dialogData.getValidationErrorMessage\"\n class=\"col-lg-{{EntityUtilities.getWidth(dialogData.entity, key, 'lg')}} col-md-{{EntityUtilities.getWidth(dialogData.entity, key, 'md')}} col-sm-{{EntityUtilities.getWidth(dialogData.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n </mat-dialog-content>\n\n <mat-dialog-actions>\n <button mat-raised-button (click)=\"addArrayItem()\" [disabled]=\"!EntityUtilities.isEntityValid(dialogData.entity, 'create')\">\n {{dialogData.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancelAddArrayItem()\" class=\"cancel-button\">\n {{dialogData.createDialogData.cancelButtonLabel}}\n </button>\n </mat-dialog-actions>\n\n</ng-template>", styles: ["mat-form-field{width:100%}::ng-deep .hideUnderline .mat-form-field-underline{opacity:0%}.entityArray .buttons{display:flex;justify-content:space-between;margin-bottom:10px;margin-top:5px}.entityArray mat-table{border:1px solid #E0E0E0;border-radius:5px;padding-top:5px;padding-bottom:25px}.entityArray .mat-column-select{flex:0 0 75px}.entityArray .array-error{display:flex;align-items:center;justify-content:center;margin-top:-25.8px;border:1px solid #E0E0E0;background-color:#f8d3d7;color:#721c24;height:25.8px;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.date-time{display:flex;align-items:baseline}.date-time .timepicker{margin-left:10px}\n"] }]
|
|
1520
|
+
}], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { entity: [{
|
|
965
1521
|
type: Input
|
|
966
1522
|
}], propertyKey: [{
|
|
967
1523
|
type: Input
|
|
@@ -971,11 +1527,103 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
971
1527
|
type: Input
|
|
972
1528
|
}], hideOmitForEdit: [{
|
|
973
1529
|
type: Input
|
|
1530
|
+
}], addArrayItemDialog: [{
|
|
1531
|
+
type: ViewChild,
|
|
1532
|
+
args: ['addArrayItemDialog']
|
|
974
1533
|
}] } });
|
|
975
1534
|
|
|
1535
|
+
class NgxMatEntityInputModule {
|
|
1536
|
+
}
|
|
1537
|
+
NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1538
|
+
NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
|
|
1539
|
+
MatInputModule,
|
|
1540
|
+
FormsModule,
|
|
1541
|
+
MatFormFieldModule,
|
|
1542
|
+
MatSelectModule,
|
|
1543
|
+
MatAutocompleteModule,
|
|
1544
|
+
MatCheckboxModule,
|
|
1545
|
+
MatSlideToggleModule,
|
|
1546
|
+
MatChipsModule,
|
|
1547
|
+
MatIconModule,
|
|
1548
|
+
MatTableModule,
|
|
1549
|
+
MatDialogModule,
|
|
1550
|
+
MatButtonModule,
|
|
1551
|
+
MatDatepickerModule], exports: [NgxMatEntityInputComponent] });
|
|
1552
|
+
NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
|
|
1553
|
+
CommonModule,
|
|
1554
|
+
MatInputModule,
|
|
1555
|
+
FormsModule,
|
|
1556
|
+
MatFormFieldModule,
|
|
1557
|
+
MatSelectModule,
|
|
1558
|
+
MatAutocompleteModule,
|
|
1559
|
+
MatCheckboxModule,
|
|
1560
|
+
MatSlideToggleModule,
|
|
1561
|
+
MatChipsModule,
|
|
1562
|
+
MatIconModule,
|
|
1563
|
+
MatTableModule,
|
|
1564
|
+
MatDialogModule,
|
|
1565
|
+
MatButtonModule,
|
|
1566
|
+
MatDatepickerModule
|
|
1567
|
+
]] });
|
|
1568
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
|
|
1569
|
+
type: NgModule,
|
|
1570
|
+
args: [{
|
|
1571
|
+
declarations: [
|
|
1572
|
+
NgxMatEntityInputComponent,
|
|
1573
|
+
],
|
|
1574
|
+
imports: [
|
|
1575
|
+
CommonModule,
|
|
1576
|
+
MatInputModule,
|
|
1577
|
+
FormsModule,
|
|
1578
|
+
MatFormFieldModule,
|
|
1579
|
+
MatSelectModule,
|
|
1580
|
+
MatAutocompleteModule,
|
|
1581
|
+
MatCheckboxModule,
|
|
1582
|
+
MatSlideToggleModule,
|
|
1583
|
+
MatChipsModule,
|
|
1584
|
+
MatIconModule,
|
|
1585
|
+
MatTableModule,
|
|
1586
|
+
MatDialogModule,
|
|
1587
|
+
MatButtonModule,
|
|
1588
|
+
MatDatepickerModule
|
|
1589
|
+
],
|
|
1590
|
+
exports: [NgxMatEntityInputComponent]
|
|
1591
|
+
}]
|
|
1592
|
+
}] });
|
|
1593
|
+
|
|
1594
|
+
/**
|
|
1595
|
+
* The internal CreateEntityDialogData. Requires all default values the user can leave out.
|
|
1596
|
+
*/
|
|
1597
|
+
class CreateEntityDialogDataInternal {
|
|
1598
|
+
constructor(entity, EntityServiceClass, createDialogData) {
|
|
1599
|
+
this.entity = entity;
|
|
1600
|
+
this.EntityServiceClass = EntityServiceClass;
|
|
1601
|
+
this.createDialogData = createDialogData;
|
|
1602
|
+
}
|
|
1603
|
+
}
|
|
1604
|
+
/**
|
|
1605
|
+
* The Builder for the CreateEntityDialogData. Sets default values.
|
|
1606
|
+
*/
|
|
1607
|
+
class CreateEntityDialogDataBuilder extends BaseBuilder {
|
|
1608
|
+
constructor(data) {
|
|
1609
|
+
super(data);
|
|
1610
|
+
}
|
|
1611
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1612
|
+
generateBaseData(data) {
|
|
1613
|
+
const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
|
|
1614
|
+
return new CreateEntityDialogDataInternal(data.entity, data.EntityServiceClass, createDialogData);
|
|
1615
|
+
}
|
|
1616
|
+
}
|
|
1617
|
+
|
|
1618
|
+
/**
|
|
1619
|
+
* The default dialog used to create new entities based on the configuration passed in the MAT_DIALOG_DATA "inputData".
|
|
1620
|
+
* Used by the ngx-mat-entity-table.
|
|
1621
|
+
*
|
|
1622
|
+
* It offers a lot of customization options which can be found in "CreateEntityDialogData".
|
|
1623
|
+
*/
|
|
976
1624
|
class NgxMatEntityCreateDialogComponent {
|
|
977
|
-
constructor(
|
|
978
|
-
this.
|
|
1625
|
+
constructor(inputData, dialogRef, injector, dialog) {
|
|
1626
|
+
this.inputData = inputData;
|
|
979
1627
|
this.dialogRef = dialogRef;
|
|
980
1628
|
this.injector = injector;
|
|
981
1629
|
this.dialog = dialog;
|
|
@@ -983,42 +1631,31 @@ class NgxMatEntityCreateDialogComponent {
|
|
|
983
1631
|
this.getWidth = EntityUtilities.getWidth;
|
|
984
1632
|
}
|
|
985
1633
|
ngOnInit() {
|
|
1634
|
+
this.data = new CreateEntityDialogDataBuilder(this.inputData).getResult();
|
|
986
1635
|
this.dialogRef.disableClose = true;
|
|
987
|
-
this.
|
|
1636
|
+
this.entityRows = EntityUtilities.getEntityRows(this.data.entity, true);
|
|
988
1637
|
this.entityService = this.injector.get(this.data.EntityServiceClass);
|
|
989
1638
|
}
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
.sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
|
|
995
|
-
}
|
|
1639
|
+
/**
|
|
1640
|
+
* Tries add the new entity and close the dialog afterwards.
|
|
1641
|
+
* Also handles the confirmation if required.
|
|
1642
|
+
*/
|
|
996
1643
|
create() {
|
|
997
|
-
var _a, _b
|
|
998
|
-
if (this.data.createDialogData
|
|
1644
|
+
var _a, _b;
|
|
1645
|
+
if (!((_a = this.data.createDialogData) === null || _a === void 0 ? void 0 : _a.createRequiresConfirmDialog)) {
|
|
999
1646
|
return this.confirmCreate();
|
|
1000
1647
|
}
|
|
1001
|
-
const dialogData =
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
// eslint-disable-next-line max-len
|
|
1008
|
-
cancelButtonLabel: ((_e = this.data.createDialogData.confirmCreateDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = this.data.createDialogData.confirmCreateDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
|
|
1009
|
-
// eslint-disable-next-line max-len
|
|
1010
|
-
title: ((_g = this.data.createDialogData.confirmCreateDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = this.data.createDialogData.confirmCreateDialogData) === null || _h === void 0 ? void 0 : _h.title : 'Create',
|
|
1011
|
-
// eslint-disable-next-line max-len
|
|
1012
|
-
requireConfirmation: ((_j = this.data.createDialogData.confirmCreateDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = this.data.createDialogData.confirmCreateDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
|
|
1013
|
-
// eslint-disable-next-line max-len
|
|
1014
|
-
confirmationText: ((_l = this.data.createDialogData.confirmCreateDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = this.data.createDialogData.confirmCreateDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined,
|
|
1015
|
-
};
|
|
1016
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1648
|
+
const dialogData = new ConfirmDialogDataBuilder((_b = this.data.createDialogData) === null || _b === void 0 ? void 0 : _b.confirmCreateDialogData)
|
|
1649
|
+
.withDefault('text', ['Do you really want to create this entity?'])
|
|
1650
|
+
.withDefault('confirmButtonLabel', 'Create')
|
|
1651
|
+
.withDefault('title', 'Create')
|
|
1652
|
+
.getResult();
|
|
1653
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1017
1654
|
data: dialogData,
|
|
1018
1655
|
autoFocus: false,
|
|
1019
1656
|
restoreFocus: false
|
|
1020
1657
|
});
|
|
1021
|
-
|
|
1658
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1022
1659
|
if (res === 1) {
|
|
1023
1660
|
this.confirmCreate();
|
|
1024
1661
|
}
|
|
@@ -1027,15 +1664,18 @@ class NgxMatEntityCreateDialogComponent {
|
|
|
1027
1664
|
confirmCreate() {
|
|
1028
1665
|
this.entityService.create(this.data.entity).then(() => this.dialogRef.close());
|
|
1029
1666
|
}
|
|
1667
|
+
/**
|
|
1668
|
+
* Closes the dialog.
|
|
1669
|
+
*/
|
|
1030
1670
|
cancel() {
|
|
1031
1671
|
this.dialogRef.close();
|
|
1032
1672
|
}
|
|
1033
1673
|
}
|
|
1034
1674
|
NgxMatEntityCreateDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i0.Injector }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
1035
|
-
NgxMatEntityCreateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityCreateDialogComponent, selector: "ngx-mat-entity-create-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n
|
|
1675
|
+
NgxMatEntityCreateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityCreateDialogComponent, selector: "ngx-mat-entity-create-dialog", ngImport: i0, template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"], components: [{ type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
1036
1676
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogComponent, decorators: [{
|
|
1037
1677
|
type: Component,
|
|
1038
|
-
args: [{ selector: 'ngx-mat-entity-create-dialog', template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n
|
|
1678
|
+
args: [{ selector: 'ngx-mat-entity-create-dialog', template: "<h2 mat-dialog-title>{{data.createDialogData.title}}</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForCreate]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"create()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'create')\">\n {{data.createDialogData.createButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.createDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}\n"] }]
|
|
1039
1679
|
}], ctorParameters: function () {
|
|
1040
1680
|
return [{ type: undefined, decorators: [{
|
|
1041
1681
|
type: Inject,
|
|
@@ -1043,9 +1683,79 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1043
1683
|
}] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }];
|
|
1044
1684
|
} });
|
|
1045
1685
|
|
|
1686
|
+
/**
|
|
1687
|
+
* The internal EditDialogData. Requires all default values the user can leave out.
|
|
1688
|
+
*/
|
|
1689
|
+
class EditDialogDataInternal {
|
|
1690
|
+
constructor(title, confirmButtonLabel, deleteButtonLabel, cancelButtonLabel, deleteRequiresConfirmDialog, editRequiresConfirmDialog, confirmDeleteDialogData, confirmEditDialogData) {
|
|
1691
|
+
this.title = title;
|
|
1692
|
+
this.confirmButtonLabel = confirmButtonLabel;
|
|
1693
|
+
this.deleteButtonLabel = deleteButtonLabel;
|
|
1694
|
+
this.cancelButtonLabel = cancelButtonLabel;
|
|
1695
|
+
this.deleteRequiresConfirmDialog = deleteRequiresConfirmDialog;
|
|
1696
|
+
this.editRequiresConfirmDialog = editRequiresConfirmDialog;
|
|
1697
|
+
this.confirmDeleteDialogData = confirmDeleteDialogData;
|
|
1698
|
+
this.confirmEditDialogData = confirmEditDialogData;
|
|
1699
|
+
}
|
|
1700
|
+
}
|
|
1701
|
+
/**
|
|
1702
|
+
* The Builder for the EditDialogData. Sets default values.
|
|
1703
|
+
*/
|
|
1704
|
+
class EditDialogDataBuilder extends BaseBuilder {
|
|
1705
|
+
constructor(data) {
|
|
1706
|
+
super(data);
|
|
1707
|
+
}
|
|
1708
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1709
|
+
generateBaseData(data) {
|
|
1710
|
+
const confirmEditDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmEditDialogData)
|
|
1711
|
+
.withDefault('confirmButtonLabel', 'Save')
|
|
1712
|
+
.withDefault('text', ['Do you really want to save all changes?'])
|
|
1713
|
+
.withDefault('title', 'Edit')
|
|
1714
|
+
.getResult();
|
|
1715
|
+
const confirmDeleteDialogData = new ConfirmDialogDataBuilder(data === null || data === void 0 ? void 0 : data.confirmDeleteDialogData)
|
|
1716
|
+
.withDefault('confirmButtonLabel', 'Delete')
|
|
1717
|
+
.withDefault('type', 'delete')
|
|
1718
|
+
.withDefault('text', ['Do you really want to delete this entity?'])
|
|
1719
|
+
.withDefault('title', 'Delete')
|
|
1720
|
+
.getResult();
|
|
1721
|
+
return new EditDialogDataInternal((data === null || data === void 0 ? void 0 : data.title) ? data.title : () => 'Edit', (data === null || data === void 0 ? void 0 : data.confirmButtonLabel) ? data.confirmButtonLabel : 'Save', (data === null || data === void 0 ? void 0 : data.deleteButtonLabel) ? data.deleteButtonLabel : 'Delete', (data === null || data === void 0 ? void 0 : data.cancelButtonLabel) ? data.cancelButtonLabel : 'Cancel', (data === null || data === void 0 ? void 0 : data.deleteRequiresConfirmDialog) ? data.deleteRequiresConfirmDialog : true, (data === null || data === void 0 ? void 0 : data.editRequiresConfirmDialog) ? data.editRequiresConfirmDialog : false, confirmDeleteDialogData, confirmEditDialogData);
|
|
1722
|
+
}
|
|
1723
|
+
}
|
|
1724
|
+
|
|
1725
|
+
/**
|
|
1726
|
+
* The internal EditEntityDialogData. Requires all default values the user can leave out.
|
|
1727
|
+
*/
|
|
1728
|
+
class EditEntityDialogDataInternal {
|
|
1729
|
+
constructor(entity, EntityServiceClass, editDialogData, allowDelete) {
|
|
1730
|
+
this.entity = entity;
|
|
1731
|
+
this.EntityServiceClass = EntityServiceClass;
|
|
1732
|
+
this.editDialogData = editDialogData;
|
|
1733
|
+
this.allowDelete = allowDelete;
|
|
1734
|
+
}
|
|
1735
|
+
}
|
|
1736
|
+
/**
|
|
1737
|
+
* The Builder for the EditEntityDialogData. Sets default values.
|
|
1738
|
+
*/
|
|
1739
|
+
class EditEntityDialogDataBuilder extends BaseBuilder {
|
|
1740
|
+
constructor(data) {
|
|
1741
|
+
super(data);
|
|
1742
|
+
}
|
|
1743
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1744
|
+
generateBaseData(data) {
|
|
1745
|
+
const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
|
|
1746
|
+
return new EditEntityDialogDataInternal(data.entity, data.EntityServiceClass, editDialogData, data.allowDelete ? data.allowDelete : () => true);
|
|
1747
|
+
}
|
|
1748
|
+
}
|
|
1749
|
+
|
|
1750
|
+
/**
|
|
1751
|
+
* The default dialog used to edit an existing entity based on the configuration passed in the MAT_DIALOG_DATA "inputData".
|
|
1752
|
+
* Used by the ngx-mat-entity-table.
|
|
1753
|
+
*
|
|
1754
|
+
* It offers a lot of customization options which can be found in "EditEntityDialogData".
|
|
1755
|
+
*/
|
|
1046
1756
|
class NgxMatEntityEditDialogComponent {
|
|
1047
|
-
constructor(
|
|
1048
|
-
this.
|
|
1757
|
+
constructor(inputData, dialogRef, injector, dialog) {
|
|
1758
|
+
this.inputData = inputData;
|
|
1049
1759
|
this.dialogRef = dialogRef;
|
|
1050
1760
|
this.injector = injector;
|
|
1051
1761
|
this.dialog = dialog;
|
|
@@ -1053,42 +1763,31 @@ class NgxMatEntityEditDialogComponent {
|
|
|
1053
1763
|
this.getWidth = EntityUtilities.getWidth;
|
|
1054
1764
|
}
|
|
1055
1765
|
ngOnInit() {
|
|
1766
|
+
this.data = new EditEntityDialogDataBuilder(this.inputData).getResult();
|
|
1056
1767
|
this.dialogRef.disableClose = true;
|
|
1057
|
-
this.
|
|
1768
|
+
this.entityRows = EntityUtilities.getEntityRows(this.data.entity, false, true);
|
|
1058
1769
|
this.entityService = this.injector.get(this.data.EntityServiceClass);
|
|
1059
1770
|
this.entityPriorChanges = cloneDeep(this.data.entity);
|
|
1060
1771
|
}
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
.sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
|
|
1066
|
-
}
|
|
1772
|
+
/**
|
|
1773
|
+
* Tries to save the changes and close the dialog afterwards.
|
|
1774
|
+
* Also handles the confirmation if required.
|
|
1775
|
+
*/
|
|
1067
1776
|
edit() {
|
|
1068
|
-
|
|
1069
|
-
if (this.data.editDialogData.editRequiresConfirmDialog === false) {
|
|
1777
|
+
if (!this.data.editDialogData.editRequiresConfirmDialog) {
|
|
1070
1778
|
return this.confirmEdit();
|
|
1071
1779
|
}
|
|
1072
|
-
const dialogData =
|
|
1073
|
-
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
// eslint-disable-next-line max-len
|
|
1079
|
-
cancelButtonLabel: ((_e = this.data.editDialogData.confirmEditDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = this.data.editDialogData.confirmEditDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
|
|
1080
|
-
title: ((_g = this.data.editDialogData.confirmEditDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = this.data.editDialogData.confirmEditDialogData) === null || _h === void 0 ? void 0 : _h.title : 'Edit',
|
|
1081
|
-
// eslint-disable-next-line max-len
|
|
1082
|
-
requireConfirmation: ((_j = this.data.editDialogData.confirmEditDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = this.data.editDialogData.confirmEditDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
|
|
1083
|
-
// eslint-disable-next-line max-len
|
|
1084
|
-
confirmationText: ((_l = this.data.editDialogData.confirmEditDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = this.data.editDialogData.confirmEditDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined,
|
|
1085
|
-
};
|
|
1086
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1780
|
+
const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmEditDialogData)
|
|
1781
|
+
.withDefault('text', ['Do you really want to save all changes?'])
|
|
1782
|
+
.withDefault('confirmButtonLabel', 'Save')
|
|
1783
|
+
.withDefault('title', 'Edit')
|
|
1784
|
+
.getResult();
|
|
1785
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1087
1786
|
data: dialogData,
|
|
1088
1787
|
autoFocus: false,
|
|
1089
1788
|
restoreFocus: false
|
|
1090
1789
|
});
|
|
1091
|
-
|
|
1790
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1092
1791
|
if (res === 1) {
|
|
1093
1792
|
this.confirmEdit();
|
|
1094
1793
|
}
|
|
@@ -1097,50 +1796,47 @@ class NgxMatEntityEditDialogComponent {
|
|
|
1097
1796
|
confirmEdit() {
|
|
1098
1797
|
this.entityService.update(this.data.entity, this.entityPriorChanges).then(() => this.dialogRef.close(1));
|
|
1099
1798
|
}
|
|
1799
|
+
/**
|
|
1800
|
+
* Tries to delete the entity and close the dialog afterwards.
|
|
1801
|
+
* Also handles the confirmation if required.
|
|
1802
|
+
*/
|
|
1100
1803
|
delete() {
|
|
1101
|
-
|
|
1102
|
-
if (this.data.editDialogData.deleteRequiresConfirmDialog === false) {
|
|
1804
|
+
if (!this.data.editDialogData.deleteRequiresConfirmDialog) {
|
|
1103
1805
|
return this.confirmDelete();
|
|
1104
1806
|
}
|
|
1105
|
-
const dialogData =
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
cancelButtonLabel: ((_e = this.data.editDialogData.confirmDeleteDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = this.data.editDialogData.confirmDeleteDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
|
|
1113
|
-
// eslint-disable-next-line max-len
|
|
1114
|
-
title: ((_g = this.data.editDialogData.confirmDeleteDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = this.data.editDialogData.confirmDeleteDialogData) === null || _h === void 0 ? void 0 : _h.title : 'Delete',
|
|
1115
|
-
// eslint-disable-next-line max-len
|
|
1116
|
-
requireConfirmation: ((_j = this.data.editDialogData.confirmDeleteDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = this.data.editDialogData.confirmDeleteDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
|
|
1117
|
-
// eslint-disable-next-line max-len
|
|
1118
|
-
confirmationText: ((_l = this.data.editDialogData.confirmDeleteDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = this.data.editDialogData.confirmDeleteDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined,
|
|
1119
|
-
};
|
|
1120
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1807
|
+
const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmDeleteDialogData)
|
|
1808
|
+
.withDefault('text', ['Do you really want to delete this entity?'])
|
|
1809
|
+
.withDefault('type', 'delete')
|
|
1810
|
+
.withDefault('confirmButtonLabel', 'Delete')
|
|
1811
|
+
.withDefault('title', 'Delete')
|
|
1812
|
+
.getResult();
|
|
1813
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1121
1814
|
data: dialogData,
|
|
1122
1815
|
autoFocus: false,
|
|
1123
1816
|
restoreFocus: false
|
|
1124
1817
|
});
|
|
1125
|
-
|
|
1818
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1126
1819
|
if (res === 1) {
|
|
1127
1820
|
this.confirmDelete();
|
|
1128
1821
|
}
|
|
1129
1822
|
});
|
|
1130
1823
|
}
|
|
1131
1824
|
confirmDelete() {
|
|
1132
|
-
this.entityService.delete(this.entityPriorChanges
|
|
1825
|
+
this.entityService.delete(this.entityPriorChanges).then(() => this.dialogRef.close(2));
|
|
1133
1826
|
}
|
|
1827
|
+
/**
|
|
1828
|
+
* Reverts all changes made and closes the dialog.
|
|
1829
|
+
*/
|
|
1134
1830
|
cancel() {
|
|
1135
1831
|
EntityUtilities.resetChangesOnEntity(this.data.entity, this.entityPriorChanges);
|
|
1136
1832
|
this.dialogRef.close(0);
|
|
1137
1833
|
}
|
|
1138
1834
|
}
|
|
1139
1835
|
NgxMatEntityEditDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }, { token: i0.Injector }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
1140
|
-
NgxMatEntityEditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityEditDialogComponent, selector: "ngx-mat-entity-edit-dialog", ngImport: i0, template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel
|
|
1836
|
+
NgxMatEntityEditDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityEditDialogComponent, selector: "ngx-mat-entity-edit-dialog", ngImport: i0, template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel}}\n </button>\n</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForEdit]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'update') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n {{data.editDialogData.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.editDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"], components: [{ type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NgxMatEntityInputComponent, selector: "ngx-mat-entity-input", inputs: ["entity", "propertyKey", "getValidationErrorMessage", "hideOmitForCreate", "hideOmitForEdit"] }], directives: [{ type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i14.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i14.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i14.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
1141
1837
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogComponent, decorators: [{
|
|
1142
1838
|
type: Component,
|
|
1143
|
-
args: [{ selector: 'ngx-mat-entity-edit-dialog', template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel
|
|
1839
|
+
args: [{ selector: 'ngx-mat-entity-edit-dialog', template: "<h2 mat-dialog-title>\n {{data.editDialogData.title(data.entity)}}\n <button *ngIf=\"data.allowDelete(data.entity)\" mat-raised-button (click)=\"delete()\" color=\"warn\" class=\"delete-button\" tabindex=\"-1\">\n {{data.editDialogData.deleteButtonLabel}}\n </button>\n</h2>\n\n<mat-dialog-content>\n <form #form=\"ngForm\" class=\"row\">\n <div class=\"row\" *ngFor=\"let row of entityRows\">\n <ngx-mat-entity-input\n *ngFor=\"let key of row.keys\"\n [entity]=\"data.entity\"\n [propertyKey]=\"key\"\n [hideOmitForEdit]=\"true\"\n class=\"col-lg-{{getWidth(data.entity, key, 'lg')}} col-md-{{getWidth(data.entity, key, 'md')}} col-sm-{{getWidth(data.entity, key, 'sm')}}\"\n >\n </ngx-mat-entity-input>\n </div>\n </form>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n <button mat-raised-button (click)=\"edit()\" [disabled]=\"!EntityUtilities.isEntityValid(data.entity, 'update') || !EntityUtilities.dirty(data.entity, entityPriorChanges)\">\n {{data.editDialogData.confirmButtonLabel}}\n </button>\n <button mat-raised-button (click)=\"cancel()\" class=\"cancel-button\">\n {{data.editDialogData.cancelButtonLabel}}\n </button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-actions{display:flex;justify-content:space-between}.delete-button{float:right}\n"] }]
|
|
1144
1840
|
}], ctorParameters: function () {
|
|
1145
1841
|
return [{ type: undefined, decorators: [{
|
|
1146
1842
|
type: Inject,
|
|
@@ -1148,6 +1844,115 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1148
1844
|
}] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }];
|
|
1149
1845
|
} });
|
|
1150
1846
|
|
|
1847
|
+
/**
|
|
1848
|
+
* The internal TableData. Requires all default values the user can leave out.
|
|
1849
|
+
*/
|
|
1850
|
+
class TableDataInternal {
|
|
1851
|
+
constructor(baseData, createDialogData, editDialogData) {
|
|
1852
|
+
this.baseData = baseData;
|
|
1853
|
+
this.createDialogData = createDialogData;
|
|
1854
|
+
this.editDialogData = editDialogData;
|
|
1855
|
+
}
|
|
1856
|
+
}
|
|
1857
|
+
/**
|
|
1858
|
+
* The Builder for the table BaseData. Sets default values.
|
|
1859
|
+
*/
|
|
1860
|
+
class BaseDataBuilder extends BaseBuilder {
|
|
1861
|
+
constructor(data) {
|
|
1862
|
+
super(data);
|
|
1863
|
+
}
|
|
1864
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1865
|
+
generateBaseData(data) {
|
|
1866
|
+
return new BaseDataInternal(data.title, data.displayColumns, data.EntityServiceClass, data.searchLabel ? data.searchLabel : 'Search', data.createButtonLabel ? data.createButtonLabel : 'Create', data.searchString ? data.searchString : defaultSearchFunction, data.allowCreate === false ? data.allowCreate : true, data.allowEdit ? data.allowEdit : () => true, data.allowDelete ? data.allowDelete : () => true, data.multiSelectActions ? data.multiSelectActions : [], data.multiSelectLabel ? data.multiSelectLabel : 'Actions', data.EntityClass, data.edit, data.create);
|
|
1867
|
+
}
|
|
1868
|
+
}
|
|
1869
|
+
/**
|
|
1870
|
+
* The internal TableData. Requires all default values the user can leave out.
|
|
1871
|
+
*/
|
|
1872
|
+
class BaseDataInternal {
|
|
1873
|
+
constructor(title, displayColumns, EntityServiceClass, searchLabel, createButtonLabel, searchString, allowCreate, allowEdit, allowDelete, multiSelectActions, multiSelectLabel, EntityClass, edit, create) {
|
|
1874
|
+
this.title = title;
|
|
1875
|
+
this.displayColumns = displayColumns;
|
|
1876
|
+
this.EntityServiceClass = EntityServiceClass;
|
|
1877
|
+
this.EntityClass = EntityClass;
|
|
1878
|
+
this.searchLabel = searchLabel;
|
|
1879
|
+
this.createButtonLabel = createButtonLabel;
|
|
1880
|
+
this.searchString = searchString;
|
|
1881
|
+
this.allowCreate = allowCreate;
|
|
1882
|
+
this.allowEdit = allowEdit;
|
|
1883
|
+
this.allowDelete = allowDelete;
|
|
1884
|
+
this.multiSelectActions = multiSelectActions;
|
|
1885
|
+
this.multiSelectLabel = multiSelectLabel;
|
|
1886
|
+
this.edit = edit;
|
|
1887
|
+
this.create = create;
|
|
1888
|
+
}
|
|
1889
|
+
}
|
|
1890
|
+
/**
|
|
1891
|
+
* The Builder for the complete TableData. Sets default values and validates user input.
|
|
1892
|
+
*/
|
|
1893
|
+
class TableDataBuilder extends BaseBuilder {
|
|
1894
|
+
constructor(data) {
|
|
1895
|
+
super(data);
|
|
1896
|
+
}
|
|
1897
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1898
|
+
generateBaseData(data) {
|
|
1899
|
+
const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
|
|
1900
|
+
const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
|
|
1901
|
+
const baseData = new BaseDataBuilder(data.baseData).getResult();
|
|
1902
|
+
return new TableDataInternal(baseData, createDialogData, editDialogData);
|
|
1903
|
+
}
|
|
1904
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1905
|
+
validateInput(data) {
|
|
1906
|
+
var _a;
|
|
1907
|
+
if (((_a = data.baseData.multiSelectActions) === null || _a === void 0 ? void 0 : _a.length) && data.baseData.displayColumns.find(dp => dp.displayName === 'select')) {
|
|
1908
|
+
throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
|
|
1909
|
+
Please choose a different name.`);
|
|
1910
|
+
}
|
|
1911
|
+
if ((data.baseData.allowEdit && data.baseData.allowEdit !== (() => false)
|
|
1912
|
+
|| data.baseData.allowDelete && data.baseData.allowDelete !== (() => false)
|
|
1913
|
+
|| data.baseData.allowCreate)
|
|
1914
|
+
&& !data.baseData.EntityClass) {
|
|
1915
|
+
throw new Error(`
|
|
1916
|
+
Missing required Input data "EntityClass".
|
|
1917
|
+
You can only omit this value if you can neither create or update entities.`);
|
|
1918
|
+
}
|
|
1919
|
+
if (data.baseData.allowCreate !== false && !data.baseData.create && !data.createDialogData) {
|
|
1920
|
+
throw new Error(`Missing required Input data "createDialogData".
|
|
1921
|
+
You can only omit this value when creation is disallowed or done with a custom create method.`);
|
|
1922
|
+
}
|
|
1923
|
+
if ((data.baseData.allowEdit !== (() => false)
|
|
1924
|
+
|| data.baseData.allowDelete !== (() => false))
|
|
1925
|
+
&& !data.baseData.edit
|
|
1926
|
+
&& !data.editDialogData) {
|
|
1927
|
+
throw new Error(`Missing required Input data "editDialogData".
|
|
1928
|
+
You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
|
|
1929
|
+
}
|
|
1930
|
+
}
|
|
1931
|
+
}
|
|
1932
|
+
/**
|
|
1933
|
+
* The default search function taken from googles mat table.
|
|
1934
|
+
* This will be used if no custom search function is provided by the configuration.
|
|
1935
|
+
*
|
|
1936
|
+
* It generates a string from an entity which is then used to compare it to the search input.
|
|
1937
|
+
*
|
|
1938
|
+
* @param entity - An entity that is in the search.
|
|
1939
|
+
* @returns The generated string of the given entity used for comparison with the search input.
|
|
1940
|
+
*/
|
|
1941
|
+
function defaultSearchFunction(entity) {
|
|
1942
|
+
const searchString = Object.keys(entity)
|
|
1943
|
+
.reduce((currentTerm, key) => {
|
|
1944
|
+
return `${currentTerm}${entity[key]}◬`;
|
|
1945
|
+
}, '')
|
|
1946
|
+
.toLowerCase();
|
|
1947
|
+
return searchString;
|
|
1948
|
+
}
|
|
1949
|
+
|
|
1950
|
+
/**
|
|
1951
|
+
* Generates a fully functional table for displaying, creating, updating and deleting entities
|
|
1952
|
+
* based on the configuration passed in the @Input "tableData".
|
|
1953
|
+
*
|
|
1954
|
+
* It offers a lot of customization options which can be found in "TableData".
|
|
1955
|
+
*/
|
|
1151
1956
|
class NgxMatEntityTableComponent {
|
|
1152
1957
|
constructor(dialog, injector) {
|
|
1153
1958
|
this.dialog = dialog;
|
|
@@ -1156,16 +1961,14 @@ class NgxMatEntityTableComponent {
|
|
|
1156
1961
|
this.dataSource = new MatTableDataSource();
|
|
1157
1962
|
this.selection = new SelectionModel(true, []);
|
|
1158
1963
|
}
|
|
1964
|
+
/**
|
|
1965
|
+
* Sets up all the configuration for the table and the EntityService.
|
|
1966
|
+
*/
|
|
1159
1967
|
ngOnInit() {
|
|
1160
|
-
|
|
1161
|
-
this.
|
|
1162
|
-
|
|
1163
|
-
|
|
1164
|
-
if ((_a = this.entitiesData.baseData.multiSelectActions) === null || _a === void 0 ? void 0 : _a.length) {
|
|
1165
|
-
if (givenDisplayColumns.find((s) => s === 'select')) {
|
|
1166
|
-
throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
|
|
1167
|
-
Please choose a different name.`);
|
|
1168
|
-
}
|
|
1968
|
+
this.data = new TableDataBuilder(this.tableData).getResult();
|
|
1969
|
+
this.entityService = this.injector.get(this.data.baseData.EntityServiceClass);
|
|
1970
|
+
const givenDisplayColumns = this.data.baseData.displayColumns.map((v) => v.displayName);
|
|
1971
|
+
if (this.data.baseData.multiSelectActions.length) {
|
|
1169
1972
|
this.displayedColumns = ['select'].concat(givenDisplayColumns);
|
|
1170
1973
|
}
|
|
1171
1974
|
else {
|
|
@@ -1173,83 +1976,52 @@ class NgxMatEntityTableComponent {
|
|
|
1173
1976
|
}
|
|
1174
1977
|
this.dataSource.sortingDataAccessor = (entity, header) => {
|
|
1175
1978
|
var _a;
|
|
1176
|
-
return (_a = this.
|
|
1979
|
+
return (_a = this.data.baseData.displayColumns.find((dp) => dp.displayName === header)) === null || _a === void 0 ? void 0 : _a.value(entity);
|
|
1177
1980
|
};
|
|
1178
1981
|
this.dataSource.sort = this.sort;
|
|
1179
|
-
if (this.
|
|
1180
|
-
this.dataSource.filterPredicate = (entity, filter) => {
|
|
1181
|
-
|
|
1182
|
-
const
|
|
1183
|
-
const
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
};
|
|
1187
|
-
}
|
|
1188
|
-
this.dataSource.filter = this.filter;
|
|
1189
|
-
this.dataSource.paginator = this.paginator;
|
|
1190
|
-
this.entityService.entitiesSubject.pipe(takeUntil(this.onDestroy)).subscribe((entities) => {
|
|
1191
|
-
this.dataSource.data = entities;
|
|
1192
|
-
this.selection.clear();
|
|
1193
|
-
});
|
|
1194
|
-
this.entityService.read();
|
|
1195
|
-
}
|
|
1196
|
-
validateInput() {
|
|
1197
|
-
if (!this.entitiesData.baseData.displayColumns) {
|
|
1198
|
-
throw new Error('Missing required Input data "displayColumns"');
|
|
1199
|
-
}
|
|
1200
|
-
if (!this.entitiesData.baseData.title) {
|
|
1201
|
-
throw new Error('Missing required Input data "title"');
|
|
1202
|
-
}
|
|
1203
|
-
if (!this.entitiesData.baseData.EntityServiceClass) {
|
|
1204
|
-
throw new Error('Missing required Input data "EntityServiceClass"');
|
|
1205
|
-
}
|
|
1206
|
-
if (this.entitiesData.baseData.allowCreate === undefined) {
|
|
1207
|
-
this.entitiesData.baseData.allowCreate = true;
|
|
1208
|
-
}
|
|
1209
|
-
if (this.entitiesData.baseData.allowEdit === undefined) {
|
|
1210
|
-
this.entitiesData.baseData.allowEdit = () => true;
|
|
1211
|
-
}
|
|
1212
|
-
if (this.entitiesData.baseData.allowDelete === undefined) {
|
|
1213
|
-
this.entitiesData.baseData.allowDelete = () => true;
|
|
1214
|
-
}
|
|
1215
|
-
if ((this.entitiesData.baseData.allowEdit !== (() => false)
|
|
1216
|
-
|| this.entitiesData.baseData.allowDelete !== (() => false)
|
|
1217
|
-
|| this.entitiesData.baseData.allowCreate)
|
|
1218
|
-
&& !this.entitiesData.baseData.EntityClass) {
|
|
1219
|
-
throw new Error(`
|
|
1220
|
-
Missing required Input data "EntityClass".
|
|
1221
|
-
You can only omit this value if you can neither create or update entities.`);
|
|
1222
|
-
}
|
|
1223
|
-
if (this.entitiesData.baseData.allowCreate && !this.entitiesData.baseData.create && !this.entitiesData.createDialogData) {
|
|
1224
|
-
throw new Error(`Missing required Input data "createDialogData".
|
|
1225
|
-
You can only omit this value when creation is disallowed or done with a custom create method.`);
|
|
1226
|
-
}
|
|
1227
|
-
if ((this.entitiesData.baseData.allowEdit !== (() => false)
|
|
1228
|
-
|| this.entitiesData.baseData.allowDelete !== (() => false))
|
|
1229
|
-
&& !this.entitiesData.baseData.edit
|
|
1230
|
-
&& !this.entitiesData.editDialogData) {
|
|
1231
|
-
throw new Error(`Missing required Input data "editDialogData".
|
|
1232
|
-
You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
|
|
1982
|
+
if (this.data.baseData.searchString) {
|
|
1983
|
+
this.dataSource.filterPredicate = (entity, filter) => {
|
|
1984
|
+
const searchStr = this.data.baseData.searchString(entity);
|
|
1985
|
+
const formattedSearchString = searchStr.toLowerCase();
|
|
1986
|
+
const formattedFilterString = filter.toLowerCase();
|
|
1987
|
+
return formattedSearchString.includes(formattedFilterString);
|
|
1988
|
+
};
|
|
1233
1989
|
}
|
|
1990
|
+
this.dataSource.filter = this.filter;
|
|
1991
|
+
this.dataSource.paginator = this.paginator;
|
|
1992
|
+
this.entityService.entitiesSubject.pipe(takeUntil(this.onDestroy)).subscribe((entities) => {
|
|
1993
|
+
this.dataSource.data = entities;
|
|
1994
|
+
this.selection.clear();
|
|
1995
|
+
});
|
|
1996
|
+
this.entityService.read();
|
|
1234
1997
|
}
|
|
1998
|
+
/**
|
|
1999
|
+
* Edits an entity. This either calls the edit-Method provided by the user or uses a default edit-dialog.
|
|
2000
|
+
*
|
|
2001
|
+
* @param entity - The entity that should be updated.
|
|
2002
|
+
* @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
|
|
2003
|
+
*/
|
|
1235
2004
|
editEntity(entity) {
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
2005
|
+
if (this.data.baseData.allowEdit(entity)) {
|
|
2006
|
+
if (!this.data.baseData.EntityClass) {
|
|
2007
|
+
throw new Error('No "EntityClass" specified for this table');
|
|
2008
|
+
}
|
|
2009
|
+
if (this.data.baseData.edit) {
|
|
2010
|
+
this.data.baseData.edit(new this.data.baseData.EntityClass(entity));
|
|
1240
2011
|
}
|
|
1241
2012
|
else {
|
|
1242
|
-
this.editDefault(new this.
|
|
2013
|
+
this.editDefault(new this.data.baseData.EntityClass(entity));
|
|
1243
2014
|
}
|
|
1244
2015
|
}
|
|
1245
2016
|
}
|
|
1246
2017
|
editDefault(entity) {
|
|
1247
|
-
const
|
|
2018
|
+
const inputDialogData = {
|
|
1248
2019
|
entity: entity,
|
|
1249
|
-
EntityServiceClass: this.
|
|
1250
|
-
allowDelete: this.
|
|
1251
|
-
editDialogData: this.
|
|
2020
|
+
EntityServiceClass: this.data.baseData.EntityServiceClass,
|
|
2021
|
+
allowDelete: this.data.baseData.allowDelete,
|
|
2022
|
+
editDialogData: this.data.editDialogData
|
|
1252
2023
|
};
|
|
2024
|
+
const dialogData = new EditEntityDialogDataBuilder(inputDialogData).getResult();
|
|
1253
2025
|
firstValueFrom(this.dialog.open(NgxMatEntityEditDialogComponent, {
|
|
1254
2026
|
data: dialogData,
|
|
1255
2027
|
minWidth: '60%',
|
|
@@ -1258,28 +2030,36 @@ class NgxMatEntityTableComponent {
|
|
|
1258
2030
|
}).afterClosed()).then((res) => {
|
|
1259
2031
|
if (res === 0) {
|
|
1260
2032
|
const data = this.dataSource.data;
|
|
1261
|
-
data[this.dataSource.data.findIndex((e) => e.
|
|
2033
|
+
data[this.dataSource.data.findIndex((e) => e[this.entityService.idKey] === entity[this.entityService.idKey])] = entity;
|
|
1262
2034
|
this.dataSource.data = data;
|
|
1263
2035
|
this.selection.clear();
|
|
1264
2036
|
}
|
|
1265
2037
|
});
|
|
1266
2038
|
}
|
|
2039
|
+
/**
|
|
2040
|
+
* Creates a new Entity. This either calls the create-Method provided by the user or uses a default create-dialog.
|
|
2041
|
+
*
|
|
2042
|
+
* @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
|
|
2043
|
+
*/
|
|
1267
2044
|
createEntity() {
|
|
1268
|
-
if (this.
|
|
1269
|
-
if (this.
|
|
1270
|
-
|
|
2045
|
+
if (this.data.baseData.allowCreate) {
|
|
2046
|
+
if (!this.data.baseData.EntityClass) {
|
|
2047
|
+
throw new Error('No "EntityClass" specified for this table');
|
|
2048
|
+
}
|
|
2049
|
+
if (this.data.baseData.create) {
|
|
2050
|
+
this.data.baseData.create(new this.data.baseData.EntityClass());
|
|
1271
2051
|
}
|
|
1272
2052
|
else {
|
|
1273
|
-
this.createDefault(new this.
|
|
2053
|
+
this.createDefault(new this.data.baseData.EntityClass());
|
|
1274
2054
|
}
|
|
1275
2055
|
}
|
|
1276
2056
|
}
|
|
1277
2057
|
createDefault(entity) {
|
|
1278
|
-
const dialogData = {
|
|
2058
|
+
const dialogData = new CreateEntityDialogDataBuilder({
|
|
1279
2059
|
entity: entity,
|
|
1280
|
-
EntityServiceClass: this.
|
|
1281
|
-
createDialogData: this.
|
|
1282
|
-
};
|
|
2060
|
+
EntityServiceClass: this.data.baseData.EntityServiceClass,
|
|
2061
|
+
createDialogData: this.data.createDialogData
|
|
2062
|
+
}).getResult();
|
|
1283
2063
|
this.dialog.open(NgxMatEntityCreateDialogComponent, {
|
|
1284
2064
|
data: dialogData,
|
|
1285
2065
|
minWidth: '60%',
|
|
@@ -1287,27 +2067,26 @@ class NgxMatEntityTableComponent {
|
|
|
1287
2067
|
restoreFocus: false
|
|
1288
2068
|
});
|
|
1289
2069
|
}
|
|
2070
|
+
/**
|
|
2071
|
+
* Runs the MultiAction for all selected entries.
|
|
2072
|
+
* Also handles confirmation with an additional dialog if configured.
|
|
2073
|
+
*
|
|
2074
|
+
* @param action - The MultiAction to run.
|
|
2075
|
+
*/
|
|
1290
2076
|
runMultiAction(action) {
|
|
1291
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
1292
2077
|
if (!action.requireConfirmDialog || !action.requireConfirmDialog(this.selection.selected)) {
|
|
1293
2078
|
return this.confirmRunMultiAction(action);
|
|
1294
2079
|
}
|
|
1295
|
-
const dialogData =
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
cancelButtonLabel: ((_e = action.confirmDialogData) === null || _e === void 0 ? void 0 : _e.cancelButtonLabel) ? (_f = action.confirmDialogData) === null || _f === void 0 ? void 0 : _f.cancelButtonLabel : 'Cancel',
|
|
1301
|
-
title: ((_g = action.confirmDialogData) === null || _g === void 0 ? void 0 : _g.title) ? (_h = action.confirmDialogData) === null || _h === void 0 ? void 0 : _h.title : action.displayName,
|
|
1302
|
-
requireConfirmation: ((_j = action.confirmDialogData) === null || _j === void 0 ? void 0 : _j.requireConfirmation) ? (_k = action.confirmDialogData) === null || _k === void 0 ? void 0 : _k.requireConfirmation : false,
|
|
1303
|
-
confirmationText: ((_l = action.confirmDialogData) === null || _l === void 0 ? void 0 : _l.confirmationText) ? (_m = action.confirmDialogData) === null || _m === void 0 ? void 0 : _m.confirmationText : undefined
|
|
1304
|
-
};
|
|
1305
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
2080
|
+
const dialogData = new ConfirmDialogDataBuilder(action.confirmDialogData)
|
|
2081
|
+
.withDefault('text', [`Do you really want to run this action on ${this.selection.selected.length} entries?`])
|
|
2082
|
+
.withDefault('title', action.displayName)
|
|
2083
|
+
.getResult();
|
|
2084
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1306
2085
|
data: dialogData,
|
|
1307
2086
|
autoFocus: false,
|
|
1308
2087
|
restoreFocus: false
|
|
1309
2088
|
});
|
|
1310
|
-
|
|
2089
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1311
2090
|
if (res === 1) {
|
|
1312
2091
|
this.confirmRunMultiAction(action);
|
|
1313
2092
|
}
|
|
@@ -1316,6 +2095,12 @@ class NgxMatEntityTableComponent {
|
|
|
1316
2095
|
confirmRunMultiAction(action) {
|
|
1317
2096
|
action.action(this.selection.selected);
|
|
1318
2097
|
}
|
|
2098
|
+
/**
|
|
2099
|
+
* Checks if an MultiAction is disabled (e.g. Because no entries have been selected).
|
|
2100
|
+
*
|
|
2101
|
+
* @param action - The MultiAction to check.
|
|
2102
|
+
* @returns Whether or not the Action can be used.
|
|
2103
|
+
*/
|
|
1319
2104
|
multiActionDisabled(action) {
|
|
1320
2105
|
var _a;
|
|
1321
2106
|
if (!this.selection.selected.length) {
|
|
@@ -1326,6 +2111,9 @@ class NgxMatEntityTableComponent {
|
|
|
1326
2111
|
}
|
|
1327
2112
|
return false;
|
|
1328
2113
|
}
|
|
2114
|
+
/**
|
|
2115
|
+
* Toggles all entries in the table.
|
|
2116
|
+
*/
|
|
1329
2117
|
masterToggle() {
|
|
1330
2118
|
if (this.isAllSelected()) {
|
|
1331
2119
|
this.selection.clear();
|
|
@@ -1334,6 +2122,12 @@ class NgxMatEntityTableComponent {
|
|
|
1334
2122
|
this.dataSource.data.forEach((row) => this.selection.select(row));
|
|
1335
2123
|
}
|
|
1336
2124
|
}
|
|
2125
|
+
/**
|
|
2126
|
+
* Checks if all entries in the table have been selected.
|
|
2127
|
+
* This is needed to display the "masterToggle"-checkbox correctly.
|
|
2128
|
+
*
|
|
2129
|
+
* @returns Whether or not all entries in the table have been selected.
|
|
2130
|
+
*/
|
|
1337
2131
|
isAllSelected() {
|
|
1338
2132
|
const numSelected = this.selection.selected.length;
|
|
1339
2133
|
const numRows = this.dataSource.data.length;
|
|
@@ -1343,17 +2137,22 @@ class NgxMatEntityTableComponent {
|
|
|
1343
2137
|
this.onDestroy.next(undefined);
|
|
1344
2138
|
this.onDestroy.complete();
|
|
1345
2139
|
}
|
|
2140
|
+
/**
|
|
2141
|
+
* Applies the search input to filter the table entries.
|
|
2142
|
+
*
|
|
2143
|
+
* @param event - The keyup-event which contains the search-string of the user.
|
|
2144
|
+
*/
|
|
1346
2145
|
applyFilter(event) {
|
|
1347
2146
|
const filterValue = event.target.value;
|
|
1348
2147
|
this.dataSource.filter = filterValue.trim().toLowerCase();
|
|
1349
2148
|
}
|
|
1350
2149
|
}
|
|
1351
2150
|
NgxMatEntityTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableComponent, deps: [{ token: i1.MatDialog }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
1352
|
-
NgxMatEntityTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityTableComponent, selector: "ngx-mat-entity-table", inputs: {
|
|
2151
|
+
NgxMatEntityTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityTableComponent, selector: "ngx-mat-entity-table", inputs: { tableData: "tableData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ["filter"], descendants: true, static: true }], ngImport: i0, template: "<h1 class=\"title\">{{data.baseData.title}}</h1>\n\n<div class=\"row\">\n <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n <mat-label>{{data.baseData.searchLabel}}</mat-label>\n <input matInput (keyup)=\"applyFilter($event)\" />\n </mat-form-field>\n <div\n *ngIf=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-2]=\"data.baseData.allowCreate\"\n [class.col-lg-4]=\"!data.baseData.allowCreate\"\n [class.col-md-3]=\"data.baseData.allowCreate\"\n [class.col-md-6]=\"!data.baseData.allowCreate\"\n [class.col-sm-6]=\"data.baseData.allowCreate\"\n [class.col-sm-12]=\"!data.baseData.allowCreate\"\n >\n <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n {{data.baseData.multiSelectLabel}}\n </button>\n </div>\n <mat-menu #menu=\"matMenu\">\n <button *ngFor=\"let action of data.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n {{action.displayName}}\n </button>\n </mat-menu>\n\n <div\n *ngIf=\"data.baseData.allowCreate\"\n [class.col-lg-2]=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-4]=\"!data.baseData.multiSelectActions.length\"\n [class.col-md-3]=\"data.baseData.multiSelectActions.length\"\n [class.col-md-6]=\"!data.baseData.multiSelectActions.length\"\n [class.col-sm-6]=\"data.baseData.multiSelectActions.length\"\n [class.col-sm-12]=\"!data.baseData.multiSelectActions.length\"\n >\n <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n {{data.baseData.createButtonLabel}}\n </button>\n </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngFor=\"let dCol of data.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" [class.enabled]=\"data.baseData.allowEdit(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button,.create-button{margin-bottom:15px}}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i6.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i2.MatLabel, selector: "mat-label" }, { type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i9.MatCellDef, selector: "[matCellDef]" }, { type: i9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }] });
|
|
1353
2152
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableComponent, decorators: [{
|
|
1354
2153
|
type: Component,
|
|
1355
|
-
args: [{ selector: 'ngx-mat-entity-table', template: "<h1 class=\"title\">{{
|
|
1356
|
-
}], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: {
|
|
2154
|
+
args: [{ selector: 'ngx-mat-entity-table', template: "<h1 class=\"title\">{{data.baseData.title}}</h1>\n\n<div class=\"row\">\n <mat-form-field class=\"col-lg-8 col-md-6 col-sm-12\">\n <mat-label>{{data.baseData.searchLabel}}</mat-label>\n <input matInput (keyup)=\"applyFilter($event)\" />\n </mat-form-field>\n <div\n *ngIf=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-2]=\"data.baseData.allowCreate\"\n [class.col-lg-4]=\"!data.baseData.allowCreate\"\n [class.col-md-3]=\"data.baseData.allowCreate\"\n [class.col-md-6]=\"!data.baseData.allowCreate\"\n [class.col-sm-6]=\"data.baseData.allowCreate\"\n [class.col-sm-12]=\"!data.baseData.allowCreate\"\n >\n <button class=\"actions-button\" [matMenuTriggerFor]=\"menu\" mat-raised-button>\n {{data.baseData.multiSelectLabel}}\n </button>\n </div>\n <mat-menu #menu=\"matMenu\">\n <button *ngFor=\"let action of data.baseData.multiSelectActions\" [disabled]=\"multiActionDisabled(action)\" (click)=\"runMultiAction(action)\" mat-menu-item>\n {{action.displayName}}\n </button>\n </mat-menu>\n\n <div\n *ngIf=\"data.baseData.allowCreate\"\n [class.col-lg-2]=\"data.baseData.multiSelectActions.length\"\n [class.col-lg-4]=\"!data.baseData.multiSelectActions.length\"\n [class.col-md-3]=\"data.baseData.multiSelectActions.length\"\n [class.col-md-6]=\"!data.baseData.multiSelectActions.length\"\n [class.col-sm-6]=\"data.baseData.multiSelectActions.length\"\n [class.col-sm-12]=\"!data.baseData.multiSelectActions.length\"\n >\n <button class=\"create-button\" (click)=\"createEntity()\" mat-raised-button>\n {{data.baseData.createButtonLabel}}\n </button>\n </div>\n</div>\n\n<div class=\"mat-elevation-z8\">\n <mat-table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" matSort>\n <!-- select Column -->\n <ng-container matColumnDef=\"select\">\n <mat-header-cell *matHeaderCellDef>\n <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\" [indeterminate]=\"selection.hasValue() && !isAllSelected()\"> </mat-checkbox>\n </mat-header-cell>\n <mat-cell *matCellDef=\"let module\" class=\"module\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(module) : null\" [checked]=\"selection.isSelected(module)\"> </mat-checkbox>\n </mat-cell>\n </ng-container>\n\n <ng-container *ngFor=\"let dCol of data.baseData.displayColumns\" [matColumnDef]=\"dCol.displayName\">\n <mat-header-cell *matHeaderCellDef mat-sort-header>\n {{dCol.displayName}}\n </mat-header-cell>\n <mat-cell class=\"entity\" [class.enabled]=\"data.baseData.allowEdit(entity)\" (click)=\"editEntity(entity)\" *matCellDef=\"let entity\">\n {{dCol.value(entity)}}\n </mat-cell>\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: displayedColumns\"></mat-row>\n </mat-table>\n\n <mat-paginator *ngIf=\"dataSource\" id=\"paginator\" [length]=\"dataSource.filteredData.length\" [pageIndex]=\"0\" [pageSize]=\"10\" [pageSizeOptions]=\"[5, 10, 25, 50]\"> </mat-paginator>\n</div>\n", styles: [".title{text-align:center}button{width:100%}.mat-column-select{flex:0 0 75px}.enabled:hover{cursor:pointer}@media (max-width: 767px){.actions-button,.create-button{margin-bottom:15px}}\n"] }]
|
|
2155
|
+
}], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: { tableData: [{
|
|
1357
2156
|
type: Input
|
|
1358
2157
|
}], paginator: [{
|
|
1359
2158
|
type: ViewChild,
|
|
@@ -1366,421 +2165,342 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1366
2165
|
args: ['filter', { static: true }]
|
|
1367
2166
|
}] } });
|
|
1368
2167
|
|
|
1369
|
-
class
|
|
2168
|
+
class NgxMatEntityCreateDialogModule {
|
|
1370
2169
|
}
|
|
1371
|
-
|
|
1372
|
-
|
|
1373
|
-
|
|
2170
|
+
NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2171
|
+
NgxMatEntityCreateDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, declarations: [NgxMatEntityCreateDialogComponent], imports: [CommonModule,
|
|
2172
|
+
NgxMatEntityInputModule,
|
|
2173
|
+
MatDialogModule,
|
|
1374
2174
|
FormsModule,
|
|
1375
|
-
|
|
1376
|
-
|
|
1377
|
-
MatTableModule,
|
|
1378
|
-
MatPaginatorModule,
|
|
1379
|
-
MatButtonModule,
|
|
1380
|
-
MatMenuModule,
|
|
1381
|
-
MatDialogModule], exports: [NgxMatEntityTableComponent] });
|
|
1382
|
-
NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
|
|
2175
|
+
MatButtonModule], exports: [NgxMatEntityCreateDialogComponent] });
|
|
2176
|
+
NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[
|
|
1383
2177
|
CommonModule,
|
|
1384
|
-
|
|
2178
|
+
NgxMatEntityInputModule,
|
|
2179
|
+
MatDialogModule,
|
|
1385
2180
|
FormsModule,
|
|
1386
|
-
|
|
1387
|
-
MatCheckboxModule,
|
|
1388
|
-
MatTableModule,
|
|
1389
|
-
MatPaginatorModule,
|
|
1390
|
-
MatButtonModule,
|
|
1391
|
-
MatMenuModule,
|
|
1392
|
-
MatDialogModule
|
|
2181
|
+
MatButtonModule
|
|
1393
2182
|
]] });
|
|
1394
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type:
|
|
2183
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
|
|
1395
2184
|
type: NgModule,
|
|
1396
2185
|
args: [{
|
|
1397
|
-
declarations: [
|
|
2186
|
+
declarations: [NgxMatEntityCreateDialogComponent],
|
|
1398
2187
|
imports: [
|
|
1399
2188
|
CommonModule,
|
|
1400
|
-
|
|
2189
|
+
NgxMatEntityInputModule,
|
|
2190
|
+
MatDialogModule,
|
|
1401
2191
|
FormsModule,
|
|
1402
|
-
|
|
1403
|
-
MatCheckboxModule,
|
|
1404
|
-
MatTableModule,
|
|
1405
|
-
MatPaginatorModule,
|
|
1406
|
-
MatButtonModule,
|
|
1407
|
-
MatMenuModule,
|
|
1408
|
-
MatDialogModule
|
|
2192
|
+
MatButtonModule
|
|
1409
2193
|
],
|
|
1410
|
-
exports: [
|
|
2194
|
+
exports: [NgxMatEntityCreateDialogComponent]
|
|
1411
2195
|
}]
|
|
1412
2196
|
}] });
|
|
1413
2197
|
|
|
1414
|
-
class
|
|
2198
|
+
class NgxMatEntityEditDialogModule {
|
|
1415
2199
|
}
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
2200
|
+
NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2201
|
+
NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
|
|
2202
|
+
NgxMatEntityInputModule,
|
|
2203
|
+
MatDialogModule,
|
|
1419
2204
|
FormsModule,
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
MatCheckboxModule,
|
|
1424
|
-
MatSlideToggleModule,
|
|
1425
|
-
MatTableModule], exports: [NgxMatEntityInternalInputComponent] });
|
|
1426
|
-
NgxMatEntityInternalInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, imports: [[
|
|
2205
|
+
MatButtonModule,
|
|
2206
|
+
NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
|
|
2207
|
+
NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
|
|
1427
2208
|
CommonModule,
|
|
1428
|
-
|
|
2209
|
+
NgxMatEntityInputModule,
|
|
2210
|
+
MatDialogModule,
|
|
1429
2211
|
FormsModule,
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
MatAutocompleteModule,
|
|
1433
|
-
MatCheckboxModule,
|
|
1434
|
-
MatSlideToggleModule,
|
|
1435
|
-
MatTableModule
|
|
2212
|
+
MatButtonModule,
|
|
2213
|
+
NgxMatEntityConfirmDialogModule
|
|
1436
2214
|
]] });
|
|
1437
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type:
|
|
2215
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
|
|
1438
2216
|
type: NgModule,
|
|
1439
2217
|
args: [{
|
|
1440
|
-
declarations: [
|
|
2218
|
+
declarations: [NgxMatEntityEditDialogComponent],
|
|
1441
2219
|
imports: [
|
|
1442
2220
|
CommonModule,
|
|
1443
|
-
|
|
2221
|
+
NgxMatEntityInputModule,
|
|
2222
|
+
MatDialogModule,
|
|
1444
2223
|
FormsModule,
|
|
1445
|
-
|
|
1446
|
-
|
|
1447
|
-
MatAutocompleteModule,
|
|
1448
|
-
MatCheckboxModule,
|
|
1449
|
-
MatSlideToggleModule,
|
|
1450
|
-
MatTableModule
|
|
2224
|
+
MatButtonModule,
|
|
2225
|
+
NgxMatEntityConfirmDialogModule
|
|
1451
2226
|
],
|
|
1452
|
-
exports: [
|
|
1453
|
-
}]
|
|
1454
|
-
}] });
|
|
1455
|
-
|
|
1456
|
-
class NgxMatEntityAddArrayItemDialogModule {
|
|
1457
|
-
}
|
|
1458
|
-
NgxMatEntityAddArrayItemDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1459
|
-
NgxMatEntityAddArrayItemDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, declarations: [NgxMatEntityAddArrayItemDialogComponent], imports: [CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule], exports: [NgxMatEntityAddArrayItemDialogComponent] });
|
|
1460
|
-
NgxMatEntityAddArrayItemDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, imports: [[CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
|
|
1461
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, decorators: [{
|
|
1462
|
-
type: NgModule,
|
|
1463
|
-
args: [{
|
|
1464
|
-
declarations: [NgxMatEntityAddArrayItemDialogComponent],
|
|
1465
|
-
imports: [CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule],
|
|
1466
|
-
exports: [NgxMatEntityAddArrayItemDialogComponent]
|
|
2227
|
+
exports: [NgxMatEntityEditDialogComponent]
|
|
1467
2228
|
}]
|
|
1468
2229
|
}] });
|
|
1469
2230
|
|
|
1470
|
-
class
|
|
2231
|
+
class NgxMatEntityTableModule {
|
|
1471
2232
|
}
|
|
1472
|
-
|
|
1473
|
-
|
|
2233
|
+
NgxMatEntityTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2234
|
+
NgxMatEntityTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, declarations: [NgxMatEntityTableComponent], imports: [CommonModule,
|
|
1474
2235
|
MatInputModule,
|
|
1475
2236
|
FormsModule,
|
|
1476
2237
|
MatFormFieldModule,
|
|
1477
|
-
MatSelectModule,
|
|
1478
|
-
MatAutocompleteModule,
|
|
1479
2238
|
MatCheckboxModule,
|
|
1480
|
-
MatSlideToggleModule,
|
|
1481
2239
|
MatTableModule,
|
|
1482
|
-
|
|
2240
|
+
MatPaginatorModule,
|
|
1483
2241
|
MatButtonModule,
|
|
1484
|
-
|
|
1485
|
-
|
|
2242
|
+
MatMenuModule,
|
|
2243
|
+
MatDialogModule,
|
|
2244
|
+
NgxMatEntityCreateDialogModule,
|
|
2245
|
+
NgxMatEntityEditDialogModule], exports: [NgxMatEntityTableComponent] });
|
|
2246
|
+
NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
|
|
1486
2247
|
CommonModule,
|
|
1487
2248
|
MatInputModule,
|
|
1488
2249
|
FormsModule,
|
|
1489
2250
|
MatFormFieldModule,
|
|
1490
|
-
MatSelectModule,
|
|
1491
|
-
MatAutocompleteModule,
|
|
1492
2251
|
MatCheckboxModule,
|
|
1493
|
-
MatSlideToggleModule,
|
|
1494
2252
|
MatTableModule,
|
|
1495
|
-
|
|
2253
|
+
MatPaginatorModule,
|
|
1496
2254
|
MatButtonModule,
|
|
1497
|
-
|
|
2255
|
+
MatMenuModule,
|
|
2256
|
+
MatDialogModule,
|
|
2257
|
+
NgxMatEntityCreateDialogModule,
|
|
2258
|
+
NgxMatEntityEditDialogModule,
|
|
1498
2259
|
]] });
|
|
1499
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type:
|
|
2260
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
|
|
1500
2261
|
type: NgModule,
|
|
1501
2262
|
args: [{
|
|
1502
|
-
declarations: [
|
|
2263
|
+
declarations: [NgxMatEntityTableComponent],
|
|
1503
2264
|
imports: [
|
|
1504
2265
|
CommonModule,
|
|
1505
2266
|
MatInputModule,
|
|
1506
2267
|
FormsModule,
|
|
1507
2268
|
MatFormFieldModule,
|
|
1508
|
-
MatSelectModule,
|
|
1509
|
-
MatAutocompleteModule,
|
|
1510
2269
|
MatCheckboxModule,
|
|
1511
|
-
MatSlideToggleModule,
|
|
1512
2270
|
MatTableModule,
|
|
1513
|
-
|
|
2271
|
+
MatPaginatorModule,
|
|
1514
2272
|
MatButtonModule,
|
|
1515
|
-
|
|
2273
|
+
MatMenuModule,
|
|
2274
|
+
MatDialogModule,
|
|
2275
|
+
NgxMatEntityCreateDialogModule,
|
|
2276
|
+
NgxMatEntityEditDialogModule,
|
|
1516
2277
|
],
|
|
1517
|
-
exports: [
|
|
2278
|
+
exports: [NgxMatEntityTableComponent]
|
|
1518
2279
|
}]
|
|
1519
2280
|
}] });
|
|
1520
2281
|
|
|
1521
|
-
|
|
2282
|
+
/**
|
|
2283
|
+
* The internal EntityArrayDecoratorConfig. Sets default values.
|
|
2284
|
+
*/
|
|
2285
|
+
class EntityArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2286
|
+
constructor(data) {
|
|
2287
|
+
super(data);
|
|
2288
|
+
this.createInline = data.createInline != undefined ? data.createInline : true;
|
|
2289
|
+
this.displayStyle = data.displayStyle;
|
|
2290
|
+
this.itemType = data.itemType;
|
|
2291
|
+
this.EntityClass = data.EntityClass;
|
|
2292
|
+
this.displayColumns = data.displayColumns;
|
|
2293
|
+
this.createInline = data.createInline != undefined ? data.createInline : true;
|
|
2294
|
+
this.missingErrorMessage = data.missingErrorMessage ? data.missingErrorMessage : 'Needs to contain at least one value';
|
|
2295
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [12, 12, 12];
|
|
2296
|
+
this.addButtonLabel = data.addButtonLabel ? data.addButtonLabel : 'Add';
|
|
2297
|
+
this.removeButtonLabel = data.removeButtonLabel ? data.removeButtonLabel : 'Remove';
|
|
2298
|
+
}
|
|
1522
2299
|
}
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
MatInputModule,
|
|
1538
|
-
FormsModule,
|
|
1539
|
-
MatFormFieldModule,
|
|
1540
|
-
MatSelectModule,
|
|
1541
|
-
MatAutocompleteModule,
|
|
1542
|
-
MatCheckboxModule,
|
|
1543
|
-
MatSlideToggleModule,
|
|
1544
|
-
NgxMatEntityArrayTableModule,
|
|
1545
|
-
MatChipsModule,
|
|
1546
|
-
MatIconModule
|
|
1547
|
-
]] });
|
|
1548
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
|
|
1549
|
-
type: NgModule,
|
|
1550
|
-
args: [{
|
|
1551
|
-
declarations: [NgxMatEntityInputComponent],
|
|
1552
|
-
imports: [
|
|
1553
|
-
CommonModule,
|
|
1554
|
-
MatInputModule,
|
|
1555
|
-
FormsModule,
|
|
1556
|
-
MatFormFieldModule,
|
|
1557
|
-
MatSelectModule,
|
|
1558
|
-
MatAutocompleteModule,
|
|
1559
|
-
MatCheckboxModule,
|
|
1560
|
-
MatSlideToggleModule,
|
|
1561
|
-
NgxMatEntityArrayTableModule,
|
|
1562
|
-
MatChipsModule,
|
|
1563
|
-
MatIconModule
|
|
1564
|
-
],
|
|
1565
|
-
exports: [NgxMatEntityInputComponent]
|
|
1566
|
-
}]
|
|
1567
|
-
}] });
|
|
1568
|
-
|
|
1569
|
-
class NgxMatEntityCreateDialogModule {
|
|
2300
|
+
/**
|
|
2301
|
+
* The internal StringChipsArrayDecoratorConfig. Sets default values.
|
|
2302
|
+
*/
|
|
2303
|
+
class StringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2304
|
+
constructor(data) {
|
|
2305
|
+
super(data);
|
|
2306
|
+
this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
|
|
2307
|
+
this.displayStyle = data.displayStyle;
|
|
2308
|
+
this.itemType = data.itemType;
|
|
2309
|
+
this.maxLength = data.maxLength;
|
|
2310
|
+
this.minLength = data.minLength;
|
|
2311
|
+
this.regex = data.regex;
|
|
2312
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
|
|
2313
|
+
}
|
|
1570
2314
|
}
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
2315
|
+
/**
|
|
2316
|
+
* The internal AutocompleteStringChipsArrayDecoratorConfig. Sets default values.
|
|
2317
|
+
*/
|
|
2318
|
+
class AutocompleteStringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2319
|
+
constructor(data) {
|
|
2320
|
+
super(data);
|
|
2321
|
+
this.autocompleteValues = data.autocompleteValues;
|
|
2322
|
+
this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
|
|
2323
|
+
this.displayStyle = data.displayStyle;
|
|
2324
|
+
this.itemType = data.itemType;
|
|
2325
|
+
this.maxLength = data.maxLength;
|
|
2326
|
+
this.minLength = data.minLength;
|
|
2327
|
+
this.regex = data.regex;
|
|
2328
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
|
|
2329
|
+
}
|
|
1584
2330
|
}
|
|
1585
|
-
NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1586
|
-
NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
|
|
1587
|
-
NgxMatEntityInputModule,
|
|
1588
|
-
MatDialogModule,
|
|
1589
|
-
FormsModule,
|
|
1590
|
-
MatButtonModule,
|
|
1591
|
-
NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
|
|
1592
|
-
NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
|
|
1593
|
-
CommonModule,
|
|
1594
|
-
NgxMatEntityInputModule,
|
|
1595
|
-
MatDialogModule,
|
|
1596
|
-
FormsModule,
|
|
1597
|
-
MatButtonModule,
|
|
1598
|
-
NgxMatEntityConfirmDialogModule
|
|
1599
|
-
]] });
|
|
1600
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
|
|
1601
|
-
type: NgModule,
|
|
1602
|
-
args: [{
|
|
1603
|
-
declarations: [NgxMatEntityEditDialogComponent],
|
|
1604
|
-
imports: [
|
|
1605
|
-
CommonModule,
|
|
1606
|
-
NgxMatEntityInputModule,
|
|
1607
|
-
MatDialogModule,
|
|
1608
|
-
FormsModule,
|
|
1609
|
-
MatButtonModule,
|
|
1610
|
-
NgxMatEntityConfirmDialogModule
|
|
1611
|
-
],
|
|
1612
|
-
exports: [NgxMatEntityEditDialogComponent]
|
|
1613
|
-
}]
|
|
1614
|
-
}] });
|
|
1615
2331
|
|
|
1616
2332
|
/**
|
|
1617
|
-
* Decorator for setting and getting array
|
|
1618
|
-
*
|
|
2333
|
+
* Decorator for setting and getting array property metadata.
|
|
2334
|
+
*
|
|
2335
|
+
* @param metadata - The metadata of the array property.
|
|
2336
|
+
* @returns The method that defines the metadata.
|
|
2337
|
+
* @throws When the given type of the array-items is unknown.
|
|
1619
2338
|
*/
|
|
1620
2339
|
function array(metadata) {
|
|
1621
2340
|
switch (metadata.itemType) {
|
|
1622
2341
|
case DecoratorTypes.OBJECT:
|
|
1623
|
-
return baseProperty(new
|
|
2342
|
+
return baseProperty(new EntityArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY);
|
|
1624
2343
|
case DecoratorTypes.STRING:
|
|
1625
|
-
return baseProperty(new
|
|
2344
|
+
return baseProperty(new StringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_CHIPS);
|
|
1626
2345
|
case DecoratorTypes.STRING_AUTOCOMPLETE:
|
|
1627
|
-
return baseProperty(new
|
|
2346
|
+
return baseProperty(new AutocompleteStringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
|
|
1628
2347
|
default:
|
|
1629
2348
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
|
|
1630
2349
|
throw new Error(`Unknown itemType ${metadata.itemType}`);
|
|
1631
2350
|
}
|
|
1632
2351
|
}
|
|
2352
|
+
|
|
2353
|
+
/**
|
|
2354
|
+
* The base options for all propertyDecorators.
|
|
2355
|
+
*/
|
|
2356
|
+
class PropertyDecoratorConfig {
|
|
2357
|
+
}
|
|
2358
|
+
|
|
1633
2359
|
/**
|
|
1634
|
-
* Interface definition for the @array metadata
|
|
2360
|
+
* Interface definition for the @array metadata.
|
|
1635
2361
|
*/
|
|
1636
2362
|
class ArrayDecoratorConfig extends PropertyDecoratorConfig {
|
|
1637
2363
|
}
|
|
2364
|
+
|
|
1638
2365
|
/**
|
|
1639
|
-
*
|
|
2366
|
+
* The internal DropdownBooleanDecoratorConfig. Sets default values.
|
|
1640
2367
|
*/
|
|
1641
|
-
class
|
|
1642
|
-
constructor(
|
|
1643
|
-
super(
|
|
1644
|
-
this.
|
|
1645
|
-
this.
|
|
1646
|
-
this.
|
|
1647
|
-
this.createDialogData = metadata.createDialogData;
|
|
1648
|
-
this.missingErrorMessage = metadata.missingErrorMessage;
|
|
1649
|
-
this.createInline = metadata.createInline;
|
|
1650
|
-
this.displayColumns = metadata.displayColumns;
|
|
2368
|
+
class DropdownBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2369
|
+
constructor(data) {
|
|
2370
|
+
super(data);
|
|
2371
|
+
this.displayStyle = data.displayStyle;
|
|
2372
|
+
this.dropdownTrue = data.dropdownTrue;
|
|
2373
|
+
this.dropdownFalse = data.dropdownFalse;
|
|
1651
2374
|
}
|
|
1652
2375
|
}
|
|
1653
2376
|
/**
|
|
1654
|
-
*
|
|
2377
|
+
* The internal CheckboxBooleanDecoratorConfig. Sets default values.
|
|
1655
2378
|
*/
|
|
1656
|
-
class
|
|
1657
|
-
constructor(
|
|
1658
|
-
super(
|
|
1659
|
-
this.
|
|
1660
|
-
this.
|
|
1661
|
-
this.deleteHtml = metadata.deleteHtml;
|
|
1662
|
-
this.minLength = metadata.minLength;
|
|
1663
|
-
this.maxLength = metadata.maxLength;
|
|
1664
|
-
this.regex = metadata.regex;
|
|
2379
|
+
class CheckboxBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2380
|
+
constructor(data) {
|
|
2381
|
+
super(data);
|
|
2382
|
+
this.displayStyle = data.displayStyle;
|
|
2383
|
+
this.required = data.required === undefined ? false : data.required;
|
|
1665
2384
|
}
|
|
1666
2385
|
}
|
|
1667
2386
|
/**
|
|
1668
|
-
*
|
|
2387
|
+
* The internal ToggleBooleanDecoratorConfig. Sets default values.
|
|
1669
2388
|
*/
|
|
1670
|
-
class
|
|
1671
|
-
constructor(
|
|
1672
|
-
super(
|
|
1673
|
-
this.
|
|
1674
|
-
this.
|
|
1675
|
-
this.deleteHtml = metadata.deleteHtml;
|
|
1676
|
-
this.autocompleteValues = metadata.autocompleteValues;
|
|
1677
|
-
this.minLength = metadata.minLength;
|
|
1678
|
-
this.maxLength = metadata.maxLength;
|
|
1679
|
-
this.regex = metadata.regex;
|
|
2389
|
+
class ToggleBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2390
|
+
constructor(data) {
|
|
2391
|
+
super(data);
|
|
2392
|
+
this.displayStyle = data.displayStyle;
|
|
2393
|
+
this.required = data.required === undefined ? false : data.required;
|
|
1680
2394
|
}
|
|
1681
2395
|
}
|
|
1682
2396
|
|
|
1683
2397
|
/**
|
|
1684
|
-
* Decorator for setting and getting
|
|
1685
|
-
*
|
|
2398
|
+
* Decorator for setting and getting boolean property metadata.
|
|
2399
|
+
*
|
|
2400
|
+
* @param metadata - The metadata of the boolean property.
|
|
2401
|
+
* @returns The method that defines the metadata.
|
|
1686
2402
|
*/
|
|
1687
2403
|
function boolean(metadata) {
|
|
1688
2404
|
if (metadata.displayStyle === 'dropdown') {
|
|
1689
|
-
return baseProperty(new
|
|
2405
|
+
return baseProperty(new DropdownBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_DROPDOWN);
|
|
1690
2406
|
}
|
|
1691
2407
|
else if (metadata.displayStyle === 'checkbox') {
|
|
1692
|
-
return baseProperty(new
|
|
2408
|
+
return baseProperty(new CheckboxBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_CHECKBOX);
|
|
1693
2409
|
}
|
|
1694
2410
|
else {
|
|
1695
|
-
return baseProperty(new
|
|
2411
|
+
return baseProperty(new ToggleBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_TOGGLE);
|
|
1696
2412
|
}
|
|
1697
2413
|
}
|
|
2414
|
+
|
|
1698
2415
|
/**
|
|
1699
|
-
* The Definition for the @boolean metadata
|
|
2416
|
+
* The Definition for the @boolean metadata.
|
|
1700
2417
|
*/
|
|
1701
2418
|
class BooleanDecoratorConfig extends PropertyDecoratorConfig {
|
|
1702
2419
|
}
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
|
|
1714
|
-
this.displayStyle = metadata.displayStyle;
|
|
2420
|
+
|
|
2421
|
+
/**
|
|
2422
|
+
* The internal DefaultNumberDecoratorConfig. Sets default values.
|
|
2423
|
+
*/
|
|
2424
|
+
class DefaultNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2425
|
+
constructor(data) {
|
|
2426
|
+
super(data);
|
|
2427
|
+
this.displayStyle = data.displayStyle;
|
|
2428
|
+
this.max = data.max;
|
|
2429
|
+
this.min = data.min;
|
|
1715
2430
|
}
|
|
1716
2431
|
}
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
2432
|
+
/**
|
|
2433
|
+
* The internal DropdownNumberDecoratorConfig. Sets default values.
|
|
2434
|
+
*/
|
|
2435
|
+
class DropdownNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2436
|
+
constructor(data) {
|
|
2437
|
+
super(data);
|
|
2438
|
+
this.displayStyle = data.displayStyle;
|
|
2439
|
+
this.dropdownValues = data.dropdownValues;
|
|
1721
2440
|
}
|
|
1722
2441
|
}
|
|
1723
2442
|
|
|
1724
2443
|
/**
|
|
1725
|
-
* Decorator for setting and getting
|
|
1726
|
-
*
|
|
2444
|
+
* Decorator for setting and getting number property metadata.
|
|
2445
|
+
*
|
|
2446
|
+
* @param metadata - The metadata of the number property.
|
|
2447
|
+
* @returns The method that defines the metadata.
|
|
1727
2448
|
*/
|
|
1728
2449
|
function number(metadata) {
|
|
1729
2450
|
if (metadata.displayStyle === 'dropdown') {
|
|
1730
|
-
return baseProperty(new
|
|
2451
|
+
return baseProperty(new DropdownNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER_DROPDOWN);
|
|
1731
2452
|
}
|
|
1732
2453
|
else {
|
|
1733
|
-
return baseProperty(new
|
|
2454
|
+
return baseProperty(new DefaultNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER);
|
|
1734
2455
|
}
|
|
1735
2456
|
}
|
|
2457
|
+
|
|
1736
2458
|
/**
|
|
1737
|
-
*
|
|
2459
|
+
* Definition for the @number metadata.
|
|
1738
2460
|
*/
|
|
1739
2461
|
class NumberDecoratorConfig extends PropertyDecoratorConfig {
|
|
1740
2462
|
}
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
constructor(metadata) {
|
|
1751
|
-
super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
|
|
1752
|
-
this.displayStyle = metadata.displayStyle;
|
|
1753
|
-
this.dropdownValues = metadata.dropdownValues;
|
|
2463
|
+
|
|
2464
|
+
/**
|
|
2465
|
+
* The internal DefaultObjectDecoratorConfig. Sets default values.
|
|
2466
|
+
*/
|
|
2467
|
+
class DefaultObjectDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2468
|
+
constructor(data) {
|
|
2469
|
+
super(data);
|
|
2470
|
+
this.displayStyle = data.displayStyle;
|
|
2471
|
+
this.EntityClass = data.EntityClass;
|
|
1754
2472
|
}
|
|
1755
2473
|
}
|
|
1756
2474
|
|
|
1757
2475
|
/**
|
|
1758
|
-
* Decorator for setting and getting object
|
|
1759
|
-
*
|
|
2476
|
+
* Decorator for setting and getting object property metadata.
|
|
2477
|
+
*
|
|
2478
|
+
* @param metadata - The metadata of the object property.
|
|
2479
|
+
* @returns The method that defines the metadata.
|
|
1760
2480
|
*/
|
|
1761
2481
|
function object(metadata) {
|
|
1762
|
-
return baseProperty(new
|
|
2482
|
+
return baseProperty(new DefaultObjectDecoratorConfigInternal(metadata), DecoratorTypes.OBJECT);
|
|
1763
2483
|
}
|
|
2484
|
+
|
|
1764
2485
|
/**
|
|
1765
|
-
*
|
|
2486
|
+
* Definition for the @object metadata.
|
|
1766
2487
|
*/
|
|
1767
2488
|
class ObjectDecoratorConfig extends PropertyDecoratorConfig {
|
|
1768
2489
|
}
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
}
|
|
2490
|
+
|
|
2491
|
+
/**
|
|
2492
|
+
* Definition for the @string metadata.
|
|
2493
|
+
*/
|
|
2494
|
+
class StringDecoratorConfig extends PropertyDecoratorConfig {
|
|
1775
2495
|
}
|
|
1776
2496
|
|
|
1777
|
-
|
|
1778
|
-
* Public API Surface of ngx-material-entity
|
|
2497
|
+
/**
|
|
2498
|
+
* Public API Surface of ngx-material-entity.
|
|
1779
2499
|
*/
|
|
1780
2500
|
|
|
1781
2501
|
/**
|
|
1782
2502
|
* Generated bundle index. Do not edit.
|
|
1783
2503
|
*/
|
|
1784
2504
|
|
|
1785
|
-
export {
|
|
2505
|
+
export { DateUtilities, DecoratorTypes, Entity, EntityService, EntityUtilities, NgxMatEntityConfirmDialogComponent, NgxMatEntityConfirmDialogModule, NgxMatEntityCreateDialogComponent, NgxMatEntityCreateDialogModule, NgxMatEntityEditDialogComponent, NgxMatEntityEditDialogModule, NgxMatEntityInputComponent, NgxMatEntityInputModule, NgxMatEntityTableComponent, NgxMatEntityTableModule, array, boolean, getValidationErrorMessage, number, object, string };
|
|
1786
2506
|
//# sourceMappingURL=ngx-material-entity.mjs.map
|