@one-paragon/angular-utilities 0.0.15 → 0.0.19
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/http-request-state/HttpRequestStateFactory.mjs +3 -3
- package/esm2020/http-request-state/HttpRequestStateStore.mjs +3 -3
- package/esm2020/http-request-state/directives/HttpStateDirectiveBase.mjs +3 -3
- package/esm2020/http-request-state/directives/http-error-state-directive.mjs +3 -3
- package/esm2020/http-request-state/directives/http-inProgress-state-directive.mjs +3 -3
- package/esm2020/http-request-state/directives/http-notStarted-state-directive.mjs +3 -3
- package/esm2020/http-request-state/directives/http-success-state-directive.mjs +3 -3
- package/esm2020/http-request-state/directives/request-state-directive.mjs +3 -3
- package/esm2020/http-request-state/http-state-module.mjs +4 -4
- package/esm2020/table-builder/classes/TableBuilderConfig.mjs +1 -1
- package/esm2020/table-builder/classes/table-store.mjs +3 -3
- package/esm2020/table-builder/components/array-column.component.mjs +3 -3
- package/esm2020/table-builder/components/column-builder/column-builder.component.mjs +3 -3
- package/esm2020/table-builder/components/date-filter/date-filter.component.mjs +3 -3
- package/esm2020/table-builder/components/filter/filter.component.mjs +3 -3
- package/esm2020/table-builder/components/filter/in-list/in-list-filter.component.mjs +3 -3
- package/esm2020/table-builder/components/gen-col-displayer/gen-col-displayer.component.mjs +5 -5
- package/esm2020/table-builder/components/generic-table/generic-table.component.mjs +4 -4
- package/esm2020/table-builder/components/generic-table/paginator.component.mjs +5 -5
- package/esm2020/table-builder/components/header-menu/header-menu.component.mjs +3 -3
- package/esm2020/table-builder/components/in-filter/in-filter.component.mjs +3 -3
- package/esm2020/table-builder/components/initialization-component/initialization-component.mjs +15 -5
- package/esm2020/table-builder/components/number-filter/number-filter.component.mjs +3 -3
- package/esm2020/table-builder/components/sort-menu/sort-menu.component-store.mjs +3 -3
- package/esm2020/table-builder/components/sort-menu/sort-menu.component.mjs +5 -5
- package/esm2020/table-builder/components/table-container/table-container.mjs +3 -3
- package/esm2020/table-builder/components/table-container-filter/filter-list/filter-list.component.mjs +5 -5
- package/esm2020/table-builder/components/table-container-filter/gen-filter-displayer/gen-filter-displayer.component.mjs +3 -3
- package/esm2020/table-builder/components/table-container-filter/table-wrapper-filter-store.mjs +3 -3
- package/esm2020/table-builder/directives/custom-cell-directive.mjs +3 -3
- package/esm2020/table-builder/directives/multi-sort.directive.mjs +3 -3
- package/esm2020/table-builder/directives/resize-column.directive.mjs +3 -3
- package/esm2020/table-builder/interfaces/report-def.mjs +1 -1
- package/esm2020/table-builder/material.module.mjs +4 -4
- package/esm2020/table-builder/ngrx/effects.mjs +3 -3
- package/esm2020/table-builder/pipes/column-total.pipe.mjs +3 -3
- package/esm2020/table-builder/pipes/format-filter-type.pipe.mjs +3 -3
- package/esm2020/table-builder/pipes/format-filter-value.pipe.mjs +3 -3
- package/esm2020/table-builder/pipes/key-display.mjs +3 -3
- package/esm2020/table-builder/services/export-to-csv.service.mjs +5 -5
- package/esm2020/table-builder/services/table-template-service.mjs +3 -3
- package/esm2020/table-builder/services/transform-creator.mjs +3 -3
- package/esm2020/table-builder/table-builder.module.mjs +4 -4
- package/esm2020/utilities/directives/auto-focus.directive.mjs +3 -3
- package/esm2020/utilities/directives/clickEmitterDirective.mjs +3 -3
- package/esm2020/utilities/directives/clickSubject.mjs +3 -3
- package/esm2020/utilities/directives/dialog-service.mjs +3 -3
- package/esm2020/utilities/directives/dialog.mjs +10 -7
- package/esm2020/utilities/directives/mat-toggle-group-directive.mjs +3 -3
- package/esm2020/utilities/directives/prevent-enter.directive.mjs +3 -3
- package/esm2020/utilities/directives/stop-propagation.directive.mjs +3 -3
- package/esm2020/utilities/directives/styler.mjs +3 -3
- package/esm2020/utilities/module.mjs +4 -4
- package/esm2020/utilities/pipes/function.pipe.mjs +3 -3
- package/esm2020/utilities/pipes/phone.pipe.mjs +3 -3
- package/esm2020/utilities/pipes/space-case.pipes.mjs +3 -3
- package/fesm2015/one-paragon-angular-utilities.mjs +197 -178
- package/fesm2015/one-paragon-angular-utilities.mjs.map +1 -1
- package/fesm2020/one-paragon-angular-utilities.mjs +191 -178
- package/fesm2020/one-paragon-angular-utilities.mjs.map +1 -1
- package/package.json +1 -1
- package/table-builder/classes/TableBuilderConfig.d.ts +1 -0
- package/table-builder/components/initialization-component/initialization-component.d.ts +7 -0
- package/table-builder/interfaces/report-def.d.ts +20 -1
- package/utilities/directives/dialog.d.ts +3 -2
|
@@ -148,9 +148,9 @@ class HttpRequestStateDirective {
|
|
|
148
148
|
this.subscription.unsubscribe();
|
|
149
149
|
}
|
|
150
150
|
}
|
|
151
|
-
HttpRequestStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
152
|
-
HttpRequestStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
153
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
151
|
+
HttpRequestStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
152
|
+
HttpRequestStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpRequestStateDirective, selector: "[httpRequestState]", inputs: { stateStore: ["httpRequestState", "stateStore"] }, ngImport: i0 });
|
|
153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateDirective, decorators: [{
|
|
154
154
|
type: Directive,
|
|
155
155
|
args: [{ selector: '[httpRequestState]' }]
|
|
156
156
|
}], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; }, propDecorators: { stateStore: [{
|
|
@@ -183,9 +183,9 @@ class HttpStateDirectiveBase {
|
|
|
183
183
|
ngOnDestroy() {
|
|
184
184
|
}
|
|
185
185
|
}
|
|
186
|
-
HttpStateDirectiveBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
187
|
-
HttpStateDirectiveBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
188
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
186
|
+
HttpStateDirectiveBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpStateDirectiveBase, deps: [{ token: i0.Injector }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
187
|
+
HttpStateDirectiveBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpStateDirectiveBase, ngImport: i0 });
|
|
188
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpStateDirectiveBase, decorators: [{
|
|
189
189
|
type: Directive
|
|
190
190
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
|
|
191
191
|
|
|
@@ -207,9 +207,9 @@ class HttpErrorStateDirective extends HttpStateDirectiveBase {
|
|
|
207
207
|
super.ngOnDestroy();
|
|
208
208
|
}
|
|
209
209
|
}
|
|
210
|
-
HttpErrorStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
211
|
-
HttpErrorStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
212
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
210
|
+
HttpErrorStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpErrorStateDirective, deps: [{ token: i0.Injector }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
211
|
+
HttpErrorStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpErrorStateDirective, selector: "[httpErrorState]", usesInheritance: true, ngImport: i0 });
|
|
212
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpErrorStateDirective, decorators: [{
|
|
213
213
|
type: Directive,
|
|
214
214
|
args: [{ selector: '[httpErrorState]' }]
|
|
215
215
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
|
|
@@ -232,9 +232,9 @@ class HttpInProgressStateDirective extends HttpStateDirectiveBase {
|
|
|
232
232
|
super.ngOnDestroy();
|
|
233
233
|
}
|
|
234
234
|
}
|
|
235
|
-
HttpInProgressStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
236
|
-
HttpInProgressStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
237
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
235
|
+
HttpInProgressStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpInProgressStateDirective, deps: [{ token: i0.Injector }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
236
|
+
HttpInProgressStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpInProgressStateDirective, selector: "[httpInProgressState]", usesInheritance: true, ngImport: i0 });
|
|
237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpInProgressStateDirective, decorators: [{
|
|
238
238
|
type: Directive,
|
|
239
239
|
args: [{ selector: '[httpInProgressState]' }]
|
|
240
240
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
|
|
@@ -257,9 +257,9 @@ class HttpNotStartedStateDirective extends HttpStateDirectiveBase {
|
|
|
257
257
|
super.ngOnDestroy();
|
|
258
258
|
}
|
|
259
259
|
}
|
|
260
|
-
HttpNotStartedStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
261
|
-
HttpNotStartedStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
262
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
260
|
+
HttpNotStartedStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpNotStartedStateDirective, deps: [{ token: i0.Injector }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
261
|
+
HttpNotStartedStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpNotStartedStateDirective, selector: "[httpNotStartedState]", usesInheritance: true, ngImport: i0 });
|
|
262
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpNotStartedStateDirective, decorators: [{
|
|
263
263
|
type: Directive,
|
|
264
264
|
args: [{ selector: '[httpNotStartedState]' }]
|
|
265
265
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
|
|
@@ -282,9 +282,9 @@ class HttpSuccessStateDirective extends HttpStateDirectiveBase {
|
|
|
282
282
|
super.ngOnDestroy();
|
|
283
283
|
}
|
|
284
284
|
}
|
|
285
|
-
HttpSuccessStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
286
|
-
HttpSuccessStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
287
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
285
|
+
HttpSuccessStateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpSuccessStateDirective, deps: [{ token: i0.Injector }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
286
|
+
HttpSuccessStateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpSuccessStateDirective, selector: "[httpSuccessState]", usesInheritance: true, ngImport: i0 });
|
|
287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpSuccessStateDirective, decorators: [{
|
|
288
288
|
type: Directive,
|
|
289
289
|
args: [{ selector: '[httpSuccessState]' }]
|
|
290
290
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }]; } });
|
|
@@ -352,8 +352,8 @@ function chainRequest(httpState$, request, requestParams) {
|
|
|
352
352
|
|
|
353
353
|
class HttpRequestModule {
|
|
354
354
|
}
|
|
355
|
-
HttpRequestModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
356
|
-
HttpRequestModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.
|
|
355
|
+
HttpRequestModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
356
|
+
HttpRequestModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestModule, declarations: [HttpSuccessStateDirective,
|
|
357
357
|
HttpRequestStateDirective,
|
|
358
358
|
HttpErrorStateDirective,
|
|
359
359
|
HttpInProgressStateDirective,
|
|
@@ -362,8 +362,8 @@ HttpRequestModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
|
|
|
362
362
|
HttpErrorStateDirective,
|
|
363
363
|
HttpInProgressStateDirective,
|
|
364
364
|
HttpNotStartedStateDirective] });
|
|
365
|
-
HttpRequestModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.
|
|
366
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
365
|
+
HttpRequestModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestModule, providers: [] });
|
|
366
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestModule, decorators: [{
|
|
367
367
|
type: NgModule,
|
|
368
368
|
args: [{
|
|
369
369
|
providers: [],
|
|
@@ -447,9 +447,9 @@ class HttpRequestStateStore extends ComponentStore {
|
|
|
447
447
|
super.ngOnDestroy();
|
|
448
448
|
}
|
|
449
449
|
}
|
|
450
|
-
HttpRequestStateStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
451
|
-
HttpRequestStateStore.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
452
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
450
|
+
HttpRequestStateStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateStore, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
|
|
451
|
+
HttpRequestStateStore.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: HttpRequestStateStore, usesInheritance: true, ngImport: i0 });
|
|
452
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateStore, decorators: [{
|
|
453
453
|
type: Directive
|
|
454
454
|
}], ctorParameters: function () { return [{ type: undefined }, { type: undefined }]; } });
|
|
455
455
|
|
|
@@ -471,9 +471,9 @@ class HttpRequestStateFactory {
|
|
|
471
471
|
return requestor;
|
|
472
472
|
}
|
|
473
473
|
}
|
|
474
|
-
HttpRequestStateFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
475
|
-
HttpRequestStateFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
476
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
474
|
+
HttpRequestStateFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
475
|
+
HttpRequestStateFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateFactory });
|
|
476
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HttpRequestStateFactory, decorators: [{
|
|
477
477
|
type: Injectable
|
|
478
478
|
}], ctorParameters: function () { return []; } });
|
|
479
479
|
|
|
@@ -598,9 +598,9 @@ class PhoneNumberPipe {
|
|
|
598
598
|
}
|
|
599
599
|
}
|
|
600
600
|
}
|
|
601
|
-
PhoneNumberPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
602
|
-
PhoneNumberPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
603
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
601
|
+
PhoneNumberPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PhoneNumberPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
602
|
+
PhoneNumberPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PhoneNumberPipe, name: "phone" });
|
|
603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PhoneNumberPipe, decorators: [{
|
|
604
604
|
type: Pipe,
|
|
605
605
|
args: [{ name: 'phone' }]
|
|
606
606
|
}] });
|
|
@@ -637,9 +637,9 @@ class TransformCreator {
|
|
|
637
637
|
return (value) => value;
|
|
638
638
|
}
|
|
639
639
|
}
|
|
640
|
-
TransformCreator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
641
|
-
TransformCreator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
642
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
640
|
+
TransformCreator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TransformCreator, deps: [{ token: i1.DatePipe }, { token: i1.CurrencyPipe }, { token: PhoneNumberPipe }, { token: TableBuilderConfigToken }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
641
|
+
TransformCreator.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TransformCreator, providedIn: 'root' });
|
|
642
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TransformCreator, decorators: [{
|
|
643
643
|
type: Injectable,
|
|
644
644
|
args: [{
|
|
645
645
|
providedIn: 'root'
|
|
@@ -910,9 +910,9 @@ class TableStore extends ComponentStore {
|
|
|
910
910
|
this.on(this.state$.pipe(last()), callback);
|
|
911
911
|
}
|
|
912
912
|
}
|
|
913
|
-
TableStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
914
|
-
TableStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
915
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
913
|
+
TableStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableStore, deps: [{ token: TableBuilderConfigToken }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
914
|
+
TableStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableStore, providedIn: 'root' });
|
|
915
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableStore, decorators: [{
|
|
916
916
|
type: Injectable,
|
|
917
917
|
args: [{
|
|
918
918
|
providedIn: 'root',
|
|
@@ -940,8 +940,8 @@ class ArrayColumnComponent {
|
|
|
940
940
|
this.array = (this.array ?? []).slice(0, this.additional.limit);
|
|
941
941
|
}
|
|
942
942
|
}
|
|
943
|
-
ArrayColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
944
|
-
ArrayColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
943
|
+
ArrayColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ArrayColumnComponent, deps: [{ token: TableBuilderConfigToken }], target: i0.ɵɵFactoryTarget.Component });
|
|
944
|
+
ArrayColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ArrayColumnComponent, selector: "tb-array-column", inputs: { array: "array", metaData: "metaData" }, ngImport: i0, template: `
|
|
945
945
|
<ng-container *ngIf="array.length === 0; else hasVals">-</ng-container>
|
|
946
946
|
<ng-template #hasVals>
|
|
947
947
|
<ng-container [ngSwitch]="additional.arrayStyle">
|
|
@@ -954,7 +954,7 @@ ArrayColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
954
954
|
</ng-container>
|
|
955
955
|
</ng-template>
|
|
956
956
|
`, isInline: true, directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
957
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
957
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ArrayColumnComponent, decorators: [{
|
|
958
958
|
type: Component,
|
|
959
959
|
args: [{
|
|
960
960
|
selector: 'tb-array-column',
|
|
@@ -992,9 +992,9 @@ class FunctionPipe {
|
|
|
992
992
|
return func(...args);
|
|
993
993
|
}
|
|
994
994
|
}
|
|
995
|
-
FunctionPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
996
|
-
FunctionPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
997
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
995
|
+
FunctionPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FunctionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
996
|
+
FunctionPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FunctionPipe, name: "func" });
|
|
997
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FunctionPipe, decorators: [{
|
|
998
998
|
type: Pipe,
|
|
999
999
|
args: [{
|
|
1000
1000
|
name: 'func'
|
|
@@ -1006,9 +1006,9 @@ class SpaceCasePipe {
|
|
|
1006
1006
|
return spaceCase(value);
|
|
1007
1007
|
}
|
|
1008
1008
|
}
|
|
1009
|
-
SpaceCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1010
|
-
SpaceCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
1011
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1009
|
+
SpaceCasePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SpaceCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
1010
|
+
SpaceCasePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SpaceCasePipe, name: "spaceCase" });
|
|
1011
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SpaceCasePipe, decorators: [{
|
|
1012
1012
|
type: Pipe,
|
|
1013
1013
|
args: [{ name: 'spaceCase' }]
|
|
1014
1014
|
}] });
|
|
@@ -1028,12 +1028,22 @@ function spaceCase(value) {
|
|
|
1028
1028
|
}
|
|
1029
1029
|
|
|
1030
1030
|
class InitializationComponent {
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1031
|
+
constructor() {
|
|
1032
|
+
this.forTrueIcon = (metaData) => metaData.additional?.boolean?.forTrue?.icon || 'check';
|
|
1033
|
+
this.forFalseIcon = (metaData) => metaData.additional?.boolean?.showForFalse === true ? 'clear'
|
|
1034
|
+
: metaData.additional?.boolean?.showForFalse?.icon || null;
|
|
1035
|
+
this.useRouterLink = (metaData) => metaData.additional?.link?.useRouterLink || metaData.additional?.useRouterLink;
|
|
1036
|
+
this.target = (metaData) => metaData.additional?.link?.target || metaData.additional?.target || '_blank';
|
|
1037
|
+
this.base = (metaData) => metaData.additional?.link?.base || metaData.additional?.base;
|
|
1038
|
+
this.key = (metaData, element) => metaData.additional?.link?.urlKey ? element[metaData.additional?.link?.urlKey] :
|
|
1039
|
+
metaData.additional?.urlKey ? element[metaData.additional.urlKey] : element[metaData.key];
|
|
1040
|
+
}
|
|
1041
|
+
}
|
|
1042
|
+
InitializationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InitializationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1043
|
+
InitializationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InitializationComponent, selector: "ng-component", viewQueries: [{ propertyName: "booleanTemplate", first: true, predicate: ["boolean"], descendants: true, static: true }, { propertyName: "linkTemplate", first: true, predicate: ["link"], descendants: true, static: true }, { propertyName: "imageUrlTemplate", first: true, predicate: ["imageUrl"], descendants: true, static: true }, { propertyName: "currencyTemplate", first: true, predicate: ["currency"], descendants: true, static: true }, { propertyName: "arrayTemplate", first: true, predicate: ["array"], descendants: true, static: true }, { propertyName: "expressionTemplate", first: true, predicate: ["expression"], descendants: true, static: true }, { propertyName: "defaultTemplate", first: true, predicate: ["default"], descendants: true, static: true }, { propertyName: "enumTemplate", first: true, predicate: ["enum"], descendants: true, static: true }], ngImport: i0, template: "<ng-template #boolean let-element='element' let-metaData='metaData'>\n <span>\n <mat-icon *ngIf=\"element[metaData.key]\">\n {{forTrueIcon | func : metaData}}\n </mat-icon>\n <mat-icon *ngIf=\"!element[metaData.key]\">\n <ng-container *ngIf=\"(forFalseIcon | func : metaData) as icon\">\n {{icon}}\n </ng-container>\n </mat-icon>\n </span>\n</ng-template>\n<ng-template #link let-element='element' let-metaData='metaData'>\n <a *ngIf=\"useRouterLink | func : metaData; else hrefLink\" target=\"{{target | func : metaData }}\"\n [routerLink]=\"[(base | func : metaData), (key | func : metaData : element)]\">\n {{element[metaData.key]}}\n </a>\n <ng-template #hrefLink>\n <a target=\"{{target | func : metaData}}\"\n href=\"{{(base | func : metaData)}}{{(key | func : metaData : element)}}\">\n {{element[metaData.key]}}\n </a>\n </ng-template>\n</ng-template>\n<ng-template #imageUrl let-element='element' let-metaData='metaData'>\n <span>\n <img src=\"{{element[metaData.key]}}\" height=\"75px\" width=\"75px\" />\n </span>\n</ng-template>\n<ng-template #currency let-element='element' let-metaData='metaData' >\n <span [class.negative-currency]=\"element[metaData.key] < 0\">\n {{ element[metaData.key] | currency }}\n </span>\n</ng-template>\n<ng-template #array let-element='element' let-metaData='metaData'>\n <tb-array-column [array]='element[metaData.key]' [metaData]='metaData'></tb-array-column>\n</ng-template>\n<ng-template #expression let-element='element' let-metaData='metaData'>\n <span>{{ metaData.transform | func : element }}</span>\n</ng-template>\n<ng-template #enum let-element='element' let-metaData='metaData' >\n <span>{{ metaData.additional.enumMap[element[metaData.key]] | spaceCase }}</span>\n</ng-template>\n<ng-template #default let-element='element' let-metaData='metaData' let-transform='transform'>\n <span>{{ transform | func : element[metaData.key] }}</span>\n</ng-template>\n", components: [{ type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: ArrayColumnComponent, selector: "tb-array-column", inputs: ["array", "metaData"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "func": FunctionPipe, "currency": i1.CurrencyPipe, "spaceCase": SpaceCasePipe } });
|
|
1044
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InitializationComponent, decorators: [{
|
|
1035
1045
|
type: Component,
|
|
1036
|
-
args: [{ template: "<ng-template #boolean let-element='element' let-metaData='metaData'>\n <span>\n <mat-icon *ngIf=\"element[metaData.key]\">\n {{
|
|
1046
|
+
args: [{ template: "<ng-template #boolean let-element='element' let-metaData='metaData'>\n <span>\n <mat-icon *ngIf=\"element[metaData.key]\">\n {{forTrueIcon | func : metaData}}\n </mat-icon>\n <mat-icon *ngIf=\"!element[metaData.key]\">\n <ng-container *ngIf=\"(forFalseIcon | func : metaData) as icon\">\n {{icon}}\n </ng-container>\n </mat-icon>\n </span>\n</ng-template>\n<ng-template #link let-element='element' let-metaData='metaData'>\n <a *ngIf=\"useRouterLink | func : metaData; else hrefLink\" target=\"{{target | func : metaData }}\"\n [routerLink]=\"[(base | func : metaData), (key | func : metaData : element)]\">\n {{element[metaData.key]}}\n </a>\n <ng-template #hrefLink>\n <a target=\"{{target | func : metaData}}\"\n href=\"{{(base | func : metaData)}}{{(key | func : metaData : element)}}\">\n {{element[metaData.key]}}\n </a>\n </ng-template>\n</ng-template>\n<ng-template #imageUrl let-element='element' let-metaData='metaData'>\n <span>\n <img src=\"{{element[metaData.key]}}\" height=\"75px\" width=\"75px\" />\n </span>\n</ng-template>\n<ng-template #currency let-element='element' let-metaData='metaData' >\n <span [class.negative-currency]=\"element[metaData.key] < 0\">\n {{ element[metaData.key] | currency }}\n </span>\n</ng-template>\n<ng-template #array let-element='element' let-metaData='metaData'>\n <tb-array-column [array]='element[metaData.key]' [metaData]='metaData'></tb-array-column>\n</ng-template>\n<ng-template #expression let-element='element' let-metaData='metaData'>\n <span>{{ metaData.transform | func : element }}</span>\n</ng-template>\n<ng-template #enum let-element='element' let-metaData='metaData' >\n <span>{{ metaData.additional.enumMap[element[metaData.key]] | spaceCase }}</span>\n</ng-template>\n<ng-template #default let-element='element' let-metaData='metaData' let-transform='transform'>\n <span>{{ transform | func : element[metaData.key] }}</span>\n</ng-template>\n" }]
|
|
1037
1047
|
}], propDecorators: { booleanTemplate: [{
|
|
1038
1048
|
type: ViewChild,
|
|
1039
1049
|
args: ['boolean', { static: true }]
|
|
@@ -1086,9 +1096,9 @@ class TableTemplateService {
|
|
|
1086
1096
|
return this.templates[fieldType];
|
|
1087
1097
|
}
|
|
1088
1098
|
}
|
|
1089
|
-
TableTemplateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1090
|
-
TableTemplateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
1091
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1099
|
+
TableTemplateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableTemplateService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1100
|
+
TableTemplateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableTemplateService, providedIn: 'root' });
|
|
1101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableTemplateService, decorators: [{
|
|
1092
1102
|
type: Injectable,
|
|
1093
1103
|
args: [{ providedIn: 'root' }]
|
|
1094
1104
|
}], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i0.Injector }]; } });
|
|
@@ -1159,9 +1169,9 @@ class StopPropagationDirective {
|
|
|
1159
1169
|
event.stopPropagation();
|
|
1160
1170
|
}
|
|
1161
1171
|
}
|
|
1162
|
-
StopPropagationDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1163
|
-
StopPropagationDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
1164
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1172
|
+
StopPropagationDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: StopPropagationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
1173
|
+
StopPropagationDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: StopPropagationDirective, selector: "[stop-propagation]", host: { listeners: { "click": "onClick($event)", "mousedown": "onMousedown($event)" } }, ngImport: i0 });
|
|
1174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: StopPropagationDirective, decorators: [{
|
|
1165
1175
|
type: Directive,
|
|
1166
1176
|
args: [{
|
|
1167
1177
|
selector: "[stop-propagation]"
|
|
@@ -1221,8 +1231,8 @@ class InListFilterComponent {
|
|
|
1221
1231
|
this.onChange(this.value);
|
|
1222
1232
|
}
|
|
1223
1233
|
}
|
|
1224
|
-
InListFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1225
|
-
InListFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
1234
|
+
InListFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InListFilterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TableStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
1235
|
+
InListFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InListFilterComponent, selector: "tb-in-list-filter", inputs: { key: "key" }, providers: [{
|
|
1226
1236
|
provide: NG_VALUE_ACCESSOR,
|
|
1227
1237
|
useExisting: InListFilterComponent,
|
|
1228
1238
|
multi: true
|
|
@@ -1233,7 +1243,7 @@ InListFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
|
|
|
1233
1243
|
</mat-checkbox>
|
|
1234
1244
|
</div>
|
|
1235
1245
|
`, isInline: true, components: [{ type: i2.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"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: StopPropagationDirective, selector: "[stop-propagation]" }], pipes: { "keyvalue": i1.KeyValuePipe, "async": i1.AsyncPipe, "spaceCase": SpaceCasePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1236
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1246
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InListFilterComponent, decorators: [{
|
|
1237
1247
|
type: Component,
|
|
1238
1248
|
args: [{
|
|
1239
1249
|
selector: 'tb-in-list-filter',
|
|
@@ -1313,9 +1323,9 @@ class HeaderMenuComponent {
|
|
|
1313
1323
|
}
|
|
1314
1324
|
}
|
|
1315
1325
|
}
|
|
1316
|
-
HeaderMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1317
|
-
HeaderMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.2", type: HeaderMenuComponent, selector: "tb-header-menu", inputs: { filter: "filter", metaData: "metaData" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<button mat-icon-button disableRipple [matMenuTriggerFor]=\"menu\" style=\"height:16px;\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n</button>\r\n<mat-menu #menu=\"matMenu\">\r\n <button mat-menu-item (click)=hideField(metaData.key)>\r\n <mat-icon color=\"primary\">visibility_off</mat-icon>\r\n <span>Hide Column</span>\r\n </button>\r\n <ng-form #myForm=\"ngForm\" [ngSwitch]=\"true\" (keydown.enter)=\"onEnter(myForm.value)\">\r\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"'header-column-' + metaData.key\" />\r\n <input type=\"hidden\" name=\"filterType\" [ngModel]=\"myFilterType\" />\r\n <input type=\"hidden\" name=\"key\" [ngModel]=\"metaData.key\" />\r\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"metaData.fieldType\" />\r\n\r\n <ng-container *ngIf=\"(myFilterType === FilterType.Or || myFilterType === FilterType.In); else defaultFilter\">\r\n <tb-in-list-filter name='filterValue' [key]='metaData.key' [(ngModel)]='myFilterValue' ></tb-in-list-filter>\r\n </ng-container>\r\n\r\n\r\n <ng-template #defaultFilter>\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Link || metaData.fieldType === FieldType.String || metaData.fieldType === FieldType.Array || metaData.fieldType === FieldType.Unknown || metaData.fieldType === FieldType.PhoneNumber\">\r\n <mat-form-field stop-propagation class=\"example-full-width font\" style=\"padding: 0 16px\">\r\n <mat-icon matPrefix class=\"search-icon\">search</mat-icon>\r\n <mat-label>{{myFilterType === FilterType.StringDoesNotContain ? 'Does Not Contain...' : 'Contains...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n <span matSuffix [matTooltip]=\"myFilterType === FilterType.StringDoesNotContain ? 'Contains' : 'Does Not Contain'\">\r\n <button mat-icon-button color=\"primary\" (click)=\"setStringFilterType()\">\r\n <mat-icon [ngClass]=\"{'chosen-icon': myFilterType === FilterType.StringDoesNotContain }\">\r\n block\r\n </mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Number || metaData.fieldType === FieldType.Currency\">\r\n <mat-form-field class=\"auto-width\" stop-propagation style=\"padding: 0 16px\">\r\n <mat-label>{{myFilterType === FilterType.NumberEquals ? 'Equals...' : myFilterType === FilterType.NumberLessThan ? 'Less Than...' : 'More Than...'}}</mat-label>\r\n <input matInput type='number' name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n <span matPrefix>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.NumberLessThan)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberLessThan }\">\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.NumberGreaterThan)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberGreaterThan }\">\r\n arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <span (click)=\"setFilterType(FilterType.NumberEquals)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberEquals }\">\r\n =</span>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Boolean\">\r\n <div style=\"padding: 0 16px\">\r\n <label>\r\n <mat-icon class=\"search-icon\">filter_list</mat-icon>\r\n </label>\r\n <mat-radio-group stop-propagation #ctrl=\"matRadioGroup\" #boolField='ngModel' class=\"font\" name=\"filterValue\" [ngModel]=\"myFilterValue\" >\r\n <mat-radio-button class=\"filter-radio-button\" (click)=\"myFilterValue = true;\" [value]=\"true\">True</mat-radio-button><br/>\r\n <mat-radio-button class=\"filter-radio-button\" (click)=\"myFilterValue = false\" [value]=\"false\">False</mat-radio-button><br/>\r\n </mat-radio-group>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Date\">\r\n <mat-form-field style=\"padding: 0 16px\" class=\"font auto-width\" stop-propagation >\r\n <span matPrefix>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.DateOnOrAfter)\" class=\"suffix-icons underline\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateOnOrAfter }\">\r\n arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.DateOnOrBefore)\" class=\"suffix-icons underline\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateOnOrBefore }\">\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <span (click)=\"setFilterType(FilterType.DateIsOn)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateIsOn }\">\r\n =</span>\r\n </button>\r\n </span>\r\n <mat-label>{{myFilterType === FilterType.DateIsOn ? 'On...' : \r\n myFilterType === FilterType.DateOnOrBefore ? 'On or Before...' : 'On or After...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" [matDatepicker]=\"calendar\"\r\n (click)=\"calendar.open()\"/>\r\n <mat-datepicker-toggle matSuffix [for]=\"calendar\" preventEnter></mat-datepicker-toggle>\r\n <mat-datepicker #calendar></mat-datepicker>\r\n </mat-form-field>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <button mat-button (click)=\"onEnter(myForm.value)\" [disabled]=\"myForm.value.filterValue == undefined\" disableRipple>\r\n Apply\r\n </button>\r\n </ng-form>\r\n</mat-menu>\r\n", styles: ["input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}::ng-deep .form-field .mat-form-field-wrapper{padding-bottom:4px!important;padding-top:4px!important;margin-bottom:5px!important}.menu-icon{font-size:16px;line-height:16px!important;vertical-align:top!important}.search-icon{margin-right:16px;vertical-align:middle;height:24px;color:#0000008a;font-size:21px;line-height:1.125}.font{font-size:14px}.filter-radio-button:first-of-type{padding-left:0}.filter-radio-button{padding:10px 40px;min-width:110px}::ng-deep .form-field.mat-form-field-appearance-outline .mat-form-field-infix{padding:5px 0;width:auto}::ng-deep .auto-width .mat-form-field-infix{width:auto}.suffix-icons{font-size:14px;margin-left:6px}mat-icon.chosen-icon.mat-icon.suffix-icons,.chosen-icon{font-size:20px;color:green}mat-icon.mat-icon.suffix-icons.underline{-webkit-text-decoration:underline .1px solid;text-decoration:underline .1px solid;transform:scaleX(.7)}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["key"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: i8.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i8.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: StopPropagationDirective, selector: "[stop-propagation]" }, { type: i6.MatPrefix, selector: "[matPrefix]" }, { type: i6.MatLabel, selector: "mat-label" }, { type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i6.MatSuffix, selector: "[matSuffix]" }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i7.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { type: i8.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1318
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1326
|
+
HeaderMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HeaderMenuComponent, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
1327
|
+
HeaderMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: HeaderMenuComponent, selector: "tb-header-menu", inputs: { filter: "filter", metaData: "metaData" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<button mat-icon-button disableRipple [matMenuTriggerFor]=\"menu\" style=\"height:16px;\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n</button>\r\n<mat-menu #menu=\"matMenu\">\r\n <button mat-menu-item (click)=hideField(metaData.key)>\r\n <mat-icon color=\"primary\">visibility_off</mat-icon>\r\n <span>Hide Column</span>\r\n </button>\r\n <ng-form #myForm=\"ngForm\" [ngSwitch]=\"true\" (keydown.enter)=\"onEnter(myForm.value)\">\r\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"'header-column-' + metaData.key\" />\r\n <input type=\"hidden\" name=\"filterType\" [ngModel]=\"myFilterType\" />\r\n <input type=\"hidden\" name=\"key\" [ngModel]=\"metaData.key\" />\r\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"metaData.fieldType\" />\r\n\r\n <ng-container *ngIf=\"(myFilterType === FilterType.Or || myFilterType === FilterType.In); else defaultFilter\">\r\n <tb-in-list-filter name='filterValue' [key]='metaData.key' [(ngModel)]='myFilterValue' ></tb-in-list-filter>\r\n </ng-container>\r\n\r\n\r\n <ng-template #defaultFilter>\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Link || metaData.fieldType === FieldType.String || metaData.fieldType === FieldType.Array || metaData.fieldType === FieldType.Unknown || metaData.fieldType === FieldType.PhoneNumber\">\r\n <mat-form-field stop-propagation class=\"example-full-width font\" style=\"padding: 0 16px\">\r\n <mat-icon matPrefix class=\"search-icon\">search</mat-icon>\r\n <mat-label>{{myFilterType === FilterType.StringDoesNotContain ? 'Does Not Contain...' : 'Contains...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n <span matSuffix [matTooltip]=\"myFilterType === FilterType.StringDoesNotContain ? 'Contains' : 'Does Not Contain'\">\r\n <button mat-icon-button color=\"primary\" (click)=\"setStringFilterType()\">\r\n <mat-icon [ngClass]=\"{'chosen-icon': myFilterType === FilterType.StringDoesNotContain }\">\r\n block\r\n </mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Number || metaData.fieldType === FieldType.Currency\">\r\n <mat-form-field class=\"auto-width\" stop-propagation style=\"padding: 0 16px\">\r\n <mat-label>{{myFilterType === FilterType.NumberEquals ? 'Equals...' : myFilterType === FilterType.NumberLessThan ? 'Less Than...' : 'More Than...'}}</mat-label>\r\n <input matInput type='number' name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n <span matPrefix>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.NumberLessThan)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberLessThan }\">\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.NumberGreaterThan)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberGreaterThan }\">\r\n arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <span (click)=\"setFilterType(FilterType.NumberEquals)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberEquals }\">\r\n =</span>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Boolean\">\r\n <div style=\"padding: 0 16px\">\r\n <label>\r\n <mat-icon class=\"search-icon\">filter_list</mat-icon>\r\n </label>\r\n <mat-radio-group stop-propagation #ctrl=\"matRadioGroup\" #boolField='ngModel' class=\"font\" name=\"filterValue\" [ngModel]=\"myFilterValue\" >\r\n <mat-radio-button class=\"filter-radio-button\" (click)=\"myFilterValue = true;\" [value]=\"true\">True</mat-radio-button><br/>\r\n <mat-radio-button class=\"filter-radio-button\" (click)=\"myFilterValue = false\" [value]=\"false\">False</mat-radio-button><br/>\r\n </mat-radio-group>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Date\">\r\n <mat-form-field style=\"padding: 0 16px\" class=\"font auto-width\" stop-propagation >\r\n <span matPrefix>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.DateOnOrAfter)\" class=\"suffix-icons underline\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateOnOrAfter }\">\r\n arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.DateOnOrBefore)\" class=\"suffix-icons underline\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateOnOrBefore }\">\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <span (click)=\"setFilterType(FilterType.DateIsOn)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateIsOn }\">\r\n =</span>\r\n </button>\r\n </span>\r\n <mat-label>{{myFilterType === FilterType.DateIsOn ? 'On...' : \r\n myFilterType === FilterType.DateOnOrBefore ? 'On or Before...' : 'On or After...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" [matDatepicker]=\"calendar\"\r\n (click)=\"calendar.open()\"/>\r\n <mat-datepicker-toggle matSuffix [for]=\"calendar\" preventEnter></mat-datepicker-toggle>\r\n <mat-datepicker #calendar></mat-datepicker>\r\n </mat-form-field>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <button mat-button (click)=\"onEnter(myForm.value)\" [disabled]=\"myForm.value.filterValue == undefined\" disableRipple>\r\n Apply\r\n </button>\r\n </ng-form>\r\n</mat-menu>\r\n", styles: ["input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}::ng-deep .form-field .mat-form-field-wrapper{padding-bottom:4px!important;padding-top:4px!important;margin-bottom:5px!important}.menu-icon{font-size:16px;line-height:16px!important;vertical-align:top!important}.search-icon{margin-right:16px;vertical-align:middle;height:24px;color:#0000008a;font-size:21px;line-height:1.125}.font{font-size:14px}.filter-radio-button:first-of-type{padding-left:0}.filter-radio-button{padding:10px 40px;min-width:110px}::ng-deep .form-field.mat-form-field-appearance-outline .mat-form-field-infix{padding:5px 0;width:auto}::ng-deep .auto-width .mat-form-field-infix{width:auto}.suffix-icons{font-size:14px;margin-left:6px}mat-icon.chosen-icon.mat-icon.suffix-icons,.chosen-icon{font-size:20px;color:green}mat-icon.mat-icon.suffix-icons.underline{-webkit-text-decoration:underline .1px solid;text-decoration:underline .1px solid;transform:scaleX(.7)}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["key"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: i8.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i8.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: StopPropagationDirective, selector: "[stop-propagation]" }, { type: i6.MatPrefix, selector: "[matPrefix]" }, { type: i6.MatLabel, selector: "mat-label" }, { type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i6.MatSuffix, selector: "[matSuffix]" }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i7.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { type: i8.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1328
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: HeaderMenuComponent, decorators: [{
|
|
1319
1329
|
type: Component,
|
|
1320
1330
|
args: [{ selector: 'tb-header-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button mat-icon-button disableRipple [matMenuTriggerFor]=\"menu\" style=\"height:16px;\" [matMenuTriggerRestoreFocus]=\"false\">\r\n <mat-icon class=\"menu-icon\">more_vert</mat-icon>\r\n</button>\r\n<mat-menu #menu=\"matMenu\">\r\n <button mat-menu-item (click)=hideField(metaData.key)>\r\n <mat-icon color=\"primary\">visibility_off</mat-icon>\r\n <span>Hide Column</span>\r\n </button>\r\n <ng-form #myForm=\"ngForm\" [ngSwitch]=\"true\" (keydown.enter)=\"onEnter(myForm.value)\">\r\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"'header-column-' + metaData.key\" />\r\n <input type=\"hidden\" name=\"filterType\" [ngModel]=\"myFilterType\" />\r\n <input type=\"hidden\" name=\"key\" [ngModel]=\"metaData.key\" />\r\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"metaData.fieldType\" />\r\n\r\n <ng-container *ngIf=\"(myFilterType === FilterType.Or || myFilterType === FilterType.In); else defaultFilter\">\r\n <tb-in-list-filter name='filterValue' [key]='metaData.key' [(ngModel)]='myFilterValue' ></tb-in-list-filter>\r\n </ng-container>\r\n\r\n\r\n <ng-template #defaultFilter>\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Link || metaData.fieldType === FieldType.String || metaData.fieldType === FieldType.Array || metaData.fieldType === FieldType.Unknown || metaData.fieldType === FieldType.PhoneNumber\">\r\n <mat-form-field stop-propagation class=\"example-full-width font\" style=\"padding: 0 16px\">\r\n <mat-icon matPrefix class=\"search-icon\">search</mat-icon>\r\n <mat-label>{{myFilterType === FilterType.StringDoesNotContain ? 'Does Not Contain...' : 'Contains...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n <span matSuffix [matTooltip]=\"myFilterType === FilterType.StringDoesNotContain ? 'Contains' : 'Does Not Contain'\">\r\n <button mat-icon-button color=\"primary\" (click)=\"setStringFilterType()\">\r\n <mat-icon [ngClass]=\"{'chosen-icon': myFilterType === FilterType.StringDoesNotContain }\">\r\n block\r\n </mat-icon>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Number || metaData.fieldType === FieldType.Currency\">\r\n <mat-form-field class=\"auto-width\" stop-propagation style=\"padding: 0 16px\">\r\n <mat-label>{{myFilterType === FilterType.NumberEquals ? 'Equals...' : myFilterType === FilterType.NumberLessThan ? 'Less Than...' : 'More Than...'}}</mat-label>\r\n <input matInput type='number' name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\r\n <span matPrefix>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.NumberLessThan)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberLessThan }\">\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.NumberGreaterThan)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberGreaterThan }\">\r\n arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <span (click)=\"setFilterType(FilterType.NumberEquals)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.NumberEquals }\">\r\n =</span>\r\n </button>\r\n </span>\r\n </mat-form-field>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Boolean\">\r\n <div style=\"padding: 0 16px\">\r\n <label>\r\n <mat-icon class=\"search-icon\">filter_list</mat-icon>\r\n </label>\r\n <mat-radio-group stop-propagation #ctrl=\"matRadioGroup\" #boolField='ngModel' class=\"font\" name=\"filterValue\" [ngModel]=\"myFilterValue\" >\r\n <mat-radio-button class=\"filter-radio-button\" (click)=\"myFilterValue = true;\" [value]=\"true\">True</mat-radio-button><br/>\r\n <mat-radio-button class=\"filter-radio-button\" (click)=\"myFilterValue = false\" [value]=\"false\">False</mat-radio-button><br/>\r\n </mat-radio-group>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"metaData.fieldType === FieldType.Date\">\r\n <mat-form-field style=\"padding: 0 16px\" class=\"font auto-width\" stop-propagation >\r\n <span matPrefix>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.DateOnOrAfter)\" class=\"suffix-icons underline\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateOnOrAfter }\">\r\n arrow_forward_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <mat-icon (click)=\"setFilterType(FilterType.DateOnOrBefore)\" class=\"suffix-icons underline\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateOnOrBefore }\">\r\n arrow_back_ios</mat-icon>\r\n </button>\r\n <button mat-icon-button disableRipple>\r\n <span (click)=\"setFilterType(FilterType.DateIsOn)\" class=\"suffix-icons\"\r\n [ngClass]=\"{'chosen-icon': myFilterType === FilterType.DateIsOn }\">\r\n =</span>\r\n </button>\r\n </span>\r\n <mat-label>{{myFilterType === FilterType.DateIsOn ? 'On...' : \r\n myFilterType === FilterType.DateOnOrBefore ? 'On or Before...' : 'On or After...'}}</mat-label>\r\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" [matDatepicker]=\"calendar\"\r\n (click)=\"calendar.open()\"/>\r\n <mat-datepicker-toggle matSuffix [for]=\"calendar\" preventEnter></mat-datepicker-toggle>\r\n <mat-datepicker #calendar></mat-datepicker>\r\n </mat-form-field>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <button mat-button (click)=\"onEnter(myForm.value)\" [disabled]=\"myForm.value.filterValue == undefined\" disableRipple>\r\n Apply\r\n </button>\r\n </ng-form>\r\n</mat-menu>\r\n", styles: ["input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}::ng-deep .form-field .mat-form-field-wrapper{padding-bottom:4px!important;padding-top:4px!important;margin-bottom:5px!important}.menu-icon{font-size:16px;line-height:16px!important;vertical-align:top!important}.search-icon{margin-right:16px;vertical-align:middle;height:24px;color:#0000008a;font-size:21px;line-height:1.125}.font{font-size:14px}.filter-radio-button:first-of-type{padding-left:0}.filter-radio-button{padding:10px 40px;min-width:110px}::ng-deep .form-field.mat-form-field-appearance-outline .mat-form-field-infix{padding:5px 0;width:auto}::ng-deep .auto-width .mat-form-field-infix{width:auto}.suffix-icons{font-size:14px;margin-left:6px}mat-icon.chosen-icon.mat-icon.suffix-icons,.chosen-icon{font-size:20px;color:green}mat-icon.mat-icon.suffix-icons.underline{-webkit-text-decoration:underline .1px solid;text-decoration:underline .1px solid;transform:scaleX(.7)}\n"] }]
|
|
1321
1331
|
}], ctorParameters: function () { return [{ type: TableStore }]; }, propDecorators: { filter: [{
|
|
@@ -1340,9 +1350,9 @@ class StylerDirective {
|
|
|
1340
1350
|
}
|
|
1341
1351
|
;
|
|
1342
1352
|
}
|
|
1343
|
-
StylerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1344
|
-
StylerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
1345
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1353
|
+
StylerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: StylerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1354
|
+
StylerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: StylerDirective, selector: "[styler]", inputs: { styler: "styler" }, ngImport: i0 });
|
|
1355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: StylerDirective, decorators: [{
|
|
1346
1356
|
type: Directive,
|
|
1347
1357
|
args: [{
|
|
1348
1358
|
selector: '[styler]',
|
|
@@ -1417,9 +1427,9 @@ class ResizeColumnDirective {
|
|
|
1417
1427
|
return ({ newTableWidth, newColumnWidth });
|
|
1418
1428
|
}
|
|
1419
1429
|
}
|
|
1420
|
-
ResizeColumnDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1421
|
-
ResizeColumnDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
1422
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1430
|
+
ResizeColumnDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ResizeColumnDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: TableStore }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1431
|
+
ResizeColumnDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: ResizeColumnDirective, selector: "[resizeColumn]", inputs: { resizable: ["resizeColumn", "resizable"], key: "key" }, ngImport: i0 });
|
|
1432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ResizeColumnDirective, decorators: [{
|
|
1423
1433
|
type: Directive,
|
|
1424
1434
|
args: [{
|
|
1425
1435
|
selector: "[resizeColumn]",
|
|
@@ -1440,9 +1450,9 @@ class ColumnTotalPipe {
|
|
|
1440
1450
|
return null;
|
|
1441
1451
|
}
|
|
1442
1452
|
}
|
|
1443
|
-
ColumnTotalPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1444
|
-
ColumnTotalPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
1445
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1453
|
+
ColumnTotalPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ColumnTotalPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
1454
|
+
ColumnTotalPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ColumnTotalPipe, name: "columnTotal" });
|
|
1455
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ColumnTotalPipe, decorators: [{
|
|
1446
1456
|
type: Pipe,
|
|
1447
1457
|
args: [{ name: 'columnTotal' }]
|
|
1448
1458
|
}] });
|
|
@@ -1502,9 +1512,9 @@ class ColumnBuilderComponent {
|
|
|
1502
1512
|
}
|
|
1503
1513
|
}
|
|
1504
1514
|
}
|
|
1505
|
-
ColumnBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1506
|
-
ColumnBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
1507
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1515
|
+
ColumnBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ColumnBuilderComponent, deps: [{ token: TransformCreator }, { token: i3$1.MatTable }, { token: TableStore }, { token: TableTemplateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1516
|
+
ColumnBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ColumnBuilderComponent, selector: "tb-column-builder", inputs: { metaData: "metaData", customCell: "customCell", data$: "data$" }, viewQueries: [{ propertyName: "columnDef", first: true, predicate: MatColumnDef, descendants: true }, { propertyName: "bodyTemplate", first: true, predicate: ["body"], descendants: true }], ngImport: i0, template: "<ng-container [matColumnDef]=\"metaData.key\" *ngrxLet=\"styles$ as styles\">\n\n <ng-template #body let-element='element' >\n <mat-cell [styler]='styles.body' (click)='cellClicked(element, metaData.key)'>\n <ng-container *ngTemplateOutlet=\"innerTemplate;context: {metaData: metaData, element: element, transform: transform }\">\n </ng-container>\n <span class=\"no-val\" *ngIf=\"metaData.fieldType !== FieldType.Expression && ( element[metaData.key] == null ) &&\n !((customCell && customCell.TemplateRef) || metaData.template)\">-</span>\n </mat-cell>\n </ng-template>\n\n <ng-template matHeaderCellDef #myHeader>\n\n <ng-container *ngIf=\"customCell?.columnDef?.headerCell;else header;\">\n <ng-container *ngTemplateOutlet=\"customCell.columnDef.headerCell.template; context: {metaData: metaData, styles: styles.header} \">\n </ng-container>\n </ng-container>\n\n <ng-template #header>\n\n <mat-header-cell [styler]='styles.header' [resizeColumn]=\"true\" [key]=\"metaData.key\" class=\"column-head\" #headref >\n <div class=\"header-container\">\n <div *ngIf=\"!metaData._internalNotUserDefined || !customCell?.columnDef?.cell ; else headerWithoutMenu\" mat-sort-header style=\"width: 100%\">\n {{ metaData.displayName ? metaData.displayName : ( metaData.key | spaceCase ) }}\n </div>\n <ng-template #headerWithoutMenu >\n <div *ngIf=\"metaData._internalNotUserDefined;\" style=\"width: 100%\">\n {{ metaData.displayName ? metaData.displayName : ( metaData.key | spaceCase ) }}\n </div>\n </ng-template>\n <tb-header-menu *ngIf=\"(!metaData._internalNotUserDefined || !customCell?.columnDef?.cell) && (!metaData.noFilter)\" #menu [metaData]='metaData' [filter]='filter' ></tb-header-menu>\n </div>\n </mat-header-cell>\n </ng-template>\n </ng-template>\n\n\n <ng-container *matCellDef=\"let element;\">\n <ng-container *ngTemplateOutlet=\"outerTemplate; context: {metaData: metaData, element: element , styles: styles.body }\">\n </ng-container>\n </ng-container>\n\n <ng-template matFooterCellDef>\n <ng-container *ngIf=\"customCell?.columnDef?.footerCell;else footer\">\n <ng-container\n *ngTemplateOutlet=\"customCell.columnDef.footerCell.template;context: {metaData: metaData, data: data$, styles : styles.footer }\">\n </ng-container>\n </ng-container>\n\n <ng-template #footer>\n <mat-footer-cell [styler]='styles.footer' *ngrxLet=\"data$ as data\">\n <span *ngIf=\"data?.length && metaData.additional?.footer\" [ngSwitch]=\"metaData.fieldType\" class=\"bold\">\n <span *ngSwitchCase=\"FieldType.Currency\">\n {{ data | columnTotal: metaData | currency }}\n </span>\n <span *ngSwitchCase=\"FieldType.Number\">\n {{ data | columnTotal: metaData | number }}\n </span>\n </span>\n </mat-footer-cell>\n </ng-template>\n </ng-template>\n</ng-container>\n", styles: [".header-container{display:flex;flex-direction:row;width:100%;align-items:center}.negative-currency{color:red}.column-head{position:relative}.bold{font-weight:900}\n"], components: [{ type: i1$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { type: HeaderMenuComponent, selector: "tb-header-menu", inputs: ["filter", "metaData"] }], directives: [{ type: i7$1.LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet"] }, { type: i3$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i3$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: StylerDirective, selector: "[styler]", inputs: ["styler"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i3$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: ResizeColumnDirective, selector: "[resizeColumn]", inputs: ["resizeColumn", "key"] }, { type: i3$1.MatCellDef, selector: "[matCellDef]" }, { type: i3$1.MatFooterCellDef, selector: "[matFooterCellDef]" }, { type: i3$1.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "spaceCase": SpaceCasePipe, "currency": i1.CurrencyPipe, "columnTotal": ColumnTotalPipe, "number": i1.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1517
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ColumnBuilderComponent, decorators: [{
|
|
1508
1518
|
type: Component,
|
|
1509
1519
|
args: [{ selector: 'tb-column-builder', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [matColumnDef]=\"metaData.key\" *ngrxLet=\"styles$ as styles\">\n\n <ng-template #body let-element='element' >\n <mat-cell [styler]='styles.body' (click)='cellClicked(element, metaData.key)'>\n <ng-container *ngTemplateOutlet=\"innerTemplate;context: {metaData: metaData, element: element, transform: transform }\">\n </ng-container>\n <span class=\"no-val\" *ngIf=\"metaData.fieldType !== FieldType.Expression && ( element[metaData.key] == null ) &&\n !((customCell && customCell.TemplateRef) || metaData.template)\">-</span>\n </mat-cell>\n </ng-template>\n\n <ng-template matHeaderCellDef #myHeader>\n\n <ng-container *ngIf=\"customCell?.columnDef?.headerCell;else header;\">\n <ng-container *ngTemplateOutlet=\"customCell.columnDef.headerCell.template; context: {metaData: metaData, styles: styles.header} \">\n </ng-container>\n </ng-container>\n\n <ng-template #header>\n\n <mat-header-cell [styler]='styles.header' [resizeColumn]=\"true\" [key]=\"metaData.key\" class=\"column-head\" #headref >\n <div class=\"header-container\">\n <div *ngIf=\"!metaData._internalNotUserDefined || !customCell?.columnDef?.cell ; else headerWithoutMenu\" mat-sort-header style=\"width: 100%\">\n {{ metaData.displayName ? metaData.displayName : ( metaData.key | spaceCase ) }}\n </div>\n <ng-template #headerWithoutMenu >\n <div *ngIf=\"metaData._internalNotUserDefined;\" style=\"width: 100%\">\n {{ metaData.displayName ? metaData.displayName : ( metaData.key | spaceCase ) }}\n </div>\n </ng-template>\n <tb-header-menu *ngIf=\"(!metaData._internalNotUserDefined || !customCell?.columnDef?.cell) && (!metaData.noFilter)\" #menu [metaData]='metaData' [filter]='filter' ></tb-header-menu>\n </div>\n </mat-header-cell>\n </ng-template>\n </ng-template>\n\n\n <ng-container *matCellDef=\"let element;\">\n <ng-container *ngTemplateOutlet=\"outerTemplate; context: {metaData: metaData, element: element , styles: styles.body }\">\n </ng-container>\n </ng-container>\n\n <ng-template matFooterCellDef>\n <ng-container *ngIf=\"customCell?.columnDef?.footerCell;else footer\">\n <ng-container\n *ngTemplateOutlet=\"customCell.columnDef.footerCell.template;context: {metaData: metaData, data: data$, styles : styles.footer }\">\n </ng-container>\n </ng-container>\n\n <ng-template #footer>\n <mat-footer-cell [styler]='styles.footer' *ngrxLet=\"data$ as data\">\n <span *ngIf=\"data?.length && metaData.additional?.footer\" [ngSwitch]=\"metaData.fieldType\" class=\"bold\">\n <span *ngSwitchCase=\"FieldType.Currency\">\n {{ data | columnTotal: metaData | currency }}\n </span>\n <span *ngSwitchCase=\"FieldType.Number\">\n {{ data | columnTotal: metaData | number }}\n </span>\n </span>\n </mat-footer-cell>\n </ng-template>\n </ng-template>\n</ng-container>\n", styles: [".header-container{display:flex;flex-direction:row;width:100%;align-items:center}.negative-currency{color:red}.column-head{position:relative}.bold{font-weight:900}\n"] }]
|
|
1510
1520
|
}], ctorParameters: function () { return [{ type: TransformCreator }, { type: i3$1.MatTable }, { type: TableStore }, { type: TableTemplateService }]; }, propDecorators: { metaData: [{
|
|
@@ -1580,16 +1590,16 @@ class PaginatorComponent {
|
|
|
1580
1590
|
}
|
|
1581
1591
|
}
|
|
1582
1592
|
}
|
|
1583
|
-
PaginatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1584
|
-
PaginatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
1593
|
+
PaginatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PaginatorComponent, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
1594
|
+
PaginatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: PaginatorComponent, selector: "tb-paginator", inputs: { dataSource: "dataSource", tableElRef: "tableElRef", data$: "data$" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], ngImport: i0, template: `
|
|
1585
1595
|
<div [ngClass]="{'hide' : !(collapseFooter$ | async), 'page-amounts':true}" *ngIf="currentPageData$ | async as pageData">
|
|
1586
1596
|
{{pageData.currentStart}} - {{pageData.currentEnd}} of {{pageData.total}}
|
|
1587
1597
|
</div>
|
|
1588
1598
|
<mat-paginator [pageSizeOptions]="[5, 10, 20, 50, 100, 500]" showFirstLastButtons (page)="paginatorChange()"
|
|
1589
1599
|
[ngClass]="{'hide' : (collapseFooter$ | async)}">
|
|
1590
1600
|
</mat-paginator>
|
|
1591
|
-
`, isInline: true, styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto
|
|
1592
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1601
|
+
`, isInline: true, styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff}:host::ng-deep .mat-paginator-container{min-height:initial!important}:host::ng-deep .mat-paginator-container .mat-form-field-infix{padding:0!important}\n", ".collapse-icon{font-size:16px;height:16px;padding-bottom:.2rem;color:#3f51b5}.collapse-icon.header{align-self:flex-end}.collapse-icon.footer{align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}\n"], components: [{ type: i2$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1602
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
1593
1603
|
type: Component,
|
|
1594
1604
|
args: [{ selector: 'tb-paginator', template: `
|
|
1595
1605
|
<div [ngClass]="{'hide' : !(collapseFooter$ | async), 'page-amounts':true}" *ngIf="currentPageData$ | async as pageData">
|
|
@@ -1598,7 +1608,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImpor
|
|
|
1598
1608
|
<mat-paginator [pageSizeOptions]="[5, 10, 20, 50, 100, 500]" showFirstLastButtons (page)="paginatorChange()"
|
|
1599
1609
|
[ngClass]="{'hide' : (collapseFooter$ | async)}">
|
|
1600
1610
|
</mat-paginator>
|
|
1601
|
-
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto
|
|
1611
|
+
`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff}:host::ng-deep .mat-paginator-container{min-height:initial!important}:host::ng-deep .mat-paginator-container .mat-form-field-infix{padding:0!important}\n", ".collapse-icon{font-size:16px;height:16px;padding-bottom:.2rem;color:#3f51b5}.collapse-icon.header{align-self:flex-end}.collapse-icon.footer{align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}\n"] }]
|
|
1602
1612
|
}], ctorParameters: function () { return [{ type: TableStore }]; }, propDecorators: { dataSource: [{
|
|
1603
1613
|
type: Input
|
|
1604
1614
|
}], tableElRef: [{
|
|
@@ -1725,11 +1735,11 @@ class GenericTableComponent {
|
|
|
1725
1735
|
this.selection.select(...this.dataSource.data);
|
|
1726
1736
|
}
|
|
1727
1737
|
}
|
|
1728
|
-
GenericTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1729
|
-
GenericTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
1730
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1738
|
+
GenericTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: GenericTableComponent, deps: [{ token: i1$1.MatSort }, { token: TableStore }, { token: i0.ComponentFactoryResolver }, { token: i0.ViewContainerRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
1739
|
+
GenericTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: GenericTableComponent, selector: "tb-generic-table", inputs: { data$: "data$", IndexColumn: "IndexColumn", SelectionColumn: "SelectionColumn", trackBy: "trackBy", rows: "rows", isSticky: "isSticky", columnBuilders: "columnBuilders", columnInfos: "columnInfos" }, outputs: { selection$: "selection$" }, viewQueries: [{ propertyName: "table", first: true, predicate: MatTable, descendants: true, static: true }, { propertyName: "tableElRef", first: true, predicate: ["table"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<mat-table #table [dataSource]=\"dataSource\" [trackBy]='trackByFunction' [styler]=\"tableWidth | async\">\n\n <ng-container matColumnDef=\"select\">\n\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" style=\"flex: 0 0 30px;\" >\n <mat-checkbox (change)=\"$event ? masterToggle() : null\"\n [checked]=\"!!(masterToggleChecked$ | async)\"\n [indeterminate]=\"masterToggleIndeterminate$ | async\">\n </mat-checkbox>\n </mat-header-cell>\n\n <mat-cell *matCellDef=\"let row\" style=\"flex: 0 0 30px;\">\n <mat-checkbox (click)=\"$event.stopPropagation()\"\n (change)=\"$event ? selection.toggle(row) : null\"\n [checked]=\"selection.isSelected(row)\">\n </mat-checkbox>\n </mat-cell>\n\n <mat-footer-cell *matFooterCellDef style=\"flex: 0 0 30px;\">\n {{ selection.selected.length }}\n </mat-footer-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"index\">\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" >#</mat-header-cell>\n <mat-cell *matCellDef=\"let i = index;\"> {{ (tbPaginator.paginator.pageIndex * tbPaginator.paginator.pageSize) + i + 1 }} </mat-cell>\n <mat-footer-cell *matFooterCellDef></mat-footer-cell>\n\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"keys; sticky: isSticky\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: keys; let i = index\"></mat-row>\n <mat-footer-row *matFooterRowDef=\"keys\"></mat-footer-row>\n\n</mat-table>\n\n<div class=\"flx-row-end sticky\">\n <tb-paginator [dataSource]=\"dataSource\" [tableElRef]=\"tableElRef\" #tbPaginator\n [data$]=\"data$\"></tb-paginator>\n\n <mat-icon [matTooltip]=\"(collapseFooter$ | async) ? 'expand' : 'collapse'\" class=\"collapse-icon footer\" (click)=\"state.toggleCollapseFooter()\">\n {{(collapseFooter$ | async) ? 'expand_more' : 'expand_less'}}\n </mat-icon>\n\n</div>\n\n", styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff}:host::ng-deep .mat-paginator-container{min-height:initial!important}:host::ng-deep .mat-paginator-container .mat-form-field-infix{padding:0!important}\n", ".collapse-icon{font-size:16px;height:16px;padding-bottom:.2rem;color:#3f51b5}.collapse-icon.header{align-self:flex-end}.collapse-icon.footer{align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}\n"], components: [{ type: i3$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i2.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$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i3$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i3$1.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { type: PaginatorComponent, selector: "tb-paginator", inputs: ["dataSource", "tableElRef", "data$"] }, { type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: StylerDirective, selector: "[styler]", inputs: ["styler"] }, { type: i3$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i3$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i3$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i3$1.MatCellDef, selector: "[matCellDef]" }, { type: i3$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i3$1.MatFooterCellDef, selector: "[matFooterCellDef]" }, { type: i3$1.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { type: i3$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i3$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i3$1.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1740
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: GenericTableComponent, decorators: [{
|
|
1731
1741
|
type: Component,
|
|
1732
|
-
args: [{ selector: 'tb-generic-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-table #table [dataSource]=\"dataSource\" [trackBy]='trackByFunction' [styler]=\"tableWidth | async\">\n\n <ng-container matColumnDef=\"select\">\n\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" style=\"flex: 0 0 30px;\" >\n <mat-checkbox (change)=\"$event ? masterToggle() : null\"\n [checked]=\"!!(masterToggleChecked$ | async)\"\n [indeterminate]=\"masterToggleIndeterminate$ | async\">\n </mat-checkbox>\n </mat-header-cell>\n\n <mat-cell *matCellDef=\"let row\" style=\"flex: 0 0 30px;\">\n <mat-checkbox (click)=\"$event.stopPropagation()\"\n (change)=\"$event ? selection.toggle(row) : null\"\n [checked]=\"selection.isSelected(row)\">\n </mat-checkbox>\n </mat-cell>\n\n <mat-footer-cell *matFooterCellDef style=\"flex: 0 0 30px;\">\n {{ selection.selected.length }}\n </mat-footer-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"index\">\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" >#</mat-header-cell>\n <mat-cell *matCellDef=\"let i = index;\"> {{ (tbPaginator.paginator.pageIndex * tbPaginator.paginator.pageSize) + i + 1 }} </mat-cell>\n <mat-footer-cell *matFooterCellDef></mat-footer-cell>\n\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"keys; sticky: isSticky\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: keys; let i = index\"></mat-row>\n <mat-footer-row *matFooterRowDef=\"keys\"></mat-footer-row>\n\n</mat-table>\n\n<div class=\"flx-row-end sticky\">\n <tb-paginator [dataSource]=\"dataSource\" [tableElRef]=\"tableElRef\" #tbPaginator\n [data$]=\"data$\"></tb-paginator>\n\n <mat-icon [matTooltip]=\"(collapseFooter$ | async) ? 'expand' : 'collapse'\" class=\"collapse-icon footer\" (click)=\"state.toggleCollapseFooter()\">\n {{(collapseFooter$ | async) ? 'expand_more' : 'expand_less'}}\n </mat-icon>\n\n</div>\n\n", styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto
|
|
1742
|
+
args: [{ selector: 'tb-generic-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-table #table [dataSource]=\"dataSource\" [trackBy]='trackByFunction' [styler]=\"tableWidth | async\">\n\n <ng-container matColumnDef=\"select\">\n\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" style=\"flex: 0 0 30px;\" >\n <mat-checkbox (change)=\"$event ? masterToggle() : null\"\n [checked]=\"!!(masterToggleChecked$ | async)\"\n [indeterminate]=\"masterToggleIndeterminate$ | async\">\n </mat-checkbox>\n </mat-header-cell>\n\n <mat-cell *matCellDef=\"let row\" style=\"flex: 0 0 30px;\">\n <mat-checkbox (click)=\"$event.stopPropagation()\"\n (change)=\"$event ? selection.toggle(row) : null\"\n [checked]=\"selection.isSelected(row)\">\n </mat-checkbox>\n </mat-cell>\n\n <mat-footer-cell *matFooterCellDef style=\"flex: 0 0 30px;\">\n {{ selection.selected.length }}\n </mat-footer-cell>\n </ng-container>\n\n <ng-container matColumnDef=\"index\">\n <mat-header-cell *matHeaderCellDef class=\"f-mat-header-cell\" >#</mat-header-cell>\n <mat-cell *matCellDef=\"let i = index;\"> {{ (tbPaginator.paginator.pageIndex * tbPaginator.paginator.pageSize) + i + 1 }} </mat-cell>\n <mat-footer-cell *matFooterCellDef></mat-footer-cell>\n\n </ng-container>\n\n <mat-header-row *matHeaderRowDef=\"keys; sticky: isSticky\"></mat-header-row>\n <mat-row *matRowDef=\"let row; columns: keys; let i = index\"></mat-row>\n <mat-footer-row *matFooterRowDef=\"keys\"></mat-footer-row>\n\n</mat-table>\n\n<div class=\"flx-row-end sticky\">\n <tb-paginator [dataSource]=\"dataSource\" [tableElRef]=\"tableElRef\" #tbPaginator\n [data$]=\"data$\"></tb-paginator>\n\n <mat-icon [matTooltip]=\"(collapseFooter$ | async) ? 'expand' : 'collapse'\" class=\"collapse-icon footer\" (click)=\"state.toggleCollapseFooter()\">\n {{(collapseFooter$ | async) ? 'expand_more' : 'expand_less'}}\n </mat-icon>\n\n</div>\n\n", styles: [".mat-table{overflow:auto}.mat-row:nth-child(odd){background-color:#cdeefe}.sticky{bottom:0px;position:sticky;border-top:.5px solid rgba(0,0,0,.12)}.page-amounts{color:#0000008a;font-family:Roboto,Helvetica Neue,sans-serif;font-size:12px;margin-right:.2rem}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;background-color:#fff}:host::ng-deep .mat-paginator-container{min-height:initial!important}:host::ng-deep .mat-paginator-container .mat-form-field-infix{padding:0!important}\n", ".collapse-icon{font-size:16px;height:16px;padding-bottom:.2rem;color:#3f51b5}.collapse-icon.header{align-self:flex-end}.collapse-icon.footer{align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}\n"] }]
|
|
1733
1743
|
}], ctorParameters: function () { return [{ type: i1$1.MatSort }, { type: TableStore }, { type: i0.ComponentFactoryResolver }, { type: i0.ViewContainerRef }, { type: i0.Injector }]; }, propDecorators: { data$: [{
|
|
1734
1744
|
type: Input
|
|
1735
1745
|
}], IndexColumn: [{
|
|
@@ -1786,9 +1796,9 @@ class CustomCellDirective {
|
|
|
1786
1796
|
};
|
|
1787
1797
|
}
|
|
1788
1798
|
}
|
|
1789
|
-
CustomCellDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1790
|
-
CustomCellDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
1791
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1799
|
+
CustomCellDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CustomCellDirective, deps: [{ token: i0.TemplateRef, optional: true }, { token: i1$2.CdkColumnDef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1800
|
+
CustomCellDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: CustomCellDirective, selector: "[customCell]", inputs: { customCell: "customCell", displayName: "displayName", preSort: "preSort", TemplateRef: "TemplateRef", customCellOrder: "customCellOrder", customCellWidth: "customCellWidth" }, ngImport: i0 });
|
|
1801
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CustomCellDirective, decorators: [{
|
|
1792
1802
|
type: Directive,
|
|
1793
1803
|
args: [{
|
|
1794
1804
|
selector: '[customCell]',
|
|
@@ -1836,11 +1846,11 @@ class GenColDisplayerComponent {
|
|
|
1836
1846
|
this.tableState.setHiddenColumns(displayCols.map(c => ({ key: c.key, visible: c.isVisible })));
|
|
1837
1847
|
}
|
|
1838
1848
|
}
|
|
1839
|
-
GenColDisplayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1840
|
-
GenColDisplayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
1841
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1849
|
+
GenColDisplayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: GenColDisplayerComponent, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
1850
|
+
GenColDisplayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: GenColDisplayerComponent, selector: "tb-col-displayer", ngImport: i0, template: "<ng-container *ngIf=\"columns$ | async as displayCols\">\n <span matTooltip=\"Show/hide columns\">\n <button mat-icon-button [matMenuTriggerFor]=\"menu\">\n <mat-icon color=\"primary\">visibility_off</mat-icon>\n </button>\n </span>\n <mat-menu #menu=\"matMenu\" class=\"my-mat-menu\">\n\n <button mat-menu-item>\n <div style=\"display: flex; flex-direction: row-reverse;\">\n <span matTooltip=\"Close\">\n <button class=\"filter-button\" mat-icon-button>\n <mat-icon>close</mat-icon>\n </button>\n </span>\n </div>\n </button>\n <button mat-menu-item stop-propagation>\n <div style=\"display: flex; justify-content: space-between;\">\n <span matTooltip=\"Show all columns\">\n <button mat-icon-button (click)=\"reset(displayCols)\">\n <mat-icon color=\"primary\">done_all</mat-icon>\n </button>\n </span>\n\n <span matTooltip=\"Hide all columns\">\n <button mat-icon-button (click)=\"unset(displayCols)\">\n <mat-icon color=\"primary\">cancel</mat-icon>\n </button>\n </span>\n </div>\n </button>\n\n <div cdkDropList (cdkDropListDropped)=\"drop($event)\" stop-propagation [cdkDropListLockAxis]=\"'y'\">\n <button [class.isHidden]=\"!col.isVisible\" stop-propagation mat-menu-item cdkDrag [cdkDragData]=\"col\"\n *ngFor=\"let col of displayCols\">\n <div (click)=\"col.isVisible = !col.isVisible; emit(displayCols)\" style=\"display: flex; justify-content: space-between; align-items: center;\">\n <p class=\"label\" style=\"display: flex;\">\n {{col.displayName || (col.key | spaceCase) }}\n </p>\n <span matTooltip=\"Hide Column\" class=\"show-hide\" *ngIf=\"col.isVisible; else hidden\">\n <button mat-icon-button>\n <mat-icon color=\"primary\">check_box</mat-icon>\n </button>\n </span>\n\n <ng-template #hidden >\n <span matTooltip=\"Show Column\" class=\"show-hide\">\n <button mat-icon-button>\n <mat-icon>indeterminate_check_box</mat-icon>\n </button>\n </span>\n </ng-template>\n\n </div>\n </button>\n </div>\n </mat-menu>\n</ng-container>\n", styles: [".show-hide{margin-left:15px}.label{color:#6495ed;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-align:left;margin:0;font-size:17px;font-weight:700;display:inline-block;width:66%}.row{margin:0;padding:0}.isHidden{background-color:#d3d3d3;color:#a9a9a9;font-weight:700;font-size:17px;white-space:nowrap}.filter-button{margin-top:10px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: StopPropagationDirective, selector: "[stop-propagation]" }, { type: i8$2.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: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8$2.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: { "async": i1.AsyncPipe, "spaceCase": SpaceCasePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1851
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: GenColDisplayerComponent, decorators: [{
|
|
1842
1852
|
type: Component,
|
|
1843
|
-
args: [{ selector: 'tb-col-displayer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"columns$ | async as displayCols\">\n <span matTooltip=\"Show/hide columns\"
|
|
1853
|
+
args: [{ selector: 'tb-col-displayer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"columns$ | async as displayCols\">\n <span matTooltip=\"Show/hide columns\">\n <button mat-icon-button [matMenuTriggerFor]=\"menu\">\n <mat-icon color=\"primary\">visibility_off</mat-icon>\n </button>\n </span>\n <mat-menu #menu=\"matMenu\" class=\"my-mat-menu\">\n\n <button mat-menu-item>\n <div style=\"display: flex; flex-direction: row-reverse;\">\n <span matTooltip=\"Close\">\n <button class=\"filter-button\" mat-icon-button>\n <mat-icon>close</mat-icon>\n </button>\n </span>\n </div>\n </button>\n <button mat-menu-item stop-propagation>\n <div style=\"display: flex; justify-content: space-between;\">\n <span matTooltip=\"Show all columns\">\n <button mat-icon-button (click)=\"reset(displayCols)\">\n <mat-icon color=\"primary\">done_all</mat-icon>\n </button>\n </span>\n\n <span matTooltip=\"Hide all columns\">\n <button mat-icon-button (click)=\"unset(displayCols)\">\n <mat-icon color=\"primary\">cancel</mat-icon>\n </button>\n </span>\n </div>\n </button>\n\n <div cdkDropList (cdkDropListDropped)=\"drop($event)\" stop-propagation [cdkDropListLockAxis]=\"'y'\">\n <button [class.isHidden]=\"!col.isVisible\" stop-propagation mat-menu-item cdkDrag [cdkDragData]=\"col\"\n *ngFor=\"let col of displayCols\">\n <div (click)=\"col.isVisible = !col.isVisible; emit(displayCols)\" style=\"display: flex; justify-content: space-between; align-items: center;\">\n <p class=\"label\" style=\"display: flex;\">\n {{col.displayName || (col.key | spaceCase) }}\n </p>\n <span matTooltip=\"Hide Column\" class=\"show-hide\" *ngIf=\"col.isVisible; else hidden\">\n <button mat-icon-button>\n <mat-icon color=\"primary\">check_box</mat-icon>\n </button>\n </span>\n\n <ng-template #hidden >\n <span matTooltip=\"Show Column\" class=\"show-hide\">\n <button mat-icon-button>\n <mat-icon>indeterminate_check_box</mat-icon>\n </button>\n </span>\n </ng-template>\n\n </div>\n </button>\n </div>\n </mat-menu>\n</ng-container>\n", styles: [".show-hide{margin-left:15px}.label{color:#6495ed;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-align:left;margin:0;font-size:17px;font-weight:700;display:inline-block;width:66%}.row{margin:0;padding:0}.isHidden{background-color:#d3d3d3;color:#a9a9a9;font-weight:700;font-size:17px;white-space:nowrap}.filter-button{margin-top:10px}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
|
|
1844
1854
|
}], ctorParameters: function () { return [{ type: TableStore }]; } });
|
|
1845
1855
|
|
|
1846
1856
|
class WrapperFilterStore extends ComponentStore {
|
|
@@ -1858,9 +1868,9 @@ class WrapperFilterStore extends ComponentStore {
|
|
|
1858
1868
|
});
|
|
1859
1869
|
}
|
|
1860
1870
|
}
|
|
1861
|
-
WrapperFilterStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1862
|
-
WrapperFilterStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
1863
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1871
|
+
WrapperFilterStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: WrapperFilterStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1872
|
+
WrapperFilterStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: WrapperFilterStore });
|
|
1873
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: WrapperFilterStore, decorators: [{
|
|
1864
1874
|
type: Injectable
|
|
1865
1875
|
}], ctorParameters: function () { return []; } });
|
|
1866
1876
|
|
|
@@ -1874,9 +1884,9 @@ class GenFilterDisplayerComponent {
|
|
|
1874
1884
|
this.filterStore.addFilter({ key: metaData.key, fieldType: metaData.fieldType });
|
|
1875
1885
|
}
|
|
1876
1886
|
}
|
|
1877
|
-
GenFilterDisplayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
1878
|
-
GenFilterDisplayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
1879
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
1887
|
+
GenFilterDisplayerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: GenFilterDisplayerComponent, deps: [{ token: TableStore }, { token: WrapperFilterStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
1888
|
+
GenFilterDisplayerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: GenFilterDisplayerComponent, selector: "tb-filter-displayer", ngImport: i0, template: "<button stop-propagation class=\"filter-button\" mat-icon-button [matMenuTriggerFor]=\"menu\" matTooltip=\"Add Filter\">\n <mat-icon class=\"filter-icon\" color=\"primary\">filter_list</mat-icon>\n</button>\n<mat-menu #menu=\"matMenu\">\n <button class=\"filter-labels\" *ngFor=\"let md of filterCols$ | async\" (click)=\"addFilter(md)\" mat-menu-item>\n {{md.displayName || (md.key | spaceCase)}}\n </button>\n</mat-menu>\n", styles: [".filter{margin:15px;display:inline-block}.filter-button{color:#6495ed;font-size:22px;font-weight:700}.cancel-button{font-size:24px;font-weight:700;height:initial;line-height:initial}.filter-wrapper{margin-top:1em;margin-bottom:1em;float:right}.menu{margin-bottom:10px;width:109.1%}.filter-labels{color:#6495ed;font-size:17px;font-weight:600}.float{position:absolute;width:-moz-fit-content;width:fit-content;z-index:101;top:10px;right:180px;max-width:90vw}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: StopPropagationDirective, selector: "[stop-propagation]" }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i1.AsyncPipe, "spaceCase": SpaceCasePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1889
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: GenFilterDisplayerComponent, decorators: [{
|
|
1880
1890
|
type: Component,
|
|
1881
1891
|
args: [{ selector: 'tb-filter-displayer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button stop-propagation class=\"filter-button\" mat-icon-button [matMenuTriggerFor]=\"menu\" matTooltip=\"Add Filter\">\n <mat-icon class=\"filter-icon\" color=\"primary\">filter_list</mat-icon>\n</button>\n<mat-menu #menu=\"matMenu\">\n <button class=\"filter-labels\" *ngFor=\"let md of filterCols$ | async\" (click)=\"addFilter(md)\" mat-menu-item>\n {{md.displayName || (md.key | spaceCase)}}\n </button>\n</mat-menu>\n", styles: [".filter{margin:15px;display:inline-block}.filter-button{color:#6495ed;font-size:22px;font-weight:700}.cancel-button{font-size:24px;font-weight:700;height:initial;line-height:initial}.filter-wrapper{margin-top:1em;margin-bottom:1em;float:right}.menu{margin-bottom:10px;width:109.1%}.filter-labels{color:#6495ed;font-size:17px;font-weight:600}.float{position:absolute;width:-moz-fit-content;width:fit-content;z-index:101;top:10px;right:180px;max-width:90vw}\n"] }]
|
|
1882
1892
|
}], ctorParameters: function () { return [{ type: TableStore }, { type: WrapperFilterStore }]; } });
|
|
@@ -2063,9 +2073,9 @@ class AutoFocusDirective {
|
|
|
2063
2073
|
}
|
|
2064
2074
|
}
|
|
2065
2075
|
}
|
|
2066
|
-
AutoFocusDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2067
|
-
AutoFocusDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
2068
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2076
|
+
AutoFocusDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AutoFocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
2077
|
+
AutoFocusDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: AutoFocusDirective, selector: "[autoFocus]", inputs: { autoFocus: "autoFocus" }, ngImport: i0 });
|
|
2078
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AutoFocusDirective, decorators: [{
|
|
2069
2079
|
type: Directive,
|
|
2070
2080
|
args: [{
|
|
2071
2081
|
selector: '[autoFocus]'
|
|
@@ -2116,13 +2126,13 @@ class InFilterComponent {
|
|
|
2116
2126
|
this.onChange(this.value);
|
|
2117
2127
|
}
|
|
2118
2128
|
}
|
|
2119
|
-
InFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2120
|
-
InFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2129
|
+
InFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InFilterComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2130
|
+
InFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InFilterComponent, selector: "lib-in-filter", inputs: { type: "type" }, providers: [{
|
|
2121
2131
|
provide: NG_VALUE_ACCESSOR,
|
|
2122
2132
|
useExisting: InFilterComponent,
|
|
2123
2133
|
multi: true
|
|
2124
2134
|
}], ngImport: i0, template: "<div class=inline>\n <div *ngFor=\"let val of value; index as i\">\n <input *ngIf=\"type === FieldType.Number || type === FieldType.Currency\"\n [ngModel]=\"val\" (ngModelChange)=\"onValueChange(i,$event)\"\n [readonly]=\"i+1 < value.length\" type=\"number\" [ngModelOptions]=\"{standalone:true}\" [autoFocus]=\"i === value.length - 1\"/>\n <input *ngIf=\"type !== FieldType.Number && type !== FieldType.Currency\"\n [ngModel]=\"val\" (ngModelChange)=\"onValueChange(i,$event)\"\n [readonly]=\"i+1 < value.length\" type=\"string\" [ngModelOptions]=\"{standalone:true}\"\n #input [autoFocus]=\"i === value.length - 1\" />\n <button [disabled]=\"value.length <= 1\" (click)=\"removeInput(i)\">-</button>\n <button *ngIf=\"i === value.length - 1\" [disabled]=\"val == undefined || val === ''\" (click)=\"addInput()\">+</button>\n </div>\n</div>\n", styles: [".inline{display:inline-block}\n"], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: AutoFocusDirective, selector: "[autoFocus]", inputs: ["autoFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2125
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2135
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InFilterComponent, decorators: [{
|
|
2126
2136
|
type: Component,
|
|
2127
2137
|
args: [{ selector: 'lib-in-filter', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{
|
|
2128
2138
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -2139,9 +2149,9 @@ class NumberFilterComponent {
|
|
|
2139
2149
|
this.FieldType = FieldType;
|
|
2140
2150
|
}
|
|
2141
2151
|
}
|
|
2142
|
-
NumberFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2143
|
-
NumberFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2152
|
+
NumberFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NumberFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2153
|
+
NumberFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NumberFilterComponent, selector: "tb-number-filter", inputs: { CurrentFilterType: "CurrentFilterType", info: "info" }, ngImport: i0, template: "<ng-container *ngIf=\"CurrentFilterType !== FilterType.NumberBetween && CurrentFilterType !== FilterType.IsNull && CurrentFilterType !== FilterType.In\">\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"filterValue\" [ngModel]=\"info.filterValue\" type=\"number\"/>\n </mat-form-field>\n</ng-container>\n\n\n<ng-container *ngIf=\"CurrentFilterType === FilterType.NumberBetween\">\n <ng-container ngModelGroup=\"filterValue\" >\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"Start\" [ngModel]=\"info.filterValue?.Start\" placeholder=\"Start\" type=\"number\"/>\n </mat-form-field>\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"End\" [ngModel]=\"info.filterValue?.End\" placeholder=\"End\" type=\"number\"/>\n </mat-form-field>\n </ng-container>\n</ng-container>\n\n<div class=\"inline\" *ngIf=\"CurrentFilterType === FilterType.In\">\n <lib-in-filter name='filterValue' [type]=\"FieldType.Number\" [(ngModel)]='info.filterValue' ></lib-in-filter>\n</div>\n", styles: [".switch{display:inline-block}.my-filter{margin-right:15px}.inline{display:inline-block}\n"], components: [{ type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2154
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NumberFilterComponent, decorators: [{
|
|
2145
2155
|
type: Component,
|
|
2146
2156
|
args: [{ selector: 'tb-number-filter', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<ng-container *ngIf=\"CurrentFilterType !== FilterType.NumberBetween && CurrentFilterType !== FilterType.IsNull && CurrentFilterType !== FilterType.In\">\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"filterValue\" [ngModel]=\"info.filterValue\" type=\"number\"/>\n </mat-form-field>\n</ng-container>\n\n\n<ng-container *ngIf=\"CurrentFilterType === FilterType.NumberBetween\">\n <ng-container ngModelGroup=\"filterValue\" >\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"Start\" [ngModel]=\"info.filterValue?.Start\" placeholder=\"Start\" type=\"number\"/>\n </mat-form-field>\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"End\" [ngModel]=\"info.filterValue?.End\" placeholder=\"End\" type=\"number\"/>\n </mat-form-field>\n </ng-container>\n</ng-container>\n\n<div class=\"inline\" *ngIf=\"CurrentFilterType === FilterType.In\">\n <lib-in-filter name='filterValue' [type]=\"FieldType.Number\" [(ngModel)]='info.filterValue' ></lib-in-filter>\n</div>\n", styles: [".switch{display:inline-block}.my-filter{margin-right:15px}.inline{display:inline-block}\n"] }]
|
|
2147
2157
|
}], propDecorators: { CurrentFilterType: [{
|
|
@@ -2155,9 +2165,9 @@ class DateFilterComponent {
|
|
|
2155
2165
|
this.FilterType = FilterType;
|
|
2156
2166
|
}
|
|
2157
2167
|
}
|
|
2158
|
-
DateFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2159
|
-
DateFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2160
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2168
|
+
DateFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DateFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2169
|
+
DateFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: DateFilterComponent, selector: "tb-date-filter", inputs: { info: "info", CurrentFilterType: "CurrentFilterType" }, ngImport: i0, template: "<ng-container *ngIf=\"CurrentFilterType !== FilterType.DateBetween && CurrentFilterType !== FilterType.IsNull\">\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"filterValue\" [ngModel]=\"info.filterValue\" [matDatepicker]=\"cal\"/>\n <mat-datepicker-toggle matSuffix [for]=\"cal\" preventEnter></mat-datepicker-toggle>\n <mat-datepicker #cal></mat-datepicker>\n </mat-form-field>\n</ng-container>\n\n<ng-container *ngIf=\"CurrentFilterType === FilterType.DateBetween\">\n <ng-container ngModelGroup=\"filterValue\">\n <mat-form-field class=\"my-filter\" >\n <input matInput name=\"Start\" [ngModel]=\"info.filterValue?.Start\" placeholder=\"From\" [matDatepicker]=\"fromVal\"\n (click)=\"fromVal.open()\"/>\n <mat-datepicker-toggle matSuffix [for]=\"fromVal\" preventEnter></mat-datepicker-toggle>\n <mat-datepicker #fromVal></mat-datepicker>\n </mat-form-field>\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"End\" [ngModel]=\"info.filterValue?.End\" placeholder=\"To\" [matDatepicker]=\"toVal\" (click)=\"toVal.open()\"/>\n <mat-datepicker-toggle matSuffix [for]=\"toVal\" preventEnter></mat-datepicker-toggle>\n <mat-datepicker #toVal></mat-datepicker>\n </mat-form-field>\n </ng-container>\n</ng-container>\n\n", components: [{ type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i8.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i8.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i5.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: i8.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6.MatSuffix, selector: "[matSuffix]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2170
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DateFilterComponent, decorators: [{
|
|
2161
2171
|
type: Component,
|
|
2162
2172
|
args: [{ selector: 'tb-date-filter', changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<ng-container *ngIf=\"CurrentFilterType !== FilterType.DateBetween && CurrentFilterType !== FilterType.IsNull\">\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"filterValue\" [ngModel]=\"info.filterValue\" [matDatepicker]=\"cal\"/>\n <mat-datepicker-toggle matSuffix [for]=\"cal\" preventEnter></mat-datepicker-toggle>\n <mat-datepicker #cal></mat-datepicker>\n </mat-form-field>\n</ng-container>\n\n<ng-container *ngIf=\"CurrentFilterType === FilterType.DateBetween\">\n <ng-container ngModelGroup=\"filterValue\">\n <mat-form-field class=\"my-filter\" >\n <input matInput name=\"Start\" [ngModel]=\"info.filterValue?.Start\" placeholder=\"From\" [matDatepicker]=\"fromVal\"\n (click)=\"fromVal.open()\"/>\n <mat-datepicker-toggle matSuffix [for]=\"fromVal\" preventEnter></mat-datepicker-toggle>\n <mat-datepicker #fromVal></mat-datepicker>\n </mat-form-field>\n <mat-form-field class=\"my-filter\">\n <input matInput name=\"End\" [ngModel]=\"info.filterValue?.End\" placeholder=\"To\" [matDatepicker]=\"toVal\" (click)=\"toVal.open()\"/>\n <mat-datepicker-toggle matSuffix [for]=\"toVal\" preventEnter></mat-datepicker-toggle>\n <mat-datepicker #toVal></mat-datepicker>\n </mat-form-field>\n </ng-container>\n</ng-container>\n\n" }]
|
|
2163
2173
|
}], propDecorators: { info: [{
|
|
@@ -2186,9 +2196,9 @@ class FilterComponent {
|
|
|
2186
2196
|
}
|
|
2187
2197
|
}
|
|
2188
2198
|
}
|
|
2189
|
-
FilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2190
|
-
FilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2191
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2199
|
+
FilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterComponent, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
2200
|
+
FilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: FilterComponent, selector: "tb-filter", inputs: { filter: "filter" }, outputs: { close: "close" }, ngImport: i0, template: "<mat-card class=\"mat-elevation-z5\" *ngIf=\"filter\">\n <form #form=\"ngForm\" (keydown.enter)=\"onEnter(form.value,$event)\" (keydown.escape)=\"close.emit()\">\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"filter.filterId\" />\n <input type=\"hidden\" name=\"key\" [ngModel]=\"filter.key\" />\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"filter.fieldType\" />\n <div class=\"row\" >\n <h4 class=\"filter-name\">{{(filter.key | spaceCase)}} Filter</h4>\n <button class=\"cancel-button\" color=\"primary\" mat-icon-button (click)=\"close.emit();\" type=\"button\"\n matTooltip=\"Close\">\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\n </button>\n </div>\n <div class=\"row\">\n <mat-form-field class=\"my-filter\" >\n <mat-select placeholder=\"Select Filter Type\" name=\"filterType\" [(ngModel)]=\"currentFilterType\" >\n <mat-option *ngFor=\"let kvp of filterTypes[filter.fieldType] | keyvalue \" [value]=\"$any(kvp.value)[0]\">\n {{ kvp.key }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <ng-container [ngSwitch]=\"true\">\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.String || filter.fieldType === FieldType.Array || filter.fieldType === FieldType.Link ||\n filter.fieldType === FieldType.Unknown || filter.fieldType === FieldType.PhoneNumber\" >\n <ng-container *ngTemplateOutlet=\"String\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.Number || filter.fieldType === FieldType.Currency\">\n <tb-number-filter [info]=\"filter\" [CurrentFilterType]=\"currentFilterType!\" ></tb-number-filter>\n </ng-container>\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.Boolean\">\n <ng-container *ngTemplateOutlet=\"Boolean\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.Date\">\n <tb-date-filter [info]=\"filter\" [CurrentFilterType]=\"currentFilterType!\"></tb-date-filter>\n </ng-container>\n <ng-container *ngSwitchCase='filter.fieldType === FieldType.Enum' >\n <ng-container *ngTemplateOutlet=\"Enum\"></ng-container>\n </ng-container>\n </ng-container>\n\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\" *ngIf=\"currentFilterType === FilterType.IsNull\">\n <mat-radio-button [value]=\"true\">True</mat-radio-button>\n <mat-radio-button [value]=\"false\">False</mat-radio-button>\n </mat-radio-group>\n\n </div>\n <button mat-button (click)=\"state.addFilter(form.value)\" disableRipple [disabled]=\"form.value.filterValue==undefined || !form.value.filterType\">\n Apply\n </button>\n\n\n<ng-template #String>\n <mat-form-field class=\"my-filter\" *ngIf=\"currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In\">\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\n </mat-form-field>\n <ng-container *ngIf=\"currentFilterType === FilterType.In\">\n <lib-in-filter [type]=\"FieldType.String\" name='filterValue' [(ngModel)]=\"filter.filterValue\" ></lib-in-filter>\n </ng-container>\n</ng-template>\n\n<ng-template #Boolean >\n <div class=\"switch\" [ngSwitch]=\"currentFilterType\">\n <div class=\"switch\" *ngSwitchCase=\"FilterType.BooleanEquals\">\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\" >\n <mat-radio-button [value]=\"true\" preventEnter>True</mat-radio-button>\n <mat-radio-button [value]=\"false\" preventEnter>False</mat-radio-button>\n </mat-radio-group>\n </div>\n </div>\n</ng-template>\n\n <ng-template #Enum>\n <ng-container *ngIf='currentFilterType === FilterType.In' >\n <tb-in-list-filter [key]='filter.key' name='filterValue' [(ngModel)]='filter.filterValue' ></tb-in-list-filter>\n </ng-container>\n </ng-template>\n\n </form>\n</mat-card>\n", styles: [".filter-name{color:#6495ed;margin-right:30px;font-weight:600;display:inline-block}.switch{display:inline-block}.my-filter{margin-right:15px}.cancel-button{float:right}.row{margin:0}.cancel-button{font-size:18px;font-weight:700}mat-radio-button{margin:5px}\n"], components: [{ type: i2$2.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { 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.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i6$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i7$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: NumberFilterComponent, selector: "tb-number-filter", inputs: ["CurrentFilterType", "info"] }, { type: DateFilterComponent, selector: "tb-date-filter", inputs: ["info", "CurrentFilterType"] }, { type: i7.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: InFilterComponent, selector: "lib-in-filter", inputs: ["type"] }, { type: InListFilterComponent, selector: "tb-in-list-filter", inputs: ["key"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }], pipes: { "spaceCase": SpaceCasePipe, "keyvalue": i1.KeyValuePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2201
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterComponent, decorators: [{
|
|
2192
2202
|
type: Component,
|
|
2193
2203
|
args: [{ selector: 'tb-filter', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card class=\"mat-elevation-z5\" *ngIf=\"filter\">\n <form #form=\"ngForm\" (keydown.enter)=\"onEnter(form.value,$event)\" (keydown.escape)=\"close.emit()\">\n <input type=\"hidden\" name=\"filterId\" [ngModel]=\"filter.filterId\" />\n <input type=\"hidden\" name=\"key\" [ngModel]=\"filter.key\" />\n <input type=\"hidden\" name=\"fieldType\" [ngModel]=\"filter.fieldType\" />\n <div class=\"row\" >\n <h4 class=\"filter-name\">{{(filter.key | spaceCase)}} Filter</h4>\n <button class=\"cancel-button\" color=\"primary\" mat-icon-button (click)=\"close.emit();\" type=\"button\"\n matTooltip=\"Close\">\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\n </button>\n </div>\n <div class=\"row\">\n <mat-form-field class=\"my-filter\" >\n <mat-select placeholder=\"Select Filter Type\" name=\"filterType\" [(ngModel)]=\"currentFilterType\" >\n <mat-option *ngFor=\"let kvp of filterTypes[filter.fieldType] | keyvalue \" [value]=\"$any(kvp.value)[0]\">\n {{ kvp.key }}\n </mat-option>\n </mat-select>\n </mat-form-field>\n <ng-container [ngSwitch]=\"true\">\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.String || filter.fieldType === FieldType.Array || filter.fieldType === FieldType.Link ||\n filter.fieldType === FieldType.Unknown || filter.fieldType === FieldType.PhoneNumber\" >\n <ng-container *ngTemplateOutlet=\"String\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.Number || filter.fieldType === FieldType.Currency\">\n <tb-number-filter [info]=\"filter\" [CurrentFilterType]=\"currentFilterType!\" ></tb-number-filter>\n </ng-container>\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.Boolean\">\n <ng-container *ngTemplateOutlet=\"Boolean\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"filter.fieldType === FieldType.Date\">\n <tb-date-filter [info]=\"filter\" [CurrentFilterType]=\"currentFilterType!\"></tb-date-filter>\n </ng-container>\n <ng-container *ngSwitchCase='filter.fieldType === FieldType.Enum' >\n <ng-container *ngTemplateOutlet=\"Enum\"></ng-container>\n </ng-container>\n </ng-container>\n\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\" *ngIf=\"currentFilterType === FilterType.IsNull\">\n <mat-radio-button [value]=\"true\">True</mat-radio-button>\n <mat-radio-button [value]=\"false\">False</mat-radio-button>\n </mat-radio-group>\n\n </div>\n <button mat-button (click)=\"state.addFilter(form.value)\" disableRipple [disabled]=\"form.value.filterValue==undefined || !form.value.filterType\">\n Apply\n </button>\n\n\n<ng-template #String>\n <mat-form-field class=\"my-filter\" *ngIf=\"currentFilterType !== FilterType.IsNull && currentFilterType !== FilterType.In\">\n <input matInput name=\"filterValue\" [ngModel]=\"filter.filterValue\" />\n </mat-form-field>\n <ng-container *ngIf=\"currentFilterType === FilterType.In\">\n <lib-in-filter [type]=\"FieldType.String\" name='filterValue' [(ngModel)]=\"filter.filterValue\" ></lib-in-filter>\n </ng-container>\n</ng-template>\n\n<ng-template #Boolean >\n <div class=\"switch\" [ngSwitch]=\"currentFilterType\">\n <div class=\"switch\" *ngSwitchCase=\"FilterType.BooleanEquals\">\n <mat-radio-group name=\"filterValue\" [ngModel]=\"filter.filterValue\" >\n <mat-radio-button [value]=\"true\" preventEnter>True</mat-radio-button>\n <mat-radio-button [value]=\"false\" preventEnter>False</mat-radio-button>\n </mat-radio-group>\n </div>\n </div>\n</ng-template>\n\n <ng-template #Enum>\n <ng-container *ngIf='currentFilterType === FilterType.In' >\n <tb-in-list-filter [key]='filter.key' name='filterValue' [(ngModel)]='filter.filterValue' ></tb-in-list-filter>\n </ng-container>\n </ng-template>\n\n </form>\n</mat-card>\n", styles: [".filter-name{color:#6495ed;margin-right:30px;font-weight:600;display:inline-block}.switch{display:inline-block}.my-filter{margin-right:15px}.cancel-button{float:right}.row{margin:0}.cancel-button{font-size:18px;font-weight:700}mat-radio-button{margin:5px}\n"] }]
|
|
2194
2204
|
}], ctorParameters: function () { return [{ type: TableStore }]; }, propDecorators: { filter: [{
|
|
@@ -2199,8 +2209,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImpor
|
|
|
2199
2209
|
|
|
2200
2210
|
class MaterialModule {
|
|
2201
2211
|
}
|
|
2202
|
-
MaterialModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2203
|
-
MaterialModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.
|
|
2212
|
+
MaterialModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
2213
|
+
MaterialModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MaterialModule, imports: [MatSlideToggleModule,
|
|
2204
2214
|
MatTableModule,
|
|
2205
2215
|
MatSelectModule,
|
|
2206
2216
|
MatDialogModule,
|
|
@@ -2259,7 +2269,7 @@ MaterialModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
|
|
|
2259
2269
|
MatPaginatorModule,
|
|
2260
2270
|
MatChipsModule,
|
|
2261
2271
|
MatDialogModule] });
|
|
2262
|
-
MaterialModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.
|
|
2272
|
+
MaterialModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MaterialModule, imports: [[
|
|
2263
2273
|
MatSlideToggleModule,
|
|
2264
2274
|
MatTableModule,
|
|
2265
2275
|
MatSelectModule,
|
|
@@ -2320,7 +2330,7 @@ MaterialModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
|
|
|
2320
2330
|
MatPaginatorModule,
|
|
2321
2331
|
MatChipsModule,
|
|
2322
2332
|
MatDialogModule] });
|
|
2323
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2333
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MaterialModule, decorators: [{
|
|
2324
2334
|
type: NgModule,
|
|
2325
2335
|
args: [{
|
|
2326
2336
|
imports: [
|
|
@@ -2411,11 +2421,11 @@ class MultiSortDirective extends MatSort {
|
|
|
2411
2421
|
});
|
|
2412
2422
|
}
|
|
2413
2423
|
}
|
|
2414
|
-
MultiSortDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2415
|
-
MultiSortDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
2424
|
+
MultiSortDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MultiSortDirective, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Directive });
|
|
2425
|
+
MultiSortDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: MultiSortDirective, selector: "[multiSort]", inputs: { disabled: ["matSortDisabled", "disabled"] }, providers: [
|
|
2416
2426
|
{ provide: MatSort, useExisting: MultiSortDirective }
|
|
2417
2427
|
], exportAs: ["multiSort"], usesInheritance: true, ngImport: i0 });
|
|
2418
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2428
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MultiSortDirective, decorators: [{
|
|
2419
2429
|
type: Directive,
|
|
2420
2430
|
args: [{
|
|
2421
2431
|
selector: '[multiSort]',
|
|
@@ -2485,7 +2495,7 @@ class ExportToCsvService {
|
|
|
2485
2495
|
val = this.transform(val, dateFormat);
|
|
2486
2496
|
break;
|
|
2487
2497
|
case FieldType.String:
|
|
2488
|
-
const prepend = meta.additional?.export?.prepend || '';
|
|
2498
|
+
const prepend = meta.additional?.export?.prepend || this.config?.export?.prepend || '';
|
|
2489
2499
|
val = prepend + val;
|
|
2490
2500
|
break;
|
|
2491
2501
|
case FieldType.Array:
|
|
@@ -2510,9 +2520,9 @@ class ExportToCsvService {
|
|
|
2510
2520
|
return this.datePipe.transform(val, dateFormat);
|
|
2511
2521
|
}
|
|
2512
2522
|
}
|
|
2513
|
-
ExportToCsvService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2514
|
-
ExportToCsvService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
2515
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2523
|
+
ExportToCsvService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ExportToCsvService, deps: [{ token: TableStore }, { token: TableBuilderConfigToken }, { token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2524
|
+
ExportToCsvService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ExportToCsvService });
|
|
2525
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ExportToCsvService, decorators: [{
|
|
2516
2526
|
type: Injectable
|
|
2517
2527
|
}], ctorParameters: function () { return [{ type: TableStore }, { type: undefined, decorators: [{
|
|
2518
2528
|
type: Inject,
|
|
@@ -2569,9 +2579,9 @@ class KeyDisplayPipe {
|
|
|
2569
2579
|
return this.tableState.getMetaData$(key).pipe(map(metaData => metaData.displayName || spaceCase(key)));
|
|
2570
2580
|
}
|
|
2571
2581
|
}
|
|
2572
|
-
KeyDisplayPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2573
|
-
KeyDisplayPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
2574
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2582
|
+
KeyDisplayPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: KeyDisplayPipe, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2583
|
+
KeyDisplayPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: KeyDisplayPipe, name: "keyDisplay" });
|
|
2584
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: KeyDisplayPipe, decorators: [{
|
|
2575
2585
|
type: Pipe,
|
|
2576
2586
|
args: [{ name: 'keyDisplay' }]
|
|
2577
2587
|
}], ctorParameters: function () { return [{ type: TableStore }]; } });
|
|
@@ -2584,9 +2594,9 @@ class FormatFilterTypePipe {
|
|
|
2584
2594
|
return filterType;
|
|
2585
2595
|
}
|
|
2586
2596
|
}
|
|
2587
|
-
FormatFilterTypePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2588
|
-
FormatFilterTypePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
2589
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2597
|
+
FormatFilterTypePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FormatFilterTypePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2598
|
+
FormatFilterTypePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FormatFilterTypePipe, name: "formatFilterType" });
|
|
2599
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FormatFilterTypePipe, decorators: [{
|
|
2590
2600
|
type: Pipe,
|
|
2591
2601
|
args: [{ name: 'formatFilterType' }]
|
|
2592
2602
|
}] });
|
|
@@ -2622,9 +2632,9 @@ class FormatFilterValuePipe {
|
|
|
2622
2632
|
}));
|
|
2623
2633
|
}
|
|
2624
2634
|
}
|
|
2625
|
-
FormatFilterValuePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2626
|
-
FormatFilterValuePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.
|
|
2627
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2635
|
+
FormatFilterValuePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FormatFilterValuePipe, deps: [{ token: TableStore }, { token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Pipe });
|
|
2636
|
+
FormatFilterValuePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FormatFilterValuePipe, name: "formatFilterValue" });
|
|
2637
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FormatFilterValuePipe, decorators: [{
|
|
2628
2638
|
type: Pipe,
|
|
2629
2639
|
args: [{ name: 'formatFilterValue' }]
|
|
2630
2640
|
}], ctorParameters: function () { return [{ type: TableStore }, { type: i1.DatePipe }]; } });
|
|
@@ -2646,11 +2656,11 @@ class FilterChipsComponent {
|
|
|
2646
2656
|
this.filterStore.clearAll();
|
|
2647
2657
|
}
|
|
2648
2658
|
}
|
|
2649
|
-
FilterChipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2650
|
-
FilterChipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2651
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2659
|
+
FilterChipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterChipsComponent, deps: [{ token: TableStore }, { token: WrapperFilterStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
2660
|
+
FilterChipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: FilterChipsComponent, selector: "lib-filter-list", ngImport: i0, template: "<div style=\"display: flex; flex-direction: row;justify-content: flex-end;\" *ngrxLet=\"currentFilters$ as currentFilters\" >\n\n <button class=\"cancel-button\" *ngIf=\"currentFilters.length\" mat-icon-button (click)=\"clearAll()\"\n matTooltip=\"Close all Filters\">\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\n </button>\n\n\n <div *ngIf=\"currentFilters.length\" class=\"float\">\n <div class=\"filter\" *ngFor=\"let filter of (currentFilters$ | async); index as i;\">\n <tb-filter [filter]=\"filter\" (close)=\"deleteByIndex(i)\" > </tb-filter>\n </div>\n </div>\n\n <mat-chip-list *ngrxLet=\"filters$ as filters\">\n <mat-chip *ngFor=\"let filter of filters\" (dblclick)=\"addFilter(filter)\" (removed)=\"tableState.removeFilter(filter.filterId!)\">\n {{ filter.key | keyDisplay | async }} {{filter.filterType | formatFilterType : filter.filterValue}} {{ filter.filterValue | formatFilterValue: filter.key : filter.filterType | async }}\n <mat-icon matChipRemove>cancel</mat-icon>\n </mat-chip>\n <mat-chip *ngIf=\"filters.length >= 2\" (removed)=\"tableState.clearFilters()\">\n Clear All\n <mat-icon matChipRemove>cancel</mat-icon>\n </mat-chip>\n </mat-chip-list>\n\n</div>\n", styles: [".filter{margin:15px;display:inline-block}.filter-button{color:#6495ed;font-size:22px;font-weight:700}.cancel-button{font-size:24px;font-weight:700;height:initial;line-height:initial}.filter-wrapper{margin-top:1em;margin-bottom:1em;float:right}.menu{margin-bottom:10px;width:109.1%}.filter-labels{color:#6495ed;font-size:17px;font-weight:600}.float{position:absolute;width:-moz-fit-content;width:fit-content;z-index:101;top:10px;right:180px;max-width:90vw}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: FilterComponent, selector: "tb-filter", inputs: ["filter"], outputs: ["close"] }, { type: i6$2.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }], directives: [{ type: i7$1.LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$2.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: i6$2.MatChipRemove, selector: "[matChipRemove]" }], pipes: { "async": i1.AsyncPipe, "keyDisplay": KeyDisplayPipe, "formatFilterType": FormatFilterTypePipe, "formatFilterValue": FormatFilterValuePipe } });
|
|
2661
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: FilterChipsComponent, decorators: [{
|
|
2652
2662
|
type: Component,
|
|
2653
|
-
args: [{ selector: 'lib-filter-list', template: "<div style=\"display: flex; flex-direction: row;justify-content: flex-end;\" *ngrxLet=\"currentFilters$ as currentFilters\" >\n\n <button class=\"cancel-button
|
|
2663
|
+
args: [{ selector: 'lib-filter-list', template: "<div style=\"display: flex; flex-direction: row;justify-content: flex-end;\" *ngrxLet=\"currentFilters$ as currentFilters\" >\n\n <button class=\"cancel-button\" *ngIf=\"currentFilters.length\" mat-icon-button (click)=\"clearAll()\"\n matTooltip=\"Close all Filters\">\n <mat-icon class=\"cancel-button\" color=\"primary\">close</mat-icon>\n </button>\n\n\n <div *ngIf=\"currentFilters.length\" class=\"float\">\n <div class=\"filter\" *ngFor=\"let filter of (currentFilters$ | async); index as i;\">\n <tb-filter [filter]=\"filter\" (close)=\"deleteByIndex(i)\" > </tb-filter>\n </div>\n </div>\n\n <mat-chip-list *ngrxLet=\"filters$ as filters\">\n <mat-chip *ngFor=\"let filter of filters\" (dblclick)=\"addFilter(filter)\" (removed)=\"tableState.removeFilter(filter.filterId!)\">\n {{ filter.key | keyDisplay | async }} {{filter.filterType | formatFilterType : filter.filterValue}} {{ filter.filterValue | formatFilterValue: filter.key : filter.filterType | async }}\n <mat-icon matChipRemove>cancel</mat-icon>\n </mat-chip>\n <mat-chip *ngIf=\"filters.length >= 2\" (removed)=\"tableState.clearFilters()\">\n Clear All\n <mat-icon matChipRemove>cancel</mat-icon>\n </mat-chip>\n </mat-chip-list>\n\n</div>\n", styles: [".filter{margin:15px;display:inline-block}.filter-button{color:#6495ed;font-size:22px;font-weight:700}.cancel-button{font-size:24px;font-weight:700;height:initial;line-height:initial}.filter-wrapper{margin-top:1em;margin-bottom:1em;float:right}.menu{margin-bottom:10px;width:109.1%}.filter-labels{color:#6495ed;font-size:17px;font-weight:600}.float{position:absolute;width:-moz-fit-content;width:fit-content;z-index:101;top:10px;right:180px;max-width:90vw}\n"] }]
|
|
2654
2664
|
}], ctorParameters: function () { return [{ type: TableStore }, { type: WrapperFilterStore }]; } });
|
|
2655
2665
|
|
|
2656
2666
|
class SortMenuComponentStore extends ComponentStore {
|
|
@@ -2680,9 +2690,9 @@ class SortMenuComponentStore extends ComponentStore {
|
|
|
2680
2690
|
};
|
|
2681
2691
|
}
|
|
2682
2692
|
}
|
|
2683
|
-
SortMenuComponentStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2684
|
-
SortMenuComponentStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
2685
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2693
|
+
SortMenuComponentStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SortMenuComponentStore, deps: [{ token: TableStore }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2694
|
+
SortMenuComponentStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SortMenuComponentStore });
|
|
2695
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SortMenuComponentStore, decorators: [{
|
|
2686
2696
|
type: Injectable
|
|
2687
2697
|
}], ctorParameters: function () { return [{ type: TableStore }]; } });
|
|
2688
2698
|
const equalSortArray = (arr1, arr2) => arr1.length === arr2.length && arr2.every(s1 => arr1.some(s2 => s1.active === s2.active));
|
|
@@ -2737,11 +2747,11 @@ class SortMenuComponent {
|
|
|
2737
2747
|
this.store.setDirection(sort);
|
|
2738
2748
|
}
|
|
2739
2749
|
}
|
|
2740
|
-
SortMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2741
|
-
SortMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2742
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2750
|
+
SortMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SortMenuComponent, deps: [{ token: TableStore }, { token: SortMenuComponentStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
2751
|
+
SortMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SortMenuComponent, selector: "tb-sort-menu", providers: [SortMenuComponentStore], ngImport: i0, template: "<ng-container *ngrxLet=\"dirty$ as dirty\">\n<ng-container *ngIf=\"sorted$ | async as sorted\">\n <ng-container *ngIf=\"notSorted$ | async as notSorted\">\n <!-- Menu Trigger -->\n <span matTooltip=\"Sort\">\n <button mat-icon-button [matMenuTriggerFor]=\"menu\">\n <mat-icon color=\"primary\">swap_vert</mat-icon>\n </button>\n </span>\n\n <!-- Menu -->\n <mat-menu #menu=\"matMenu\" class=\"my-mat-menu\" (closed)=\"reset()\">\n <div mat-menu-item class=\"menu-button\">\n <div class=\"close-button-wrapper\">\n <span matTooltip=\"Close\">\n <mat-icon>close</mat-icon>\n </span>\n <span *ngIf=\"dirty\" matTooltip=\"Undo\" stop-propagation (click)=\"reset()\">\n <mat-icon>undo</mat-icon>\n </span>\n </div>\n </div>\n\n <!-- Apply Button -->\n <div class=\"apply-button-wrapper\">\n <button mat-button color=\"primary\" (click)=\"apply(null)\"\n stop-propagation [class.apply-border]=\"dirty\"\n [disabled]=\"!dirty\">\n Apply\n <ng-container *ngIf=\"dirty\">Unsaved Changes</ng-container>\n </button>\n </div>\n\n <!-- Default Sorting Text -->\n <div *ngIf=\"!sorted.length\" class=\"tip\" >\n Sorting List\n </div>\n\n <!-- Sorted Menu List -->\n <div class=\"list\"\n cdkDropList\n #sortedGroup=\"cdkDropList\"\n [cdkDropListConnectedTo]=\"[notSortedGroup]\"\n [cdkDropListData]=\"sorted\"\n (cdkDropListDropped)=\"dropIntoSorted($event)\">\n\n <!-- Menu Item Wrapper -->\n <ng-container *ngFor=\"let sort of sorted;let i=index\">\n\n <!-- Menu Item Headers -->\n <span *ngIf=\"sorted.length > 1 && i === 0 \" class=\"description\" class=\"sort-header\">First By</span>\n <span *ngIf=\"sorted.length > 1 && i !== 0 \" class=\"description\" class=\"sort-header\">Then By</span>\n\n <!-- Menu Item -->\n <div mat-menu-item cdkDrag class=\"menu-item\">\n <div class=\"sort-item\">\n <span class=\"sorted-name\">\n {{sort.displayName || (sort.active | spaceCase)}}\n <span class=\"direction-text\">{{sort.direction}}</span>\n </span>\n\n <!-- Sort Direction Buttons -->\n <div class=\"up-down-buttons-wrapper\">\n <button class=\"up-down-button up-button\" stop-propagation\n (click)=\"setDirection({active:sort.active,direction:SortDirection.asc,displayName:sort.displayName})\">\n <mat-icon [ngClass]=\"sort.direction !== SortDirection.asc ? 'light-arrow' : 'dark-arrow'\" class=\"up-down-icon\">\n arrow_upward\n </mat-icon>\n </button>\n\n <button class=\"up-down-button\" stop-propagation\n (click)=\"setDirection({active:sort.active,direction:SortDirection.desc,displayName:sort.displayName})\">\n <mat-icon [ngClass]=\"sort.direction === SortDirection.asc ? 'light-arrow' : 'dark-arrow'\" class=\"up-down-icon\">\n arrow_downward\n </mat-icon>\n </button>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n\n <!-- Default Not Sorted Text -->\n <div *ngIf=\"!notSorted.length\" class=\"tip\" >\n Not Sorted List\n </div>\n <!-- Not Sorted Menu List -->\n <div class=\"list\"\n cdkDropList\n #notSortedGroup=\"cdkDropList\"\n [cdkDropListConnectedTo]=\"[sortedGroup]\"\n [cdkDropListData]=\"notSorted\"\n (cdkDropListDropped)=\"dropIntoNotSorted($event)\">\n <div mat-menu-item *ngFor=\"let sort of notSorted\" class=\"menu-item\" cdkDrag>\n <span class=\"not-sorted-name\">{{sort.displayName || (sort.active | spaceCase)}}</span>\n </div>\n </div>\n </mat-menu>\n </ng-container>\n</ng-container>\n</ng-container>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.list{padding:5px 2px;border-bottom:solid 1px #ccc;color:#000000de;background:white}.light-arrow{color:#93b1ea78}.dark-arrow{color:#224e9c}.up-down-button{background-color:#fff;border-radius:30%;border-color:#0ff;padding:1px 1px 0;border-width:.5px;cursor:pointer}.mat-icon.up-down-icon{margin-right:0;font-size:20px;font-weight:lighter}.sort-item{display:flex;align-items:center;justify-content:space-between}.up-down-buttons-wrapper{margin-left:2rem}.up-button{margin-right:.3rem}.mat-menu-item.menu-item,.mat-menu-item.menu-button{padding:0 3px;font-size:17px;font-weight:700;line-height:25px;height:30px}.mat-menu-item.menu-item{cursor:move}.sorted-name{color:#224e9c}.not-sorted-name{color:#93b1ea}.apply-border{border:#224e9c solid .5px}.apply-border:hover{background-color:#faebd7}.apply-button-wrapper{display:grid;justify-content:center}.sort-header{font-size:10px;font-style:italic}.tip{padding:0 3px;color:#d3d3d3}.direction-text{font-size:small;font-weight:400}.close-button-wrapper{display:flex;flex-direction:row-reverse}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i7$1.LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: StopPropagationDirective, selector: "[stop-propagation]" }, { type: i8$2.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: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8$2.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: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1.AsyncPipe, "spaceCase": SpaceCasePipe } });
|
|
2752
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SortMenuComponent, decorators: [{
|
|
2743
2753
|
type: Component,
|
|
2744
|
-
args: [{ selector: 'tb-sort-menu', providers: [SortMenuComponentStore], template: "<ng-container *ngrxLet=\"dirty$ as dirty\">\n<ng-container *ngIf=\"sorted$ | async as sorted\">\n <ng-container *ngIf=\"notSorted$ | async as notSorted\">\n <!-- Menu Trigger -->\n <span matTooltip=\"Sort\"
|
|
2754
|
+
args: [{ selector: 'tb-sort-menu', providers: [SortMenuComponentStore], template: "<ng-container *ngrxLet=\"dirty$ as dirty\">\n<ng-container *ngIf=\"sorted$ | async as sorted\">\n <ng-container *ngIf=\"notSorted$ | async as notSorted\">\n <!-- Menu Trigger -->\n <span matTooltip=\"Sort\">\n <button mat-icon-button [matMenuTriggerFor]=\"menu\">\n <mat-icon color=\"primary\">swap_vert</mat-icon>\n </button>\n </span>\n\n <!-- Menu -->\n <mat-menu #menu=\"matMenu\" class=\"my-mat-menu\" (closed)=\"reset()\">\n <div mat-menu-item class=\"menu-button\">\n <div class=\"close-button-wrapper\">\n <span matTooltip=\"Close\">\n <mat-icon>close</mat-icon>\n </span>\n <span *ngIf=\"dirty\" matTooltip=\"Undo\" stop-propagation (click)=\"reset()\">\n <mat-icon>undo</mat-icon>\n </span>\n </div>\n </div>\n\n <!-- Apply Button -->\n <div class=\"apply-button-wrapper\">\n <button mat-button color=\"primary\" (click)=\"apply(null)\"\n stop-propagation [class.apply-border]=\"dirty\"\n [disabled]=\"!dirty\">\n Apply\n <ng-container *ngIf=\"dirty\">Unsaved Changes</ng-container>\n </button>\n </div>\n\n <!-- Default Sorting Text -->\n <div *ngIf=\"!sorted.length\" class=\"tip\" >\n Sorting List\n </div>\n\n <!-- Sorted Menu List -->\n <div class=\"list\"\n cdkDropList\n #sortedGroup=\"cdkDropList\"\n [cdkDropListConnectedTo]=\"[notSortedGroup]\"\n [cdkDropListData]=\"sorted\"\n (cdkDropListDropped)=\"dropIntoSorted($event)\">\n\n <!-- Menu Item Wrapper -->\n <ng-container *ngFor=\"let sort of sorted;let i=index\">\n\n <!-- Menu Item Headers -->\n <span *ngIf=\"sorted.length > 1 && i === 0 \" class=\"description\" class=\"sort-header\">First By</span>\n <span *ngIf=\"sorted.length > 1 && i !== 0 \" class=\"description\" class=\"sort-header\">Then By</span>\n\n <!-- Menu Item -->\n <div mat-menu-item cdkDrag class=\"menu-item\">\n <div class=\"sort-item\">\n <span class=\"sorted-name\">\n {{sort.displayName || (sort.active | spaceCase)}}\n <span class=\"direction-text\">{{sort.direction}}</span>\n </span>\n\n <!-- Sort Direction Buttons -->\n <div class=\"up-down-buttons-wrapper\">\n <button class=\"up-down-button up-button\" stop-propagation\n (click)=\"setDirection({active:sort.active,direction:SortDirection.asc,displayName:sort.displayName})\">\n <mat-icon [ngClass]=\"sort.direction !== SortDirection.asc ? 'light-arrow' : 'dark-arrow'\" class=\"up-down-icon\">\n arrow_upward\n </mat-icon>\n </button>\n\n <button class=\"up-down-button\" stop-propagation\n (click)=\"setDirection({active:sort.active,direction:SortDirection.desc,displayName:sort.displayName})\">\n <mat-icon [ngClass]=\"sort.direction === SortDirection.asc ? 'light-arrow' : 'dark-arrow'\" class=\"up-down-icon\">\n arrow_downward\n </mat-icon>\n </button>\n </div>\n </div>\n </div>\n </ng-container>\n </div>\n\n <!-- Default Not Sorted Text -->\n <div *ngIf=\"!notSorted.length\" class=\"tip\" >\n Not Sorted List\n </div>\n <!-- Not Sorted Menu List -->\n <div class=\"list\"\n cdkDropList\n #notSortedGroup=\"cdkDropList\"\n [cdkDropListConnectedTo]=\"[sortedGroup]\"\n [cdkDropListData]=\"notSorted\"\n (cdkDropListDropped)=\"dropIntoNotSorted($event)\">\n <div mat-menu-item *ngFor=\"let sort of notSorted\" class=\"menu-item\" cdkDrag>\n <span class=\"not-sorted-name\">{{sort.displayName || (sort.active | spaceCase)}}</span>\n </div>\n </div>\n </mat-menu>\n </ng-container>\n</ng-container>\n</ng-container>\n", styles: [".cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.list{padding:5px 2px;border-bottom:solid 1px #ccc;color:#000000de;background:white}.light-arrow{color:#93b1ea78}.dark-arrow{color:#224e9c}.up-down-button{background-color:#fff;border-radius:30%;border-color:#0ff;padding:1px 1px 0;border-width:.5px;cursor:pointer}.mat-icon.up-down-icon{margin-right:0;font-size:20px;font-weight:lighter}.sort-item{display:flex;align-items:center;justify-content:space-between}.up-down-buttons-wrapper{margin-left:2rem}.up-button{margin-right:.3rem}.mat-menu-item.menu-item,.mat-menu-item.menu-button{padding:0 3px;font-size:17px;font-weight:700;line-height:25px;height:30px}.mat-menu-item.menu-item{cursor:move}.sorted-name{color:#224e9c}.not-sorted-name{color:#93b1ea}.apply-border{border:#224e9c solid .5px}.apply-border:hover{background-color:#faebd7}.apply-button-wrapper{display:grid;justify-content:center}.sort-header{font-size:10px;font-style:italic}.tip{padding:0 3px;color:#d3d3d3}.direction-text{font-size:small;font-weight:400}.close-button-wrapper{display:flex;flex-direction:row-reverse}\n"] }]
|
|
2745
2755
|
}], ctorParameters: function () { return [{ type: TableStore }, { type: SortMenuComponentStore }]; } });
|
|
2746
2756
|
|
|
2747
2757
|
class ClickEmitterDirective extends Subject {
|
|
@@ -2749,9 +2759,9 @@ class ClickEmitterDirective extends Subject {
|
|
|
2749
2759
|
super();
|
|
2750
2760
|
}
|
|
2751
2761
|
}
|
|
2752
|
-
ClickEmitterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2753
|
-
ClickEmitterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
2754
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2762
|
+
ClickEmitterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ClickEmitterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2763
|
+
ClickEmitterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: ClickEmitterDirective, selector: "[clickEmitter]", host: { listeners: { "click": "next(true)" } }, exportAs: ["clickEmitter"], usesInheritance: true, ngImport: i0 });
|
|
2764
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ClickEmitterDirective, decorators: [{
|
|
2755
2765
|
type: Directive,
|
|
2756
2766
|
args: [{
|
|
2757
2767
|
selector: '[clickEmitter]',
|
|
@@ -2776,9 +2786,9 @@ class DialogService {
|
|
|
2776
2786
|
this.allOpenAppDialogs.forEach(ref => ref.close());
|
|
2777
2787
|
}
|
|
2778
2788
|
}
|
|
2779
|
-
DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2780
|
-
DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
2781
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2789
|
+
DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2790
|
+
DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogService, providedIn: 'root' });
|
|
2791
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogService, decorators: [{
|
|
2782
2792
|
type: Injectable,
|
|
2783
2793
|
args: [{
|
|
2784
2794
|
providedIn: 'root'
|
|
@@ -2808,9 +2818,9 @@ class DialogWrapper {
|
|
|
2808
2818
|
this.viewContext.opDialog = value;
|
|
2809
2819
|
}
|
|
2810
2820
|
}
|
|
2811
|
-
DialogWrapper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2812
|
-
DialogWrapper.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
2813
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2821
|
+
DialogWrapper.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogWrapper, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2822
|
+
DialogWrapper.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: DialogWrapper, selector: "app-dialog-content", ngImport: i0, template: ``, isInline: true });
|
|
2823
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogWrapper, decorators: [{
|
|
2814
2824
|
type: Component,
|
|
2815
2825
|
args: [{
|
|
2816
2826
|
selector: 'app-dialog-content',
|
|
@@ -2889,10 +2899,13 @@ class DialogDirective {
|
|
|
2889
2899
|
this.subscription.unsubscribe();
|
|
2890
2900
|
}
|
|
2891
2901
|
}
|
|
2902
|
+
static ngTemplateContextGuard(dir, ctx) {
|
|
2903
|
+
return true;
|
|
2904
|
+
}
|
|
2892
2905
|
}
|
|
2893
|
-
DialogDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
2894
|
-
DialogDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
2895
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
2906
|
+
DialogDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogDirective, deps: [{ token: i0.TemplateRef }, { token: i1$3.MatDialog }, { token: DialogService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
2907
|
+
DialogDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: DialogDirective, selector: "[opDialog]", inputs: { opDialogConfig: "opDialogConfig", state: ["opDialog", "state"], nativeElement: ["opDialogOrigin", "nativeElement"] }, outputs: { opDialogClosed: "opDialogClosed" }, ngImport: i0 });
|
|
2908
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: DialogDirective, decorators: [{
|
|
2896
2909
|
type: Directive,
|
|
2897
2910
|
args: [{ selector: '[opDialog]' }]
|
|
2898
2911
|
}], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i1$3.MatDialog }, { type: DialogService }]; }, propDecorators: { opDialogClosed: [{
|
|
@@ -2997,9 +3010,9 @@ class TableContainerComponent {
|
|
|
2997
3010
|
this.myColumns$ = this.state.metaDataArray$.pipe(mapArray(metaData => ({ metaData, customCell: customCellMap.get(metaData.key) })));
|
|
2998
3011
|
}
|
|
2999
3012
|
}
|
|
3000
|
-
TableContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3001
|
-
TableContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.
|
|
3002
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3013
|
+
TableContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableContainerComponent, deps: [{ token: TableStore }, { token: ExportToCsvService }, { token: TableBuilderConfigToken }, { token: i3$2.Store }], target: i0.ɵɵFactoryTarget.Component });
|
|
3014
|
+
TableContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: TableContainerComponent, selector: "tb-table-container", inputs: { tableId: "tableId", SaveState: "SaveState", tableBuilder: "tableBuilder", IndexColumn: "IndexColumn", SelectionColumn: "SelectionColumn", trackBy: "trackBy", isSticky: "isSticky", pageSize: "pageSize", inputFilters: "inputFilters" }, outputs: { selection$: "selection$", data: "data", OnStateReset: "OnStateReset", OnSaveState: "OnSaveState", state$: "state$" }, providers: [TableStore, ExportToCsvService, WrapperFilterStore], queries: [{ propertyName: "customRows", predicate: MatRowDef }, { propertyName: "customCells", predicate: CustomCellDirective }], ngImport: i0, template: "<ng-container multiSort>\n <ng-container *ngrxLet=\"state.tableSettings$ as tableSettings\">\n\n\n <div class=\"header-wrapper\">\n <div class=\"title\">\n <ng-content select=\".tb-header-title\"\n *ngIf=\"(!(collapseHeader$ | async)) || tableSettings.showTitleWhenHeaderCollapsed\">\n\n </ng-content>\n </div>\n <div class=\"flx-row-end\">\n <lib-filter-list></lib-filter-list>\n <ng-container *ngIf=\"!(collapseHeader$ | async); else allMenu\">\n <ng-container *ngTemplateOutlet=\"headerMenu\"></ng-container>\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"mainMenu\"\n [ngClass]=\"{'flat-menu':(collapseHeader$ | async)}\">\n <mat-icon>{{(collapseHeader$ | async) ? 'more_horiz' : 'more_vert'}}</mat-icon>\n </button>\n <mat-menu #mainMenu='matMenu'>\n <ng-container *ngTemplateOutlet=\"headerMenuExtra\"></ng-container>\n </mat-menu>\n </ng-container>\n <ng-template #allMenu>\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"mainMenu\"\n [ngClass]=\"{'flat-menu':(collapseHeader$ | async)}\">\n <mat-icon>{{(collapseHeader$ | async) ? 'more_horiz' : 'more_vert'}}</mat-icon>\n </button>\n <mat-menu #mainMenu='matMenu'>\n <div class=\"flex-column\">\n <ng-container *ngTemplateOutlet=\"headerMenu\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"headerMenuExtra\"></ng-container>\n </mat-menu>\n </ng-template>\n <mat-icon [matTooltip]=\"(collapseHeader$ | async) ? 'expand' : 'collapse'\" class=\"collapse-icon header\"\n (click)=\"state.toggleCollapseHeader()\">\n {{(collapseHeader$ | async) ? 'expand_less' : 'expand_more'}}\n </mat-icon>\n </div>\n </div>\n\n <div style=\"clear: both;\">\n <tb-generic-table [rows]='customRows' [data$]=\"data\" [IndexColumn]='IndexColumn'\n [SelectionColumn]='SelectionColumn' (selection$)='selection$.emit($event)' [trackBy]='trackBy'\n [isSticky]='isSticky' [columnInfos]='myColumns$'>\n </tb-generic-table>\n </div>\n\n\n\n <ng-template #headerMenu>\n <ng-container>\n <tb-filter-displayer *ngIf=\"!tableSettings.hideFilter\">\n </tb-filter-displayer>\n <tb-col-displayer *ngIf=\"!tableSettings.hideColumnSettings\"></tb-col-displayer>\n <tb-sort-menu *ngIf=\"!tableSettings.hideSort\"></tb-sort-menu>\n </ng-container>\n </ng-template>\n <ng-template #headerMenuExtra>\n <button mat-menu-item (click)=\"state.resetState();OnStateReset.next(null)\">\n <mat-icon color=\"primary\">autorenew</mat-icon>\n <span>Reset table</span>\n </button>\n <button mat-menu-item (click)=\"exportToCsv()\" *ngIf=\"!tableSettings.hideExport\">\n <mat-icon color=\"primary\">file_download</mat-icon>\n <span>Export Table</span>\n </button>\n <ng-container *ngIf=\"currentStateKey$ | async as currentKey\">\n <button mat-menu-item *ngIf=\"tableId\" (click)=\"saveState()\">\n <mat-icon color=\"primary\">save</mat-icon>\n <span>Save to {{currentKey}}</span>\n </button>\n <button *ngIf='tableId' mat-menu-item [matMenuTriggerFor]=\"savedNames\">\n <span>Choose Profile</span>\n </button>\n </ng-container>\n\n <mat-menu #savedNames='matMenu' panelClass='wide-menu'>\n <button mat-menu-item clickEmitter #add='clickEmitter'>\n <mat-icon>add</mat-icon>\n <span>New</span>\n </button>\n <ng-container *ngFor='let key of stateKeys$ | async'>\n <button mat-menu-item (click)='setProfileState(key)'>\n <div style='display: flex; align-items: center; justify-content: space-between;'>\n <span style='display:flex;'>{{key}}</span>\n <span style='display:flex;'>\n <span style=\"width: 120px;\"></span>\n <mat-icon color='warn' (click)='deleteProfileState(key)' stop-propagation>delete_forever</mat-icon>\n </span>\n </div>\n </button>\n </ng-container>\n </mat-menu>\n <div *opDialog='add'>\n <mat-form-field>\n <input style='width:90%' matInput #addedKey />\n </mat-form-field>\n <button mat-button (click)='setProfileState(addedKey.value); add.next(false);'\n [disabled]=\"!addedKey.value\">Add</button>\n </div>\n </ng-template>\n\n </ng-container>\n\n</ng-container>\n", styles: [".wide-menu{width:200px!important}.header-wrapper{display:flex;flex-direction:row;justify-content:space-between;width:100%}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.flat-menu{line-height:initial;height:initial}\n", ".collapse-icon{font-size:16px;height:16px;padding-bottom:.2rem;color:#3f51b5}.collapse-icon.header{align-self:flex-end}.collapse-icon.footer{align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}\n"], components: [{ type: FilterChipsComponent, selector: "lib-filter-list" }, { 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.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: GenericTableComponent, selector: "tb-generic-table", inputs: ["data$", "IndexColumn", "SelectionColumn", "trackBy", "rows", "isSticky", "columnBuilders", "columnInfos"], outputs: ["selection$"] }, { type: GenFilterDisplayerComponent, selector: "tb-filter-displayer" }, { type: GenColDisplayerComponent, selector: "tb-col-displayer" }, { type: SortMenuComponent, selector: "tb-sort-menu" }, { type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i6.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: MultiSortDirective, selector: "[multiSort]", inputs: ["matSortDisabled"], exportAs: ["multiSort"] }, { type: i7$1.LetDirective, selector: "[ngrxLet]", inputs: ["ngrxLet"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i8$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: ClickEmitterDirective, selector: "[clickEmitter]", exportAs: ["clickEmitter"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: StopPropagationDirective, selector: "[stop-propagation]" }, { type: DialogDirective, selector: "[opDialog]", inputs: ["opDialogConfig", "opDialog", "opDialogOrigin"], outputs: ["opDialogClosed"] }, { type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3015
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableContainerComponent, decorators: [{
|
|
3003
3016
|
type: Component,
|
|
3004
3017
|
args: [{ selector: 'tb-table-container', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TableStore, ExportToCsvService, WrapperFilterStore], template: "<ng-container multiSort>\n <ng-container *ngrxLet=\"state.tableSettings$ as tableSettings\">\n\n\n <div class=\"header-wrapper\">\n <div class=\"title\">\n <ng-content select=\".tb-header-title\"\n *ngIf=\"(!(collapseHeader$ | async)) || tableSettings.showTitleWhenHeaderCollapsed\">\n\n </ng-content>\n </div>\n <div class=\"flx-row-end\">\n <lib-filter-list></lib-filter-list>\n <ng-container *ngIf=\"!(collapseHeader$ | async); else allMenu\">\n <ng-container *ngTemplateOutlet=\"headerMenu\"></ng-container>\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"mainMenu\"\n [ngClass]=\"{'flat-menu':(collapseHeader$ | async)}\">\n <mat-icon>{{(collapseHeader$ | async) ? 'more_horiz' : 'more_vert'}}</mat-icon>\n </button>\n <mat-menu #mainMenu='matMenu'>\n <ng-container *ngTemplateOutlet=\"headerMenuExtra\"></ng-container>\n </mat-menu>\n </ng-container>\n <ng-template #allMenu>\n <button mat-icon-button color='primary' [matMenuTriggerFor]=\"mainMenu\"\n [ngClass]=\"{'flat-menu':(collapseHeader$ | async)}\">\n <mat-icon>{{(collapseHeader$ | async) ? 'more_horiz' : 'more_vert'}}</mat-icon>\n </button>\n <mat-menu #mainMenu='matMenu'>\n <div class=\"flex-column\">\n <ng-container *ngTemplateOutlet=\"headerMenu\"></ng-container>\n </div>\n <ng-container *ngTemplateOutlet=\"headerMenuExtra\"></ng-container>\n </mat-menu>\n </ng-template>\n <mat-icon [matTooltip]=\"(collapseHeader$ | async) ? 'expand' : 'collapse'\" class=\"collapse-icon header\"\n (click)=\"state.toggleCollapseHeader()\">\n {{(collapseHeader$ | async) ? 'expand_less' : 'expand_more'}}\n </mat-icon>\n </div>\n </div>\n\n <div style=\"clear: both;\">\n <tb-generic-table [rows]='customRows' [data$]=\"data\" [IndexColumn]='IndexColumn'\n [SelectionColumn]='SelectionColumn' (selection$)='selection$.emit($event)' [trackBy]='trackBy'\n [isSticky]='isSticky' [columnInfos]='myColumns$'>\n </tb-generic-table>\n </div>\n\n\n\n <ng-template #headerMenu>\n <ng-container>\n <tb-filter-displayer *ngIf=\"!tableSettings.hideFilter\">\n </tb-filter-displayer>\n <tb-col-displayer *ngIf=\"!tableSettings.hideColumnSettings\"></tb-col-displayer>\n <tb-sort-menu *ngIf=\"!tableSettings.hideSort\"></tb-sort-menu>\n </ng-container>\n </ng-template>\n <ng-template #headerMenuExtra>\n <button mat-menu-item (click)=\"state.resetState();OnStateReset.next(null)\">\n <mat-icon color=\"primary\">autorenew</mat-icon>\n <span>Reset table</span>\n </button>\n <button mat-menu-item (click)=\"exportToCsv()\" *ngIf=\"!tableSettings.hideExport\">\n <mat-icon color=\"primary\">file_download</mat-icon>\n <span>Export Table</span>\n </button>\n <ng-container *ngIf=\"currentStateKey$ | async as currentKey\">\n <button mat-menu-item *ngIf=\"tableId\" (click)=\"saveState()\">\n <mat-icon color=\"primary\">save</mat-icon>\n <span>Save to {{currentKey}}</span>\n </button>\n <button *ngIf='tableId' mat-menu-item [matMenuTriggerFor]=\"savedNames\">\n <span>Choose Profile</span>\n </button>\n </ng-container>\n\n <mat-menu #savedNames='matMenu' panelClass='wide-menu'>\n <button mat-menu-item clickEmitter #add='clickEmitter'>\n <mat-icon>add</mat-icon>\n <span>New</span>\n </button>\n <ng-container *ngFor='let key of stateKeys$ | async'>\n <button mat-menu-item (click)='setProfileState(key)'>\n <div style='display: flex; align-items: center; justify-content: space-between;'>\n <span style='display:flex;'>{{key}}</span>\n <span style='display:flex;'>\n <span style=\"width: 120px;\"></span>\n <mat-icon color='warn' (click)='deleteProfileState(key)' stop-propagation>delete_forever</mat-icon>\n </span>\n </div>\n </button>\n </ng-container>\n </mat-menu>\n <div *opDialog='add'>\n <mat-form-field>\n <input style='width:90%' matInput #addedKey />\n </mat-form-field>\n <button mat-button (click)='setProfileState(addedKey.value); add.next(false);'\n [disabled]=\"!addedKey.value\">Add</button>\n </div>\n </ng-template>\n\n </ng-container>\n\n</ng-container>\n", styles: [".wide-menu{width:200px!important}.header-wrapper{display:flex;flex-direction:row;justify-content:space-between;width:100%}.flx-row-end{display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.flat-menu{line-height:initial;height:initial}\n", ".collapse-icon{font-size:16px;height:16px;padding-bottom:.2rem;color:#3f51b5}.collapse-icon.header{align-self:flex-end}.collapse-icon.footer{align-self:flex-start}.collapse-icon:hover{cursor:pointer}.hide{display:none}\n"] }]
|
|
3005
3018
|
}], ctorParameters: function () { return [{ type: TableStore }, { type: ExportToCsvService }, { type: undefined, decorators: [{
|
|
@@ -3124,9 +3137,9 @@ class SaveTableEffects {
|
|
|
3124
3137
|
})), { dispatch: false });
|
|
3125
3138
|
}
|
|
3126
3139
|
}
|
|
3127
|
-
SaveTableEffects.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3128
|
-
SaveTableEffects.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.
|
|
3129
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3140
|
+
SaveTableEffects.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SaveTableEffects, deps: [{ token: i1$4.Actions }, { token: i3$2.Store }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3141
|
+
SaveTableEffects.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SaveTableEffects });
|
|
3142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SaveTableEffects, decorators: [{
|
|
3130
3143
|
type: Injectable
|
|
3131
3144
|
}], ctorParameters: function () { return [{ type: i1$4.Actions }, { type: i3$2.Store }]; } });
|
|
3132
3145
|
|
|
@@ -3135,9 +3148,9 @@ class PreventEnterDirective {
|
|
|
3135
3148
|
return false;
|
|
3136
3149
|
}
|
|
3137
3150
|
}
|
|
3138
|
-
PreventEnterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3139
|
-
PreventEnterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
3140
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3151
|
+
PreventEnterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PreventEnterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3152
|
+
PreventEnterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: PreventEnterDirective, selector: "preventEnter", host: { listeners: { "keydown.enter": "onKeyDown($event)" } }, ngImport: i0 });
|
|
3153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PreventEnterDirective, decorators: [{
|
|
3141
3154
|
type: Directive,
|
|
3142
3155
|
args: [{
|
|
3143
3156
|
selector: 'preventEnter'
|
|
@@ -3155,9 +3168,9 @@ class ClickSubjectDirective extends Subject {
|
|
|
3155
3168
|
this._val = val;
|
|
3156
3169
|
}
|
|
3157
3170
|
}
|
|
3158
|
-
ClickSubjectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3159
|
-
ClickSubjectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
3160
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3171
|
+
ClickSubjectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ClickSubjectDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3172
|
+
ClickSubjectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: ClickSubjectDirective, selector: "[clickSubject]", inputs: { clickSubject: "clickSubject" }, host: { listeners: { "click": "next(this._val)" } }, exportAs: ["clickSubject"], usesInheritance: true, ngImport: i0 });
|
|
3173
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ClickSubjectDirective, decorators: [{
|
|
3161
3174
|
type: Directive,
|
|
3162
3175
|
args: [{
|
|
3163
3176
|
selector: '[clickSubject]',
|
|
@@ -3211,9 +3224,9 @@ class MatSlideToggleGroupDirective {
|
|
|
3211
3224
|
}, startValue), startWith$1(startValue));
|
|
3212
3225
|
}
|
|
3213
3226
|
}
|
|
3214
|
-
MatSlideToggleGroupDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3215
|
-
MatSlideToggleGroupDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.
|
|
3216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3227
|
+
MatSlideToggleGroupDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MatSlideToggleGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3228
|
+
MatSlideToggleGroupDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.2", type: MatSlideToggleGroupDirective, selector: "[opMatSlideToggleGroup]", inputs: { allowMultiple: "allowMultiple" }, outputs: { valueEmitter: "valueEmitter" }, queries: [{ propertyName: "toggles", predicate: MatSlideToggle }], ngImport: i0 });
|
|
3229
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MatSlideToggleGroupDirective, decorators: [{
|
|
3217
3230
|
type: Directive,
|
|
3218
3231
|
args: [{ selector: '[opMatSlideToggleGroup]', }]
|
|
3219
3232
|
}], propDecorators: { allowMultiple: [{
|
|
@@ -3227,8 +3240,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.2", ngImpor
|
|
|
3227
3240
|
|
|
3228
3241
|
class UtilitiesModule {
|
|
3229
3242
|
}
|
|
3230
|
-
UtilitiesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3231
|
-
UtilitiesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.
|
|
3243
|
+
UtilitiesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: UtilitiesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
3244
|
+
UtilitiesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: UtilitiesModule, declarations: [SpaceCasePipe,
|
|
3232
3245
|
PhoneNumberPipe,
|
|
3233
3246
|
FunctionPipe,
|
|
3234
3247
|
StopPropagationDirective,
|
|
@@ -3251,10 +3264,10 @@ UtilitiesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
|
|
|
3251
3264
|
ClickEmitterDirective,
|
|
3252
3265
|
DialogDirective,
|
|
3253
3266
|
MatSlideToggleGroupDirective] });
|
|
3254
|
-
UtilitiesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.
|
|
3267
|
+
UtilitiesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: UtilitiesModule, providers: [
|
|
3255
3268
|
DialogService
|
|
3256
3269
|
], imports: [[]] });
|
|
3257
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3270
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: UtilitiesModule, decorators: [{
|
|
3258
3271
|
type: NgModule,
|
|
3259
3272
|
args: [{
|
|
3260
3273
|
imports: [],
|
|
@@ -3303,8 +3316,8 @@ class TableBuilderModule {
|
|
|
3303
3316
|
};
|
|
3304
3317
|
}
|
|
3305
3318
|
}
|
|
3306
|
-
TableBuilderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.
|
|
3307
|
-
TableBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.
|
|
3319
|
+
TableBuilderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableBuilderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
3320
|
+
TableBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableBuilderModule, declarations: [ColumnTotalPipe,
|
|
3308
3321
|
TableContainerComponent,
|
|
3309
3322
|
GenericTableComponent,
|
|
3310
3323
|
PaginatorComponent,
|
|
@@ -3340,7 +3353,7 @@ TableBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", vers
|
|
|
3340
3353
|
FilterComponent,
|
|
3341
3354
|
MultiSortDirective,
|
|
3342
3355
|
ResizeColumnDirective] });
|
|
3343
|
-
TableBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.
|
|
3356
|
+
TableBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableBuilderModule, providers: [
|
|
3344
3357
|
SpaceCasePipe,
|
|
3345
3358
|
DatePipe,
|
|
3346
3359
|
CurrencyPipe,
|
|
@@ -3357,7 +3370,7 @@ TableBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", vers
|
|
|
3357
3370
|
DragDropModule,
|
|
3358
3371
|
UtilitiesModule,
|
|
3359
3372
|
]] });
|
|
3360
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.
|
|
3373
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TableBuilderModule, decorators: [{
|
|
3361
3374
|
type: NgModule,
|
|
3362
3375
|
args: [{
|
|
3363
3376
|
imports: [
|