@rosoftlab/core 0.0.100 → 0.0.101
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/esm2020/lib/base-components/base-form-edit.component.mjs +15 -41
- package/esm2020/lib/base-components/field-error-display/field-error-display.component.mjs +3 -3
- package/esm2020/lib/base-components/generic-table/generic-table.component.mjs +17 -80
- package/esm2020/lib/base-components/index.mjs +1 -2
- package/esm2020/lib/base-components/page-not-found/page-not-found.component.mjs +3 -3
- package/esm2020/lib/base-components/under-construction/under-construction.component.mjs +3 -3
- package/esm2020/lib/decorators/attribute.decorator.mjs +1 -4
- package/esm2020/lib/interfaces/attribute-decorator-options.interface.mjs +1 -1
- package/esm2020/lib/models/base.model.mjs +3 -46
- package/esm2020/lib/models/grid-layout-format.enum.mjs +1 -2
- package/esm2020/lib/module.mjs +5 -14
- package/esm2020/lib/services/base.service.mjs +2 -6
- package/fesm2015/rosoftlab-core.mjs +72 -443
- package/fesm2015/rosoftlab-core.mjs.map +1 -1
- package/fesm2020/rosoftlab-core.mjs +72 -438
- package/fesm2020/rosoftlab-core.mjs.map +1 -1
- package/lib/base-components/base-form-edit.component.d.ts +4 -9
- package/lib/base-components/field-error-display/field-error-display.component.d.ts +1 -1
- package/lib/base-components/generic-table/generic-table.component.d.ts +4 -17
- package/lib/base-components/index.d.ts +0 -1
- package/lib/base-components/page-not-found/page-not-found.component.d.ts +1 -1
- package/lib/base-components/under-construction/under-construction.component.d.ts +1 -1
- package/lib/interfaces/attribute-decorator-options.interface.d.ts +0 -1
- package/lib/models/base.model.d.ts +3 -7
- package/lib/models/grid-layout-format.enum.d.ts +1 -2
- package/lib/module.d.ts +6 -8
- package/package.json +3 -3
- package/esm2020/lib/base-components/searchable-dropdown/searchable-dropdown.component.mjs +0 -231
- package/lib/base-components/searchable-dropdown/searchable-dropdown.component.d.ts +0 -62
@@ -1,52 +1,47 @@
|
|
1
1
|
import * as i0 from '@angular/core';
|
2
|
-
import { Component, Input,
|
3
|
-
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
4
|
-
import * as i2 from '@angular/forms';
|
5
|
-
import { FormControl, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
|
6
|
-
import { Subject, Observable, throwError, from, merge, of, fromEvent, BehaviorSubject, combineLatest } from 'rxjs';
|
7
|
-
import { filter, debounceTime, tap, switchMap, finalize, takeUntil, map, catchError, distinctUntilChanged, startWith } from 'rxjs/operators';
|
8
|
-
import * as i1 from '@angular/cdk/a11y';
|
9
|
-
import * as i3 from '@angular/material/form-field';
|
10
|
-
import * as i4 from '@angular/material/button';
|
11
|
-
import { MatButtonModule } from '@angular/material/button';
|
12
|
-
import * as i5 from '@angular/material/icon';
|
13
|
-
import { MatIconModule } from '@angular/material/icon';
|
14
|
-
import * as i6 from '@angular/material/autocomplete';
|
15
|
-
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
16
|
-
import * as i7 from '@angular/material/core';
|
17
|
-
import { MatNativeDateModule, MatRippleModule, MatOptionModule } from '@angular/material/core';
|
18
|
-
import * as i8 from '@angular/material/input';
|
19
|
-
import { MatInputModule } from '@angular/material/input';
|
20
|
-
import * as i3$1 from '@angular/common';
|
21
|
-
import { DatePipe, DecimalPipe, PercentPipe, CommonModule } from '@angular/common';
|
22
|
-
import * as i1$1 from '@ngx-translate/core';
|
23
|
-
import { TranslateModule } from '@ngx-translate/core';
|
2
|
+
import { Component, Input, Injectable, EventEmitter, ElementRef, ViewChild, Output, Directive, ContentChildren, NgModule, Pipe } from '@angular/core';
|
24
3
|
import { __decorate } from 'tslib';
|
25
|
-
import * as
|
4
|
+
import * as i1$1 from '@angular/forms';
|
5
|
+
import { FormGroup, FormControl, Validators } from '@angular/forms';
|
6
|
+
import * as i2$1 from 'ng-block-ui';
|
26
7
|
import { BlockUI, BlockUIModule } from 'ng-block-ui';
|
27
|
-
import
|
28
|
-
import * as
|
8
|
+
import { Observable, throwError, from, Subject, merge, of, BehaviorSubject, combineLatest } from 'rxjs';
|
9
|
+
import * as i2 from '@angular/router';
|
10
|
+
import * as i1 from '@angular/common/http';
|
29
11
|
import { HttpHeaders, HttpParams, HttpErrorResponse, HttpClientModule } from '@angular/common/http';
|
30
12
|
import { compare } from 'fast-json-patch';
|
31
13
|
import * as qs from 'qs';
|
14
|
+
import { map, catchError, debounceTime, distinctUntilChanged, startWith, switchMap } from 'rxjs/operators';
|
32
15
|
import Swal from 'sweetalert2';
|
33
|
-
import * as
|
16
|
+
import * as i1$2 from '@ngx-translate/core';
|
17
|
+
import { TranslateModule } from '@ngx-translate/core';
|
18
|
+
import * as i3 from '@angular/common';
|
19
|
+
import { DatePipe, DecimalPipe, PercentPipe, CommonModule } from '@angular/common';
|
20
|
+
import * as i11 from '@angular/cdk/drag-drop';
|
34
21
|
import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
|
35
22
|
import * as i9 from '@angular/material/paginator';
|
36
23
|
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
37
|
-
import * as i8
|
24
|
+
import * as i8 from '@angular/material/sort';
|
38
25
|
import { MatSort, MatSortModule } from '@angular/material/sort';
|
39
|
-
import * as i6
|
26
|
+
import * as i6 from '@angular/material/table';
|
40
27
|
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
|
41
28
|
import * as jsonLogic from 'json-logic-js/logic.js';
|
42
|
-
import * as
|
29
|
+
import * as i4 from '@angular/material/form-field';
|
30
|
+
import * as i5 from '@angular/material/progress-spinner';
|
43
31
|
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
44
|
-
import * as
|
32
|
+
import * as i7 from '@angular/material/icon';
|
33
|
+
import { MatIconModule } from '@angular/material/icon';
|
34
|
+
import * as i10 from '@angular/material/input';
|
35
|
+
import { MatInputModule } from '@angular/material/input';
|
36
|
+
import * as i12 from '@angular/material/tooltip';
|
45
37
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
46
38
|
import { parseISO } from 'date-fns';
|
39
|
+
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
40
|
+
import { MatButtonModule } from '@angular/material/button';
|
47
41
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
48
42
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
49
43
|
import { MatChipsModule } from '@angular/material/chips';
|
44
|
+
import { MatNativeDateModule, MatRippleModule, MatOptionModule } from '@angular/material/core';
|
50
45
|
import { MatGridListModule } from '@angular/material/grid-list';
|
51
46
|
import { MatMenuModule } from '@angular/material/menu';
|
52
47
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
@@ -73,10 +68,10 @@ import { CdkStepperModule } from '@angular/cdk/stepper';
|
|
73
68
|
class FieldErrorDisplayComponent {
|
74
69
|
}
|
75
70
|
FieldErrorDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FieldErrorDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
76
|
-
FieldErrorDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: FieldErrorDisplayComponent, selector: "
|
71
|
+
FieldErrorDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: FieldErrorDisplayComponent, selector: "app-field-error-display", inputs: { errorMsg: "errorMsg", displayError: "displayError" }, ngImport: i0, template: "<div *ngIf=\"displayError\" >\n <!-- <span class=\"glyphicon glyphicon-remove form-control-feedback fix-error-icon\"></span> -->\n <span class=\"sr-only\">(error)</span>\n <div class=\"error-msg\">\n {{ errorMsg }}\n </div>\n</div>\n", styles: [".error-msg{color:red}.fix-error-icon{top:27px}\n"] });
|
77
72
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FieldErrorDisplayComponent, decorators: [{
|
78
73
|
type: Component,
|
79
|
-
args: [{ selector: '
|
74
|
+
args: [{ selector: 'app-field-error-display', template: "<div *ngIf=\"displayError\" >\n <!-- <span class=\"glyphicon glyphicon-remove form-control-feedback fix-error-icon\"></span> -->\n <span class=\"sr-only\">(error)</span>\n <div class=\"error-msg\">\n {{ errorMsg }}\n </div>\n</div>\n", styles: [".error-msg{color:red}.fix-error-icon{top:27px}\n"] }]
|
80
75
|
}], propDecorators: { errorMsg: [{
|
81
76
|
type: Input
|
82
77
|
}], displayError: [{
|
@@ -90,237 +85,20 @@ class PageNotFoundComponent {
|
|
90
85
|
}
|
91
86
|
}
|
92
87
|
PageNotFoundComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: PageNotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
93
|
-
PageNotFoundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: PageNotFoundComponent, selector: "
|
88
|
+
PageNotFoundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: PageNotFoundComponent, selector: "app-page-not-found", ngImport: i0, template: "<div class=\"forms-view-container\">\n <div class=\"under-construction-view-container\">\n Page not found\n </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] });
|
94
89
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: PageNotFoundComponent, decorators: [{
|
95
90
|
type: Component,
|
96
|
-
args: [{ selector: '
|
91
|
+
args: [{ selector: 'app-page-not-found', template: "<div class=\"forms-view-container\">\n <div class=\"under-construction-view-container\">\n Page not found\n </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] }]
|
97
92
|
}], ctorParameters: function () { return []; } });
|
98
93
|
|
99
|
-
class SearchableDropdownComponent {
|
100
|
-
constructor(_focusMonitor, _elementRef, ngControl) {
|
101
|
-
this._focusMonitor = _focusMonitor;
|
102
|
-
this._elementRef = _elementRef;
|
103
|
-
this.ngControl = ngControl;
|
104
|
-
this.onChange = (_) => { };
|
105
|
-
this.onTouched = () => { };
|
106
|
-
this.stateChanges = new Subject();
|
107
|
-
this.focused = false;
|
108
|
-
this.errorState = false;
|
109
|
-
this.id = `rsl-searchable-dropdown-${SearchableDropdownComponent.nextId++}`;
|
110
|
-
// label for the search dropdown
|
111
|
-
this.label = '';
|
112
|
-
//Fields for sorting the API data
|
113
|
-
this.sortFields = '';
|
114
|
-
// The value used to populate the control value
|
115
|
-
this.valueField = 'id';
|
116
|
-
// The minumum char for search
|
117
|
-
this.minLengthTerm = 3;
|
118
|
-
this.modelSelected = new EventEmitter();
|
119
|
-
this._required = false;
|
120
|
-
this._disabled = false;
|
121
|
-
this.showSerach = true;
|
122
|
-
this.isLoading = false;
|
123
|
-
this.options = [];
|
124
|
-
this.filteredOptions = [];
|
125
|
-
/** Subject that emits when the component has been destroyed. */
|
126
|
-
this._onDestroy = new Subject();
|
127
|
-
this.searchControl = new FormControl('');
|
128
|
-
_focusMonitor.monitor(_elementRef, true).subscribe(origin => {
|
129
|
-
if (this.focused && !origin) {
|
130
|
-
this.onTouched();
|
131
|
-
}
|
132
|
-
this.focused = !!origin;
|
133
|
-
this.stateChanges.next();
|
134
|
-
});
|
135
|
-
if (this.ngControl) {
|
136
|
-
this.ngControl.valueAccessor = this;
|
137
|
-
}
|
138
|
-
}
|
139
|
-
get empty() {
|
140
|
-
return !this.value;
|
141
|
-
}
|
142
|
-
get required() { return this._required; }
|
143
|
-
set required(value) {
|
144
|
-
this._required = coerceBooleanProperty(value);
|
145
|
-
this.stateChanges.next();
|
146
|
-
}
|
147
|
-
get disabled() { return this._disabled; }
|
148
|
-
set disabled(value) {
|
149
|
-
this._disabled = coerceBooleanProperty(value);
|
150
|
-
this.stateChanges.next();
|
151
|
-
}
|
152
|
-
get value() {
|
153
|
-
return this._value;
|
154
|
-
}
|
155
|
-
set value(value) {
|
156
|
-
if (value)
|
157
|
-
if (this._value !== value) {
|
158
|
-
this.loadModel(value);
|
159
|
-
}
|
160
|
-
this._value = value;
|
161
|
-
this.stateChanges.next();
|
162
|
-
}
|
163
|
-
ngOnInit() {
|
164
|
-
if (!this.displayFields)
|
165
|
-
this.displayFields = this.searchFields;
|
166
|
-
this.loadModel(this.ngControl.value);
|
167
|
-
if (this.preloadElementsCount) {
|
168
|
-
this.serviceRef.getAll(1, this.preloadElementsCount).subscribe({
|
169
|
-
next: (data) => {
|
170
|
-
this.showSerach = false;
|
171
|
-
this.options = data.getModels();
|
172
|
-
this.filteredOptions = this.options;
|
173
|
-
}
|
174
|
-
});
|
175
|
-
}
|
176
|
-
this.searchControl.valueChanges
|
177
|
-
.pipe(filter((res) => {
|
178
|
-
const result = res !== null && res.length >= this.minLengthTerm;
|
179
|
-
if (!result) {
|
180
|
-
this.options = [];
|
181
|
-
this.filteredOptions = [];
|
182
|
-
}
|
183
|
-
this.showSerach = !result;
|
184
|
-
return result;
|
185
|
-
}), debounceTime(300), tap(() => {
|
186
|
-
this.filteredOptions = [];
|
187
|
-
this.isLoading = true;
|
188
|
-
}), switchMap((value) => this.serviceRef
|
189
|
-
.getAll(1, 10, this.sortFields, `${this.searchFields.replace(',', '|')}@=*${value}`)
|
190
|
-
.pipe(finalize(() => {
|
191
|
-
this.isLoading = false;
|
192
|
-
}))), takeUntil(this._onDestroy))
|
193
|
-
.subscribe((options) => {
|
194
|
-
this.filteredOptions = options.getModels();
|
195
|
-
});
|
196
|
-
}
|
197
|
-
onSelected($event) {
|
198
|
-
const value = $event.option.value;
|
199
|
-
this.searchControl.setValue(value);
|
200
|
-
this.modelSelected.emit(value);
|
201
|
-
if (this.valueField in value) {
|
202
|
-
this.setControlValue(value[this.valueField]);
|
203
|
-
}
|
204
|
-
}
|
205
|
-
setControlValue(value) {
|
206
|
-
this.value = value;
|
207
|
-
this.ngControl.control.setValue(value);
|
208
|
-
}
|
209
|
-
displayWith(value) {
|
210
|
-
return this.getConcatedFields(value);
|
211
|
-
}
|
212
|
-
clearSelection() {
|
213
|
-
this.modelSelected.emit(null);
|
214
|
-
this.setControlValue(null);
|
215
|
-
this.searchControl.setValue(null);
|
216
|
-
this.filteredOptions = this.options;
|
217
|
-
}
|
218
|
-
getConcatedFields(option) {
|
219
|
-
if (!option)
|
220
|
-
return null;
|
221
|
-
const filtersArr = this.displayFields.split(',');
|
222
|
-
return filtersArr.reduce((acc, cv) => {
|
223
|
-
return acc.concat(option[cv] + ' ');
|
224
|
-
}, '');
|
225
|
-
}
|
226
|
-
ngOnDestroy() {
|
227
|
-
this.searchControl = null;
|
228
|
-
this.stateChanges.complete();
|
229
|
-
this._focusMonitor.stopMonitoring(this._elementRef);
|
230
|
-
this._onDestroy.next();
|
231
|
-
this._onDestroy.complete();
|
232
|
-
}
|
233
|
-
getSearchText() {
|
234
|
-
return `Enter ${this.minLengthTerm} characters to start search`;
|
235
|
-
}
|
236
|
-
writeValue(model) {
|
237
|
-
console.log(model);
|
238
|
-
this.value = model;
|
239
|
-
}
|
240
|
-
registerOnChange(fn) {
|
241
|
-
this.onChange = fn;
|
242
|
-
}
|
243
|
-
registerOnTouched(fn) {
|
244
|
-
this.onTouched = fn;
|
245
|
-
}
|
246
|
-
setDisabledState(isDisabled) {
|
247
|
-
this.disabled = isDisabled;
|
248
|
-
}
|
249
|
-
loadModel(id) {
|
250
|
-
//Load the model from API to display the value
|
251
|
-
let needLoad = false;
|
252
|
-
if (id) {
|
253
|
-
if (!this.searchControl.value)
|
254
|
-
needLoad = true;
|
255
|
-
else {
|
256
|
-
if (this.searchControl.value[this.valueField] !== id) {
|
257
|
-
needLoad = true;
|
258
|
-
}
|
259
|
-
}
|
260
|
-
}
|
261
|
-
if (needLoad) {
|
262
|
-
this.serviceRef.get(id).subscribe({
|
263
|
-
next: (model) => {
|
264
|
-
this.options.push(model);
|
265
|
-
this.filteredOptions = this.options;
|
266
|
-
this.searchControl.setValue(model);
|
267
|
-
}
|
268
|
-
});
|
269
|
-
}
|
270
|
-
}
|
271
|
-
}
|
272
|
-
SearchableDropdownComponent.nextId = 0;
|
273
|
-
SearchableDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: SearchableDropdownComponent, deps: [{ token: i1.FocusMonitor }, { token: i0.ElementRef }, { token: i2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
|
274
|
-
SearchableDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: SearchableDropdownComponent, selector: "rsl-searchable-dropdown", inputs: { label: "label", fControlName: "fControlName", serviceRef: "serviceRef", searchFields: "searchFields", displayFields: "displayFields", sortFields: "sortFields", valueField: "valueField", minLengthTerm: "minLengthTerm", preloadElementsCount: "preloadElementsCount", required: "required", disabled: "disabled", value: "value" }, outputs: { modelSelected: "modelSelected" }, host: { properties: { "class.example-floating": "shouldLabelFloat", "id": "id", "attr.aria-describedby": "describedBy" } }, ngImport: i0, template: "<div class=\"form-group\">\r\n <label>{{label | translate}}</label>\r\n <mat-form-field appearance=\"outline\" fxFlex>\r\n <input matInput [matAutocomplete]=\"auto\" [formControl]=\"searchControl\">\r\n <button *ngIf=\"searchControl.value\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearSelection()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelected($event)\"\r\n [displayWith]=\"displayWith.bind(this)\">\r\n <mat-option *ngIf=\"isLoading\">Loading...</mat-option>\r\n <mat-option *ngIf=\"!isLoading && filteredOptions.length == 0 && !showSerach\" disabled>Not found</mat-option>\r\n <mat-option *ngIf=\"showSerach\" disabled>{{getSearchText()}}</mat-option>\r\n <ng-container *ngIf=\"!isLoading && filteredOptions.length > 0\">\r\n <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n <span><b>{{getConcatedFields(option)}}</b></span>\r\n </mat-option>\r\n </ng-container>\r\n\r\n </mat-autocomplete>\r\n </mat-form-field>\r\n</div>", components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i6.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i7.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i6.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatSuffix, selector: "[matSuffix]" }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1$1.TranslatePipe } });
|
275
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: SearchableDropdownComponent, decorators: [{
|
276
|
-
type: Component,
|
277
|
-
args: [{ selector: 'rsl-searchable-dropdown', host: {
|
278
|
-
'[class.example-floating]': 'shouldLabelFloat',
|
279
|
-
'[id]': 'id',
|
280
|
-
'[attr.aria-describedby]': 'describedBy',
|
281
|
-
}, template: "<div class=\"form-group\">\r\n <label>{{label | translate}}</label>\r\n <mat-form-field appearance=\"outline\" fxFlex>\r\n <input matInput [matAutocomplete]=\"auto\" [formControl]=\"searchControl\">\r\n <button *ngIf=\"searchControl.value\" matSuffix mat-icon-button aria-label=\"Clear\" (click)=\"clearSelection()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n <mat-autocomplete #auto=\"matAutocomplete\" (optionSelected)=\"onSelected($event)\"\r\n [displayWith]=\"displayWith.bind(this)\">\r\n <mat-option *ngIf=\"isLoading\">Loading...</mat-option>\r\n <mat-option *ngIf=\"!isLoading && filteredOptions.length == 0 && !showSerach\" disabled>Not found</mat-option>\r\n <mat-option *ngIf=\"showSerach\" disabled>{{getSearchText()}}</mat-option>\r\n <ng-container *ngIf=\"!isLoading && filteredOptions.length > 0\">\r\n <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n <span><b>{{getConcatedFields(option)}}</b></span>\r\n </mat-option>\r\n </ng-container>\r\n\r\n </mat-autocomplete>\r\n </mat-form-field>\r\n</div>" }]
|
282
|
-
}], ctorParameters: function () {
|
283
|
-
return [{ type: i1.FocusMonitor }, { type: i0.ElementRef }, { type: i2.NgControl, decorators: [{
|
284
|
-
type: Optional
|
285
|
-
}, {
|
286
|
-
type: Self
|
287
|
-
}] }];
|
288
|
-
}, propDecorators: { label: [{
|
289
|
-
type: Input
|
290
|
-
}], fControlName: [{
|
291
|
-
type: Input
|
292
|
-
}], serviceRef: [{
|
293
|
-
type: Input
|
294
|
-
}], searchFields: [{
|
295
|
-
type: Input
|
296
|
-
}], displayFields: [{
|
297
|
-
type: Input
|
298
|
-
}], sortFields: [{
|
299
|
-
type: Input
|
300
|
-
}], valueField: [{
|
301
|
-
type: Input
|
302
|
-
}], minLengthTerm: [{
|
303
|
-
type: Input
|
304
|
-
}], preloadElementsCount: [{
|
305
|
-
type: Input
|
306
|
-
}], modelSelected: [{
|
307
|
-
type: Output
|
308
|
-
}], required: [{
|
309
|
-
type: Input
|
310
|
-
}], disabled: [{
|
311
|
-
type: Input
|
312
|
-
}], value: [{
|
313
|
-
type: Input
|
314
|
-
}] } });
|
315
|
-
|
316
94
|
class UnderConstructionComponent {
|
317
95
|
constructor() { }
|
318
96
|
}
|
319
97
|
UnderConstructionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: UnderConstructionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
320
|
-
UnderConstructionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: UnderConstructionComponent, selector: "
|
98
|
+
UnderConstructionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: UnderConstructionComponent, selector: "app-under-construction", ngImport: i0, template: "<div class=\"forms-view-container\">\n <div class=\"under-construction-view-container\">\n Page under construction\n </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] });
|
321
99
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: UnderConstructionComponent, decorators: [{
|
322
100
|
type: Component,
|
323
|
-
args: [{ selector: '
|
101
|
+
args: [{ selector: 'app-under-construction', template: "<div class=\"forms-view-container\">\n <div class=\"under-construction-view-container\">\n Page under construction\n </div>\n</div>", styles: [".under-construction-view-container{height:calc(100vh - 250px);margin:60px 0 0;padding:0;display:flex;justify-content:center;align-items:center;box-sizing:border-box;font-size:1.8em;line-height:1.3em;font-weight:300;color:#58585b;text-align:center}\n"] }]
|
324
102
|
}], ctorParameters: function () { return []; } });
|
325
103
|
|
326
104
|
class BaseQueryData {
|
@@ -654,11 +432,11 @@ class BaseDatastore {
|
|
654
432
|
return qs.stringify(params, { arrayFormat: 'brackets' });
|
655
433
|
}
|
656
434
|
}
|
657
|
-
BaseDatastore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore, deps: [{ token: i1
|
435
|
+
BaseDatastore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
658
436
|
BaseDatastore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore });
|
659
437
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseDatastore, decorators: [{
|
660
438
|
type: Injectable
|
661
|
-
}], ctorParameters: function () { return [{ type: i1
|
439
|
+
}], ctorParameters: function () { return [{ type: i1.HttpClient }]; } });
|
662
440
|
|
663
441
|
class BaseService {
|
664
442
|
constructor(datastore) {
|
@@ -733,11 +511,7 @@ class BaseService {
|
|
733
511
|
return fromModel.getFromGroup(fb);
|
734
512
|
}
|
735
513
|
fromFormGroup(formGroup, id) {
|
736
|
-
|
737
|
-
// saveModel.id = id ? id : null;
|
738
|
-
// return saveModel;
|
739
|
-
const saveModel = this.newModel();
|
740
|
-
saveModel.getModelFromFormGroup(formGroup);
|
514
|
+
const saveModel = this.newModel(formGroup.getRawValue());
|
741
515
|
saveModel.id = id ? id : null;
|
742
516
|
return saveModel;
|
743
517
|
}
|
@@ -959,18 +733,10 @@ class BaseFormEditComponent {
|
|
959
733
|
}
|
960
734
|
afterFormGenerated() {
|
961
735
|
}
|
962
|
-
|
963
|
-
|
964
|
-
return this.baseForm;
|
965
|
-
if (formGroup instanceof FormGroup)
|
966
|
-
return formGroup;
|
967
|
-
return this.baseForm.controls[formGroup];
|
968
|
-
}
|
969
|
-
validateAllFormFields(formGroup = null) {
|
970
|
-
const fg = this.getFromGroup(formGroup);
|
971
|
-
Object.keys(fg.controls).forEach(field => {
|
736
|
+
validateAllFormFields(formGroup) {
|
737
|
+
Object.keys(formGroup.controls).forEach(field => {
|
972
738
|
// console.log(field);
|
973
|
-
const control =
|
739
|
+
const control = formGroup.get(field);
|
974
740
|
if (control instanceof FormControl) {
|
975
741
|
control.markAsTouched({ onlySelf: true });
|
976
742
|
}
|
@@ -979,32 +745,22 @@ class BaseFormEditComponent {
|
|
979
745
|
}
|
980
746
|
});
|
981
747
|
}
|
982
|
-
isFieldValid(
|
983
|
-
|
984
|
-
const filedControl = fg.get(field);
|
985
|
-
return !filedControl.valid && filedControl.touched;
|
986
|
-
}
|
987
|
-
isFieldValidFromArray(arrayIndex, field, arrayName = 'formArray') {
|
988
|
-
const fieldControl = this.baseForm.get(arrayName).get([arrayIndex]).get(field);
|
989
|
-
return !fieldControl.valid && fieldControl.touched;
|
748
|
+
isFieldValid(form, field) {
|
749
|
+
return !form.get(field).valid && form.get(field).touched;
|
990
750
|
}
|
991
|
-
displayFieldCss(field) {
|
751
|
+
displayFieldCss(form, field) {
|
992
752
|
return {
|
993
|
-
'has-error': this.isFieldValid(field),
|
994
|
-
'has-feedback': this.isFieldValid(field)
|
753
|
+
'has-error': this.isFieldValid(form, field),
|
754
|
+
'has-feedback': this.isFieldValid(form, field)
|
995
755
|
};
|
996
756
|
}
|
997
757
|
onCancel() {
|
998
758
|
this.router.navigate([this.cancelRoute]);
|
999
759
|
}
|
1000
760
|
onSave() {
|
1001
|
-
this.saveModel(this.baseForm);
|
1002
|
-
}
|
1003
|
-
saveModel(formGroup = null) {
|
1004
|
-
const fg = this.getFromGroup(formGroup);
|
1005
761
|
const that = this;
|
1006
|
-
if (
|
1007
|
-
if (
|
762
|
+
if (this.baseForm) {
|
763
|
+
if (this.baseForm.valid) {
|
1008
764
|
that.blockUI.start('Saving ...');
|
1009
765
|
this.beforeSave(this.model).subscribe(_ => {
|
1010
766
|
this.modelService.save(this.baseForm, this.modelId, this.model).subscribe((newModel) => {
|
@@ -1020,7 +776,7 @@ class BaseFormEditComponent {
|
|
1020
776
|
this.afterSave(newModel).subscribe((val) => {
|
1021
777
|
this.blockUI.stop();
|
1022
778
|
this.dialogService.showSaveMessage('Your changes were saved successfully.').subscribe(d => {
|
1023
|
-
|
779
|
+
this.baseForm.markAsPristine();
|
1024
780
|
});
|
1025
781
|
});
|
1026
782
|
}, err => {
|
@@ -1030,7 +786,7 @@ class BaseFormEditComponent {
|
|
1030
786
|
});
|
1031
787
|
}
|
1032
788
|
else {
|
1033
|
-
this.validateAllFormFields(
|
789
|
+
this.validateAllFormFields(this.baseForm);
|
1034
790
|
}
|
1035
791
|
}
|
1036
792
|
}
|
@@ -1079,16 +835,8 @@ class BaseFormEditComponent {
|
|
1079
835
|
getCustomErrorMessage(error, fieldLabel) {
|
1080
836
|
return '';
|
1081
837
|
}
|
1082
|
-
|
1083
|
-
const
|
1084
|
-
return this.getErrorMessageForField(fieldControl, filedTranslationKey);
|
1085
|
-
}
|
1086
|
-
getErrorMessage(field, filedTranslationKey, formGroup = null) {
|
1087
|
-
const fg = this.getFromGroup(formGroup);
|
1088
|
-
return this.getErrorMessageForField(fg.get(field), filedTranslationKey);
|
1089
|
-
}
|
1090
|
-
getErrorMessageForField(fieldControl, filedTranslationKey) {
|
1091
|
-
const error = fieldControl.errors;
|
838
|
+
getErrorMessage(field, filedTranslationKey) {
|
839
|
+
const error = this.baseForm.get(field).errors;
|
1092
840
|
const fieldLabel = this.translate.instant(filedTranslationKey);
|
1093
841
|
let rvalue = '';
|
1094
842
|
if (error !== null) {
|
@@ -1114,7 +862,7 @@ class BaseFormEditComponent {
|
|
1114
862
|
return rvalue;
|
1115
863
|
}
|
1116
864
|
}
|
1117
|
-
BaseFormEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseFormEditComponent, deps: [{ token:
|
865
|
+
BaseFormEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: BaseFormEditComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2.Router }, { token: i2.ActivatedRoute }, { token: BaseService }, { token: DialogService }, { token: i1$2.TranslateService }, { token: i3.Location }], target: i0.ɵɵFactoryTarget.Component });
|
1118
866
|
BaseFormEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: BaseFormEditComponent, selector: "app-base.form.edit", ngImport: i0, template: '', isInline: true });
|
1119
867
|
__decorate([
|
1120
868
|
BlockUI()
|
@@ -1125,7 +873,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
|
|
1125
873
|
selector: 'app-base.form.edit',
|
1126
874
|
template: ''
|
1127
875
|
}]
|
1128
|
-
}], ctorParameters: function () { return [{ type:
|
876
|
+
}], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: BaseService }, { type: DialogService }, { type: i1$2.TranslateService }, { type: i3.Location }]; }, propDecorators: { blockUI: [] } });
|
1129
877
|
|
1130
878
|
var GridLayoutFormat;
|
1131
879
|
(function (GridLayoutFormat) {
|
@@ -1133,7 +881,6 @@ var GridLayoutFormat;
|
|
1133
881
|
GridLayoutFormat[GridLayoutFormat["date"] = 1] = "date";
|
1134
882
|
GridLayoutFormat[GridLayoutFormat["number"] = 2] = "number";
|
1135
883
|
GridLayoutFormat[GridLayoutFormat["percent"] = 3] = "percent";
|
1136
|
-
GridLayoutFormat[GridLayoutFormat["picture"] = 4] = "picture";
|
1137
884
|
})(GridLayoutFormat || (GridLayoutFormat = {}));
|
1138
885
|
var CellTextAlign;
|
1139
886
|
(function (CellTextAlign) {
|
@@ -1144,13 +891,12 @@ var CellTextAlign;
|
|
1144
891
|
|
1145
892
|
class GenericTableComponent {
|
1146
893
|
// ruleEngineService: RuleEngineService<T>;
|
1147
|
-
constructor(dialogService, router, datePipe, numberPipe, percentPipe
|
894
|
+
constructor(dialogService, router, datePipe, numberPipe, percentPipe) {
|
1148
895
|
this.dialogService = dialogService;
|
1149
896
|
this.router = router;
|
1150
897
|
this.datePipe = datePipe;
|
1151
898
|
this.numberPipe = numberPipe;
|
1152
899
|
this.percentPipe = percentPipe;
|
1153
|
-
this.renderer = renderer;
|
1154
900
|
this.defaultSort = null;
|
1155
901
|
this.defaultSortDirection = null;
|
1156
902
|
this.deletePropertyName = 'name';
|
@@ -1160,14 +906,12 @@ class GenericTableComponent {
|
|
1160
906
|
this.allowEdit = true;
|
1161
907
|
this.popupEdit = false;
|
1162
908
|
this.customInclude = null;
|
1163
|
-
this.infiniteScroll = false;
|
1164
909
|
this.dataSource = new MatTableDataSource();
|
1165
910
|
this.resultsLength = 0;
|
1166
911
|
this.isLoadingResults = true;
|
1167
912
|
this.isRateLimitReached = false;
|
1168
913
|
this.filterChanged = new Subject();
|
1169
914
|
this.selectedObject = new EventEmitter();
|
1170
|
-
this.click = new EventEmitter();
|
1171
915
|
this.editModel = new EventEmitter();
|
1172
916
|
}
|
1173
917
|
ngOnChanges() {
|
@@ -1234,20 +978,8 @@ class GenericTableComponent {
|
|
1234
978
|
this.isRateLimitReached = true;
|
1235
979
|
return of([]);
|
1236
980
|
})).subscribe(data => {
|
1237
|
-
// if (this.infiniteScroll) {
|
1238
|
-
// let oldData = this.dataSource.data ?? null;
|
1239
|
-
// // if (oldData.length === 0) {
|
1240
|
-
// // oldData = data;
|
1241
|
-
// // } else {
|
1242
|
-
// oldData=oldData.concat(data);
|
1243
|
-
// // }
|
1244
|
-
// this.dataSource.data = oldData;
|
1245
|
-
// }
|
1246
|
-
// else {
|
1247
981
|
this.dataSource.data = data;
|
1248
|
-
// }
|
1249
982
|
});
|
1250
|
-
// this.paginator.nextPage()
|
1251
983
|
}
|
1252
984
|
getData() {
|
1253
985
|
this.isLoadingResults = true;
|
@@ -1346,10 +1078,6 @@ class GenericTableComponent {
|
|
1346
1078
|
var _a;
|
1347
1079
|
return (_a = column.textAlign) !== null && _a !== void 0 ? _a : CellTextAlign.left;
|
1348
1080
|
}
|
1349
|
-
showPictureCell(column) {
|
1350
|
-
var _a;
|
1351
|
-
return ((_a = column === null || column === void 0 ? void 0 : column.formating) !== null && _a !== void 0 ? _a : GridLayoutFormat.none) === GridLayoutFormat.picture;
|
1352
|
-
}
|
1353
1081
|
deleteDisabled(model) {
|
1354
1082
|
if (this.deleteDisableRule) {
|
1355
1083
|
return this.evaluateRule(this.deleteDisableRule, model);
|
@@ -1358,9 +1086,6 @@ class GenericTableComponent {
|
|
1358
1086
|
return false;
|
1359
1087
|
}
|
1360
1088
|
}
|
1361
|
-
cellClick(model, propertyName) {
|
1362
|
-
this.click.emit({ propertyName, model });
|
1363
|
-
}
|
1364
1089
|
evaluateRule(rules, model) {
|
1365
1090
|
let result = true;
|
1366
1091
|
rules.forEach(rule => {
|
@@ -1419,14 +1144,12 @@ class GenericTableComponent {
|
|
1419
1144
|
applyFilter(event) {
|
1420
1145
|
}
|
1421
1146
|
dropTable(event) {
|
1422
|
-
|
1423
|
-
|
1424
|
-
|
1425
|
-
|
1426
|
-
|
1427
|
-
|
1428
|
-
this.table.renderRows();
|
1429
|
-
}
|
1147
|
+
const prevItem = this.dataSource.data[event.previousIndex];
|
1148
|
+
const currentItem = this.dataSource.data[event.currentIndex];
|
1149
|
+
if (this.changeItemPosition(prevItem, currentItem)) {
|
1150
|
+
const prevIndex = this.dataSource.data.findIndex((d) => d === event.item.data);
|
1151
|
+
moveItemInArray(this.dataSource.data, prevIndex, event.currentIndex);
|
1152
|
+
this.table.renderRows();
|
1430
1153
|
}
|
1431
1154
|
}
|
1432
1155
|
isColumnSticky(name) {
|
@@ -1450,45 +1173,13 @@ class GenericTableComponent {
|
|
1450
1173
|
this.dataSource.data = newData;
|
1451
1174
|
this.dataSource._updateChangeSubscription();
|
1452
1175
|
}
|
1453
|
-
ngAfterViewInit() {
|
1454
|
-
fromEvent(this.matTableRef.nativeElement, 'scroll')
|
1455
|
-
.pipe(debounceTime(700))
|
1456
|
-
.subscribe((e) => this.onTableScroll(e));
|
1457
|
-
}
|
1458
|
-
onTableScroll(e) {
|
1459
|
-
const tableViewHeight = e.target.offsetHeight; // viewport: ~500px
|
1460
|
-
const tableScrollHeight = e.target.scrollHeight; // length of all table
|
1461
|
-
const scrollLocation = e.target.scrollTop; // how far user scrolled
|
1462
|
-
// If the user has scrolled within 200px of the bottom, add more data
|
1463
|
-
const scrollThreshold = 200;
|
1464
|
-
const scrollUpLimit = scrollThreshold;
|
1465
|
-
if (scrollLocation < scrollUpLimit && this.paginator.pageIndex > 0) {
|
1466
|
-
// this.firstPage--;
|
1467
|
-
console.log(`onTableScroll() UP: firstPage decreased to ${this.paginator.pageIndex}. Now fetching data...`);
|
1468
|
-
// this.fetchData();
|
1469
|
-
this.scrollTo(tableScrollHeight / 2 - 2 * tableViewHeight);
|
1470
|
-
}
|
1471
|
-
const scrollDownLimit = tableScrollHeight - tableViewHeight - scrollThreshold;
|
1472
|
-
if (scrollLocation > scrollDownLimit && this.paginator.pageIndex < this.paginator.getNumberOfPages()) {
|
1473
|
-
// this.firstPage++;
|
1474
|
-
console.log(`onTableScroll(): firstPage increased to ${this.paginator.pageIndex}. Now fetching data...`);
|
1475
|
-
this.paginator.nextPage();
|
1476
|
-
// this.scrollTo(tableScrollHeight / 2 + tableViewHeight);
|
1477
|
-
}
|
1478
|
-
}
|
1479
|
-
scrollTo(position) {
|
1480
|
-
this.renderer.setProperty(this.matTableRef.nativeElement, 'scrollTop', position);
|
1481
|
-
}
|
1482
|
-
getCellClass(model, property) {
|
1483
|
-
return model.getCellClass(property);
|
1484
|
-
}
|
1485
1176
|
}
|
1486
|
-
GenericTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GenericTableComponent, deps: [{ token: DialogService }, { token: i2
|
1487
|
-
GenericTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: GenericTableComponent, selector: "rsl-generic-table", inputs: { modelType: "modelType", baseService: "baseService", gridLayoutService: "gridLayoutService", editLink: "editLink", defaultSort: "defaultSort", defaultSortDirection: "defaultSortDirection", deleteDisableRule: "deleteDisableRule", deletePropertyName: "deletePropertyName", hasSearch: "hasSearch", searchFields: "searchFields", defaultFilter: "defaultFilter", allowReorderItems: "allowReorderItems", stickyColumns: "stickyColumns", editOnClick: "editOnClick", editOnDblClick: "editOnDblClick", allowEdit: "allowEdit", popupEdit: "popupEdit", customInclude: "customInclude", changeItemPosition: "changeItemPosition", infiniteScroll: "infiniteScroll" }, outputs: { selectedObject: "selectedObject", click: "click", editModel: "editModel" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ElementRef, descendants: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }, { propertyName: "matTableRef", first: true, predicate: ["table"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"containerX\" *ngIf=\"hasSearch\">\r\n <div fxLayout=\"row\" fxLayout.xs=\"column\" fxLayout.sm=\"column\" fxFlexFill>\r\n <mat-form-field fxFlex>\r\n <mat-label>Filter</mat-label>\r\n <input matInput [ngModel]='filterValue' (ngModelChange)='filterChanged.next($event)' #filter>\r\n </mat-form-field>\r\n </div>\r\n</div>\r\n\r\n<div class=\"table-container\">\r\n <div class=\"mat-elevation-z2\">\r\n <!-- #applicationsContainer -->\r\n <div class=\"example-loading-shade\" *ngIf=\"isLoadingResults || isRateLimitReached\">\r\n <mat-spinner *ngIf=\"isLoadingResults\"></mat-spinner>\r\n <div class=\"example-rate-limit-reached\" *ngIf=\"isRateLimitReached\">\r\n {{'General.LoadingData' | translate}}\r\n </div>\r\n </div>\r\n\r\n\r\n <mat-table fxFlex #table [dataSource]=\"dataSource\" id=\"tempalte-forms-table\" matSort matSortDisableClear\r\n matSortDirection=\"asc\" cdkDropList [cdkDropListData]=\"dataSource\" (cdkDropListDropped)=\"dropTable($event)\">\r\n <!-- (scroll)=\"onTableScroll($event)\" -->\r\n\r\n\r\n <ng-container matColumnDef=\"position\">\r\n <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n <!-- {{'General.Order' | translate}} -->\r\n </mat-header-cell>\r\n <mat-cell fxFlex *matCellDef=\"let element;\">\r\n <mat-icon cdkDragHandle>reorder</mat-icon>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngFor=\"let column of gridLayout\" [matColumnDef]=\"column.propertyName\"\r\n [sticky]=\"isColumnSticky(column.propertyName)\">\r\n <mat-header-cell mat-sort-header disableClear [style.flex]=\"getFlexStyle(column)\" *matHeaderCellDef>\r\n {{column.translateKey | translate}}\r\n </mat-header-cell>\r\n <mat-cell matTooltip={{getCelValue(row,column.propertyName)}} [style.flex]=\"getFlexStyle(column)\"\r\n [style.text-align]=\"getCellTextAlign(column)\" *matCellDef=\"let row\" (click)=\"cellClick(row,column.propertyName)\">\r\n <div [ngClass]=\"getCellClass(row,column.propertyName)\" *ngIf=\"!showPictureCell(column)\">\r\n {{getCelValue(row,column.propertyName)}}\r\n </div>\r\n <img [ngClass]=\"getCellClass(row,column.propertyName)\" *ngIf=\"showPictureCell(column)\">\r\n </mat-cell>\r\n </ng-container>\r\n\r\n\r\n <ng-container matColumnDef=\"delete\" stickyEnd *ngIf=\"!editOnClick && !editOnDblClick\">\r\n <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let row\">\r\n <button class=\"btn btn-green btn-fill btn-wd btn-just-icon\" (click)=\"editObject(row)\"\r\n matTooltip=\"{{'General.Edit' | translate}}\">\r\n <!-- <mat-icon>edit</mat-icon> -->\r\n <i class=\"material-icons\">edit</i>\r\n <div class=\"ripple-container\"></div>\r\n </button>\r\n <button class=\"btn btn-red btn-fill btn-wd btn-just-icon\" (click)=\"deleteObject(row)\"\r\n [disabled]=\"deleteDisabled(row)\" matTooltip=\"{{'General.Delete' | translate}}\">\r\n <i class=\"material-icons\">delete</i>\r\n <div class=\"ripple-container\"></div>\r\n </button>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-header-row *matHeaderRowDef=\"displayedColumns;sticky: true\"></mat-header-row>\r\n\r\n <ng-container *ngIf=\"!editOnClick && !editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"highlight(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\">\r\n </mat-row>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"editOnClick && !editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"editObject(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!editOnClick && editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (dblclick)=\"editObject(row)\"\r\n (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\"\r\n style=\"cursor: pointer;\"></mat-row>\r\n </ng-container>\r\n\r\n <!-- [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\"\r\n (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" -->\r\n </mat-table>\r\n <mat-paginator #paginator [hidden]=\"infiniteScroll\" [length]=\"resultsLength\" [pageSize]=\"15\"\r\n [pageSizeOptions]=\"[15, 30, 100]\" [showFirstLastButtons]=\"true\">\r\n </mat-paginator>\r\n </div>\r\n</div>", styles: [".mat-column-delete{flex:0 0 90px;padding-right:30px}.mat-sort-header-button{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-column-position{flex:0 0 60px!important}.mat-table{overflow-x:auto}[hidden]{display:none!important}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i8$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i9.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatLabel, selector: "mat-label" }, { type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i12.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i6$1.MatCellDef, selector: "[matCellDef]" }, { type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i12.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i13.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i12.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "translate": i1$1.TranslatePipe }, encapsulation: i0.ViewEncapsulation.None });
|
1177
|
+
GenericTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GenericTableComponent, deps: [{ token: DialogService }, { token: i2.Router }, { token: i3.DatePipe }, { token: i3.DecimalPipe }, { token: i3.PercentPipe }], target: i0.ɵɵFactoryTarget.Component });
|
1178
|
+
GenericTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: GenericTableComponent, selector: "app-generic-table", inputs: { modelType: "modelType", baseService: "baseService", gridLayoutService: "gridLayoutService", editLink: "editLink", defaultSort: "defaultSort", defaultSortDirection: "defaultSortDirection", deleteDisableRule: "deleteDisableRule", deletePropertyName: "deletePropertyName", hasSearch: "hasSearch", searchFields: "searchFields", defaultFilter: "defaultFilter", allowReorderItems: "allowReorderItems", stickyColumns: "stickyColumns", editOnClick: "editOnClick", editOnDblClick: "editOnDblClick", allowEdit: "allowEdit", popupEdit: "popupEdit", customInclude: "customInclude", changeItemPosition: "changeItemPosition" }, outputs: { selectedObject: "selectedObject", editModel: "editModel" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true, static: true }, { propertyName: "filter", first: true, predicate: ElementRef, descendants: true }, { propertyName: "table", first: true, predicate: ["table"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"containerX\" *ngIf=\"hasSearch\">\r\n <div fxLayout=\"row\" fxLayout.xs=\"column\" fxLayout.sm=\"column\" fxFlexFill>\r\n <mat-form-field fxFlex>\r\n <mat-label>Filter</mat-label>\r\n <input matInput [ngModel]='filterValue' (ngModelChange)='filterChanged.next($event)' #filter>\r\n </mat-form-field>\r\n </div>\r\n</div>\r\n\r\n<div class=\"table-container\">\r\n <div class=\"mat-elevation-z2\">\r\n <!-- #applicationsContainer -->\r\n <div class=\"example-loading-shade\" *ngIf=\"isLoadingResults || isRateLimitReached\">\r\n <mat-spinner *ngIf=\"isLoadingResults\"></mat-spinner>\r\n <div class=\"example-rate-limit-reached\" *ngIf=\"isRateLimitReached\">\r\n {{'General.LoadingData' | translate}}\r\n </div>\r\n </div>\r\n\r\n\r\n <mat-table fxFlex #table [dataSource]=\"dataSource\" id=\"tempalte-forms-table\" matSort matSortDisableClear\r\n matSortDirection=\"asc\" cdkDropList [cdkDropListData]=\"dataSource\" (cdkDropListDropped)=\"dropTable($event)\">\r\n\r\n\r\n <ng-container matColumnDef=\"position\">\r\n <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n <!-- {{'General.Order' | translate}} -->\r\n </mat-header-cell>\r\n <mat-cell fxFlex *matCellDef=\"let element;\">\r\n <mat-icon cdkDragHandle>reorder</mat-icon>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngFor=\"let column of gridLayout\" [matColumnDef]=\"column.propertyName\"\r\n [sticky]=\"isColumnSticky(column.propertyName)\">\r\n <mat-header-cell mat-sort-header disableClear [style.flex]=\"getFlexStyle(column)\" *matHeaderCellDef>\r\n {{column.translateKey | translate}}\r\n </mat-header-cell>\r\n <mat-cell matTooltip={{getCelValue(row,column.propertyName)}} [style.flex]=\"getFlexStyle(column)\"\r\n [style.text-align]=\"getCellTextAlign(column)\" *matCellDef=\"let row\">{{getCelValue(row,column.propertyName)}}\r\n </mat-cell>\r\n </ng-container>\r\n\r\n\r\n <ng-container matColumnDef=\"delete\" stickyEnd *ngIf=\"!editOnClick && !editOnDblClick\">\r\n <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let row\">\r\n <button class=\"btn btn-green btn-fill btn-wd btn-just-icon\" (click)=\"editObject(row)\"\r\n matTooltip=\"{{'General.Edit' | translate}}\">\r\n <!-- <mat-icon>edit</mat-icon> -->\r\n <i class=\"material-icons\">edit</i>\r\n <div class=\"ripple-container\"></div>\r\n </button>\r\n <button class=\"btn btn-red btn-fill btn-wd btn-just-icon\" (click)=\"deleteObject(row)\"\r\n [disabled]=\"deleteDisabled(row)\" matTooltip=\"{{'General.Delete' | translate}}\">\r\n <i class=\"material-icons\">delete</i>\r\n <div class=\"ripple-container\"></div>\r\n </button>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-header-row *matHeaderRowDef=\"displayedColumns;sticky: true\"></mat-header-row>\r\n\r\n <ng-container *ngIf=\"!editOnClick && !editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"highlight(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\">\r\n </mat-row>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"editOnClick && !editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"editObject(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!editOnClick && editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (dblclick)=\"editObject(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n </ng-container>\r\n\r\n <!-- [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\"\r\n (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" -->\r\n </mat-table>\r\n <mat-paginator #paginator [length]=\"resultsLength\" [pageSize]=\"15\" [pageSizeOptions]=\"[15, 30, 100]\"\r\n [showFirstLastButtons]=\"true\">\r\n </mat-paginator>\r\n </div>\r\n</div>", styles: [".mat-column-delete{flex:0 0 90px;padding-right:30px}.mat-sort-header-button{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-column-position{flex:0 0 60px!important}.mat-table{overflow-x:scroll}\n"], components: [{ type: i4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i8.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: i6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i9.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MatLabel, selector: "mat-label" }, { type: i10.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: i8.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { type: i11.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i6.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i6.MatCellDef, selector: "[matCellDef]" }, { type: i6.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i11.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i11.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "translate": i1$2.TranslatePipe } });
|
1488
1179
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: GenericTableComponent, decorators: [{
|
1489
1180
|
type: Component,
|
1490
|
-
args: [{ selector: '
|
1491
|
-
}], ctorParameters: function () { return [{ type: DialogService }, { type: i2
|
1181
|
+
args: [{ selector: 'app-generic-table', template: "<div class=\"containerX\" *ngIf=\"hasSearch\">\r\n <div fxLayout=\"row\" fxLayout.xs=\"column\" fxLayout.sm=\"column\" fxFlexFill>\r\n <mat-form-field fxFlex>\r\n <mat-label>Filter</mat-label>\r\n <input matInput [ngModel]='filterValue' (ngModelChange)='filterChanged.next($event)' #filter>\r\n </mat-form-field>\r\n </div>\r\n</div>\r\n\r\n<div class=\"table-container\">\r\n <div class=\"mat-elevation-z2\">\r\n <!-- #applicationsContainer -->\r\n <div class=\"example-loading-shade\" *ngIf=\"isLoadingResults || isRateLimitReached\">\r\n <mat-spinner *ngIf=\"isLoadingResults\"></mat-spinner>\r\n <div class=\"example-rate-limit-reached\" *ngIf=\"isRateLimitReached\">\r\n {{'General.LoadingData' | translate}}\r\n </div>\r\n </div>\r\n\r\n\r\n <mat-table fxFlex #table [dataSource]=\"dataSource\" id=\"tempalte-forms-table\" matSort matSortDisableClear\r\n matSortDirection=\"asc\" cdkDropList [cdkDropListData]=\"dataSource\" (cdkDropListDropped)=\"dropTable($event)\">\r\n\r\n\r\n <ng-container matColumnDef=\"position\">\r\n <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n <!-- {{'General.Order' | translate}} -->\r\n </mat-header-cell>\r\n <mat-cell fxFlex *matCellDef=\"let element;\">\r\n <mat-icon cdkDragHandle>reorder</mat-icon>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n\r\n <ng-container *ngFor=\"let column of gridLayout\" [matColumnDef]=\"column.propertyName\"\r\n [sticky]=\"isColumnSticky(column.propertyName)\">\r\n <mat-header-cell mat-sort-header disableClear [style.flex]=\"getFlexStyle(column)\" *matHeaderCellDef>\r\n {{column.translateKey | translate}}\r\n </mat-header-cell>\r\n <mat-cell matTooltip={{getCelValue(row,column.propertyName)}} [style.flex]=\"getFlexStyle(column)\"\r\n [style.text-align]=\"getCellTextAlign(column)\" *matCellDef=\"let row\">{{getCelValue(row,column.propertyName)}}\r\n </mat-cell>\r\n </ng-container>\r\n\r\n\r\n <ng-container matColumnDef=\"delete\" stickyEnd *ngIf=\"!editOnClick && !editOnDblClick\">\r\n <mat-header-cell *matHeaderCellDef disableClear=\"true\">\r\n </mat-header-cell>\r\n <mat-cell *matCellDef=\"let row\">\r\n <button class=\"btn btn-green btn-fill btn-wd btn-just-icon\" (click)=\"editObject(row)\"\r\n matTooltip=\"{{'General.Edit' | translate}}\">\r\n <!-- <mat-icon>edit</mat-icon> -->\r\n <i class=\"material-icons\">edit</i>\r\n <div class=\"ripple-container\"></div>\r\n </button>\r\n <button class=\"btn btn-red btn-fill btn-wd btn-just-icon\" (click)=\"deleteObject(row)\"\r\n [disabled]=\"deleteDisabled(row)\" matTooltip=\"{{'General.Delete' | translate}}\">\r\n <i class=\"material-icons\">delete</i>\r\n <div class=\"ripple-container\"></div>\r\n </button>\r\n </mat-cell>\r\n </ng-container>\r\n\r\n <mat-header-row *matHeaderRowDef=\"displayedColumns;sticky: true\"></mat-header-row>\r\n\r\n <ng-container *ngIf=\"!editOnClick && !editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"highlight(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\">\r\n </mat-row>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"editOnClick && !editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (click)=\"editObject(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"!editOnClick && editOnDblClick\">\r\n <mat-row *matRowDef=\"let row;let index = dataIndex; columns: displayedColumns;\" cdkDrag [cdkDragData]=\"row\"\r\n [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\" (dblclick)=\"editObject(row)\"\r\n (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" style=\"cursor: pointer;\"></mat-row>\r\n </ng-container>\r\n\r\n <!-- [ngClass]=\"{hovered: row.hovered, highlighted: row.highlighted}\"\r\n (click)=\"highlight(row)\" (mouseover)=\"row.hovered = true\" (mouseout)=\"row.hovered = false\" -->\r\n </mat-table>\r\n <mat-paginator #paginator [length]=\"resultsLength\" [pageSize]=\"15\" [pageSizeOptions]=\"[15, 30, 100]\"\r\n [showFirstLastButtons]=\"true\">\r\n </mat-paginator>\r\n </div>\r\n</div>", styles: [".mat-column-delete{flex:0 0 90px;padding-right:30px}.mat-sort-header-button{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mat-column-position{flex:0 0 60px!important}.mat-table{overflow-x:scroll}\n"] }]
|
1182
|
+
}], ctorParameters: function () { return [{ type: DialogService }, { type: i2.Router }, { type: i3.DatePipe }, { type: i3.DecimalPipe }, { type: i3.PercentPipe }]; }, propDecorators: { modelType: [{
|
1492
1183
|
type: Input
|
1493
1184
|
}], baseService: [{
|
1494
1185
|
type: Input
|
@@ -1526,8 +1217,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
|
|
1526
1217
|
type: Input
|
1527
1218
|
}], changeItemPosition: [{
|
1528
1219
|
type: Input
|
1529
|
-
}], infiniteScroll: [{
|
1530
|
-
type: Input
|
1531
1220
|
}], paginator: [{
|
1532
1221
|
type: ViewChild,
|
1533
1222
|
args: [MatPaginator, { static: true }]
|
@@ -1540,13 +1229,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
|
|
1540
1229
|
}], table: [{
|
1541
1230
|
type: ViewChild,
|
1542
1231
|
args: ['table']
|
1543
|
-
}], matTableRef: [{
|
1544
|
-
type: ViewChild,
|
1545
|
-
args: ['table', { read: ElementRef }]
|
1546
1232
|
}], selectedObject: [{
|
1547
1233
|
type: Output
|
1548
|
-
}], click: [{
|
1549
|
-
type: Output
|
1550
1234
|
}], editModel: [{
|
1551
1235
|
type: Output
|
1552
1236
|
}] } });
|
@@ -1607,9 +1291,6 @@ function Attribute(options = {}) {
|
|
1607
1291
|
const defaultMetadata = Reflect.getMetadata('AttributedefaultValue', target) || {};
|
1608
1292
|
defaultMetadata[serializedPropertyName] = options.defaultValue !== undefined ? options.defaultValue : null;
|
1609
1293
|
Reflect.defineMetadata('AttributedefaultValue', defaultMetadata, target);
|
1610
|
-
const formSubGroupMetadata = Reflect.getMetadata('AttributeformSubGroup', target) || {};
|
1611
|
-
formSubGroupMetadata[serializedPropertyName] = options.formSubGroup !== undefined ? options.formSubGroup : null;
|
1612
|
-
Reflect.defineMetadata('AttributeformSubGroup', formSubGroupMetadata, target);
|
1613
1294
|
};
|
1614
1295
|
const setMetadata = (hasDirtyAttributes, instance, oldValue, newValue, isNew) => {
|
1615
1296
|
const targetType = Reflect.getMetadata('design:type', target, propertyName);
|
@@ -1797,14 +1478,14 @@ class TranslatedContentDirective {
|
|
1797
1478
|
this.subs.forEach(sub => sub.unsubscribe());
|
1798
1479
|
}
|
1799
1480
|
}
|
1800
|
-
TranslatedContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedContentDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.Renderer2 }, { token: i1$
|
1481
|
+
TranslatedContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedContentDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.Renderer2 }, { token: i1$2.TranslateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
|
1801
1482
|
TranslatedContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: TranslatedContentDirective, selector: "[appTranslatedContent]", inputs: { translationKey: ["appTranslatedContent", "translationKey"] }, queries: [{ propertyName: "elements", predicate: TranslatedElementDirective }], ngImport: i0 });
|
1802
1483
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TranslatedContentDirective, decorators: [{
|
1803
1484
|
type: Directive,
|
1804
1485
|
args: [{
|
1805
1486
|
selector: '[appTranslatedContent]',
|
1806
1487
|
}]
|
1807
|
-
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.Renderer2 }, { type: i1$
|
1488
|
+
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.Renderer2 }, { type: i1$2.TranslateService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { translationKey: [{
|
1808
1489
|
type: Input,
|
1809
1490
|
args: ['appTranslatedContent']
|
1810
1491
|
}], elements: [{
|
@@ -1917,67 +1598,25 @@ class BaseModel {
|
|
1917
1598
|
getModelDefaultPropertyValues(model) {
|
1918
1599
|
return Reflect.getMetadata('AttributedefaultValue', model);
|
1919
1600
|
}
|
1920
|
-
getModelSubGroupPropertyNames(model) {
|
1921
|
-
return Reflect.getMetadata('AttributeformSubGroup', model);
|
1922
|
-
}
|
1923
1601
|
getFromGroup(fb) {
|
1924
1602
|
const props = Object.keys(this.getModelPropertyNames(this));
|
1925
1603
|
const requiredProps = this.getModelRequiredPropertyNames(this);
|
1926
1604
|
const defaultValues = this.getModelDefaultPropertyValues(this);
|
1927
|
-
const formSubGroupsValues = this.getModelSubGroupPropertyNames(this);
|
1928
1605
|
const controlsConfig = {};
|
1929
1606
|
const that = this;
|
1930
1607
|
if (props) {
|
1931
1608
|
props.forEach(property => {
|
1932
|
-
var _a;
|
1933
1609
|
const value = that[property] !== undefined ? that[property] : defaultValues[property];
|
1934
|
-
const formSubGroup = (_a = formSubGroupsValues[property]) !== null && _a !== void 0 ? _a : null;
|
1935
1610
|
if (requiredProps[property]) {
|
1936
|
-
|
1937
|
-
this.getSubFromGroup(fb, controlsConfig, formSubGroup).addControl(property, fb.control(value, Validators.required));
|
1938
|
-
else
|
1939
|
-
controlsConfig[property] = [value, Validators.required];
|
1611
|
+
controlsConfig[property] = [value, Validators.required];
|
1940
1612
|
}
|
1941
1613
|
else {
|
1942
|
-
|
1943
|
-
this.getSubFromGroup(fb, controlsConfig, formSubGroup).addControl(property, fb.control(value));
|
1944
|
-
else
|
1945
|
-
controlsConfig[property] = value;
|
1614
|
+
controlsConfig[property] = value;
|
1946
1615
|
}
|
1947
1616
|
});
|
1948
1617
|
}
|
1949
1618
|
return fb.group(controlsConfig);
|
1950
1619
|
}
|
1951
|
-
getSubFromGroup(fb, controlsConfig, subGroup) {
|
1952
|
-
if (!controlsConfig[subGroup])
|
1953
|
-
controlsConfig[subGroup] = fb.group({});
|
1954
|
-
return controlsConfig[subGroup];
|
1955
|
-
}
|
1956
|
-
getModelFromFormGroup(formGroup, id) {
|
1957
|
-
const props = Object.keys(this.getModelPropertyNames(this));
|
1958
|
-
const formSubGroupsValues = this.getModelSubGroupPropertyNames(this);
|
1959
|
-
const data = {};
|
1960
|
-
if (id) {
|
1961
|
-
data.id = id;
|
1962
|
-
}
|
1963
|
-
const that = this;
|
1964
|
-
if (props) {
|
1965
|
-
props.forEach(property => {
|
1966
|
-
var _a, _b, _c;
|
1967
|
-
const formSubGroup = (_a = formSubGroupsValues[property]) !== null && _a !== void 0 ? _a : null;
|
1968
|
-
if (!formSubGroup)
|
1969
|
-
data[property] = (_b = formGroup.controls[property].value) !== null && _b !== void 0 ? _b : null;
|
1970
|
-
else
|
1971
|
-
data[property] = (_c = formGroup.controls[formSubGroup].controls[property].value) !== null && _c !== void 0 ? _c : null;
|
1972
|
-
});
|
1973
|
-
}
|
1974
|
-
if (data) {
|
1975
|
-
if (id) {
|
1976
|
-
this.id = id;
|
1977
|
-
}
|
1978
|
-
Object.assign(this, data);
|
1979
|
-
}
|
1980
|
-
}
|
1981
1620
|
getGridLayout() {
|
1982
1621
|
const result = Array();
|
1983
1622
|
const gridLayout = Reflect.getMetadata('GridLayout', this);
|
@@ -1994,9 +1633,6 @@ class BaseModel {
|
|
1994
1633
|
const attributesMetadata = this[AttributeMetadata];
|
1995
1634
|
return this._datastore.modelToEntity(this, attributesMetadata, true);
|
1996
1635
|
}
|
1997
|
-
getCellClass(property) {
|
1998
|
-
return '';
|
1999
|
-
}
|
2000
1636
|
}
|
2001
1637
|
|
2002
1638
|
class ErrorResponse {
|
@@ -2097,32 +1733,26 @@ const PROVIDERS = [
|
|
2097
1733
|
class RslBaseModule {
|
2098
1734
|
}
|
2099
1735
|
RslBaseModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
2100
|
-
RslBaseModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, declarations: [GenericTableComponent,
|
2101
|
-
|
2102
|
-
ReactiveFormsModule, i2$2.BlockUIModule], exports: [HttpClientModule,
|
2103
|
-
GenericTableComponent,
|
2104
|
-
SearchableDropdownComponent] });
|
1736
|
+
RslBaseModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, declarations: [GenericTableComponent], imports: [CommonModule, i1$2.TranslateModule, MaterialModule, i2$1.BlockUIModule], exports: [HttpClientModule,
|
1737
|
+
GenericTableComponent] });
|
2105
1738
|
RslBaseModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, providers: [
|
2106
1739
|
PROVIDERS
|
2107
1740
|
], imports: [[
|
2108
1741
|
CommonModule,
|
2109
1742
|
TranslateModule.forChild({}),
|
2110
1743
|
MaterialModule,
|
2111
|
-
ReactiveFormsModule,
|
2112
1744
|
BlockUIModule.forRoot(),
|
2113
1745
|
], HttpClientModule] });
|
2114
1746
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: RslBaseModule, decorators: [{
|
2115
1747
|
type: NgModule,
|
2116
1748
|
args: [{
|
2117
1749
|
declarations: [
|
2118
|
-
GenericTableComponent
|
2119
|
-
SearchableDropdownComponent
|
1750
|
+
GenericTableComponent
|
2120
1751
|
],
|
2121
1752
|
imports: [
|
2122
1753
|
CommonModule,
|
2123
1754
|
TranslateModule.forChild({}),
|
2124
1755
|
MaterialModule,
|
2125
|
-
ReactiveFormsModule,
|
2126
1756
|
BlockUIModule.forRoot(),
|
2127
1757
|
],
|
2128
1758
|
providers: [
|
@@ -2130,8 +1760,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
|
|
2130
1760
|
],
|
2131
1761
|
exports: [
|
2132
1762
|
HttpClientModule,
|
2133
|
-
GenericTableComponent
|
2134
|
-
SearchableDropdownComponent
|
1763
|
+
GenericTableComponent
|
2135
1764
|
]
|
2136
1765
|
}]
|
2137
1766
|
}] });
|
@@ -2161,14 +1790,14 @@ class InputErrorPipe {
|
|
2161
1790
|
return rvalue;
|
2162
1791
|
}
|
2163
1792
|
}
|
2164
|
-
InputErrorPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, deps: [{ token: i1$
|
1793
|
+
InputErrorPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe });
|
2165
1794
|
InputErrorPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, name: "inputError" });
|
2166
1795
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: InputErrorPipe, decorators: [{
|
2167
1796
|
type: Pipe,
|
2168
1797
|
args: [{
|
2169
1798
|
name: 'inputError'
|
2170
1799
|
}]
|
2171
|
-
}], ctorParameters: function () { return [{ type: i1$
|
1800
|
+
}], ctorParameters: function () { return [{ type: i1$2.TranslateService }]; } });
|
2172
1801
|
|
2173
1802
|
class Nl2brPipe {
|
2174
1803
|
transform(value, args) {
|
@@ -2213,5 +1842,5 @@ class CustomValidators {
|
|
2213
1842
|
* Generated bundle index. Do not edit.
|
2214
1843
|
*/
|
2215
1844
|
|
2216
|
-
export { Attribute, BaseDatastore, BaseDatastoreConfig, BaseFormEditComponent, BaseMetaModel, BaseModel, BaseModelConfig, BaseQueryData, BaseService, CellTextAlign, CustomType, CustomValidators, DialogService, ErrorResponse, FieldErrorDisplayComponent, GenericTableComponent, GridLayout, GridLayoutFormat, GridLayoutModel, GridLayoutService, InputErrorPipe, MaterialModule, Nl2brPipe, PROVIDERS, PageNotFoundComponent, RslBaseModule, Rule,
|
1845
|
+
export { Attribute, BaseDatastore, BaseDatastoreConfig, BaseFormEditComponent, BaseMetaModel, BaseModel, BaseModelConfig, BaseQueryData, BaseService, CellTextAlign, CustomType, CustomValidators, DialogService, ErrorResponse, FieldErrorDisplayComponent, GenericTableComponent, GridLayout, GridLayoutFormat, GridLayoutModel, GridLayoutService, InputErrorPipe, MaterialModule, Nl2brPipe, PROVIDERS, PageNotFoundComponent, RslBaseModule, Rule, TranslatedContentDirective, TranslatedElementDirective, UnderConstructionComponent };
|
2217
1846
|
//# sourceMappingURL=rosoftlab-core.mjs.map
|