ngx-material-entity 0.1.0 → 0.1.3
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 +3 -2
- package/classes/base-builder.class.d.ts +35 -0
- package/classes/entity-model.class.d.ts +1 -1
- package/classes/entity-service.class.d.ts +27 -17
- package/classes/entity-utilities.class.d.ts +96 -46
- 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 +21 -0
- package/components/input/add-array-item-dialog-data.d.ts +20 -0
- package/components/input/input.component.d.ts +116 -26
- package/components/input/input.module.d.ts +6 -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 +22 -0
- package/components/table/create-dialog/create-entity-dialog-data.d.ts +2 -2
- package/components/table/create-dialog/create-entity-dialog.component.d.ts +19 -5
- package/components/table/edit-dialog/edit-dialog-data.builder.d.ts +25 -0
- package/components/table/edit-dialog/edit-entity-dialog-data.d.ts +5 -5
- package/components/table/edit-dialog/edit-entity-dialog.builder.d.ts +23 -0
- package/components/table/edit-dialog/edit-entity-dialog.component.d.ts +23 -5
- package/components/table/table-data.builder.d.ts +51 -0
- package/components/table/table-data.d.ts +40 -24
- package/components/table/table.component.d.ts +52 -5
- 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 +10 -0
- package/decorators/base/base-property.decorator.d.ts +7 -6
- package/decorators/base/decorator-types.enum.d.ts +7 -7
- 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/number/number-decorator-internal.data.d.ts +22 -0
- package/decorators/number/number-decorator.data.d.ts +38 -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 +9 -0
- package/decorators/string/string-decorator-internal.data.d.ts +43 -0
- package/decorators/string/string-decorator.data.d.ts +79 -0
- package/decorators/string/string.decorator.d.ts +8 -0
- package/esm2020/classes/base-builder.class.mjs +43 -0
- package/esm2020/classes/entity-model.class.mjs +2 -2
- package/esm2020/classes/entity-service.class.mjs +20 -14
- package/esm2020/classes/entity-utilities.class.mjs +182 -101
- 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 +168 -32
- package/esm2020/components/input/input.module.mjs +19 -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 +30 -30
- 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 +43 -47
- 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 +90 -82
- 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 +1 -1
- 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/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 +15 -10
- package/fesm2015/ngx-material-entity.mjs +1221 -880
- package/fesm2015/ngx-material-entity.mjs.map +1 -1
- package/fesm2020/ngx-material-entity.mjs +1225 -877
- package/fesm2020/ngx-material-entity.mjs.map +1 -1
- package/package.json +2 -1
- package/public-api.d.ts +15 -7
- 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/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
|
@@ -6,75 +6,44 @@ 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 i11 from '@angular/common';
|
|
14
14
|
import { CommonModule } from '@angular/common';
|
|
15
|
-
import * as
|
|
15
|
+
import * as i13 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 i12 from '@angular/material/input';
|
|
32
|
+
import { MatInputModule } from '@angular/material/input';
|
|
33
|
+
import * as i14 from '@angular/cdk/text-field';
|
|
38
34
|
import { MatIconModule } from '@angular/material/icon';
|
|
39
|
-
import * as
|
|
35
|
+
import * as i7$1 from '@angular/material/paginator';
|
|
36
|
+
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
|
37
|
+
import { MatSort } from '@angular/material/sort';
|
|
38
|
+
import * as i4$1 from '@angular/material/menu';
|
|
40
39
|
import { MatMenuModule } from '@angular/material/menu';
|
|
41
40
|
|
|
42
41
|
/**
|
|
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
|
|
42
|
+
* The base decorator for setting metadata on properties.
|
|
43
|
+
*
|
|
44
|
+
* @param metadata - The metadata to define.
|
|
45
|
+
* @param type - The type of metadata.
|
|
46
|
+
* @returns The method that sets the metadata.
|
|
78
47
|
*/
|
|
79
48
|
function baseProperty(metadata, type) {
|
|
80
49
|
return function (target, propertyKey) {
|
|
@@ -104,60 +73,108 @@ var DecoratorTypes;
|
|
|
104
73
|
})(DecoratorTypes || (DecoratorTypes = {}));
|
|
105
74
|
|
|
106
75
|
/**
|
|
107
|
-
*
|
|
108
|
-
* @param metadata The metadata of the string property
|
|
76
|
+
* The internal Position. Sets default values and validates user input.
|
|
109
77
|
*/
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
78
|
+
class PositionInternal {
|
|
79
|
+
constructor(data) {
|
|
80
|
+
this.validateInput(data);
|
|
81
|
+
this.row = data?.row ? data.row : -1;
|
|
82
|
+
this.order = data?.order ? data.order : -1;
|
|
83
|
+
}
|
|
84
|
+
validateInput(data) {
|
|
85
|
+
if (data?.order) {
|
|
86
|
+
if (data.order < 1) {
|
|
87
|
+
throw new Error('order must be at least 1');
|
|
88
|
+
}
|
|
89
|
+
if (data.order > 12) {
|
|
90
|
+
throw new Error('order cannot be bigger than 12 (the minimum value for a bootstrap column)');
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
if (data?.row && (data.row < 1)) {
|
|
94
|
+
throw new Error('row must be at least 1');
|
|
95
|
+
}
|
|
119
96
|
}
|
|
120
|
-
|
|
121
|
-
|
|
97
|
+
}
|
|
98
|
+
/**
|
|
99
|
+
* The internal PropertyDecoratorConfig. Sets default values.
|
|
100
|
+
*/
|
|
101
|
+
class PropertyDecoratorConfigInternal {
|
|
102
|
+
constructor(data) {
|
|
103
|
+
this.display = data.display != undefined ? data.display : true;
|
|
104
|
+
this.displayName = data.displayName;
|
|
105
|
+
this.required = data.required != undefined ? data.required : true;
|
|
106
|
+
this.omitForCreate = data.omitForCreate != undefined ? data.omitForCreate : false;
|
|
107
|
+
this.omitForUpdate = data.omitForUpdate != undefined ? data.omitForUpdate : false;
|
|
108
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 6, 12];
|
|
109
|
+
this.position = new PositionInternal(data.position);
|
|
122
110
|
}
|
|
123
111
|
}
|
|
112
|
+
|
|
124
113
|
/**
|
|
125
|
-
*
|
|
114
|
+
* The internal DropdownStringDecoratorConfig. Sets default values.
|
|
126
115
|
*/
|
|
127
|
-
class
|
|
116
|
+
class DropdownStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
117
|
+
constructor(data) {
|
|
118
|
+
super(data);
|
|
119
|
+
this.displayStyle = data.displayStyle;
|
|
120
|
+
this.dropdownValues = data.dropdownValues;
|
|
121
|
+
}
|
|
128
122
|
}
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
123
|
+
/**
|
|
124
|
+
* The internal DefaultStringDecoratorConfig. Sets default values.
|
|
125
|
+
*/
|
|
126
|
+
class DefaultStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
127
|
+
constructor(data) {
|
|
128
|
+
super(data);
|
|
129
|
+
this.displayStyle = data.displayStyle;
|
|
130
|
+
this.minLength = data.minLength;
|
|
131
|
+
this.maxLength = data.maxLength;
|
|
132
|
+
this.regex = data.regex;
|
|
134
133
|
}
|
|
135
134
|
}
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
this.
|
|
135
|
+
/**
|
|
136
|
+
* The internal TextboxStringDecoratorConfig. Sets default values.
|
|
137
|
+
*/
|
|
138
|
+
class TextboxStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
139
|
+
constructor(data) {
|
|
140
|
+
super(data);
|
|
141
|
+
this.displayStyle = data.displayStyle;
|
|
142
|
+
this.minLength = data.minLength;
|
|
143
|
+
this.maxLength = data.maxLength;
|
|
143
144
|
}
|
|
144
145
|
}
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
146
|
+
/**
|
|
147
|
+
* The internal AutocompleteStringDecoratorConfig. Sets default values.
|
|
148
|
+
*/
|
|
149
|
+
class AutocompleteStringDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
150
|
+
constructor(data) {
|
|
151
|
+
super(data);
|
|
152
|
+
this.displayStyle = data.displayStyle;
|
|
153
|
+
this.autocompleteValues = data.autocompleteValues;
|
|
154
|
+
this.minLength = data.minLength;
|
|
155
|
+
this.maxLength = data.maxLength;
|
|
156
|
+
this.regex = data.regex;
|
|
151
157
|
}
|
|
152
158
|
}
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
159
|
+
|
|
160
|
+
/**
|
|
161
|
+
* Decorator for setting and getting string Property metadata.
|
|
162
|
+
*
|
|
163
|
+
* @param metadata - The metadata of the string property.
|
|
164
|
+
* @returns The method that defines the metadata.
|
|
165
|
+
*/
|
|
166
|
+
function string(metadata) {
|
|
167
|
+
if (metadata.displayStyle === 'dropdown') {
|
|
168
|
+
return baseProperty(new DropdownStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_DROPDOWN);
|
|
169
|
+
}
|
|
170
|
+
else if (metadata.displayStyle === 'autocomplete') {
|
|
171
|
+
return baseProperty(new AutocompleteStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_AUTOCOMPLETE);
|
|
172
|
+
}
|
|
173
|
+
else if (metadata.displayStyle === 'textbox') {
|
|
174
|
+
return baseProperty(new TextboxStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING_TEXTBOX);
|
|
175
|
+
}
|
|
176
|
+
else {
|
|
177
|
+
return baseProperty(new DefaultStringDecoratorConfigInternal(metadata), DecoratorTypes.STRING);
|
|
161
178
|
}
|
|
162
179
|
}
|
|
163
180
|
|
|
@@ -180,17 +197,19 @@ __decorate([
|
|
|
180
197
|
|
|
181
198
|
var _a;
|
|
182
199
|
/**
|
|
183
|
-
* Contains HelperMethods around handling Entities and their property-metadata
|
|
200
|
+
* Contains HelperMethods around handling Entities and their property-metadata.
|
|
184
201
|
*/
|
|
185
202
|
class EntityUtilities {
|
|
186
203
|
/**
|
|
187
|
-
* Gets the properties to omit when updating the entity
|
|
188
|
-
*
|
|
204
|
+
* Gets the properties to omit when updating the entity.
|
|
205
|
+
*
|
|
206
|
+
* @param entity - The entity to get the properties which should be left out for updating from.
|
|
207
|
+
* @returns The properties which should be left out for updating an Entity.
|
|
189
208
|
*/
|
|
190
209
|
static getOmitForUpdate(entity) {
|
|
191
210
|
const res = [];
|
|
192
|
-
for (const key of
|
|
193
|
-
const metadata =
|
|
211
|
+
for (const key of EntityUtilities.keysOf(entity)) {
|
|
212
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key);
|
|
194
213
|
if (metadata.omitForUpdate) {
|
|
195
214
|
res.push(key);
|
|
196
215
|
}
|
|
@@ -198,13 +217,15 @@ class EntityUtilities {
|
|
|
198
217
|
return res;
|
|
199
218
|
}
|
|
200
219
|
/**
|
|
201
|
-
* Gets the properties to omit when creating new entities
|
|
202
|
-
*
|
|
220
|
+
* Gets the properties to omit when creating new entities.
|
|
221
|
+
*
|
|
222
|
+
* @param entity - The entity to get the properties which should be left out for creating from.
|
|
223
|
+
* @returns The properties which should be left out for creating a new Entity.
|
|
203
224
|
*/
|
|
204
225
|
static getOmitForCreate(entity) {
|
|
205
226
|
const res = [];
|
|
206
|
-
for (const key of
|
|
207
|
-
const metadata =
|
|
227
|
+
for (const key of EntityUtilities.keysOf(entity)) {
|
|
228
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key);
|
|
208
229
|
if (metadata.omitForCreate) {
|
|
209
230
|
res.push(key);
|
|
210
231
|
}
|
|
@@ -212,11 +233,13 @@ class EntityUtilities {
|
|
|
212
233
|
return res;
|
|
213
234
|
}
|
|
214
235
|
/**
|
|
215
|
-
* Gets the metadata included in an property
|
|
216
|
-
*
|
|
217
|
-
* @param
|
|
218
|
-
* @param
|
|
219
|
-
* @
|
|
236
|
+
* Gets the metadata included in an property.
|
|
237
|
+
*
|
|
238
|
+
* @param entity - The entity with the property to get the metadata from.
|
|
239
|
+
* @param propertyKey - The property on the given Entity to get the metadata from.
|
|
240
|
+
* @param type - For secure Typing, defines the returned PropertyConfig.
|
|
241
|
+
* @returns The metadata of the property.
|
|
242
|
+
* @throws When no metadata can be found for the given property.
|
|
220
243
|
*/
|
|
221
244
|
static getPropertyMetadata(entity, propertyKey,
|
|
222
245
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
@@ -224,58 +247,78 @@ class EntityUtilities {
|
|
|
224
247
|
try {
|
|
225
248
|
const metadata = Reflect.getMetadata('metadata', entity, propertyKey);
|
|
226
249
|
if (!metadata) {
|
|
227
|
-
throw new Error(`Could not find metadata for property ${String(propertyKey)}
|
|
228
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
250
|
+
throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
229
251
|
}
|
|
230
252
|
return metadata;
|
|
231
253
|
}
|
|
232
254
|
catch (error) {
|
|
233
|
-
throw new Error(`Could not find metadata for property ${String(propertyKey)}
|
|
234
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
255
|
+
throw new Error(`Could not find metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
235
256
|
}
|
|
236
257
|
}
|
|
237
258
|
/**
|
|
238
259
|
* Gets the type of the property-metadata.
|
|
239
|
-
*
|
|
240
|
-
* @param
|
|
241
|
-
* @
|
|
260
|
+
*
|
|
261
|
+
* @param entity - The entity with the property to get the type from.
|
|
262
|
+
* @param propertyKey - The property on the given Entity to get the type from.
|
|
263
|
+
* @returns The type of the metadata.
|
|
264
|
+
* @throws Will throw an error if no metadata can be found for the given property.
|
|
242
265
|
*/
|
|
243
266
|
static getPropertyType(entity, propertyKey) {
|
|
244
267
|
try {
|
|
245
268
|
const propertyType = Reflect.getMetadata('type', entity, propertyKey);
|
|
246
269
|
if (!propertyType) {
|
|
247
|
-
throw new Error(`Could not find type metadata for property ${String(propertyKey)}
|
|
248
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
270
|
+
throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
249
271
|
}
|
|
250
272
|
return propertyType;
|
|
251
273
|
}
|
|
252
274
|
catch (error) {
|
|
253
|
-
throw new Error(`Could not find type metadata for property ${String(propertyKey)}
|
|
254
|
-
on the entity ${JSON.stringify(entity)}`);
|
|
275
|
+
throw new Error(`Could not find type metadata for property ${String(propertyKey)} on the entity ${JSON.stringify(entity)}`);
|
|
255
276
|
}
|
|
256
277
|
}
|
|
257
278
|
/**
|
|
258
279
|
* 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)
|
|
280
|
+
*
|
|
281
|
+
* @param target - The target object that needs to be constructed (if called inside an Entity constructor its usually this).
|
|
282
|
+
* @param entity - The data object to get the property values from.
|
|
263
283
|
* @alias new
|
|
264
284
|
* @alias build
|
|
265
285
|
* @alias construct
|
|
266
286
|
*/
|
|
267
287
|
static new(target, entity) {
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
288
|
+
for (const key in target) {
|
|
289
|
+
const type = EntityUtilities.getPropertyType(target, key);
|
|
290
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
|
291
|
+
let value = entity ? Reflect.get(entity, key) : undefined;
|
|
292
|
+
switch (type) {
|
|
293
|
+
case DecoratorTypes.OBJECT:
|
|
294
|
+
const objectMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.OBJECT);
|
|
295
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-argument
|
|
296
|
+
value = new objectMetadata.type(value);
|
|
297
|
+
break;
|
|
298
|
+
case DecoratorTypes.ARRAY:
|
|
299
|
+
const inputArray = value;
|
|
300
|
+
const resArray = [];
|
|
301
|
+
if (inputArray) {
|
|
302
|
+
const arrayMetadata = EntityUtilities.getPropertyMetadata(target, key, DecoratorTypes.ARRAY);
|
|
303
|
+
for (const item of inputArray) {
|
|
304
|
+
const itemWithMetadata = new arrayMetadata.EntityClass(item);
|
|
305
|
+
resArray.push(itemWithMetadata);
|
|
306
|
+
}
|
|
307
|
+
}
|
|
308
|
+
value = resArray;
|
|
309
|
+
break;
|
|
310
|
+
default:
|
|
311
|
+
break;
|
|
271
312
|
}
|
|
313
|
+
Reflect.set(target, key, value);
|
|
272
314
|
}
|
|
273
315
|
}
|
|
274
316
|
/**
|
|
275
317
|
* 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
|
|
318
|
+
* Also checks all the validators given by the metadata ("required", "maxLength" etc.).
|
|
319
|
+
*
|
|
320
|
+
* @param entity - The entity to validate.
|
|
321
|
+
* @param omit - Whether to check for creating or editing validity.
|
|
279
322
|
* @returns Whether or not the entity is valid.
|
|
280
323
|
*/
|
|
281
324
|
static isEntityValid(entity, omit) {
|
|
@@ -287,17 +330,19 @@ class EntityUtilities {
|
|
|
287
330
|
return true;
|
|
288
331
|
}
|
|
289
332
|
/**
|
|
290
|
-
* Checks if a single property value is valid
|
|
291
|
-
*
|
|
292
|
-
* @param
|
|
293
|
-
* @
|
|
333
|
+
* Checks if a single property value is valid.
|
|
334
|
+
*
|
|
335
|
+
* @param entity - The entity where the property is from.
|
|
336
|
+
* @param key - The name of the property.
|
|
337
|
+
* @param omit - Whether to check if the given entity is valid for creation or updating.
|
|
338
|
+
* @returns Whether or not the property value is valid.
|
|
339
|
+
* @throws Throws when it extracts an unknown metadata type.
|
|
294
340
|
*/
|
|
295
341
|
static isPropertyValid(entity, key, omit) {
|
|
296
342
|
const type = this.getPropertyType(entity, key);
|
|
297
343
|
const metadata = this.getPropertyMetadata(entity, key, type);
|
|
298
344
|
const metadataDefaultString = metadata;
|
|
299
345
|
const metadataTextboxString = metadata;
|
|
300
|
-
const metadataAutocompleteString = metadata;
|
|
301
346
|
const metadataDefaultNumber = metadata;
|
|
302
347
|
const objectProperty = entity[key];
|
|
303
348
|
const metadataEntityArray = metadata;
|
|
@@ -305,14 +350,21 @@ class EntityUtilities {
|
|
|
305
350
|
if (metadata.omitForCreate && omit === 'create') {
|
|
306
351
|
return true;
|
|
307
352
|
}
|
|
308
|
-
if (metadata.omitForUpdate && omit === '
|
|
353
|
+
if (metadata.omitForUpdate && omit === 'update') {
|
|
309
354
|
return true;
|
|
310
355
|
}
|
|
311
356
|
if (metadata.required && !entity[key]) {
|
|
312
357
|
return false;
|
|
313
358
|
}
|
|
314
359
|
switch (type) {
|
|
360
|
+
case DecoratorTypes.BOOLEAN_DROPDOWN:
|
|
361
|
+
case DecoratorTypes.BOOLEAN_CHECKBOX:
|
|
362
|
+
case DecoratorTypes.BOOLEAN_TOGGLE:
|
|
363
|
+
return true;
|
|
364
|
+
case DecoratorTypes.STRING_DROPDOWN:
|
|
365
|
+
return true;
|
|
315
366
|
case DecoratorTypes.STRING:
|
|
367
|
+
case DecoratorTypes.STRING_AUTOCOMPLETE:
|
|
316
368
|
if (metadataDefaultString.maxLength
|
|
317
369
|
&& entity[key].length > metadataDefaultString.maxLength) {
|
|
318
370
|
return false;
|
|
@@ -326,20 +378,6 @@ class EntityUtilities {
|
|
|
326
378
|
return false;
|
|
327
379
|
}
|
|
328
380
|
break;
|
|
329
|
-
case DecoratorTypes.STRING_AUTOCOMPLETE:
|
|
330
|
-
if (metadataAutocompleteString.maxLength
|
|
331
|
-
&& entity[key].length > metadataAutocompleteString.maxLength) {
|
|
332
|
-
return false;
|
|
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)) {
|
|
340
|
-
return false;
|
|
341
|
-
}
|
|
342
|
-
break;
|
|
343
381
|
case DecoratorTypes.STRING_TEXTBOX:
|
|
344
382
|
if (metadataTextboxString.maxLength
|
|
345
383
|
&& entity[key].length > metadataTextboxString.maxLength) {
|
|
@@ -350,11 +388,13 @@ class EntityUtilities {
|
|
|
350
388
|
return false;
|
|
351
389
|
}
|
|
352
390
|
break;
|
|
391
|
+
case DecoratorTypes.NUMBER_DROPDOWN:
|
|
392
|
+
return true;
|
|
353
393
|
case DecoratorTypes.NUMBER:
|
|
354
394
|
if (metadataDefaultNumber.max && entity[key] > metadataDefaultNumber.max) {
|
|
355
395
|
return false;
|
|
356
396
|
}
|
|
357
|
-
if (metadataDefaultNumber.min && entity[key]
|
|
397
|
+
if (metadataDefaultNumber.min && entity[key] < metadataDefaultNumber.min) {
|
|
358
398
|
return false;
|
|
359
399
|
}
|
|
360
400
|
break;
|
|
@@ -378,10 +418,11 @@ class EntityUtilities {
|
|
|
378
418
|
return true;
|
|
379
419
|
}
|
|
380
420
|
/**
|
|
381
|
-
* Checks if an entity is "dirty" (if its values have changed)
|
|
382
|
-
*
|
|
383
|
-
* @param
|
|
384
|
-
* @
|
|
421
|
+
* Checks if an entity is "dirty" (if its values have changed).
|
|
422
|
+
*
|
|
423
|
+
* @param entity - The entity after all changes.
|
|
424
|
+
* @param entityPriorChanges - The entity before the changes.
|
|
425
|
+
* @returns Whether or not the entity is dirty.
|
|
385
426
|
*/
|
|
386
427
|
static dirty(entity, entityPriorChanges) {
|
|
387
428
|
if (!entityPriorChanges) {
|
|
@@ -398,10 +439,11 @@ class EntityUtilities {
|
|
|
398
439
|
}
|
|
399
440
|
}
|
|
400
441
|
/**
|
|
401
|
-
* Compares two Entities and returns their difference in an object
|
|
402
|
-
*
|
|
403
|
-
* @param
|
|
404
|
-
* @
|
|
442
|
+
* Compares two Entities and returns their difference in an object.
|
|
443
|
+
*
|
|
444
|
+
* @param entity - The first entity to compare.
|
|
445
|
+
* @param entityPriorChanges - The second entity to compare.
|
|
446
|
+
* @returns The difference between the two Entities in form of a Partial.
|
|
405
447
|
*/
|
|
406
448
|
static difference(entity, entityPriorChanges) {
|
|
407
449
|
const res = {};
|
|
@@ -412,64 +454,120 @@ class EntityUtilities {
|
|
|
412
454
|
}
|
|
413
455
|
return res;
|
|
414
456
|
}
|
|
457
|
+
//TODO X Y
|
|
415
458
|
/**
|
|
416
|
-
*
|
|
417
|
-
*
|
|
418
|
-
* @param
|
|
419
|
-
* @param
|
|
459
|
+
* Compare function for sorting entity keys by their order value.
|
|
460
|
+
*
|
|
461
|
+
* @param a - First key of entity.
|
|
462
|
+
* @param b - Second key of entity.
|
|
463
|
+
* @param entity - Current entity (used to get metadata of entity keys).
|
|
464
|
+
* @returns 0 if both values have the same order, a negative value if X, a positive value if Y.
|
|
420
465
|
*/
|
|
421
466
|
static compareOrder(a, b, entity) {
|
|
422
|
-
const metadataA = EntityUtilities.getPropertyMetadata(entity, a
|
|
423
|
-
const metadataB = EntityUtilities.getPropertyMetadata(entity, b
|
|
424
|
-
if (metadataA.order === -1) {
|
|
467
|
+
const metadataA = EntityUtilities.getPropertyMetadata(entity, a);
|
|
468
|
+
const metadataB = EntityUtilities.getPropertyMetadata(entity, b);
|
|
469
|
+
if (metadataA.position.order === -1) {
|
|
470
|
+
if (metadataB.position.order === -1) {
|
|
471
|
+
return 0;
|
|
472
|
+
}
|
|
425
473
|
return 1;
|
|
426
474
|
}
|
|
427
|
-
else if (metadataB.order === -1) {
|
|
428
|
-
return
|
|
475
|
+
else if (metadataB.position.order === -1) {
|
|
476
|
+
return -1;
|
|
429
477
|
}
|
|
430
|
-
return (metadataA.order - metadataB.order);
|
|
478
|
+
return ((metadataA.position.order) - (metadataB.position.order));
|
|
431
479
|
}
|
|
432
480
|
/**
|
|
433
|
-
*
|
|
434
|
-
*
|
|
435
|
-
* @param
|
|
436
|
-
* @param
|
|
437
|
-
* @
|
|
481
|
+
* Gets the bootstrap column values for "lg", "md", "sm".
|
|
482
|
+
*
|
|
483
|
+
* @param entity - Entity to get the bootstrap column values of the key.
|
|
484
|
+
* @param key - Key of the property to get bootstrap column values from.
|
|
485
|
+
* @param type - Defines for which screen size the column values should be returned.
|
|
486
|
+
* @returns Bootstrap column value.
|
|
438
487
|
*/
|
|
439
488
|
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');
|
|
489
|
+
const metadata = EntityUtilities.getPropertyMetadata(entity, key);
|
|
490
|
+
switch (type) {
|
|
491
|
+
case 'lg':
|
|
492
|
+
return metadata.defaultWidths[0];
|
|
493
|
+
case 'md':
|
|
494
|
+
return metadata.defaultWidths[1];
|
|
495
|
+
case 'sm':
|
|
496
|
+
return metadata.defaultWidths[2];
|
|
456
497
|
}
|
|
457
498
|
}
|
|
458
499
|
/**
|
|
459
|
-
* Resets all changes on an entity
|
|
460
|
-
*
|
|
461
|
-
* @param
|
|
500
|
+
* Resets all changes on an entity.
|
|
501
|
+
*
|
|
502
|
+
* @param entity - The entity to reset.
|
|
503
|
+
* @param entityPriorChanges - The entity before any changes.
|
|
462
504
|
*/
|
|
463
505
|
static resetChangesOnEntity(entity, entityPriorChanges) {
|
|
464
506
|
for (const key in entityPriorChanges) {
|
|
465
507
|
Reflect.set(entity, key, Reflect.get(entityPriorChanges, key));
|
|
466
508
|
}
|
|
467
509
|
}
|
|
510
|
+
/**
|
|
511
|
+
* Gets the rows that are used to display the given entity.
|
|
512
|
+
*
|
|
513
|
+
* @param entity - The entity to get the rows from.
|
|
514
|
+
* @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
|
|
515
|
+
* @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
|
|
516
|
+
* @returns The sorted Rows containing the row number and the keys to display in that row.
|
|
517
|
+
*/
|
|
518
|
+
static getEntityRows(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
|
|
519
|
+
const res = [];
|
|
520
|
+
const keys = EntityUtilities.keysOf(entity, hideOmitForCreate, hideOmitForEdit);
|
|
521
|
+
const numberOfRows = EntityUtilities.getNumberOfRows(keys, entity);
|
|
522
|
+
for (let i = 1; i <= numberOfRows; i++) {
|
|
523
|
+
const row = {
|
|
524
|
+
row: i,
|
|
525
|
+
keys: EntityUtilities.getKeysForRow(keys, entity, i)
|
|
526
|
+
};
|
|
527
|
+
res.push(row);
|
|
528
|
+
}
|
|
529
|
+
const lastRow = {
|
|
530
|
+
row: numberOfRows + 1,
|
|
531
|
+
keys: EntityUtilities.getKeysForRow(keys, entity, -1)
|
|
532
|
+
};
|
|
533
|
+
res.push(lastRow);
|
|
534
|
+
return res;
|
|
535
|
+
}
|
|
536
|
+
static getKeysForRow(keys, entity, i) {
|
|
537
|
+
return keys
|
|
538
|
+
.filter(k => EntityUtilities.getPropertyMetadata(entity, k).position.row === i)
|
|
539
|
+
.sort((a, b) => EntityUtilities.compareOrder(a, b, entity));
|
|
540
|
+
}
|
|
541
|
+
static getNumberOfRows(keys, entity) {
|
|
542
|
+
return keys
|
|
543
|
+
.map(k => EntityUtilities.getPropertyMetadata(entity, k).position.row)
|
|
544
|
+
.sort((a, b) => (a > b ? -1 : 1))[0];
|
|
545
|
+
}
|
|
546
|
+
/**
|
|
547
|
+
* Gets the keys of the provided entity correctly typed.
|
|
548
|
+
*
|
|
549
|
+
* @param entity - The entity to get the keys of.
|
|
550
|
+
* @param hideOmitForCreate - Whether or not keys with the metadata omitForCreate should be filtered out.
|
|
551
|
+
* @param hideOmitForEdit - Whether or not keys with the metadata omitForUpdate should be filtered out.
|
|
552
|
+
* @returns An array of keys of the entity.
|
|
553
|
+
*/
|
|
554
|
+
static keysOf(entity, hideOmitForCreate = false, hideOmitForEdit = false) {
|
|
555
|
+
let keys = Reflect.ownKeys(entity);
|
|
556
|
+
if (hideOmitForCreate) {
|
|
557
|
+
const omitForCreateKeys = EntityUtilities.getOmitForCreate(entity);
|
|
558
|
+
keys = keys.filter(k => !omitForCreateKeys.includes(k));
|
|
559
|
+
}
|
|
560
|
+
if (hideOmitForEdit) {
|
|
561
|
+
const omitForUpdateKeys = EntityUtilities.getOmitForUpdate(entity);
|
|
562
|
+
keys = keys.filter(k => !omitForUpdateKeys.includes(k));
|
|
563
|
+
}
|
|
564
|
+
return keys;
|
|
565
|
+
}
|
|
468
566
|
}
|
|
469
567
|
_a = EntityUtilities;
|
|
470
|
-
// eslint-disable-next-line @typescript-eslint/member-ordering
|
|
568
|
+
// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
|
|
471
569
|
EntityUtilities.construct = _a.new;
|
|
472
|
-
// eslint-disable-next-line @typescript-eslint/member-ordering
|
|
570
|
+
// eslint-disable-next-line @typescript-eslint/member-ordering, jsdoc/require-jsdoc
|
|
473
571
|
EntityUtilities.build = _a.new;
|
|
474
572
|
|
|
475
573
|
/**
|
|
@@ -482,22 +580,25 @@ class EntityService {
|
|
|
482
580
|
constructor(http) {
|
|
483
581
|
this.http = http;
|
|
484
582
|
/**
|
|
485
|
-
*
|
|
583
|
+
* A subject of all the entity values.
|
|
486
584
|
* Can be subscribed to when you want to do a specific thing whenever the entities change.
|
|
487
585
|
*/
|
|
488
586
|
this.entitiesSubject = new BehaviorSubject([]);
|
|
489
587
|
}
|
|
490
588
|
/**
|
|
491
|
-
*
|
|
589
|
+
* Gets the entities in an array from the internal entitiesSubject.
|
|
590
|
+
*
|
|
591
|
+
* @returns The current entities in form of an array.
|
|
492
592
|
*/
|
|
493
593
|
get entities() {
|
|
494
594
|
return this.entitiesSubject.value;
|
|
495
595
|
}
|
|
496
596
|
/**
|
|
497
|
-
* Creates a new Entity and pushes it to the entities array
|
|
498
|
-
*
|
|
597
|
+
* Creates a new Entity and pushes it to the entities array.
|
|
598
|
+
*
|
|
599
|
+
* @param entity - The data of the entity to create.
|
|
499
600
|
* All values that should be omitted will be removed from it inside this method.
|
|
500
|
-
* @returns A Promise of the created entity
|
|
601
|
+
* @returns A Promise of the created entity.
|
|
501
602
|
*/
|
|
502
603
|
async create(entity) {
|
|
503
604
|
const body = omit(entity, EntityUtilities.getOmitForCreate(entity));
|
|
@@ -507,8 +608,9 @@ class EntityService {
|
|
|
507
608
|
return e;
|
|
508
609
|
}
|
|
509
610
|
/**
|
|
510
|
-
* Gets all existing entities and pushes them to the
|
|
511
|
-
*
|
|
611
|
+
* Gets all existing entities and pushes them to the entities array.
|
|
612
|
+
*
|
|
613
|
+
* @returns A Promise of all received Entities.
|
|
512
614
|
*/
|
|
513
615
|
async read() {
|
|
514
616
|
const e = await firstValueFrom(this.http.get(this.baseUrl));
|
|
@@ -516,11 +618,12 @@ class EntityService {
|
|
|
516
618
|
return e;
|
|
517
619
|
}
|
|
518
620
|
/**
|
|
519
|
-
* Updates a specific Entity
|
|
520
|
-
*
|
|
621
|
+
* Updates a specific Entity.
|
|
622
|
+
*
|
|
623
|
+
* @param entity - The updated Entity
|
|
521
624
|
* All values that should be omitted will be removed from it inside this method.
|
|
522
|
-
* @param entityPriorChanges The current Entity.
|
|
523
|
-
* It Is used to get changed values and only update them instead of sending the whole entity data
|
|
625
|
+
* @param entityPriorChanges - The current Entity.
|
|
626
|
+
* It Is used to get changed values and only update them instead of sending the whole entity data.
|
|
524
627
|
*/
|
|
525
628
|
async update(entity, entityPriorChanges) {
|
|
526
629
|
const reqBody = omit(EntityUtilities.difference(entity, entityPriorChanges), EntityUtilities.getOmitForUpdate(entity));
|
|
@@ -529,8 +632,9 @@ class EntityService {
|
|
|
529
632
|
this.entitiesSubject.next(this.entities);
|
|
530
633
|
}
|
|
531
634
|
/**
|
|
532
|
-
*
|
|
533
|
-
*
|
|
635
|
+
* Deletes a specific Entity.
|
|
636
|
+
*
|
|
637
|
+
* @param id - The id of the element to delete.
|
|
534
638
|
*/
|
|
535
639
|
async delete(id) {
|
|
536
640
|
await firstValueFrom(this.http.delete(`${this.baseUrl}/${id}`));
|
|
@@ -539,44 +643,125 @@ class EntityService {
|
|
|
539
643
|
}
|
|
540
644
|
}
|
|
541
645
|
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
this.
|
|
646
|
+
/**
|
|
647
|
+
* The abstract BaseBuilder class.
|
|
648
|
+
*/
|
|
649
|
+
class BaseBuilder {
|
|
650
|
+
constructor(data) {
|
|
651
|
+
this.validateInput(data);
|
|
652
|
+
this.inputData = data;
|
|
653
|
+
this.data = this.generateBaseData(data);
|
|
654
|
+
return this;
|
|
550
655
|
}
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
656
|
+
/**
|
|
657
|
+
* Used to validate the user input in the constructor.
|
|
658
|
+
*
|
|
659
|
+
* @param data - The user input.
|
|
660
|
+
*/
|
|
661
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
662
|
+
validateInput(data) {
|
|
663
|
+
// By default, no validation is done
|
|
664
|
+
}
|
|
665
|
+
;
|
|
666
|
+
/**
|
|
667
|
+
* Sets the value for the given key if no user value was provided.
|
|
668
|
+
*
|
|
669
|
+
* @param key - The key to set the default value for.
|
|
670
|
+
* @param value - The value to set when nothing was provided.
|
|
671
|
+
* @returns The Builder.
|
|
672
|
+
*/
|
|
673
|
+
withDefault(key, value) {
|
|
674
|
+
if (!this.inputData || !this.inputData[key]) {
|
|
675
|
+
this.data[key] = value;
|
|
556
676
|
}
|
|
557
|
-
|
|
558
|
-
|
|
677
|
+
return this;
|
|
678
|
+
}
|
|
679
|
+
/**
|
|
680
|
+
* Method used to get the final build value after applying all chaining.
|
|
681
|
+
*
|
|
682
|
+
* @returns The build value.
|
|
683
|
+
*/
|
|
684
|
+
getResult() {
|
|
685
|
+
return this.data;
|
|
686
|
+
}
|
|
687
|
+
}
|
|
688
|
+
|
|
689
|
+
/**
|
|
690
|
+
* The internal ConfirmDialogData. Requires all default values the user can leave out.
|
|
691
|
+
*/
|
|
692
|
+
class ConfirmDialogDataInternal {
|
|
693
|
+
constructor(text, type, confirmButtonLabel, cancelButtonLabel, title, requireConfirmation, confirmationText) {
|
|
694
|
+
this.text = text;
|
|
695
|
+
this.type = type;
|
|
696
|
+
this.confirmButtonLabel = confirmButtonLabel;
|
|
697
|
+
this.cancelButtonLabel = cancelButtonLabel;
|
|
698
|
+
this.title = title;
|
|
699
|
+
this.requireConfirmation = requireConfirmation;
|
|
700
|
+
this.confirmationText = confirmationText;
|
|
701
|
+
}
|
|
702
|
+
}
|
|
703
|
+
/**
|
|
704
|
+
* The Builder for the ConfirmDialogData. Sets default values.
|
|
705
|
+
*/
|
|
706
|
+
class ConfirmDialogDataBuilder extends BaseBuilder {
|
|
707
|
+
constructor(data) {
|
|
708
|
+
super(data);
|
|
709
|
+
}
|
|
710
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
711
|
+
generateBaseData(data) {
|
|
712
|
+
return new ConfirmDialogDataInternal(data?.text ? data.text : ['Do you really want to do this?'], data?.type ? data.type : 'default', data?.confirmButtonLabel ? data.confirmButtonLabel : 'Confirm', data?.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel', data?.title ? data.title : 'Confirmation', data?.requireConfirmation ? data.requireConfirmation : false, data?.confirmationText);
|
|
713
|
+
}
|
|
714
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
715
|
+
validateInput(data) {
|
|
716
|
+
if (!data) {
|
|
717
|
+
return;
|
|
559
718
|
}
|
|
560
|
-
if (
|
|
561
|
-
|
|
719
|
+
if (data.requireConfirmation && !data.confirmationText) {
|
|
720
|
+
throw new Error(`Missing required Input data "confirmationText".
|
|
721
|
+
You can only omit this value when "requireConfirmation" is false.`);
|
|
722
|
+
}
|
|
723
|
+
if (!data.requireConfirmation && data.confirmationText) {
|
|
724
|
+
throw new Error('The "confirmationText" will never be shown because "requireConfirmation" is not set to true');
|
|
562
725
|
}
|
|
563
|
-
if (
|
|
726
|
+
if (data.type === 'info-only' && data.cancelButtonLabel) {
|
|
564
727
|
throw new Error('The "cancelButtonLabel" will never be shown because "type" is set to "info-only"');
|
|
565
728
|
}
|
|
729
|
+
}
|
|
730
|
+
}
|
|
731
|
+
|
|
732
|
+
/**
|
|
733
|
+
* The Dialog used whenever confirmation by the user is required (e.g. When the user tries to delete an entity).
|
|
734
|
+
*
|
|
735
|
+
* Can be customized with the MAT_DIALOG_DATA "inputData". Customization options are defined in "ConfirmDialogData".
|
|
736
|
+
*/
|
|
737
|
+
class NgxMatEntityConfirmDialogComponent {
|
|
738
|
+
constructor(dialogRef, inputData) {
|
|
739
|
+
this.dialogRef = dialogRef;
|
|
740
|
+
this.inputData = inputData;
|
|
741
|
+
this.confirm = false;
|
|
742
|
+
}
|
|
743
|
+
ngOnInit() {
|
|
744
|
+
this.data = new ConfirmDialogDataBuilder(this.inputData).getResult();
|
|
566
745
|
this.dialogRef.disableClose = true;
|
|
567
746
|
}
|
|
747
|
+
/**
|
|
748
|
+
* Closes the dialog with value 1 to signal that the action should be run.
|
|
749
|
+
*/
|
|
568
750
|
confirmAction() {
|
|
569
751
|
this.dialogRef.close(1);
|
|
570
752
|
}
|
|
753
|
+
/**
|
|
754
|
+
* Closes the dialog.
|
|
755
|
+
*/
|
|
571
756
|
cancel() {
|
|
572
757
|
this.dialogRef.close();
|
|
573
758
|
}
|
|
574
759
|
}
|
|
575
760
|
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 });
|
|
576
|
-
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
|
|
761
|
+
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: i11.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: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i13.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]" }] });
|
|
577
762
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityConfirmDialogComponent, decorators: [{
|
|
578
763
|
type: Component,
|
|
579
|
-
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
|
|
764
|
+
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"] }]
|
|
580
765
|
}], ctorParameters: function () { return [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
|
|
581
766
|
type: Inject,
|
|
582
767
|
args: [MAT_DIALOG_DATA]
|
|
@@ -598,8 +783,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
598
783
|
|
|
599
784
|
/**
|
|
600
785
|
* Generates a default error message for most validation errors.
|
|
601
|
-
*
|
|
602
|
-
* @
|
|
786
|
+
*
|
|
787
|
+
* @param model - The ngModel to get the error from.
|
|
788
|
+
* @returns The Validation Error Message to display.
|
|
603
789
|
*/
|
|
604
790
|
function getValidationErrorMessage(model) {
|
|
605
791
|
if (model.hasError('matDatepickerParse')) {
|
|
@@ -623,85 +809,94 @@ function getValidationErrorMessage(model) {
|
|
|
623
809
|
else if (model.hasError('required')) {
|
|
624
810
|
return 'required';
|
|
625
811
|
}
|
|
812
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
813
|
+
else if (model.hasError('pattern') && model.getError('pattern').requiredPattern === '^true$') {
|
|
814
|
+
return 'needs to be selected';
|
|
815
|
+
}
|
|
626
816
|
else {
|
|
627
817
|
return 'invalid input';
|
|
628
818
|
}
|
|
629
819
|
}
|
|
630
820
|
|
|
631
821
|
/**
|
|
632
|
-
*
|
|
633
|
-
* @param metadata The metadata of the array property
|
|
822
|
+
* The internal CreateDialogData. Requires all default values the user can leave out.
|
|
634
823
|
*/
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
return baseProperty(new AutocompleteStringChipsArrayDecoratorConfig(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
|
|
643
|
-
default:
|
|
644
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
|
|
645
|
-
throw new Error(`Unknown itemType ${metadata.itemType}`);
|
|
824
|
+
class CreateDialogDataInternal {
|
|
825
|
+
constructor(title, createButtonLabel, cancelButtonLabel, createRequiresConfirmDialog, confirmCreateDialogData) {
|
|
826
|
+
this.title = title;
|
|
827
|
+
this.createButtonLabel = createButtonLabel;
|
|
828
|
+
this.cancelButtonLabel = cancelButtonLabel;
|
|
829
|
+
this.createRequiresConfirmDialog = createRequiresConfirmDialog;
|
|
830
|
+
this.confirmCreateDialogData = confirmCreateDialogData;
|
|
646
831
|
}
|
|
647
832
|
}
|
|
648
833
|
/**
|
|
649
|
-
*
|
|
650
|
-
*/
|
|
651
|
-
class ArrayDecoratorConfig extends PropertyDecoratorConfig {
|
|
652
|
-
}
|
|
653
|
-
/**
|
|
654
|
-
* Definition for an array of Entities
|
|
834
|
+
* The Builder for the CreateDialogData. Sets default values.
|
|
655
835
|
*/
|
|
656
|
-
class
|
|
657
|
-
constructor(
|
|
658
|
-
super(
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
836
|
+
class CreateDialogDataBuilder extends BaseBuilder {
|
|
837
|
+
constructor(data) {
|
|
838
|
+
super(data);
|
|
839
|
+
}
|
|
840
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
841
|
+
generateBaseData(data) {
|
|
842
|
+
const confirmCreateDialogData = new ConfirmDialogDataBuilder(data?.confirmCreateDialogData)
|
|
843
|
+
.withDefault('confirmButtonLabel', 'create')
|
|
844
|
+
.withDefault('text', ['Do you really want to create this entity?'])
|
|
845
|
+
.withDefault('title', 'Create')
|
|
846
|
+
.getResult();
|
|
847
|
+
return new CreateDialogDataInternal(data?.title ? data.title : 'Create', data?.createButtonLabel ? data.createButtonLabel : 'Create', data?.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel', data?.createRequiresConfirmDialog ? data.createRequiresConfirmDialog : false, confirmCreateDialogData);
|
|
666
848
|
}
|
|
667
849
|
}
|
|
850
|
+
|
|
668
851
|
/**
|
|
669
|
-
*
|
|
852
|
+
* The internal AddArrayItemDialogData. Requires all default values the user can leave out.
|
|
670
853
|
*/
|
|
671
|
-
class
|
|
672
|
-
constructor(
|
|
673
|
-
|
|
674
|
-
this.
|
|
675
|
-
this.
|
|
676
|
-
this.deleteHtml = metadata.deleteHtml;
|
|
677
|
-
this.minLength = metadata.minLength;
|
|
678
|
-
this.maxLength = metadata.maxLength;
|
|
679
|
-
this.regex = metadata.regex;
|
|
854
|
+
class AddArrayItemDialogDataInternal {
|
|
855
|
+
constructor(entity, createDialogData, getValidationErrorMessage) {
|
|
856
|
+
this.entity = entity;
|
|
857
|
+
this.createDialogData = createDialogData;
|
|
858
|
+
this.getValidationErrorMessage = getValidationErrorMessage;
|
|
680
859
|
}
|
|
681
860
|
}
|
|
682
861
|
/**
|
|
683
|
-
*
|
|
862
|
+
* The Builder for the AddArrayItemDialogData. Sets default values.
|
|
684
863
|
*/
|
|
685
|
-
class
|
|
686
|
-
constructor(
|
|
687
|
-
super(
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
864
|
+
class AddArrayItemDialogDataBuilder extends BaseBuilder {
|
|
865
|
+
constructor(data) {
|
|
866
|
+
super(data);
|
|
867
|
+
}
|
|
868
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
869
|
+
generateBaseData(data) {
|
|
870
|
+
const createDialogData = new CreateDialogDataBuilder(data.createDialogData)
|
|
871
|
+
.withDefault('createButtonLabel', 'Add')
|
|
872
|
+
.withDefault('title', 'Add to array')
|
|
873
|
+
.getResult();
|
|
874
|
+
return new AddArrayItemDialogDataInternal(data.entity, createDialogData, data.getValidationErrorMessage ? data.getValidationErrorMessage : getValidationErrorMessage);
|
|
695
875
|
}
|
|
696
876
|
}
|
|
697
877
|
|
|
698
|
-
|
|
699
|
-
|
|
878
|
+
/**
|
|
879
|
+
* The default input component. It gets the metadata of the property from the given @Input "entity" and @Input "propertyKey"
|
|
880
|
+
* and displays the input field accordingly.
|
|
881
|
+
*
|
|
882
|
+
* You can also define a method that generates error-messages and if the input should be hidden when its metadata says
|
|
883
|
+
* that it should be omitted for creating or updating.
|
|
884
|
+
* The last part being mostly relevant if you want to use this component inside an ngFor.
|
|
885
|
+
*/
|
|
886
|
+
class NgxMatEntityInputComponent {
|
|
887
|
+
constructor(dialog) {
|
|
888
|
+
this.dialog = dialog;
|
|
889
|
+
this.chipsInput = '';
|
|
890
|
+
this.selection = new SelectionModel(true, []);
|
|
700
891
|
this.DecoratorTypes = DecoratorTypes;
|
|
892
|
+
this.EntityUtilities = EntityUtilities;
|
|
701
893
|
this.getWidth = EntityUtilities.getWidth;
|
|
702
894
|
}
|
|
703
895
|
/**
|
|
704
|
-
*
|
|
896
|
+
* This is needed for the inputs to work inside an ngFor.
|
|
897
|
+
*
|
|
898
|
+
* @param index - The index of the element in the ngFor.
|
|
899
|
+
* @returns The index.
|
|
705
900
|
*/
|
|
706
901
|
trackByFn(index) {
|
|
707
902
|
return index;
|
|
@@ -718,147 +913,113 @@ class NgxMatEntityInternalInputComponent {
|
|
|
718
913
|
this.metadataDefaultString = this.metadata;
|
|
719
914
|
this.metadataTextboxString = this.metadata;
|
|
720
915
|
this.metadataAutocompleteString = this.metadata;
|
|
916
|
+
this.autocompleteStrings = this.metadataAutocompleteString.autocompleteValues;
|
|
917
|
+
this.filteredAutocompleteStrings = cloneDeep(this.autocompleteStrings);
|
|
721
918
|
this.metadataDropdownString = this.metadata;
|
|
722
919
|
this.metadataDropdownBoolean = this.metadata;
|
|
920
|
+
if ((this.type === DecoratorTypes.BOOLEAN_CHECKBOX || this.type === DecoratorTypes.BOOLEAN_TOGGLE)
|
|
921
|
+
&& this.entity[this.propertyKey] === undefined) {
|
|
922
|
+
this.entity[this.propertyKey] = false;
|
|
923
|
+
}
|
|
723
924
|
this.metadataDefaultNumber = this.metadata;
|
|
724
925
|
this.metadataDropdownNumber = this.metadata;
|
|
725
926
|
this.metadataDefaultObject = this.metadata;
|
|
726
927
|
this.objectProperty = this.entity[this.propertyKey];
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
if (!
|
|
733
|
-
|
|
734
|
-
|
|
928
|
+
if (this.type === DecoratorTypes.OBJECT) {
|
|
929
|
+
this.objectPropertyRows = EntityUtilities.getEntityRows(this.objectProperty, this.hideOmitForCreate, this.hideOmitForEdit);
|
|
930
|
+
}
|
|
931
|
+
this.metadataEntityArray = this.metadata;
|
|
932
|
+
if (this.type === DecoratorTypes.ARRAY) {
|
|
933
|
+
if (!this.entity[this.propertyKey]) {
|
|
934
|
+
this.entity[this.propertyKey] = [];
|
|
935
|
+
}
|
|
936
|
+
this.entityArrayValues = this.entity[this.propertyKey];
|
|
937
|
+
if (this.metadataEntityArray.createInline === undefined) {
|
|
938
|
+
this.metadataEntityArray.createInline = true;
|
|
939
|
+
}
|
|
940
|
+
if (!this.metadataEntityArray.createInline && !this.metadataEntityArray.createDialogData) {
|
|
941
|
+
this.metadataEntityArray.createDialogData = {
|
|
942
|
+
title: 'Add'
|
|
943
|
+
};
|
|
944
|
+
}
|
|
945
|
+
// TODO
|
|
946
|
+
const givenDisplayColumns = this.metadataEntityArray.displayColumns.map((v) => v.displayName);
|
|
947
|
+
if (givenDisplayColumns.find((s) => s === 'select')) {
|
|
948
|
+
throw new Error(`The name "select" for a display column is reserved.
|
|
949
|
+
Please choose a different name.`);
|
|
735
950
|
}
|
|
951
|
+
this.displayedColumns = ['select'].concat(givenDisplayColumns);
|
|
952
|
+
this.dataSource = new MatTableDataSource();
|
|
953
|
+
this.dataSource.data = this.entityArrayValues;
|
|
954
|
+
this.arrayItem = new this.metadataEntityArray.EntityClass();
|
|
955
|
+
this.arrayItemInlineRows = EntityUtilities.getEntityRows(this.arrayItem, this.hideOmitForCreate === false ? false : true, this.hideOmitForEdit ? true : false);
|
|
956
|
+
this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
|
|
957
|
+
this.dialogInputData = {
|
|
958
|
+
entity: this.arrayItem,
|
|
959
|
+
createDialogData: this.metadataEntityArray.createDialogData,
|
|
960
|
+
getValidationErrorMessage: this.getValidationErrorMessage
|
|
961
|
+
};
|
|
962
|
+
this.dialogData = new AddArrayItemDialogDataBuilder(this.dialogInputData).getResult();
|
|
963
|
+
this.arrayItemDialogRows = EntityUtilities.getEntityRows(this.dialogData.entity, true);
|
|
736
964
|
}
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
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]" }] });
|
|
742
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputComponent, decorators: [{
|
|
743
|
-
type: Component,
|
|
744
|
-
args: [{ selector: 'ngx-mat-entity-internal-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 [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"] }]
|
|
745
|
-
}], propDecorators: { entity: [{
|
|
746
|
-
type: Input
|
|
747
|
-
}], propertyKey: [{
|
|
748
|
-
type: Input
|
|
749
|
-
}], hideOmitForCreate: [{
|
|
750
|
-
type: Input
|
|
751
|
-
}], hideOmitForEdit: [{
|
|
752
|
-
type: Input
|
|
753
|
-
}], getValidationErrorMessage: [{
|
|
754
|
-
type: Input
|
|
755
|
-
}] } });
|
|
756
|
-
|
|
757
|
-
class NgxMatEntityAddArrayItemDialogComponent {
|
|
758
|
-
constructor(data, dialogRef) {
|
|
759
|
-
this.data = data;
|
|
760
|
-
this.dialogRef = dialogRef;
|
|
761
|
-
this.EntityUtilities = EntityUtilities;
|
|
762
|
-
this.getWidth = EntityUtilities.getWidth;
|
|
763
|
-
}
|
|
764
|
-
ngOnInit() {
|
|
765
|
-
this.dialogRef.disableClose = true;
|
|
766
|
-
this.setEntityKeys();
|
|
767
|
-
}
|
|
768
|
-
setEntityKeys() {
|
|
769
|
-
this.entityKeys = Reflect.ownKeys(this.data.entity);
|
|
770
|
-
const omitCreateKeys = EntityUtilities.getOmitForCreate(this.data.entity);
|
|
771
|
-
this.entityKeys = this.entityKeys.filter((k) => !omitCreateKeys.includes(k))
|
|
772
|
-
.sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
|
|
773
|
-
}
|
|
774
|
-
create() {
|
|
775
|
-
this.dialogRef.close(1);
|
|
776
|
-
}
|
|
777
|
-
cancel() {
|
|
778
|
-
this.dialogRef.close();
|
|
779
|
-
}
|
|
780
|
-
}
|
|
781
|
-
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 });
|
|
782
|
-
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]" }] });
|
|
783
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogComponent, decorators: [{
|
|
784
|
-
type: Component,
|
|
785
|
-
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"] }]
|
|
786
|
-
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
787
|
-
type: Inject,
|
|
788
|
-
args: [MAT_DIALOG_DATA]
|
|
789
|
-
}] }, { type: i1.MatDialogRef }]; } });
|
|
790
|
-
|
|
791
|
-
class NgxMatEntityArrayTableComponent {
|
|
792
|
-
constructor(dialog) {
|
|
793
|
-
this.dialog = dialog;
|
|
794
|
-
this.selection = new SelectionModel(true, []);
|
|
795
|
-
this.getWidth = EntityUtilities.getWidth;
|
|
796
|
-
this.EntityUtilities = EntityUtilities;
|
|
797
|
-
}
|
|
798
|
-
trackByFn(index) {
|
|
799
|
-
return index;
|
|
800
|
-
}
|
|
801
|
-
ngOnInit() {
|
|
802
|
-
this.validateInput();
|
|
803
|
-
const givenDisplayColumns = this.metadata.displayColumns.map((v) => v.displayName);
|
|
804
|
-
if (givenDisplayColumns.find((s) => s === 'select')) {
|
|
805
|
-
throw new Error(`The name "select" for a display column is reserved.
|
|
806
|
-
Please choose a different name.`);
|
|
965
|
+
this.metadataStringChipsArray = this.metadata;
|
|
966
|
+
if ((this.type === DecoratorTypes.ARRAY_STRING_CHIPS || this.type === DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS)
|
|
967
|
+
&& this.entity[this.propertyKey]?.length) {
|
|
968
|
+
this.stringChipsArrayValues = this.entity[this.propertyKey];
|
|
807
969
|
}
|
|
808
|
-
this.
|
|
809
|
-
this.
|
|
810
|
-
|
|
811
|
-
this.arrayItem = new this.metadata.EntityClass();
|
|
812
|
-
this.arrayItemPriorChanges = cloneDeep(this.arrayItem);
|
|
813
|
-
}
|
|
814
|
-
validateInput() {
|
|
815
|
-
if (!this.metadata.createInline && !this.metadata.createDialogData) {
|
|
816
|
-
throw new Error(`Missing required Input data "createDialogData".
|
|
817
|
-
You can only omit this value when the creation is inline.`);
|
|
970
|
+
this.metadataAutocompleteStringChipsArray = this.metadata;
|
|
971
|
+
if (!this.getValidationErrorMessage) {
|
|
972
|
+
this.getValidationErrorMessage = getValidationErrorMessage;
|
|
818
973
|
}
|
|
819
974
|
}
|
|
975
|
+
/**
|
|
976
|
+
* Tries to add an item to the array.
|
|
977
|
+
* Does this either inline if the "createInline"-metadata is set to true
|
|
978
|
+
* or in a separate dialog if it is set to false.
|
|
979
|
+
*/
|
|
820
980
|
add() {
|
|
821
|
-
if (this.
|
|
822
|
-
this.
|
|
823
|
-
this.dataSource.data = this.
|
|
981
|
+
if (this.metadataEntityArray.createInline) {
|
|
982
|
+
this.entityArrayValues.push(cloneDeep(this.arrayItem));
|
|
983
|
+
this.dataSource.data = this.entityArrayValues;
|
|
824
984
|
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
825
985
|
}
|
|
826
986
|
else {
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
createDialogData: this.metadata.createDialogData,
|
|
830
|
-
getValidationErrorMessage: this.getValidationErrorMessage
|
|
831
|
-
};
|
|
832
|
-
firstValueFrom(this.dialog.open(NgxMatEntityAddArrayItemDialogComponent, {
|
|
833
|
-
data: dialogData,
|
|
987
|
+
this.addArrayItemDialogRef = this.dialog.open(this.addArrayItemDialog, {
|
|
988
|
+
data: this.dialogData,
|
|
834
989
|
autoFocus: false,
|
|
835
990
|
restoreFocus: false
|
|
836
|
-
}).afterClosed()).then((res) => {
|
|
837
|
-
if (res === 1) {
|
|
838
|
-
this.arrayItems.push(cloneDeep(this.arrayItem));
|
|
839
|
-
this.dataSource.data = this.arrayItems;
|
|
840
|
-
}
|
|
841
|
-
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
842
991
|
});
|
|
843
992
|
}
|
|
844
993
|
}
|
|
994
|
+
/**
|
|
995
|
+
* Adds the array item defined in the dialog.
|
|
996
|
+
*/
|
|
997
|
+
addArrayItem() {
|
|
998
|
+
this.addArrayItemDialogRef.close();
|
|
999
|
+
this.entityArrayValues.push(cloneDeep(this.arrayItem));
|
|
1000
|
+
this.dataSource.data = this.entityArrayValues;
|
|
1001
|
+
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
1002
|
+
}
|
|
1003
|
+
/**
|
|
1004
|
+
* Cancels adding the array item defined in the dialog.
|
|
1005
|
+
*/
|
|
1006
|
+
cancelAddArrayItem() {
|
|
1007
|
+
this.addArrayItemDialogRef.close();
|
|
1008
|
+
EntityUtilities.resetChangesOnEntity(this.arrayItem, this.arrayItemPriorChanges);
|
|
1009
|
+
}
|
|
1010
|
+
/**
|
|
1011
|
+
* Removes all selected entries from the array.
|
|
1012
|
+
*/
|
|
845
1013
|
remove() {
|
|
846
1014
|
this.selection.selected.forEach(s => {
|
|
847
|
-
this.
|
|
1015
|
+
this.entityArrayValues.splice(this.entityArrayValues.indexOf(s), 1);
|
|
848
1016
|
});
|
|
849
|
-
this.dataSource.data = this.
|
|
1017
|
+
this.dataSource.data = this.entityArrayValues;
|
|
850
1018
|
this.selection.clear();
|
|
851
1019
|
}
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
const metadata = EntityUtilities.getPropertyMetadata(this.arrayItem, property, EntityUtilities.getPropertyType(this.arrayItem, property));
|
|
856
|
-
if (!(metadata.omitForCreate)) {
|
|
857
|
-
res.push(property);
|
|
858
|
-
}
|
|
859
|
-
}
|
|
860
|
-
return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.arrayItem));
|
|
861
|
-
}
|
|
1020
|
+
/**
|
|
1021
|
+
* Toggles all array-items in the table.
|
|
1022
|
+
*/
|
|
862
1023
|
masterToggle() {
|
|
863
1024
|
if (this.isAllSelected()) {
|
|
864
1025
|
this.selection.clear();
|
|
@@ -867,95 +1028,28 @@ class NgxMatEntityArrayTableComponent {
|
|
|
867
1028
|
this.dataSource.data.forEach((row) => this.selection.select(row));
|
|
868
1029
|
}
|
|
869
1030
|
}
|
|
1031
|
+
/**
|
|
1032
|
+
* Checks if all array-items in the table have been selected.
|
|
1033
|
+
* This is needed to display the "masterToggle"-checkbox correctly.
|
|
1034
|
+
*
|
|
1035
|
+
* @returns Whether or not all array-items in the table have been selected.
|
|
1036
|
+
*/
|
|
870
1037
|
isAllSelected() {
|
|
871
1038
|
const numSelected = this.selection.selected.length;
|
|
872
1039
|
const numRows = this.dataSource.data.length;
|
|
873
1040
|
return numSelected === numRows;
|
|
874
1041
|
}
|
|
875
|
-
}
|
|
876
|
-
NgxMatEntityArrayTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
877
|
-
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"] }] });
|
|
878
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityArrayTableComponent, decorators: [{
|
|
879
|
-
type: Component,
|
|
880
|
-
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"] }]
|
|
881
|
-
}], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { arrayItems: [{
|
|
882
|
-
type: Input
|
|
883
|
-
}], metadata: [{
|
|
884
|
-
type: Input
|
|
885
|
-
}], getValidationErrorMessage: [{
|
|
886
|
-
type: Input
|
|
887
|
-
}], omit: [{
|
|
888
|
-
type: Input
|
|
889
|
-
}] } });
|
|
890
|
-
|
|
891
|
-
class NgxMatEntityInputComponent {
|
|
892
|
-
constructor() {
|
|
893
|
-
this.chipsInput = '';
|
|
894
|
-
this.DecoratorTypes = DecoratorTypes;
|
|
895
|
-
this.getWidth = EntityUtilities.getWidth;
|
|
896
|
-
}
|
|
897
1042
|
/**
|
|
898
|
-
*
|
|
1043
|
+
* Handles adding strings to the chipsArray.
|
|
1044
|
+
* Checks validation and also creates a new array if it is undefined.
|
|
1045
|
+
* This is needed because two things are validated: The array itself
|
|
1046
|
+
* and the contents of the array. And we need a way to display an
|
|
1047
|
+
* mat-error. As the only validation for the array is whether or not
|
|
1048
|
+
* it contains values, we can set it to undefined when the last element is removed
|
|
1049
|
+
* (removeStringChipArrayValue). That way we can use the "required" validator.
|
|
1050
|
+
*
|
|
1051
|
+
* @param event - The event that fires when a new chip is completed.
|
|
899
1052
|
*/
|
|
900
|
-
trackByFn(index) {
|
|
901
|
-
return index;
|
|
902
|
-
}
|
|
903
|
-
ngOnInit() {
|
|
904
|
-
if (!this.entity) {
|
|
905
|
-
throw new Error('Missing required Input data "entity"');
|
|
906
|
-
}
|
|
907
|
-
if (!this.propertyKey) {
|
|
908
|
-
throw new Error('Missing required Input data "propertyKey"');
|
|
909
|
-
}
|
|
910
|
-
this.type = EntityUtilities.getPropertyType(this.entity, this.propertyKey);
|
|
911
|
-
this.metadata = EntityUtilities.getPropertyMetadata(this.entity, this.propertyKey, this.type);
|
|
912
|
-
this.metadataDefaultString = this.metadata;
|
|
913
|
-
this.metadataTextboxString = this.metadata;
|
|
914
|
-
this.metadataAutocompleteString = this.metadata;
|
|
915
|
-
this.autocompleteStrings = this.metadataAutocompleteString.autocompleteValues;
|
|
916
|
-
this.filteredAutocompleteStrings = cloneDeep(this.autocompleteStrings);
|
|
917
|
-
this.metadataDropdownString = this.metadata;
|
|
918
|
-
this.metadataDropdownBoolean = this.metadata;
|
|
919
|
-
this.metadataDefaultNumber = this.metadata;
|
|
920
|
-
this.metadataDropdownNumber = this.metadata;
|
|
921
|
-
this.metadataDefaultObject = this.metadata;
|
|
922
|
-
this.objectProperty = this.entity[this.propertyKey];
|
|
923
|
-
this.metadataEntityArray = this.metadata;
|
|
924
|
-
if (this.metadataEntityArray.EntityClass) {
|
|
925
|
-
if (!this.entity[this.propertyKey]) {
|
|
926
|
-
this.entity[this.propertyKey] = [];
|
|
927
|
-
}
|
|
928
|
-
this.entityArrayValues = this.entity[this.propertyKey];
|
|
929
|
-
if (this.metadataEntityArray.createInline === undefined) {
|
|
930
|
-
this.metadataEntityArray.createInline = true;
|
|
931
|
-
}
|
|
932
|
-
if (!this.metadataEntityArray.createInline && !this.metadataEntityArray.createDialogData) {
|
|
933
|
-
this.metadataEntityArray.createDialogData = {
|
|
934
|
-
title: 'Add'
|
|
935
|
-
};
|
|
936
|
-
}
|
|
937
|
-
}
|
|
938
|
-
this.metadataStringChipsArray = this.metadata;
|
|
939
|
-
if (this.metadataStringChipsArray.itemType
|
|
940
|
-
&& this.entity[this.propertyKey]?.length) {
|
|
941
|
-
this.stringChipsArrayValues = this.entity[this.propertyKey];
|
|
942
|
-
}
|
|
943
|
-
this.metadataAutocompleteStringChipsArray = this.metadata;
|
|
944
|
-
if (!this.getValidationErrorMessage) {
|
|
945
|
-
this.getValidationErrorMessage = getValidationErrorMessage;
|
|
946
|
-
}
|
|
947
|
-
}
|
|
948
|
-
getObjectProperties() {
|
|
949
|
-
const res = [];
|
|
950
|
-
for (const property in this.objectProperty) {
|
|
951
|
-
const metadata = EntityUtilities.getPropertyMetadata(this.objectProperty, property, EntityUtilities.getPropertyType(this.objectProperty, property));
|
|
952
|
-
if (!(this.hideOmitForCreate && metadata.omitForCreate)
|
|
953
|
-
&& !(this.hideOmitForEdit && metadata.omitForUpdate)) {
|
|
954
|
-
res.push(property);
|
|
955
|
-
}
|
|
956
|
-
}
|
|
957
|
-
return res.sort((a, b) => EntityUtilities.compareOrder(a, b, this.objectProperty));
|
|
958
|
-
}
|
|
959
1053
|
addStringChipArrayValue(event) {
|
|
960
1054
|
const value = (event.value || '').trim();
|
|
961
1055
|
if (value) {
|
|
@@ -978,6 +1072,16 @@ class NgxMatEntityInputComponent {
|
|
|
978
1072
|
}
|
|
979
1073
|
event.chipInput.clear();
|
|
980
1074
|
}
|
|
1075
|
+
/**
|
|
1076
|
+
* Removes the given value from the array.
|
|
1077
|
+
* Sets the array to undefined if it is now empty.
|
|
1078
|
+
* This is needed because two things are validated: The array itself
|
|
1079
|
+
* and the contents of the array. And we need a way to display an
|
|
1080
|
+
* mat-error. As the only validation for the array is whether or not
|
|
1081
|
+
* it is empty, setting it to undefined here enables us to use the "required" validator.
|
|
1082
|
+
*
|
|
1083
|
+
* @param value - The string to remove from the array.
|
|
1084
|
+
*/
|
|
981
1085
|
removeStringChipArrayValue(value) {
|
|
982
1086
|
this.stringChipsArrayValues.splice(this.stringChipsArrayValues.indexOf(value), 1);
|
|
983
1087
|
if (!this.stringChipsArrayValues.length) {
|
|
@@ -985,6 +1089,12 @@ class NgxMatEntityInputComponent {
|
|
|
985
1089
|
this.stringChipsArrayValues = this.entity[this.propertyKey];
|
|
986
1090
|
}
|
|
987
1091
|
}
|
|
1092
|
+
/**
|
|
1093
|
+
* Handles adding a string to the array when an autocomplete value has been selected.
|
|
1094
|
+
*
|
|
1095
|
+
* @param event - The autocomplete selected event.
|
|
1096
|
+
* @param chipsInput - The element where the user typed the value.
|
|
1097
|
+
*/
|
|
988
1098
|
selected(event, chipsInput) {
|
|
989
1099
|
const value = (event.option.viewValue || '').trim();
|
|
990
1100
|
if (this.metadataStringChipsArray.minLength && value.length < this.metadataStringChipsArray.minLength) {
|
|
@@ -1005,17 +1115,22 @@ class NgxMatEntityInputComponent {
|
|
|
1005
1115
|
this.stringChipsArrayValues.push(value);
|
|
1006
1116
|
chipsInput.value = '';
|
|
1007
1117
|
}
|
|
1118
|
+
/**
|
|
1119
|
+
* Dynamically filters the Autocomplete options when the user inputs something.
|
|
1120
|
+
*
|
|
1121
|
+
* @param input - The input of the user.
|
|
1122
|
+
*/
|
|
1008
1123
|
filterAutocompleteStrings(input) {
|
|
1009
1124
|
const filterValue = input.toLowerCase();
|
|
1010
1125
|
this.filteredAutocompleteStrings = this.autocompleteStrings.filter(s => s.toLowerCase().includes(filterValue));
|
|
1011
1126
|
}
|
|
1012
1127
|
}
|
|
1013
|
-
NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1014
|
-
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]" }] });
|
|
1128
|
+
NgxMatEntityInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
1129
|
+
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-{{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 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-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{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 <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-{{getWidth(dialogData.entity, key, 'lg')}} col-md-{{getWidth(dialogData.entity, key, 'md')}} col-sm-{{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}\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"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i11.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2.MatLabel, selector: "mat-label" }, { type: i12.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: i13.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: i13.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i13.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i13.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i13.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i13.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { type: i13.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i2.MatError, selector: "mat-error", inputs: ["id"] }, { type: i14.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i3$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i13.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i13.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.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: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.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]" }] });
|
|
1015
1130
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputComponent, decorators: [{
|
|
1016
1131
|
type: Component,
|
|
1017
|
-
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"] }]
|
|
1018
|
-
}], ctorParameters: function () { return []; }, propDecorators: { entity: [{
|
|
1132
|
+
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-{{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 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-{{getWidth(arrayItem, key, 'lg')}} col-md-{{getWidth(arrayItem, key, 'md')}} col-sm-{{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 <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-{{getWidth(dialogData.entity, key, 'lg')}} col-md-{{getWidth(dialogData.entity, key, 'md')}} col-sm-{{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}\n"] }]
|
|
1133
|
+
}], ctorParameters: function () { return [{ type: i1.MatDialog }]; }, propDecorators: { entity: [{
|
|
1019
1134
|
type: Input
|
|
1020
1135
|
}], propertyKey: [{
|
|
1021
1136
|
type: Input
|
|
@@ -1025,11 +1140,100 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1025
1140
|
type: Input
|
|
1026
1141
|
}], hideOmitForEdit: [{
|
|
1027
1142
|
type: Input
|
|
1143
|
+
}], addArrayItemDialog: [{
|
|
1144
|
+
type: ViewChild,
|
|
1145
|
+
args: ['addArrayItemDialog']
|
|
1028
1146
|
}] } });
|
|
1029
1147
|
|
|
1148
|
+
class NgxMatEntityInputModule {
|
|
1149
|
+
}
|
|
1150
|
+
NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1151
|
+
NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
|
|
1152
|
+
MatInputModule,
|
|
1153
|
+
FormsModule,
|
|
1154
|
+
MatFormFieldModule,
|
|
1155
|
+
MatSelectModule,
|
|
1156
|
+
MatAutocompleteModule,
|
|
1157
|
+
MatCheckboxModule,
|
|
1158
|
+
MatSlideToggleModule,
|
|
1159
|
+
MatChipsModule,
|
|
1160
|
+
MatIconModule,
|
|
1161
|
+
MatTableModule,
|
|
1162
|
+
MatDialogModule,
|
|
1163
|
+
MatButtonModule], exports: [NgxMatEntityInputComponent] });
|
|
1164
|
+
NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
|
|
1165
|
+
CommonModule,
|
|
1166
|
+
MatInputModule,
|
|
1167
|
+
FormsModule,
|
|
1168
|
+
MatFormFieldModule,
|
|
1169
|
+
MatSelectModule,
|
|
1170
|
+
MatAutocompleteModule,
|
|
1171
|
+
MatCheckboxModule,
|
|
1172
|
+
MatSlideToggleModule,
|
|
1173
|
+
MatChipsModule,
|
|
1174
|
+
MatIconModule,
|
|
1175
|
+
MatTableModule,
|
|
1176
|
+
MatDialogModule,
|
|
1177
|
+
MatButtonModule
|
|
1178
|
+
]] });
|
|
1179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
|
|
1180
|
+
type: NgModule,
|
|
1181
|
+
args: [{
|
|
1182
|
+
declarations: [
|
|
1183
|
+
NgxMatEntityInputComponent,
|
|
1184
|
+
],
|
|
1185
|
+
imports: [
|
|
1186
|
+
CommonModule,
|
|
1187
|
+
MatInputModule,
|
|
1188
|
+
FormsModule,
|
|
1189
|
+
MatFormFieldModule,
|
|
1190
|
+
MatSelectModule,
|
|
1191
|
+
MatAutocompleteModule,
|
|
1192
|
+
MatCheckboxModule,
|
|
1193
|
+
MatSlideToggleModule,
|
|
1194
|
+
MatChipsModule,
|
|
1195
|
+
MatIconModule,
|
|
1196
|
+
MatTableModule,
|
|
1197
|
+
MatDialogModule,
|
|
1198
|
+
MatButtonModule
|
|
1199
|
+
],
|
|
1200
|
+
exports: [NgxMatEntityInputComponent]
|
|
1201
|
+
}]
|
|
1202
|
+
}] });
|
|
1203
|
+
|
|
1204
|
+
/**
|
|
1205
|
+
* The internal CreateEntityDialogData. Requires all default values the user can leave out.
|
|
1206
|
+
*/
|
|
1207
|
+
class CreateEntityDialogDataInternal {
|
|
1208
|
+
constructor(entity, EntityServiceClass, createDialogData) {
|
|
1209
|
+
this.entity = entity;
|
|
1210
|
+
this.EntityServiceClass = EntityServiceClass;
|
|
1211
|
+
this.createDialogData = createDialogData;
|
|
1212
|
+
}
|
|
1213
|
+
}
|
|
1214
|
+
/**
|
|
1215
|
+
* The Builder for the CreateEntityDialogData. Sets default values.
|
|
1216
|
+
*/
|
|
1217
|
+
class CreateEntityDialogDataBuilder extends BaseBuilder {
|
|
1218
|
+
constructor(data) {
|
|
1219
|
+
super(data);
|
|
1220
|
+
}
|
|
1221
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1222
|
+
generateBaseData(data) {
|
|
1223
|
+
const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
|
|
1224
|
+
return new CreateEntityDialogDataInternal(data.entity, data.EntityServiceClass, createDialogData);
|
|
1225
|
+
}
|
|
1226
|
+
}
|
|
1227
|
+
|
|
1228
|
+
/**
|
|
1229
|
+
* The default dialog used to create new entities based on the configuration passed in the MAT_DIALOG_DATA "inputData".
|
|
1230
|
+
* Used by the ngx-mat-entity-table.
|
|
1231
|
+
*
|
|
1232
|
+
* It offers a lot of customization options which can be found in "CreateEntityDialogData".
|
|
1233
|
+
*/
|
|
1030
1234
|
class NgxMatEntityCreateDialogComponent {
|
|
1031
|
-
constructor(
|
|
1032
|
-
this.
|
|
1235
|
+
constructor(inputData, dialogRef, injector, dialog) {
|
|
1236
|
+
this.inputData = inputData;
|
|
1033
1237
|
this.dialogRef = dialogRef;
|
|
1034
1238
|
this.injector = injector;
|
|
1035
1239
|
this.dialog = dialog;
|
|
@@ -1037,41 +1241,30 @@ class NgxMatEntityCreateDialogComponent {
|
|
|
1037
1241
|
this.getWidth = EntityUtilities.getWidth;
|
|
1038
1242
|
}
|
|
1039
1243
|
ngOnInit() {
|
|
1244
|
+
this.data = new CreateEntityDialogDataBuilder(this.inputData).getResult();
|
|
1040
1245
|
this.dialogRef.disableClose = true;
|
|
1041
|
-
this.
|
|
1246
|
+
this.entityRows = EntityUtilities.getEntityRows(this.data.entity, true);
|
|
1042
1247
|
this.entityService = this.injector.get(this.data.EntityServiceClass);
|
|
1043
1248
|
}
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
.sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
|
|
1049
|
-
}
|
|
1249
|
+
/**
|
|
1250
|
+
* Tries add the new entity and close the dialog afterwards.
|
|
1251
|
+
* Also handles the confirmation if required.
|
|
1252
|
+
*/
|
|
1050
1253
|
create() {
|
|
1051
|
-
if (this.data.createDialogData
|
|
1254
|
+
if (!this.data.createDialogData?.createRequiresConfirmDialog) {
|
|
1052
1255
|
return this.confirmCreate();
|
|
1053
1256
|
}
|
|
1054
|
-
const dialogData =
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
// eslint-disable-next-line max-len
|
|
1061
|
-
cancelButtonLabel: this.data.createDialogData.confirmCreateDialogData?.cancelButtonLabel ? this.data.createDialogData.confirmCreateDialogData?.cancelButtonLabel : 'Cancel',
|
|
1062
|
-
// eslint-disable-next-line max-len
|
|
1063
|
-
title: this.data.createDialogData.confirmCreateDialogData?.title ? this.data.createDialogData.confirmCreateDialogData?.title : 'Create',
|
|
1064
|
-
// eslint-disable-next-line max-len
|
|
1065
|
-
requireConfirmation: this.data.createDialogData.confirmCreateDialogData?.requireConfirmation ? this.data.createDialogData.confirmCreateDialogData?.requireConfirmation : false,
|
|
1066
|
-
// eslint-disable-next-line max-len
|
|
1067
|
-
confirmationText: this.data.createDialogData.confirmCreateDialogData?.confirmationText ? this.data.createDialogData.confirmCreateDialogData?.confirmationText : undefined,
|
|
1068
|
-
};
|
|
1069
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1257
|
+
const dialogData = new ConfirmDialogDataBuilder(this.data.createDialogData?.confirmCreateDialogData)
|
|
1258
|
+
.withDefault('text', ['Do you really want to create this entity?'])
|
|
1259
|
+
.withDefault('confirmButtonLabel', 'Create')
|
|
1260
|
+
.withDefault('title', 'Create')
|
|
1261
|
+
.getResult();
|
|
1262
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1070
1263
|
data: dialogData,
|
|
1071
1264
|
autoFocus: false,
|
|
1072
1265
|
restoreFocus: false
|
|
1073
1266
|
});
|
|
1074
|
-
|
|
1267
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1075
1268
|
if (res === 1) {
|
|
1076
1269
|
this.confirmCreate();
|
|
1077
1270
|
}
|
|
@@ -1080,23 +1273,96 @@ class NgxMatEntityCreateDialogComponent {
|
|
|
1080
1273
|
confirmCreate() {
|
|
1081
1274
|
this.entityService.create(this.data.entity).then(() => this.dialogRef.close());
|
|
1082
1275
|
}
|
|
1276
|
+
/**
|
|
1277
|
+
* Closes the dialog.
|
|
1278
|
+
*/
|
|
1083
1279
|
cancel() {
|
|
1084
1280
|
this.dialogRef.close();
|
|
1085
1281
|
}
|
|
1086
1282
|
}
|
|
1087
1283
|
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 });
|
|
1088
|
-
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
|
|
1284
|
+
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: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
1089
1285
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogComponent, decorators: [{
|
|
1090
1286
|
type: Component,
|
|
1091
|
-
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
|
|
1287
|
+
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"] }]
|
|
1092
1288
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
1093
1289
|
type: Inject,
|
|
1094
1290
|
args: [MAT_DIALOG_DATA]
|
|
1095
1291
|
}] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }]; } });
|
|
1096
1292
|
|
|
1293
|
+
/**
|
|
1294
|
+
* The internal EditDialogData. Requires all default values the user can leave out.
|
|
1295
|
+
*/
|
|
1296
|
+
class EditDialogDataInternal {
|
|
1297
|
+
constructor(title, confirmButtonLabel, deleteButtonLabel, cancelButtonLabel, deleteRequiresConfirmDialog, editRequiresConfirmDialog, confirmDeleteDialogData, confirmEditDialogData) {
|
|
1298
|
+
this.title = title;
|
|
1299
|
+
this.confirmButtonLabel = confirmButtonLabel;
|
|
1300
|
+
this.deleteButtonLabel = deleteButtonLabel;
|
|
1301
|
+
this.cancelButtonLabel = cancelButtonLabel;
|
|
1302
|
+
this.deleteRequiresConfirmDialog = deleteRequiresConfirmDialog;
|
|
1303
|
+
this.editRequiresConfirmDialog = editRequiresConfirmDialog;
|
|
1304
|
+
this.confirmDeleteDialogData = confirmDeleteDialogData;
|
|
1305
|
+
this.confirmEditDialogData = confirmEditDialogData;
|
|
1306
|
+
}
|
|
1307
|
+
}
|
|
1308
|
+
/**
|
|
1309
|
+
* The Builder for the EditDialogData. Sets default values.
|
|
1310
|
+
*/
|
|
1311
|
+
class EditDialogDataBuilder extends BaseBuilder {
|
|
1312
|
+
constructor(data) {
|
|
1313
|
+
super(data);
|
|
1314
|
+
}
|
|
1315
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1316
|
+
generateBaseData(data) {
|
|
1317
|
+
const confirmEditDialogData = new ConfirmDialogDataBuilder(data?.confirmEditDialogData)
|
|
1318
|
+
.withDefault('confirmButtonLabel', 'Save')
|
|
1319
|
+
.withDefault('text', ['Do you really want to save all changes?'])
|
|
1320
|
+
.withDefault('title', 'Edit')
|
|
1321
|
+
.getResult();
|
|
1322
|
+
const confirmDeleteDialogData = new ConfirmDialogDataBuilder(data?.confirmDeleteDialogData)
|
|
1323
|
+
.withDefault('confirmButtonLabel', 'Delete')
|
|
1324
|
+
.withDefault('type', 'delete')
|
|
1325
|
+
.withDefault('text', ['Do you really want to delete this entity?'])
|
|
1326
|
+
.withDefault('title', 'Delete')
|
|
1327
|
+
.getResult();
|
|
1328
|
+
return new EditDialogDataInternal(data?.title ? data.title : () => 'Edit', data?.confirmButtonLabel ? data.confirmButtonLabel : 'Save', data?.deleteButtonLabel ? data.deleteButtonLabel : 'Delete', data?.cancelButtonLabel ? data.cancelButtonLabel : 'Cancel', data?.deleteRequiresConfirmDialog ? data.deleteRequiresConfirmDialog : true, data?.editRequiresConfirmDialog ? data.editRequiresConfirmDialog : false, confirmDeleteDialogData, confirmEditDialogData);
|
|
1329
|
+
}
|
|
1330
|
+
}
|
|
1331
|
+
|
|
1332
|
+
/**
|
|
1333
|
+
* The internal EditEntityDialogData. Requires all default values the user can leave out.
|
|
1334
|
+
*/
|
|
1335
|
+
class EditEntityDialogDataInternal {
|
|
1336
|
+
constructor(entity, EntityServiceClass, editDialogData, allowDelete) {
|
|
1337
|
+
this.entity = entity;
|
|
1338
|
+
this.EntityServiceClass = EntityServiceClass;
|
|
1339
|
+
this.editDialogData = editDialogData;
|
|
1340
|
+
this.allowDelete = allowDelete;
|
|
1341
|
+
}
|
|
1342
|
+
}
|
|
1343
|
+
/**
|
|
1344
|
+
* The Builder for the EditEntityDialogData. Sets default values.
|
|
1345
|
+
*/
|
|
1346
|
+
class EditEntityDialogDataBuilder extends BaseBuilder {
|
|
1347
|
+
constructor(data) {
|
|
1348
|
+
super(data);
|
|
1349
|
+
}
|
|
1350
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1351
|
+
generateBaseData(data) {
|
|
1352
|
+
const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
|
|
1353
|
+
return new EditEntityDialogDataInternal(data.entity, data.EntityServiceClass, editDialogData, data.allowDelete ? data.allowDelete : () => true);
|
|
1354
|
+
}
|
|
1355
|
+
}
|
|
1356
|
+
|
|
1357
|
+
/**
|
|
1358
|
+
* The default dialog used to edit an existing entity based on the configuration passed in the MAT_DIALOG_DATA "inputData".
|
|
1359
|
+
* Used by the ngx-mat-entity-table.
|
|
1360
|
+
*
|
|
1361
|
+
* It offers a lot of customization options which can be found in "EditEntityDialogData".
|
|
1362
|
+
*/
|
|
1097
1363
|
class NgxMatEntityEditDialogComponent {
|
|
1098
|
-
constructor(
|
|
1099
|
-
this.
|
|
1364
|
+
constructor(inputData, dialogRef, injector, dialog) {
|
|
1365
|
+
this.inputData = inputData;
|
|
1100
1366
|
this.dialogRef = dialogRef;
|
|
1101
1367
|
this.injector = injector;
|
|
1102
1368
|
this.dialog = dialog;
|
|
@@ -1104,41 +1370,31 @@ class NgxMatEntityEditDialogComponent {
|
|
|
1104
1370
|
this.getWidth = EntityUtilities.getWidth;
|
|
1105
1371
|
}
|
|
1106
1372
|
ngOnInit() {
|
|
1373
|
+
this.data = new EditEntityDialogDataBuilder(this.inputData).getResult();
|
|
1107
1374
|
this.dialogRef.disableClose = true;
|
|
1108
|
-
this.
|
|
1375
|
+
this.entityRows = EntityUtilities.getEntityRows(this.data.entity, false, true);
|
|
1109
1376
|
this.entityService = this.injector.get(this.data.EntityServiceClass);
|
|
1110
1377
|
this.entityPriorChanges = cloneDeep(this.data.entity);
|
|
1111
1378
|
}
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
.sort((a, b) => EntityUtilities.compareOrder(a, b, this.data.entity));
|
|
1117
|
-
}
|
|
1379
|
+
/**
|
|
1380
|
+
* Tries to save the changes and close the dialog afterwards.
|
|
1381
|
+
* Also handles the confirmation if required.
|
|
1382
|
+
*/
|
|
1118
1383
|
edit() {
|
|
1119
|
-
if (this.data.editDialogData.editRequiresConfirmDialog
|
|
1384
|
+
if (!this.data.editDialogData.editRequiresConfirmDialog) {
|
|
1120
1385
|
return this.confirmEdit();
|
|
1121
1386
|
}
|
|
1122
|
-
const dialogData =
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
// eslint-disable-next-line max-len
|
|
1129
|
-
cancelButtonLabel: this.data.editDialogData.confirmEditDialogData?.cancelButtonLabel ? this.data.editDialogData.confirmEditDialogData?.cancelButtonLabel : 'Cancel',
|
|
1130
|
-
title: this.data.editDialogData.confirmEditDialogData?.title ? this.data.editDialogData.confirmEditDialogData?.title : 'Edit',
|
|
1131
|
-
// eslint-disable-next-line max-len
|
|
1132
|
-
requireConfirmation: this.data.editDialogData.confirmEditDialogData?.requireConfirmation ? this.data.editDialogData.confirmEditDialogData?.requireConfirmation : false,
|
|
1133
|
-
// eslint-disable-next-line max-len
|
|
1134
|
-
confirmationText: this.data.editDialogData.confirmEditDialogData?.confirmationText ? this.data.editDialogData.confirmEditDialogData?.confirmationText : undefined,
|
|
1135
|
-
};
|
|
1136
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1387
|
+
const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmEditDialogData)
|
|
1388
|
+
.withDefault('text', ['Do you really want to save all changes?'])
|
|
1389
|
+
.withDefault('confirmButtonLabel', 'Save')
|
|
1390
|
+
.withDefault('title', 'Edit')
|
|
1391
|
+
.getResult();
|
|
1392
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1137
1393
|
data: dialogData,
|
|
1138
1394
|
autoFocus: false,
|
|
1139
1395
|
restoreFocus: false
|
|
1140
1396
|
});
|
|
1141
|
-
|
|
1397
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1142
1398
|
if (res === 1) {
|
|
1143
1399
|
this.confirmEdit();
|
|
1144
1400
|
}
|
|
@@ -1147,31 +1403,26 @@ class NgxMatEntityEditDialogComponent {
|
|
|
1147
1403
|
confirmEdit() {
|
|
1148
1404
|
this.entityService.update(this.data.entity, this.entityPriorChanges).then(() => this.dialogRef.close(1));
|
|
1149
1405
|
}
|
|
1406
|
+
/**
|
|
1407
|
+
* Tries to delete the entity and close the dialog afterwards.
|
|
1408
|
+
* Also handles the confirmation if required.
|
|
1409
|
+
*/
|
|
1150
1410
|
delete() {
|
|
1151
|
-
if (this.data.editDialogData.deleteRequiresConfirmDialog
|
|
1411
|
+
if (!this.data.editDialogData.deleteRequiresConfirmDialog) {
|
|
1152
1412
|
return this.confirmDelete();
|
|
1153
1413
|
}
|
|
1154
|
-
const dialogData =
|
|
1155
|
-
|
|
1156
|
-
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
cancelButtonLabel: this.data.editDialogData.confirmDeleteDialogData?.cancelButtonLabel ? this.data.editDialogData.confirmDeleteDialogData?.cancelButtonLabel : 'Cancel',
|
|
1162
|
-
// eslint-disable-next-line max-len
|
|
1163
|
-
title: this.data.editDialogData.confirmDeleteDialogData?.title ? this.data.editDialogData.confirmDeleteDialogData?.title : 'Delete',
|
|
1164
|
-
// eslint-disable-next-line max-len
|
|
1165
|
-
requireConfirmation: this.data.editDialogData.confirmDeleteDialogData?.requireConfirmation ? this.data.editDialogData.confirmDeleteDialogData?.requireConfirmation : false,
|
|
1166
|
-
// eslint-disable-next-line max-len
|
|
1167
|
-
confirmationText: this.data.editDialogData.confirmDeleteDialogData?.confirmationText ? this.data.editDialogData.confirmDeleteDialogData?.confirmationText : undefined,
|
|
1168
|
-
};
|
|
1169
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1414
|
+
const dialogData = new ConfirmDialogDataBuilder(this.data.editDialogData.confirmDeleteDialogData)
|
|
1415
|
+
.withDefault('text', ['Do you really want to delete this entity?'])
|
|
1416
|
+
.withDefault('type', 'delete')
|
|
1417
|
+
.withDefault('confirmButtonLabel', 'Delete')
|
|
1418
|
+
.withDefault('title', 'Delete')
|
|
1419
|
+
.getResult();
|
|
1420
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1170
1421
|
data: dialogData,
|
|
1171
1422
|
autoFocus: false,
|
|
1172
1423
|
restoreFocus: false
|
|
1173
1424
|
});
|
|
1174
|
-
|
|
1425
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1175
1426
|
if (res === 1) {
|
|
1176
1427
|
this.confirmDelete();
|
|
1177
1428
|
}
|
|
@@ -1180,21 +1431,132 @@ class NgxMatEntityEditDialogComponent {
|
|
|
1180
1431
|
confirmDelete() {
|
|
1181
1432
|
this.entityService.delete(this.entityPriorChanges.id).then(() => this.dialogRef.close(2));
|
|
1182
1433
|
}
|
|
1434
|
+
/**
|
|
1435
|
+
* Reverts all changes made and closes the dialog.
|
|
1436
|
+
*/
|
|
1183
1437
|
cancel() {
|
|
1184
1438
|
EntityUtilities.resetChangesOnEntity(this.data.entity, this.entityPriorChanges);
|
|
1185
1439
|
this.dialogRef.close(0);
|
|
1186
1440
|
}
|
|
1187
1441
|
}
|
|
1188
1442
|
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 });
|
|
1189
|
-
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
|
|
1443
|
+
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: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i13.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i13.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i13.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }] });
|
|
1190
1444
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogComponent, decorators: [{
|
|
1191
1445
|
type: Component,
|
|
1192
|
-
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
|
|
1446
|
+
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"] }]
|
|
1193
1447
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
1194
1448
|
type: Inject,
|
|
1195
1449
|
args: [MAT_DIALOG_DATA]
|
|
1196
1450
|
}] }, { type: i1.MatDialogRef }, { type: i0.Injector }, { type: i1.MatDialog }]; } });
|
|
1197
1451
|
|
|
1452
|
+
/**
|
|
1453
|
+
* The internal TableData. Requires all default values the user can leave out.
|
|
1454
|
+
*/
|
|
1455
|
+
class TableDataInternal {
|
|
1456
|
+
constructor(baseData, createDialogData, editDialogData) {
|
|
1457
|
+
this.baseData = baseData;
|
|
1458
|
+
this.createDialogData = createDialogData;
|
|
1459
|
+
this.editDialogData = editDialogData;
|
|
1460
|
+
}
|
|
1461
|
+
}
|
|
1462
|
+
/**
|
|
1463
|
+
* The Builder for the table BaseData. Sets default values.
|
|
1464
|
+
*/
|
|
1465
|
+
class BaseDataBuilder extends BaseBuilder {
|
|
1466
|
+
constructor(data) {
|
|
1467
|
+
super(data);
|
|
1468
|
+
}
|
|
1469
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1470
|
+
generateBaseData(data) {
|
|
1471
|
+
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);
|
|
1472
|
+
}
|
|
1473
|
+
}
|
|
1474
|
+
/**
|
|
1475
|
+
* The internal TableData. Requires all default values the user can leave out.
|
|
1476
|
+
*/
|
|
1477
|
+
class BaseDataInternal {
|
|
1478
|
+
constructor(title, displayColumns, EntityServiceClass, searchLabel, createButtonLabel, searchString, allowCreate, allowEdit, allowDelete, multiSelectActions, multiSelectLabel, EntityClass, edit, create) {
|
|
1479
|
+
this.title = title;
|
|
1480
|
+
this.displayColumns = displayColumns;
|
|
1481
|
+
this.EntityServiceClass = EntityServiceClass;
|
|
1482
|
+
this.EntityClass = EntityClass;
|
|
1483
|
+
this.searchLabel = searchLabel;
|
|
1484
|
+
this.createButtonLabel = createButtonLabel;
|
|
1485
|
+
this.searchString = searchString;
|
|
1486
|
+
this.allowCreate = allowCreate;
|
|
1487
|
+
this.allowEdit = allowEdit;
|
|
1488
|
+
this.allowDelete = allowDelete;
|
|
1489
|
+
this.multiSelectActions = multiSelectActions;
|
|
1490
|
+
this.multiSelectLabel = multiSelectLabel;
|
|
1491
|
+
this.edit = edit;
|
|
1492
|
+
this.create = create;
|
|
1493
|
+
}
|
|
1494
|
+
}
|
|
1495
|
+
/**
|
|
1496
|
+
* The Builder for the complete TableData. Sets default values and validates user input.
|
|
1497
|
+
*/
|
|
1498
|
+
class TableDataBuilder extends BaseBuilder {
|
|
1499
|
+
constructor(data) {
|
|
1500
|
+
super(data);
|
|
1501
|
+
}
|
|
1502
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1503
|
+
generateBaseData(data) {
|
|
1504
|
+
const createDialogData = new CreateDialogDataBuilder(data.createDialogData).getResult();
|
|
1505
|
+
const editDialogData = new EditDialogDataBuilder(data.editDialogData).getResult();
|
|
1506
|
+
const baseData = new BaseDataBuilder(data.baseData).getResult();
|
|
1507
|
+
return new TableDataInternal(baseData, createDialogData, editDialogData);
|
|
1508
|
+
}
|
|
1509
|
+
// eslint-disable-next-line jsdoc/require-jsdoc
|
|
1510
|
+
validateInput(data) {
|
|
1511
|
+
if (data.baseData.multiSelectActions?.length && data.baseData.displayColumns.find(dp => dp.displayName === 'select')) {
|
|
1512
|
+
throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
|
|
1513
|
+
Please choose a different name.`);
|
|
1514
|
+
}
|
|
1515
|
+
if ((data.baseData.allowEdit && data.baseData.allowEdit !== (() => false)
|
|
1516
|
+
|| data.baseData.allowDelete && data.baseData.allowDelete !== (() => false)
|
|
1517
|
+
|| data.baseData.allowCreate)
|
|
1518
|
+
&& !data.baseData.EntityClass) {
|
|
1519
|
+
throw new Error(`
|
|
1520
|
+
Missing required Input data "EntityClass".
|
|
1521
|
+
You can only omit this value if you can neither create or update entities.`);
|
|
1522
|
+
}
|
|
1523
|
+
if (data.baseData.allowCreate !== false && !data.baseData.create && !data.createDialogData) {
|
|
1524
|
+
throw new Error(`Missing required Input data "createDialogData".
|
|
1525
|
+
You can only omit this value when creation is disallowed or done with a custom create method.`);
|
|
1526
|
+
}
|
|
1527
|
+
if ((data.baseData.allowEdit !== (() => false)
|
|
1528
|
+
|| data.baseData.allowDelete !== (() => false))
|
|
1529
|
+
&& !data.baseData.edit
|
|
1530
|
+
&& !data.editDialogData) {
|
|
1531
|
+
throw new Error(`Missing required Input data "editDialogData".
|
|
1532
|
+
You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
|
|
1533
|
+
}
|
|
1534
|
+
}
|
|
1535
|
+
}
|
|
1536
|
+
/**
|
|
1537
|
+
* The default search function taken from googles mat table.
|
|
1538
|
+
* This will be used if no custom search function is provided by the configuration.
|
|
1539
|
+
*
|
|
1540
|
+
* It generates a string from an entity which is then used to compare it to the search input.
|
|
1541
|
+
*
|
|
1542
|
+
* @param entity - An entity that is in the search.
|
|
1543
|
+
* @returns The generated string of the given entity used for comparison with the search input.
|
|
1544
|
+
*/
|
|
1545
|
+
function defaultSearchFunction(entity) {
|
|
1546
|
+
const searchString = Object.keys(entity)
|
|
1547
|
+
.reduce((currentTerm, key) => {
|
|
1548
|
+
return `${currentTerm}${entity[key]}◬`;
|
|
1549
|
+
}, '')
|
|
1550
|
+
.toLowerCase();
|
|
1551
|
+
return searchString;
|
|
1552
|
+
}
|
|
1553
|
+
|
|
1554
|
+
/**
|
|
1555
|
+
* Generates a fully functional table for displaying, creating, updating and deleting entities
|
|
1556
|
+
* based on the configuration passed in the @Input "tableData".
|
|
1557
|
+
*
|
|
1558
|
+
* It offers a lot of customization options which can be found in "TableData".
|
|
1559
|
+
*/
|
|
1198
1560
|
class NgxMatEntityTableComponent {
|
|
1199
1561
|
constructor(dialog, injector) {
|
|
1200
1562
|
this.dialog = dialog;
|
|
@@ -1203,27 +1565,26 @@ class NgxMatEntityTableComponent {
|
|
|
1203
1565
|
this.dataSource = new MatTableDataSource();
|
|
1204
1566
|
this.selection = new SelectionModel(true, []);
|
|
1205
1567
|
}
|
|
1568
|
+
/**
|
|
1569
|
+
* Sets up all the configuration for the table and the EntityService.
|
|
1570
|
+
*/
|
|
1206
1571
|
ngOnInit() {
|
|
1207
|
-
this.
|
|
1208
|
-
this.entityService = this.injector.get(this.
|
|
1209
|
-
const givenDisplayColumns = this.
|
|
1210
|
-
if (this.
|
|
1211
|
-
if (givenDisplayColumns.find((s) => s === 'select')) {
|
|
1212
|
-
throw new Error(`The name "select" for a display column is reserved for the multi-select action functionality.
|
|
1213
|
-
Please choose a different name.`);
|
|
1214
|
-
}
|
|
1572
|
+
this.data = new TableDataBuilder(this.tableData).getResult();
|
|
1573
|
+
this.entityService = this.injector.get(this.data.baseData.EntityServiceClass);
|
|
1574
|
+
const givenDisplayColumns = this.data.baseData.displayColumns.map((v) => v.displayName);
|
|
1575
|
+
if (this.data.baseData.multiSelectActions.length) {
|
|
1215
1576
|
this.displayedColumns = ['select'].concat(givenDisplayColumns);
|
|
1216
1577
|
}
|
|
1217
1578
|
else {
|
|
1218
1579
|
this.displayedColumns = givenDisplayColumns;
|
|
1219
1580
|
}
|
|
1220
1581
|
this.dataSource.sortingDataAccessor = (entity, header) => {
|
|
1221
|
-
return this.
|
|
1582
|
+
return this.data.baseData.displayColumns.find((dp) => dp.displayName === header)?.value(entity);
|
|
1222
1583
|
};
|
|
1223
1584
|
this.dataSource.sort = this.sort;
|
|
1224
|
-
if (this.
|
|
1585
|
+
if (this.data.baseData.searchString) {
|
|
1225
1586
|
this.dataSource.filterPredicate = (entity, filter) => {
|
|
1226
|
-
const searchStr = this.
|
|
1587
|
+
const searchStr = this.data.baseData.searchString(entity);
|
|
1227
1588
|
const formattedSearchString = searchStr.toLowerCase();
|
|
1228
1589
|
const formattedFilterString = filter.toLowerCase();
|
|
1229
1590
|
return formattedSearchString.includes(formattedFilterString);
|
|
@@ -1237,62 +1598,33 @@ class NgxMatEntityTableComponent {
|
|
|
1237
1598
|
});
|
|
1238
1599
|
this.entityService.read();
|
|
1239
1600
|
}
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
}
|
|
1247
|
-
if (!this.entitiesData.baseData.EntityServiceClass) {
|
|
1248
|
-
throw new Error('Missing required Input data "EntityServiceClass"');
|
|
1249
|
-
}
|
|
1250
|
-
if (this.entitiesData.baseData.allowCreate === undefined) {
|
|
1251
|
-
this.entitiesData.baseData.allowCreate = true;
|
|
1252
|
-
}
|
|
1253
|
-
if (this.entitiesData.baseData.allowEdit === undefined) {
|
|
1254
|
-
this.entitiesData.baseData.allowEdit = () => true;
|
|
1255
|
-
}
|
|
1256
|
-
if (this.entitiesData.baseData.allowDelete === undefined) {
|
|
1257
|
-
this.entitiesData.baseData.allowDelete = () => true;
|
|
1258
|
-
}
|
|
1259
|
-
if ((this.entitiesData.baseData.allowEdit !== (() => false)
|
|
1260
|
-
|| this.entitiesData.baseData.allowDelete !== (() => false)
|
|
1261
|
-
|| this.entitiesData.baseData.allowCreate)
|
|
1262
|
-
&& !this.entitiesData.baseData.EntityClass) {
|
|
1263
|
-
throw new Error(`
|
|
1264
|
-
Missing required Input data "EntityClass".
|
|
1265
|
-
You can only omit this value if you can neither create or update entities.`);
|
|
1266
|
-
}
|
|
1267
|
-
if (this.entitiesData.baseData.allowCreate && !this.entitiesData.baseData.create && !this.entitiesData.createDialogData) {
|
|
1268
|
-
throw new Error(`Missing required Input data "createDialogData".
|
|
1269
|
-
You can only omit this value when creation is disallowed or done with a custom create method.`);
|
|
1270
|
-
}
|
|
1271
|
-
if ((this.entitiesData.baseData.allowEdit !== (() => false)
|
|
1272
|
-
|| this.entitiesData.baseData.allowDelete !== (() => false))
|
|
1273
|
-
&& !this.entitiesData.baseData.edit
|
|
1274
|
-
&& !this.entitiesData.editDialogData) {
|
|
1275
|
-
throw new Error(`Missing required Input data "editDialogData".
|
|
1276
|
-
You can only omit this value when editing and deleting is disallowed or done with a custom edit method.`);
|
|
1277
|
-
}
|
|
1278
|
-
}
|
|
1601
|
+
/**
|
|
1602
|
+
* Edits an entity. This either calls the edit-Method provided by the user or uses a default edit-dialog.
|
|
1603
|
+
*
|
|
1604
|
+
* @param entity - The entity that should be updated.
|
|
1605
|
+
* @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
|
|
1606
|
+
*/
|
|
1279
1607
|
editEntity(entity) {
|
|
1280
|
-
if (this.
|
|
1281
|
-
if (this.
|
|
1282
|
-
|
|
1608
|
+
if (this.data.baseData.allowEdit(entity)) {
|
|
1609
|
+
if (!this.data.baseData.EntityClass) {
|
|
1610
|
+
throw new Error('No "EntityClass" specified for this table');
|
|
1611
|
+
}
|
|
1612
|
+
if (this.data.baseData.edit) {
|
|
1613
|
+
this.data.baseData.edit(new this.data.baseData.EntityClass(entity));
|
|
1283
1614
|
}
|
|
1284
1615
|
else {
|
|
1285
|
-
this.editDefault(new this.
|
|
1616
|
+
this.editDefault(new this.data.baseData.EntityClass(entity));
|
|
1286
1617
|
}
|
|
1287
1618
|
}
|
|
1288
1619
|
}
|
|
1289
1620
|
editDefault(entity) {
|
|
1290
|
-
const
|
|
1621
|
+
const inputDialogData = {
|
|
1291
1622
|
entity: entity,
|
|
1292
|
-
EntityServiceClass: this.
|
|
1293
|
-
allowDelete: this.
|
|
1294
|
-
editDialogData: this.
|
|
1623
|
+
EntityServiceClass: this.data.baseData.EntityServiceClass,
|
|
1624
|
+
allowDelete: this.data.baseData.allowDelete,
|
|
1625
|
+
editDialogData: this.data.editDialogData
|
|
1295
1626
|
};
|
|
1627
|
+
const dialogData = new EditEntityDialogDataBuilder(inputDialogData).getResult();
|
|
1296
1628
|
firstValueFrom(this.dialog.open(NgxMatEntityEditDialogComponent, {
|
|
1297
1629
|
data: dialogData,
|
|
1298
1630
|
minWidth: '60%',
|
|
@@ -1307,22 +1639,30 @@ class NgxMatEntityTableComponent {
|
|
|
1307
1639
|
}
|
|
1308
1640
|
});
|
|
1309
1641
|
}
|
|
1642
|
+
/**
|
|
1643
|
+
* Creates a new Entity. This either calls the create-Method provided by the user or uses a default create-dialog.
|
|
1644
|
+
*
|
|
1645
|
+
* @throws When no EntityClass was provided, as a new call is needed to initialize metadata.
|
|
1646
|
+
*/
|
|
1310
1647
|
createEntity() {
|
|
1311
|
-
if (this.
|
|
1312
|
-
if (this.
|
|
1313
|
-
|
|
1648
|
+
if (this.data.baseData.allowCreate) {
|
|
1649
|
+
if (!this.data.baseData.EntityClass) {
|
|
1650
|
+
throw new Error('No "EntityClass" specified for this table');
|
|
1651
|
+
}
|
|
1652
|
+
if (this.data.baseData.create) {
|
|
1653
|
+
this.data.baseData.create(new this.data.baseData.EntityClass());
|
|
1314
1654
|
}
|
|
1315
1655
|
else {
|
|
1316
|
-
this.createDefault(new this.
|
|
1656
|
+
this.createDefault(new this.data.baseData.EntityClass());
|
|
1317
1657
|
}
|
|
1318
1658
|
}
|
|
1319
1659
|
}
|
|
1320
1660
|
createDefault(entity) {
|
|
1321
|
-
const dialogData = {
|
|
1661
|
+
const dialogData = new CreateEntityDialogDataBuilder({
|
|
1322
1662
|
entity: entity,
|
|
1323
|
-
EntityServiceClass: this.
|
|
1324
|
-
createDialogData: this.
|
|
1325
|
-
};
|
|
1663
|
+
EntityServiceClass: this.data.baseData.EntityServiceClass,
|
|
1664
|
+
createDialogData: this.data.createDialogData
|
|
1665
|
+
}).getResult();
|
|
1326
1666
|
this.dialog.open(NgxMatEntityCreateDialogComponent, {
|
|
1327
1667
|
data: dialogData,
|
|
1328
1668
|
minWidth: '60%',
|
|
@@ -1330,26 +1670,26 @@ class NgxMatEntityTableComponent {
|
|
|
1330
1670
|
restoreFocus: false
|
|
1331
1671
|
});
|
|
1332
1672
|
}
|
|
1673
|
+
/**
|
|
1674
|
+
* Runs the MultiAction for all selected entries.
|
|
1675
|
+
* Also handles confirmation with an additional dialog if configured.
|
|
1676
|
+
*
|
|
1677
|
+
* @param action - The MultiAction to run.
|
|
1678
|
+
*/
|
|
1333
1679
|
runMultiAction(action) {
|
|
1334
1680
|
if (!action.requireConfirmDialog || !action.requireConfirmDialog(this.selection.selected)) {
|
|
1335
1681
|
return this.confirmRunMultiAction(action);
|
|
1336
1682
|
}
|
|
1337
|
-
const dialogData =
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
cancelButtonLabel: action.confirmDialogData?.cancelButtonLabel ? action.confirmDialogData?.cancelButtonLabel : 'Cancel',
|
|
1343
|
-
title: action.confirmDialogData?.title ? action.confirmDialogData?.title : action.displayName,
|
|
1344
|
-
requireConfirmation: action.confirmDialogData?.requireConfirmation ? action.confirmDialogData?.requireConfirmation : false,
|
|
1345
|
-
confirmationText: action.confirmDialogData?.confirmationText ? action.confirmDialogData?.confirmationText : undefined
|
|
1346
|
-
};
|
|
1347
|
-
const dialogref = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1683
|
+
const dialogData = new ConfirmDialogDataBuilder(action.confirmDialogData)
|
|
1684
|
+
.withDefault('text', [`Do you really want to run this action on ${this.selection.selected.length} entries?`])
|
|
1685
|
+
.withDefault('title', action.displayName)
|
|
1686
|
+
.getResult();
|
|
1687
|
+
const dialogRef = this.dialog.open(NgxMatEntityConfirmDialogComponent, {
|
|
1348
1688
|
data: dialogData,
|
|
1349
1689
|
autoFocus: false,
|
|
1350
1690
|
restoreFocus: false
|
|
1351
1691
|
});
|
|
1352
|
-
|
|
1692
|
+
dialogRef.afterClosed().subscribe((res) => {
|
|
1353
1693
|
if (res === 1) {
|
|
1354
1694
|
this.confirmRunMultiAction(action);
|
|
1355
1695
|
}
|
|
@@ -1358,6 +1698,12 @@ class NgxMatEntityTableComponent {
|
|
|
1358
1698
|
confirmRunMultiAction(action) {
|
|
1359
1699
|
action.action(this.selection.selected);
|
|
1360
1700
|
}
|
|
1701
|
+
/**
|
|
1702
|
+
* Checks if an MultiAction is disabled (e.g. Because no entries have been selected).
|
|
1703
|
+
*
|
|
1704
|
+
* @param action - The MultiAction to check.
|
|
1705
|
+
* @returns Whether or not the Action can be used.
|
|
1706
|
+
*/
|
|
1361
1707
|
multiActionDisabled(action) {
|
|
1362
1708
|
if (!this.selection.selected.length) {
|
|
1363
1709
|
return true;
|
|
@@ -1367,6 +1713,9 @@ class NgxMatEntityTableComponent {
|
|
|
1367
1713
|
}
|
|
1368
1714
|
return false;
|
|
1369
1715
|
}
|
|
1716
|
+
/**
|
|
1717
|
+
* Toggles all entries in the table.
|
|
1718
|
+
*/
|
|
1370
1719
|
masterToggle() {
|
|
1371
1720
|
if (this.isAllSelected()) {
|
|
1372
1721
|
this.selection.clear();
|
|
@@ -1375,6 +1724,12 @@ class NgxMatEntityTableComponent {
|
|
|
1375
1724
|
this.dataSource.data.forEach((row) => this.selection.select(row));
|
|
1376
1725
|
}
|
|
1377
1726
|
}
|
|
1727
|
+
/**
|
|
1728
|
+
* Checks if all entries in the table have been selected.
|
|
1729
|
+
* This is needed to display the "masterToggle"-checkbox correctly.
|
|
1730
|
+
*
|
|
1731
|
+
* @returns Whether or not all entries in the table have been selected.
|
|
1732
|
+
*/
|
|
1378
1733
|
isAllSelected() {
|
|
1379
1734
|
const numSelected = this.selection.selected.length;
|
|
1380
1735
|
const numRows = this.dataSource.data.length;
|
|
@@ -1384,17 +1739,22 @@ class NgxMatEntityTableComponent {
|
|
|
1384
1739
|
this.onDestroy.next(undefined);
|
|
1385
1740
|
this.onDestroy.complete();
|
|
1386
1741
|
}
|
|
1742
|
+
/**
|
|
1743
|
+
* Applies the search input to filter the table entries.
|
|
1744
|
+
*
|
|
1745
|
+
* @param event - The keyup-event which contains the search-string of the user.
|
|
1746
|
+
*/
|
|
1387
1747
|
applyFilter(event) {
|
|
1388
1748
|
const filterValue = event.target.value;
|
|
1389
1749
|
this.dataSource.filter = filterValue.trim().toLowerCase();
|
|
1390
1750
|
}
|
|
1391
1751
|
}
|
|
1392
1752
|
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 });
|
|
1393
|
-
NgxMatEntityTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NgxMatEntityTableComponent, selector: "ngx-mat-entity-table", inputs: {
|
|
1753
|
+
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: i12.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: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i11.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"] }] });
|
|
1394
1754
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableComponent, decorators: [{
|
|
1395
1755
|
type: Component,
|
|
1396
|
-
args: [{ selector: 'ngx-mat-entity-table', template: "<h1 class=\"title\">{{
|
|
1397
|
-
}], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: {
|
|
1756
|
+
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"] }]
|
|
1757
|
+
}], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i0.Injector }]; }, propDecorators: { tableData: [{
|
|
1398
1758
|
type: Input
|
|
1399
1759
|
}], paginator: [{
|
|
1400
1760
|
type: ViewChild,
|
|
@@ -1407,354 +1767,342 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
1407
1767
|
args: ['filter', { static: true }]
|
|
1408
1768
|
}] } });
|
|
1409
1769
|
|
|
1410
|
-
class
|
|
1770
|
+
class NgxMatEntityCreateDialogModule {
|
|
1411
1771
|
}
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1772
|
+
NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1773
|
+
NgxMatEntityCreateDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, declarations: [NgxMatEntityCreateDialogComponent], imports: [CommonModule,
|
|
1774
|
+
NgxMatEntityInputModule,
|
|
1775
|
+
MatDialogModule,
|
|
1415
1776
|
FormsModule,
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
MatTableModule,
|
|
1419
|
-
MatPaginatorModule,
|
|
1420
|
-
MatButtonModule,
|
|
1421
|
-
MatMenuModule,
|
|
1422
|
-
MatDialogModule], exports: [NgxMatEntityTableComponent] });
|
|
1423
|
-
NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
|
|
1777
|
+
MatButtonModule], exports: [NgxMatEntityCreateDialogComponent] });
|
|
1778
|
+
NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[
|
|
1424
1779
|
CommonModule,
|
|
1425
|
-
|
|
1780
|
+
NgxMatEntityInputModule,
|
|
1781
|
+
MatDialogModule,
|
|
1426
1782
|
FormsModule,
|
|
1427
|
-
|
|
1428
|
-
MatCheckboxModule,
|
|
1429
|
-
MatTableModule,
|
|
1430
|
-
MatPaginatorModule,
|
|
1431
|
-
MatButtonModule,
|
|
1432
|
-
MatMenuModule,
|
|
1433
|
-
MatDialogModule
|
|
1783
|
+
MatButtonModule
|
|
1434
1784
|
]] });
|
|
1435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type:
|
|
1785
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
|
|
1436
1786
|
type: NgModule,
|
|
1437
1787
|
args: [{
|
|
1438
|
-
declarations: [
|
|
1788
|
+
declarations: [NgxMatEntityCreateDialogComponent],
|
|
1439
1789
|
imports: [
|
|
1440
1790
|
CommonModule,
|
|
1441
|
-
|
|
1791
|
+
NgxMatEntityInputModule,
|
|
1792
|
+
MatDialogModule,
|
|
1442
1793
|
FormsModule,
|
|
1443
|
-
|
|
1444
|
-
MatCheckboxModule,
|
|
1445
|
-
MatTableModule,
|
|
1446
|
-
MatPaginatorModule,
|
|
1447
|
-
MatButtonModule,
|
|
1448
|
-
MatMenuModule,
|
|
1449
|
-
MatDialogModule
|
|
1794
|
+
MatButtonModule
|
|
1450
1795
|
],
|
|
1451
|
-
exports: [
|
|
1796
|
+
exports: [NgxMatEntityCreateDialogComponent]
|
|
1452
1797
|
}]
|
|
1453
1798
|
}] });
|
|
1454
1799
|
|
|
1455
|
-
class
|
|
1800
|
+
class NgxMatEntityEditDialogModule {
|
|
1456
1801
|
}
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
|
|
1802
|
+
NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1803
|
+
NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
|
|
1804
|
+
NgxMatEntityInputModule,
|
|
1805
|
+
MatDialogModule,
|
|
1460
1806
|
FormsModule,
|
|
1461
|
-
|
|
1462
|
-
|
|
1463
|
-
|
|
1464
|
-
MatCheckboxModule,
|
|
1465
|
-
MatSlideToggleModule,
|
|
1466
|
-
MatTableModule], exports: [NgxMatEntityInternalInputComponent] });
|
|
1467
|
-
NgxMatEntityInternalInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInternalInputModule, imports: [[
|
|
1807
|
+
MatButtonModule,
|
|
1808
|
+
NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
|
|
1809
|
+
NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
|
|
1468
1810
|
CommonModule,
|
|
1469
|
-
|
|
1811
|
+
NgxMatEntityInputModule,
|
|
1812
|
+
MatDialogModule,
|
|
1470
1813
|
FormsModule,
|
|
1471
|
-
|
|
1472
|
-
|
|
1473
|
-
MatAutocompleteModule,
|
|
1474
|
-
MatCheckboxModule,
|
|
1475
|
-
MatSlideToggleModule,
|
|
1476
|
-
MatTableModule
|
|
1814
|
+
MatButtonModule,
|
|
1815
|
+
NgxMatEntityConfirmDialogModule
|
|
1477
1816
|
]] });
|
|
1478
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type:
|
|
1817
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
|
|
1479
1818
|
type: NgModule,
|
|
1480
1819
|
args: [{
|
|
1481
|
-
declarations: [
|
|
1820
|
+
declarations: [NgxMatEntityEditDialogComponent],
|
|
1482
1821
|
imports: [
|
|
1483
1822
|
CommonModule,
|
|
1484
|
-
|
|
1823
|
+
NgxMatEntityInputModule,
|
|
1824
|
+
MatDialogModule,
|
|
1485
1825
|
FormsModule,
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
MatAutocompleteModule,
|
|
1489
|
-
MatCheckboxModule,
|
|
1490
|
-
MatSlideToggleModule,
|
|
1491
|
-
MatTableModule
|
|
1826
|
+
MatButtonModule,
|
|
1827
|
+
NgxMatEntityConfirmDialogModule
|
|
1492
1828
|
],
|
|
1493
|
-
exports: [
|
|
1494
|
-
}]
|
|
1495
|
-
}] });
|
|
1496
|
-
|
|
1497
|
-
class NgxMatEntityAddArrayItemDialogModule {
|
|
1498
|
-
}
|
|
1499
|
-
NgxMatEntityAddArrayItemDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1500
|
-
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] });
|
|
1501
|
-
NgxMatEntityAddArrayItemDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, imports: [[CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
|
|
1502
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityAddArrayItemDialogModule, decorators: [{
|
|
1503
|
-
type: NgModule,
|
|
1504
|
-
args: [{
|
|
1505
|
-
declarations: [NgxMatEntityAddArrayItemDialogComponent],
|
|
1506
|
-
imports: [CommonModule, NgxMatEntityInternalInputModule, MatDialogModule, FormsModule, MatButtonModule],
|
|
1507
|
-
exports: [NgxMatEntityAddArrayItemDialogComponent]
|
|
1829
|
+
exports: [NgxMatEntityEditDialogComponent]
|
|
1508
1830
|
}]
|
|
1509
1831
|
}] });
|
|
1510
1832
|
|
|
1511
|
-
class
|
|
1833
|
+
class NgxMatEntityTableModule {
|
|
1512
1834
|
}
|
|
1513
|
-
|
|
1514
|
-
|
|
1835
|
+
NgxMatEntityTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1836
|
+
NgxMatEntityTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, declarations: [NgxMatEntityTableComponent], imports: [CommonModule,
|
|
1515
1837
|
MatInputModule,
|
|
1516
1838
|
FormsModule,
|
|
1517
1839
|
MatFormFieldModule,
|
|
1518
|
-
MatSelectModule,
|
|
1519
|
-
MatAutocompleteModule,
|
|
1520
1840
|
MatCheckboxModule,
|
|
1521
|
-
MatSlideToggleModule,
|
|
1522
1841
|
MatTableModule,
|
|
1523
|
-
|
|
1842
|
+
MatPaginatorModule,
|
|
1524
1843
|
MatButtonModule,
|
|
1525
|
-
|
|
1526
|
-
|
|
1844
|
+
MatMenuModule,
|
|
1845
|
+
MatDialogModule,
|
|
1846
|
+
NgxMatEntityCreateDialogModule,
|
|
1847
|
+
NgxMatEntityEditDialogModule], exports: [NgxMatEntityTableComponent] });
|
|
1848
|
+
NgxMatEntityTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, imports: [[
|
|
1527
1849
|
CommonModule,
|
|
1528
1850
|
MatInputModule,
|
|
1529
1851
|
FormsModule,
|
|
1530
1852
|
MatFormFieldModule,
|
|
1531
|
-
MatSelectModule,
|
|
1532
|
-
MatAutocompleteModule,
|
|
1533
1853
|
MatCheckboxModule,
|
|
1534
|
-
MatSlideToggleModule,
|
|
1535
1854
|
MatTableModule,
|
|
1536
|
-
|
|
1855
|
+
MatPaginatorModule,
|
|
1537
1856
|
MatButtonModule,
|
|
1538
|
-
|
|
1857
|
+
MatMenuModule,
|
|
1858
|
+
MatDialogModule,
|
|
1859
|
+
NgxMatEntityCreateDialogModule,
|
|
1860
|
+
NgxMatEntityEditDialogModule,
|
|
1539
1861
|
]] });
|
|
1540
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type:
|
|
1862
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityTableModule, decorators: [{
|
|
1541
1863
|
type: NgModule,
|
|
1542
1864
|
args: [{
|
|
1543
|
-
declarations: [
|
|
1865
|
+
declarations: [NgxMatEntityTableComponent],
|
|
1544
1866
|
imports: [
|
|
1545
1867
|
CommonModule,
|
|
1546
1868
|
MatInputModule,
|
|
1547
1869
|
FormsModule,
|
|
1548
1870
|
MatFormFieldModule,
|
|
1549
|
-
MatSelectModule,
|
|
1550
|
-
MatAutocompleteModule,
|
|
1551
1871
|
MatCheckboxModule,
|
|
1552
|
-
MatSlideToggleModule,
|
|
1553
1872
|
MatTableModule,
|
|
1554
|
-
|
|
1873
|
+
MatPaginatorModule,
|
|
1555
1874
|
MatButtonModule,
|
|
1556
|
-
|
|
1875
|
+
MatMenuModule,
|
|
1876
|
+
MatDialogModule,
|
|
1877
|
+
NgxMatEntityCreateDialogModule,
|
|
1878
|
+
NgxMatEntityEditDialogModule,
|
|
1557
1879
|
],
|
|
1558
|
-
exports: [
|
|
1880
|
+
exports: [NgxMatEntityTableComponent]
|
|
1559
1881
|
}]
|
|
1560
1882
|
}] });
|
|
1561
1883
|
|
|
1562
|
-
|
|
1884
|
+
/**
|
|
1885
|
+
* The internal EntityArrayDecoratorConfig. Sets default values.
|
|
1886
|
+
*/
|
|
1887
|
+
class EntityArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
1888
|
+
constructor(data) {
|
|
1889
|
+
super(data);
|
|
1890
|
+
this.createInline = data.createInline != undefined ? data.createInline : true;
|
|
1891
|
+
this.displayStyle = data.displayStyle;
|
|
1892
|
+
this.itemType = data.itemType;
|
|
1893
|
+
this.EntityClass = data.EntityClass;
|
|
1894
|
+
this.displayColumns = data.displayColumns;
|
|
1895
|
+
this.createInline = data.createInline != undefined ? data.createInline : true;
|
|
1896
|
+
this.missingErrorMessage = data.missingErrorMessage ? data.missingErrorMessage : 'Needs to contain at least one value';
|
|
1897
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [12, 12, 12];
|
|
1898
|
+
this.addButtonLabel = data.addButtonLabel ? data.addButtonLabel : 'Add';
|
|
1899
|
+
this.removeButtonLabel = data.removeButtonLabel ? data.removeButtonLabel : 'Remove';
|
|
1900
|
+
}
|
|
1901
|
+
}
|
|
1902
|
+
/**
|
|
1903
|
+
* The internal StringChipsArrayDecoratorConfig. Sets default values.
|
|
1904
|
+
*/
|
|
1905
|
+
class StringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
1906
|
+
constructor(data) {
|
|
1907
|
+
super(data);
|
|
1908
|
+
this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
|
|
1909
|
+
this.displayStyle = data.displayStyle;
|
|
1910
|
+
this.itemType = data.itemType;
|
|
1911
|
+
this.maxLength = data.maxLength;
|
|
1912
|
+
this.minLength = data.minLength;
|
|
1913
|
+
this.regex = data.regex;
|
|
1914
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
|
|
1915
|
+
}
|
|
1916
|
+
}
|
|
1917
|
+
/**
|
|
1918
|
+
* The internal AutocompleteStringChipsArrayDecoratorConfig. Sets default values.
|
|
1919
|
+
*/
|
|
1920
|
+
class AutocompleteStringChipsArrayDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
1921
|
+
constructor(data) {
|
|
1922
|
+
super(data);
|
|
1923
|
+
this.autocompleteValues = data.autocompleteValues;
|
|
1924
|
+
this.deleteIcon = data.deleteIcon ? data.deleteIcon : 'fas fa-circle-minus';
|
|
1925
|
+
this.displayStyle = data.displayStyle;
|
|
1926
|
+
this.itemType = data.itemType;
|
|
1927
|
+
this.maxLength = data.maxLength;
|
|
1928
|
+
this.minLength = data.minLength;
|
|
1929
|
+
this.regex = data.regex;
|
|
1930
|
+
this.defaultWidths = data.defaultWidths ? data.defaultWidths : [6, 12, 12];
|
|
1931
|
+
}
|
|
1563
1932
|
}
|
|
1564
|
-
NgxMatEntityInputModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1565
|
-
NgxMatEntityInputModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, declarations: [NgxMatEntityInputComponent], imports: [CommonModule,
|
|
1566
|
-
MatInputModule,
|
|
1567
|
-
FormsModule,
|
|
1568
|
-
MatFormFieldModule,
|
|
1569
|
-
MatSelectModule,
|
|
1570
|
-
MatAutocompleteModule,
|
|
1571
|
-
MatCheckboxModule,
|
|
1572
|
-
MatSlideToggleModule,
|
|
1573
|
-
NgxMatEntityArrayTableModule,
|
|
1574
|
-
MatChipsModule,
|
|
1575
|
-
MatIconModule], exports: [NgxMatEntityInputComponent] });
|
|
1576
|
-
NgxMatEntityInputModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, imports: [[
|
|
1577
|
-
CommonModule,
|
|
1578
|
-
MatInputModule,
|
|
1579
|
-
FormsModule,
|
|
1580
|
-
MatFormFieldModule,
|
|
1581
|
-
MatSelectModule,
|
|
1582
|
-
MatAutocompleteModule,
|
|
1583
|
-
MatCheckboxModule,
|
|
1584
|
-
MatSlideToggleModule,
|
|
1585
|
-
NgxMatEntityArrayTableModule,
|
|
1586
|
-
MatChipsModule,
|
|
1587
|
-
MatIconModule
|
|
1588
|
-
]] });
|
|
1589
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityInputModule, decorators: [{
|
|
1590
|
-
type: NgModule,
|
|
1591
|
-
args: [{
|
|
1592
|
-
declarations: [NgxMatEntityInputComponent],
|
|
1593
|
-
imports: [
|
|
1594
|
-
CommonModule,
|
|
1595
|
-
MatInputModule,
|
|
1596
|
-
FormsModule,
|
|
1597
|
-
MatFormFieldModule,
|
|
1598
|
-
MatSelectModule,
|
|
1599
|
-
MatAutocompleteModule,
|
|
1600
|
-
MatCheckboxModule,
|
|
1601
|
-
MatSlideToggleModule,
|
|
1602
|
-
NgxMatEntityArrayTableModule,
|
|
1603
|
-
MatChipsModule,
|
|
1604
|
-
MatIconModule
|
|
1605
|
-
],
|
|
1606
|
-
exports: [NgxMatEntityInputComponent]
|
|
1607
|
-
}]
|
|
1608
|
-
}] });
|
|
1609
1933
|
|
|
1610
|
-
|
|
1934
|
+
/**
|
|
1935
|
+
* Decorator for setting and getting array property metadata.
|
|
1936
|
+
*
|
|
1937
|
+
* @param metadata - The metadata of the array property.
|
|
1938
|
+
* @returns The method that defines the metadata.
|
|
1939
|
+
* @throws When the given type of the array-items is unknown.
|
|
1940
|
+
*/
|
|
1941
|
+
function array(metadata) {
|
|
1942
|
+
switch (metadata.itemType) {
|
|
1943
|
+
case DecoratorTypes.OBJECT:
|
|
1944
|
+
return baseProperty(new EntityArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY);
|
|
1945
|
+
case DecoratorTypes.STRING:
|
|
1946
|
+
return baseProperty(new StringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_CHIPS);
|
|
1947
|
+
case DecoratorTypes.STRING_AUTOCOMPLETE:
|
|
1948
|
+
return baseProperty(new AutocompleteStringChipsArrayDecoratorConfigInternal(metadata), DecoratorTypes.ARRAY_STRING_AUTOCOMPLETE_CHIPS);
|
|
1949
|
+
default:
|
|
1950
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
|
|
1951
|
+
throw new Error(`Unknown itemType ${metadata.itemType}`);
|
|
1952
|
+
}
|
|
1611
1953
|
}
|
|
1612
|
-
NgxMatEntityCreateDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1613
|
-
NgxMatEntityCreateDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, declarations: [NgxMatEntityCreateDialogComponent], imports: [CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule], exports: [NgxMatEntityCreateDialogComponent] });
|
|
1614
|
-
NgxMatEntityCreateDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, imports: [[CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule]] });
|
|
1615
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityCreateDialogModule, decorators: [{
|
|
1616
|
-
type: NgModule,
|
|
1617
|
-
args: [{
|
|
1618
|
-
declarations: [NgxMatEntityCreateDialogComponent],
|
|
1619
|
-
imports: [CommonModule, NgxMatEntityInputModule, MatDialogModule, FormsModule, MatButtonModule],
|
|
1620
|
-
exports: [NgxMatEntityCreateDialogComponent]
|
|
1621
|
-
}]
|
|
1622
|
-
}] });
|
|
1623
1954
|
|
|
1624
|
-
|
|
1955
|
+
/**
|
|
1956
|
+
* The base options for all propertyDecorators.
|
|
1957
|
+
*/
|
|
1958
|
+
class PropertyDecoratorConfig {
|
|
1959
|
+
}
|
|
1960
|
+
|
|
1961
|
+
/**
|
|
1962
|
+
* Interface definition for the @array metadata.
|
|
1963
|
+
*/
|
|
1964
|
+
class ArrayDecoratorConfig extends PropertyDecoratorConfig {
|
|
1965
|
+
}
|
|
1966
|
+
|
|
1967
|
+
/**
|
|
1968
|
+
* The internal DropdownBooleanDecoratorConfig. Sets default values.
|
|
1969
|
+
*/
|
|
1970
|
+
class DropdownBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
1971
|
+
constructor(data) {
|
|
1972
|
+
super(data);
|
|
1973
|
+
this.displayStyle = data.displayStyle;
|
|
1974
|
+
this.dropdownTrue = data.dropdownTrue;
|
|
1975
|
+
this.dropdownFalse = data.dropdownFalse;
|
|
1976
|
+
}
|
|
1977
|
+
}
|
|
1978
|
+
/**
|
|
1979
|
+
* The internal CheckboxBooleanDecoratorConfig. Sets default values.
|
|
1980
|
+
*/
|
|
1981
|
+
class CheckboxBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
1982
|
+
constructor(data) {
|
|
1983
|
+
super(data);
|
|
1984
|
+
this.displayStyle = data.displayStyle;
|
|
1985
|
+
this.required = data.required === undefined ? false : data.required;
|
|
1986
|
+
}
|
|
1987
|
+
}
|
|
1988
|
+
/**
|
|
1989
|
+
* The internal ToggleBooleanDecoratorConfig. Sets default values.
|
|
1990
|
+
*/
|
|
1991
|
+
class ToggleBooleanDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
1992
|
+
constructor(data) {
|
|
1993
|
+
super(data);
|
|
1994
|
+
this.displayStyle = data.displayStyle;
|
|
1995
|
+
this.required = data.required === undefined ? false : data.required;
|
|
1996
|
+
}
|
|
1625
1997
|
}
|
|
1626
|
-
NgxMatEntityEditDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1627
|
-
NgxMatEntityEditDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, declarations: [NgxMatEntityEditDialogComponent], imports: [CommonModule,
|
|
1628
|
-
NgxMatEntityInputModule,
|
|
1629
|
-
MatDialogModule,
|
|
1630
|
-
FormsModule,
|
|
1631
|
-
MatButtonModule,
|
|
1632
|
-
NgxMatEntityConfirmDialogModule], exports: [NgxMatEntityEditDialogComponent] });
|
|
1633
|
-
NgxMatEntityEditDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, imports: [[
|
|
1634
|
-
CommonModule,
|
|
1635
|
-
NgxMatEntityInputModule,
|
|
1636
|
-
MatDialogModule,
|
|
1637
|
-
FormsModule,
|
|
1638
|
-
MatButtonModule,
|
|
1639
|
-
NgxMatEntityConfirmDialogModule
|
|
1640
|
-
]] });
|
|
1641
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NgxMatEntityEditDialogModule, decorators: [{
|
|
1642
|
-
type: NgModule,
|
|
1643
|
-
args: [{
|
|
1644
|
-
declarations: [NgxMatEntityEditDialogComponent],
|
|
1645
|
-
imports: [
|
|
1646
|
-
CommonModule,
|
|
1647
|
-
NgxMatEntityInputModule,
|
|
1648
|
-
MatDialogModule,
|
|
1649
|
-
FormsModule,
|
|
1650
|
-
MatButtonModule,
|
|
1651
|
-
NgxMatEntityConfirmDialogModule
|
|
1652
|
-
],
|
|
1653
|
-
exports: [NgxMatEntityEditDialogComponent]
|
|
1654
|
-
}]
|
|
1655
|
-
}] });
|
|
1656
1998
|
|
|
1657
1999
|
/**
|
|
1658
|
-
* Decorator for setting and getting
|
|
1659
|
-
*
|
|
2000
|
+
* Decorator for setting and getting boolean property metadata.
|
|
2001
|
+
*
|
|
2002
|
+
* @param metadata - The metadata of the boolean property.
|
|
2003
|
+
* @returns The method that defines the metadata.
|
|
1660
2004
|
*/
|
|
1661
2005
|
function boolean(metadata) {
|
|
1662
2006
|
if (metadata.displayStyle === 'dropdown') {
|
|
1663
|
-
return baseProperty(new
|
|
2007
|
+
return baseProperty(new DropdownBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_DROPDOWN);
|
|
1664
2008
|
}
|
|
1665
2009
|
else if (metadata.displayStyle === 'checkbox') {
|
|
1666
|
-
return baseProperty(new
|
|
2010
|
+
return baseProperty(new CheckboxBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_CHECKBOX);
|
|
1667
2011
|
}
|
|
1668
2012
|
else {
|
|
1669
|
-
return baseProperty(new
|
|
2013
|
+
return baseProperty(new ToggleBooleanDecoratorConfigInternal(metadata), DecoratorTypes.BOOLEAN_TOGGLE);
|
|
1670
2014
|
}
|
|
1671
2015
|
}
|
|
2016
|
+
|
|
1672
2017
|
/**
|
|
1673
|
-
* The Definition for the @boolean metadata
|
|
2018
|
+
* The Definition for the @boolean metadata.
|
|
1674
2019
|
*/
|
|
1675
2020
|
class BooleanDecoratorConfig extends PropertyDecoratorConfig {
|
|
1676
2021
|
}
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
|
|
1688
|
-
this.displayStyle = metadata.displayStyle;
|
|
2022
|
+
|
|
2023
|
+
/**
|
|
2024
|
+
* The internal DefaultNumberDecoratorConfig. Sets default values.
|
|
2025
|
+
*/
|
|
2026
|
+
class DefaultNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2027
|
+
constructor(data) {
|
|
2028
|
+
super(data);
|
|
2029
|
+
this.displayStyle = data.displayStyle;
|
|
2030
|
+
this.max = data.max;
|
|
2031
|
+
this.min = data.min;
|
|
1689
2032
|
}
|
|
1690
2033
|
}
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
2034
|
+
/**
|
|
2035
|
+
* The internal DropdownNumberDecoratorConfig. Sets default values.
|
|
2036
|
+
*/
|
|
2037
|
+
class DropdownNumberDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2038
|
+
constructor(data) {
|
|
2039
|
+
super(data);
|
|
2040
|
+
this.displayStyle = data.displayStyle;
|
|
2041
|
+
this.dropdownValues = data.dropdownValues;
|
|
1695
2042
|
}
|
|
1696
2043
|
}
|
|
1697
2044
|
|
|
1698
2045
|
/**
|
|
1699
|
-
* Decorator for setting and getting string
|
|
1700
|
-
*
|
|
2046
|
+
* Decorator for setting and getting string property metadata.
|
|
2047
|
+
*
|
|
2048
|
+
* @param metadata - The metadata of the string property.
|
|
2049
|
+
* @returns The method that defines the metadata.
|
|
1701
2050
|
*/
|
|
1702
2051
|
function number(metadata) {
|
|
1703
2052
|
if (metadata.displayStyle === 'dropdown') {
|
|
1704
|
-
return baseProperty(new
|
|
2053
|
+
return baseProperty(new DropdownNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER_DROPDOWN);
|
|
1705
2054
|
}
|
|
1706
2055
|
else {
|
|
1707
|
-
return baseProperty(new
|
|
2056
|
+
return baseProperty(new DefaultNumberDecoratorConfigInternal(metadata), DecoratorTypes.NUMBER);
|
|
1708
2057
|
}
|
|
1709
2058
|
}
|
|
2059
|
+
|
|
1710
2060
|
/**
|
|
1711
|
-
*
|
|
2061
|
+
* Definition for the @number metadata.
|
|
1712
2062
|
*/
|
|
1713
2063
|
class NumberDecoratorConfig extends PropertyDecoratorConfig {
|
|
1714
2064
|
}
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
constructor(metadata) {
|
|
1725
|
-
super(metadata.displayName, metadata.display, metadata.required, metadata.omitForCreate, metadata.omitForUpdate, metadata.defaultWidths, metadata.order);
|
|
1726
|
-
this.displayStyle = metadata.displayStyle;
|
|
1727
|
-
this.dropdownValues = metadata.dropdownValues;
|
|
2065
|
+
|
|
2066
|
+
/**
|
|
2067
|
+
* The internal DefaultObjectDecoratorConfig. Sets default values.
|
|
2068
|
+
*/
|
|
2069
|
+
class DefaultObjectDecoratorConfigInternal extends PropertyDecoratorConfigInternal {
|
|
2070
|
+
constructor(data) {
|
|
2071
|
+
super(data);
|
|
2072
|
+
this.displayStyle = data.displayStyle;
|
|
2073
|
+
this.type = data.type;
|
|
1728
2074
|
}
|
|
1729
2075
|
}
|
|
1730
2076
|
|
|
1731
2077
|
/**
|
|
1732
|
-
* Decorator for setting and getting object
|
|
1733
|
-
*
|
|
2078
|
+
* Decorator for setting and getting object property metadata.
|
|
2079
|
+
*
|
|
2080
|
+
* @param metadata - The metadata of the object property.
|
|
2081
|
+
* @returns The method that defines the metadata.
|
|
1734
2082
|
*/
|
|
1735
2083
|
function object(metadata) {
|
|
1736
|
-
return baseProperty(new
|
|
2084
|
+
return baseProperty(new DefaultObjectDecoratorConfigInternal(metadata), DecoratorTypes.OBJECT);
|
|
1737
2085
|
}
|
|
2086
|
+
|
|
1738
2087
|
/**
|
|
1739
|
-
*
|
|
2088
|
+
* Definition for the @object metadata.
|
|
1740
2089
|
*/
|
|
1741
2090
|
class ObjectDecoratorConfig extends PropertyDecoratorConfig {
|
|
1742
2091
|
}
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
}
|
|
2092
|
+
|
|
2093
|
+
/**
|
|
2094
|
+
* Definition for the @string metadata.
|
|
2095
|
+
*/
|
|
2096
|
+
class StringDecoratorConfig extends PropertyDecoratorConfig {
|
|
1749
2097
|
}
|
|
1750
2098
|
|
|
1751
|
-
|
|
1752
|
-
* Public API Surface of ngx-material-entity
|
|
2099
|
+
/**
|
|
2100
|
+
* Public API Surface of ngx-material-entity.
|
|
1753
2101
|
*/
|
|
1754
2102
|
|
|
1755
2103
|
/**
|
|
1756
2104
|
* Generated bundle index. Do not edit.
|
|
1757
2105
|
*/
|
|
1758
2106
|
|
|
1759
|
-
export {
|
|
2107
|
+
export { DecoratorTypes, Entity, EntityService, EntityUtilities, NgxMatEntityConfirmDialogComponent, NgxMatEntityConfirmDialogModule, NgxMatEntityCreateDialogComponent, NgxMatEntityCreateDialogModule, NgxMatEntityEditDialogComponent, NgxMatEntityEditDialogModule, NgxMatEntityInputComponent, NgxMatEntityInputModule, NgxMatEntityTableComponent, NgxMatEntityTableModule, array, boolean, getValidationErrorMessage, number, object, string };
|
|
1760
2108
|
//# sourceMappingURL=ngx-material-entity.mjs.map
|