@mediusinc/mng-commons 0.19.1 → 0.19.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/action/action.component.mjs +12 -5
- package/esm2020/lib/components/action/editor/action-editor.component.mjs +14 -5
- package/esm2020/lib/components/action/models/action-execution.model.mjs +5 -1
- package/esm2020/lib/components/action/route/action-route.component.mjs +7 -2
- package/esm2020/lib/components/form/formly/fields/formly-field-input/formly-field-input.component.mjs +1 -1
- package/esm2020/lib/components/form/formly/fields/formly-field-table-dialog-form/formly-field-table-dialog-form.component.mjs +1 -1
- package/esm2020/lib/components/layout/services/main-layout.component.service.mjs +3 -1
- package/esm2020/lib/components/tableview/route/tableview-route.abstract.component.mjs +38 -5
- package/esm2020/lib/components/tableview/table/column-filter/column-filter.component.mjs +1 -1
- package/esm2020/lib/components/tableview/table/table.component.mjs +23 -17
- package/esm2020/lib/components/tableview/tableview.component.mjs +3 -3
- package/esm2020/lib/descriptors/field-validation.descriptor.mjs +5 -1
- package/esm2020/lib/descriptors/field.descriptor.mjs +5 -3
- package/esm2020/lib/models/config.model.mjs +1 -1
- package/esm2020/lib/models/view-container.model.mjs +1 -1
- package/esm2020/lib/router/tableview-route-builder.mjs +4 -1
- package/esm2020/lib/services/action-executor.service.mjs +23 -19
- package/esm2020/lib/services/commons.service.mjs +6 -1
- package/esm2020/lib/services/view-container.component.service.mjs +8 -1
- package/fesm2015/mediusinc-mng-commons.mjs +155 -62
- package/fesm2015/mediusinc-mng-commons.mjs.map +1 -1
- package/fesm2020/mediusinc-mng-commons.mjs +142 -51
- package/fesm2020/mediusinc-mng-commons.mjs.map +1 -1
- package/lib/components/action/action.component.d.ts +6 -3
- package/lib/components/action/editor/action-editor.component.d.ts +2 -0
- package/lib/components/action/models/action-execution.model.d.ts +2 -0
- package/lib/components/tableview/route/tableview-route.abstract.component.d.ts +5 -3
- package/lib/descriptors/field-validation.descriptor.d.ts +1 -0
- package/lib/models/config.model.d.ts +1 -0
- package/lib/models/view-container.model.d.ts +5 -0
- package/lib/services/commons.service.d.ts +2 -0
- package/lib/services/view-container.component.service.d.ts +4 -1
- package/package.json +1 -1
- package/version-info.json +5 -5
|
@@ -798,6 +798,10 @@ class ActionParameters {
|
|
|
798
798
|
this.sourceComponent = sourceComponent;
|
|
799
799
|
return this;
|
|
800
800
|
}
|
|
801
|
+
withHostComponent(hostComponent) {
|
|
802
|
+
this.hostComponent = hostComponent;
|
|
803
|
+
return this;
|
|
804
|
+
}
|
|
801
805
|
withRoute(route) {
|
|
802
806
|
this.route = route;
|
|
803
807
|
return this;
|
|
@@ -3377,8 +3381,8 @@ class AFieldDescriptor extends AGenericFieldDescriptor {
|
|
|
3377
3381
|
obj._size = this.size;
|
|
3378
3382
|
obj._getter = this._getter;
|
|
3379
3383
|
obj._setter = this._setter;
|
|
3380
|
-
obj._validations = this._validations;
|
|
3381
|
-
obj._asyncValidations = this._asyncValidations;
|
|
3384
|
+
obj._validations = this._validations.map(value => value.copy());
|
|
3385
|
+
obj._asyncValidations = this._asyncValidations.map(value => value.copy());
|
|
3382
3386
|
}
|
|
3383
3387
|
}
|
|
3384
3388
|
class FieldInputDescriptor extends AFieldDescriptor {
|
|
@@ -4055,6 +4059,7 @@ class FieldTabGroupDescriptor extends AFieldGroupDescriptor {
|
|
|
4055
4059
|
const tab = new FieldTabGroupDescriptor(this._editor, this.name.substring(this.baseName.length));
|
|
4056
4060
|
tab._title = this._title;
|
|
4057
4061
|
tab._fields = this.fields.map(f => f.copy());
|
|
4062
|
+
tab._validations = this.validations.map(v => v.copy());
|
|
4058
4063
|
return tab;
|
|
4059
4064
|
}
|
|
4060
4065
|
}
|
|
@@ -4088,6 +4093,7 @@ class FieldGroupDescriptor extends AFieldGroupDescriptor {
|
|
|
4088
4093
|
group._type = this._type;
|
|
4089
4094
|
group._title = this._title;
|
|
4090
4095
|
group._fields = this.fields.map(f => f.copy());
|
|
4096
|
+
group._validations = this.validations.map(v => v.copy());
|
|
4091
4097
|
return group;
|
|
4092
4098
|
}
|
|
4093
4099
|
}
|
|
@@ -4111,6 +4117,10 @@ class FieldValidationDescriptor {
|
|
|
4111
4117
|
get options() {
|
|
4112
4118
|
return this._options;
|
|
4113
4119
|
}
|
|
4120
|
+
copy() {
|
|
4121
|
+
const opt = this._options ? Object.assign({}, this._options) : undefined;
|
|
4122
|
+
return new FieldValidationDescriptor(this._name, this._validator, this._message, opt);
|
|
4123
|
+
}
|
|
4114
4124
|
}
|
|
4115
4125
|
|
|
4116
4126
|
class ModelDescriptor {
|
|
@@ -7343,30 +7353,34 @@ class MngActionExecutorService {
|
|
|
7343
7353
|
if (instance.action.activationTrigger !== ActionActivationTriggerEnum.OnRoute) {
|
|
7344
7354
|
return;
|
|
7345
7355
|
}
|
|
7346
|
-
|
|
7347
|
-
|
|
7356
|
+
// for now, deactivation always means going back to tableview root
|
|
7357
|
+
// if (this.navigationService.getPreviousLocation()) {
|
|
7358
|
+
// // there are internal history records, so back can be normally called
|
|
7359
|
+
// this.navigationService.back();
|
|
7360
|
+
// } else {
|
|
7361
|
+
// // there is no internal history records, figure out the base url by eliminating action specific url
|
|
7362
|
+
let url = this.navigationService.getCurrentLocation();
|
|
7363
|
+
// let previousUrl = this.navigationService.getPreviousLocation();
|
|
7364
|
+
// console.log(url, previousUrl);
|
|
7365
|
+
if (!url) {
|
|
7348
7366
|
this.navigationService.back();
|
|
7349
7367
|
}
|
|
7350
7368
|
else {
|
|
7351
|
-
|
|
7352
|
-
|
|
7353
|
-
if (!url) {
|
|
7354
|
-
this.navigationService.back();
|
|
7369
|
+
if (url.startsWith('/')) {
|
|
7370
|
+
url = url.substring(1);
|
|
7355
7371
|
}
|
|
7356
|
-
|
|
7357
|
-
|
|
7358
|
-
|
|
7359
|
-
|
|
7360
|
-
const urlPathSegments = url.split('?')[0].split('#')[0].split('/');
|
|
7361
|
-
let actionUrl = (_b = (_a = instance.action) === null || _a === void 0 ? void 0 : _a.routeUrl) !== null && _b !== void 0 ? _b : '';
|
|
7362
|
-
if (actionUrl.startsWith('/')) {
|
|
7363
|
-
actionUrl = actionUrl.substring(1);
|
|
7364
|
-
}
|
|
7365
|
-
const actionUrlSegments = actionUrl.split('/');
|
|
7366
|
-
const redirectUrl = urlPathSegments.slice(0, urlPathSegments.length - actionUrlSegments.length).join('/');
|
|
7367
|
-
this.router.navigateByUrl(`/${redirectUrl}`, { replaceUrl: true });
|
|
7372
|
+
const urlPathSegments = url.split('?')[0].split('#')[0].split('/');
|
|
7373
|
+
let actionUrl = (_b = (_a = instance.action) === null || _a === void 0 ? void 0 : _a.routeUrl) !== null && _b !== void 0 ? _b : '';
|
|
7374
|
+
if (actionUrl.startsWith('/')) {
|
|
7375
|
+
actionUrl = actionUrl.substring(1);
|
|
7368
7376
|
}
|
|
7377
|
+
const actionUrlSegments = actionUrl.split('/');
|
|
7378
|
+
const redirectUrl = '/' + urlPathSegments.slice(0, urlPathSegments.length - actionUrlSegments.length).join('/');
|
|
7379
|
+
// const replaceUrl = previousUrl !== null && previousUrl.split('?')[0].split('#')[0] === redirectUrl;
|
|
7380
|
+
// No URL replaces, probably ok, to allow going back
|
|
7381
|
+
this.router.navigateByUrl(redirectUrl);
|
|
7369
7382
|
}
|
|
7383
|
+
// }
|
|
7370
7384
|
}
|
|
7371
7385
|
/**
|
|
7372
7386
|
* Transform error of any type to mng error by using error mapper that could be provided by final project.
|
|
@@ -7414,6 +7428,7 @@ class MngCommonsService {
|
|
|
7414
7428
|
this._menuModeSubject = new BehaviorSubject(this._menuMode);
|
|
7415
7429
|
this._menuItems = [];
|
|
7416
7430
|
this._menuPinEnabled = false;
|
|
7431
|
+
this._menuSidebarSlim = false;
|
|
7417
7432
|
this._menuActiveKeySubject = new Subject();
|
|
7418
7433
|
this._menuResetSubject = new Subject();
|
|
7419
7434
|
// breadcrumbs
|
|
@@ -7534,6 +7549,9 @@ class MngCommonsService {
|
|
|
7534
7549
|
get menuPinEnabled() {
|
|
7535
7550
|
return this._menuPinEnabled;
|
|
7536
7551
|
}
|
|
7552
|
+
get menuSidebarSlim() {
|
|
7553
|
+
return this._menuSidebarSlim;
|
|
7554
|
+
}
|
|
7537
7555
|
// BREADCRUMB section
|
|
7538
7556
|
get breadcrumbHome$() {
|
|
7539
7557
|
return this.breadcrumbHomeSubject.asObservable();
|
|
@@ -7570,13 +7588,14 @@ class MngCommonsService {
|
|
|
7570
7588
|
return this.userRolesSubject.asObservable();
|
|
7571
7589
|
}
|
|
7572
7590
|
reset() {
|
|
7573
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
7591
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
7574
7592
|
this._menuMode = (_c = (_b = (_a = this.moduleConfig) === null || _a === void 0 ? void 0 : _a.menu) === null || _b === void 0 ? void 0 : _b.mode) !== null && _c !== void 0 ? _c : 'sidebar';
|
|
7575
7593
|
this._menuModeSubject.next(this._menuMode);
|
|
7576
7594
|
this._menuItems = (_f = (_e = (_d = this.moduleConfig) === null || _d === void 0 ? void 0 : _d.menu) === null || _e === void 0 ? void 0 : _e.menuItems) !== null && _f !== void 0 ? _f : [];
|
|
7577
7595
|
this._menuPinEnabled = (_j = (_h = (_g = this.moduleConfig) === null || _g === void 0 ? void 0 : _g.menu) === null || _h === void 0 ? void 0 : _h.pinEnabled) !== null && _j !== void 0 ? _j : false;
|
|
7596
|
+
this._menuSidebarSlim = (_m = (_l = (_k = this.moduleConfig) === null || _k === void 0 ? void 0 : _k.menu) === null || _l === void 0 ? void 0 : _l.sidebarSlim) !== null && _m !== void 0 ? _m : false;
|
|
7578
7597
|
// visual
|
|
7579
|
-
this._colorScheme = (
|
|
7598
|
+
this._colorScheme = (_q = (_p = (_o = this.moduleConfig) === null || _o === void 0 ? void 0 : _o.app) === null || _p === void 0 ? void 0 : _p.colorScheme) !== null && _q !== void 0 ? _q : 'light';
|
|
7580
7599
|
// ripple
|
|
7581
7600
|
this.primengConfig.ripple = true;
|
|
7582
7601
|
this.primengConfig.filterMatchModeOptions = {
|
|
@@ -7589,7 +7608,7 @@ class MngCommonsService {
|
|
|
7589
7608
|
const lang = this.getOrInitLanguage();
|
|
7590
7609
|
this.translate.use(lang);
|
|
7591
7610
|
this.translate.get('mngPrime').subscribe(value => this.primengConfig.setTranslation(value));
|
|
7592
|
-
(
|
|
7611
|
+
(_r = this.routerEventsSubscription) === null || _r === void 0 ? void 0 : _r.unsubscribe();
|
|
7593
7612
|
this.routerEventsSubscription = this.router.events
|
|
7594
7613
|
.pipe(
|
|
7595
7614
|
// Filter the NavigationEnd events as the breadcrumb is updated only when the route reaches its end
|
|
@@ -7598,7 +7617,7 @@ class MngCommonsService {
|
|
|
7598
7617
|
this.updateBreadcrumbs();
|
|
7599
7618
|
this.setPageTitle();
|
|
7600
7619
|
});
|
|
7601
|
-
(
|
|
7620
|
+
(_s = this.translateLangChangeSubscription) === null || _s === void 0 ? void 0 : _s.unsubscribe();
|
|
7602
7621
|
this.translateLangChangeSubscription = this.translate.onLangChange.subscribe(() => {
|
|
7603
7622
|
this.updateBreadcrumbs();
|
|
7604
7623
|
this.setPageTitle();
|
|
@@ -7822,6 +7841,7 @@ class MngViewContainerComponentService {
|
|
|
7822
7841
|
this.actions = [];
|
|
7823
7842
|
this._tableReloadSubject = new Subject();
|
|
7824
7843
|
this._editorResetSubject = new Subject();
|
|
7844
|
+
this._editorCloseSubject = new Subject();
|
|
7825
7845
|
}
|
|
7826
7846
|
set dataProvider(dataProvider) {
|
|
7827
7847
|
this._dataProvider = dataProvider;
|
|
@@ -7850,6 +7870,12 @@ class MngViewContainerComponentService {
|
|
|
7850
7870
|
resetEditor(event) {
|
|
7851
7871
|
this._editorResetSubject.next(event !== null && event !== void 0 ? event : {});
|
|
7852
7872
|
}
|
|
7873
|
+
getEditorClose$() {
|
|
7874
|
+
return this._editorCloseSubject.asObservable();
|
|
7875
|
+
}
|
|
7876
|
+
closeEditor(event) {
|
|
7877
|
+
this._editorCloseSubject.next(event !== null && event !== void 0 ? event : {});
|
|
7878
|
+
}
|
|
7853
7879
|
}
|
|
7854
7880
|
MngViewContainerComponentService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngViewContainerComponentService, deps: [{ token: i2$1.MessageService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
7855
7881
|
MngViewContainerComponentService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngViewContainerComponentService });
|
|
@@ -7918,8 +7944,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
|
|
|
7918
7944
|
}], ctorParameters: function () { return [{ type: MngAuthorizationService }]; } });
|
|
7919
7945
|
|
|
7920
7946
|
class MngActionComponent {
|
|
7921
|
-
constructor(
|
|
7922
|
-
this.
|
|
7947
|
+
constructor(routeService, translate, authorization, actionExecutor, confirmationService, viewContainerService) {
|
|
7948
|
+
this.routeService = routeService;
|
|
7923
7949
|
this.translate = translate;
|
|
7924
7950
|
this.authorization = authorization;
|
|
7925
7951
|
this.actionExecutor = actionExecutor;
|
|
@@ -7950,8 +7976,9 @@ class MngActionComponent {
|
|
|
7950
7976
|
this.loadingSubject.next(false);
|
|
7951
7977
|
}
|
|
7952
7978
|
ngOnInit() {
|
|
7953
|
-
var _a, _b;
|
|
7979
|
+
var _a, _b, _c;
|
|
7954
7980
|
this.viewContainer = (_b = (_a = this.viewContainerInit) !== null && _a !== void 0 ? _a : this.viewContainerService) !== null && _b !== void 0 ? _b : undefined;
|
|
7981
|
+
this.route = (_c = this.routeInit) !== null && _c !== void 0 ? _c : this.routeService;
|
|
7955
7982
|
this.hasNoTitle = this.action.button.label === null;
|
|
7956
7983
|
this.isEnabledSubject.next(true);
|
|
7957
7984
|
this.isVisibleSubject.next(true);
|
|
@@ -8005,6 +8032,7 @@ class MngActionComponent {
|
|
|
8005
8032
|
.withRoute(this.route)
|
|
8006
8033
|
.withViewContainer(this.viewContainer)
|
|
8007
8034
|
.withSourceComponent(this)
|
|
8035
|
+
.withHostComponent(this.hostComponent)
|
|
8008
8036
|
.withSelectedItems(this.selectedItems);
|
|
8009
8037
|
const instance = this.actionExecutor.triggerAction(this.action, parameters);
|
|
8010
8038
|
this.subscriptions.push(instance.result$.subscribe({
|
|
@@ -8077,10 +8105,10 @@ class MngActionComponent {
|
|
|
8077
8105
|
}
|
|
8078
8106
|
}
|
|
8079
8107
|
MngActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.TranslateService }, { token: MngAuthorizationService }, { token: MngActionExecutorService }, { token: i2$1.ConfirmationService }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
8080
|
-
MngActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngActionComponent, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", queryParam: "queryParam", dataProvider: "dataProvider", inputDisabled: ["disabled", "inputDisabled"], inputLoading: ["loading", "inputLoading"], viewContainerInit: ["viewContainer", "viewContainerInit"], selectedItems: "selectedItems" }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [ConfirmationService], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n <a\n *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n pButton\n pRipple\n [label]=\"($label | async) ?? ''\"\n [icon]=\"$any(action.button.icon)\"\n [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize: itemId:item:actionData)\"\n [target]=\"actionLink.target\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n <ng-template #routerLink>\n <a\n *ngIf=\"actionLink; else button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [target]=\"actionLink.target\"\n [replaceUrl]=\"actionLink.replaceUrl\"\n [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize: itemId:item:actionData)\"\n [queryParams]=\"actionLink.queryParams | parametrize: itemId:item:actionData\"\n [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n </ng-template>\n <ng-template #button>\n <button\n type=\"button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [pTooltip]=\"$any($tooltip | async)\"\n [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n (click)=\"triggerAction($event)\"\n [class]=\"buttonClass\"></button>\n </ng-template>\n <p-confirmDialog\n *ngIf=\"action.runConfirmationDialogDescriptor\"\n [key]=\"action.actionName + '_' + cmpId\"\n [baseZIndex]=\"50\"\n appendTo=\"body\"\n [closable]=\"action.runConfirmationDialogDescriptor.closable\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i9.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "directive", type: i5.Ripple, selector: "[pRipple]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: MngParametrizePipe, name: "parametrize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8108
|
+
MngActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngActionComponent, selector: "mng-action", inputs: { action: "action", item: "item", itemId: "itemId", actionData: "actionData", queryParam: "queryParam", dataProvider: "dataProvider", hostComponent: "hostComponent", routeInit: ["route", "routeInit"], inputDisabled: ["disabled", "inputDisabled"], inputLoading: ["loading", "inputLoading"], viewContainerInit: ["viewContainer", "viewContainerInit"], selectedItems: "selectedItems" }, outputs: { finishEventEmitter: "finish" }, host: { properties: { "class": "this.hostClass", "class.m-0": "this.isHostHidden" } }, providers: [ConfirmationService], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n <a\n *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n pButton\n pRipple\n [label]=\"($label | async) ?? ''\"\n [icon]=\"$any(action.button.icon)\"\n [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize: itemId:item:actionData)\"\n [target]=\"actionLink.target\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n <ng-template #routerLink>\n <a\n *ngIf=\"actionLink; else button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [target]=\"actionLink.target\"\n [replaceUrl]=\"actionLink.replaceUrl\"\n [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize: itemId:item:actionData)\"\n [relativeTo]=\"route\"\n [queryParams]=\"actionLink.queryParams | parametrize: itemId:item:actionData\"\n [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n </ng-template>\n <ng-template #button>\n <button\n type=\"button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [pTooltip]=\"$any($tooltip | async)\"\n [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n (click)=\"triggerAction($event)\"\n [class]=\"buttonClass\"></button>\n </ng-template>\n <p-confirmDialog\n *ngIf=\"action.runConfirmationDialogDescriptor\"\n [key]=\"action.actionName + '_' + cmpId\"\n [baseZIndex]=\"50\"\n appendTo=\"body\"\n [closable]=\"action.runConfirmationDialogDescriptor.closable\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i4$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i9.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "directive", type: i5.Ripple, selector: "[pRipple]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: MngParametrizePipe, name: "parametrize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8081
8109
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionComponent, decorators: [{
|
|
8082
8110
|
type: Component,
|
|
8083
|
-
args: [{ selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ConfirmationService], template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n <a\n *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n pButton\n pRipple\n [label]=\"($label | async) ?? ''\"\n [icon]=\"$any(action.button.icon)\"\n [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize: itemId:item:actionData)\"\n [target]=\"actionLink.target\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n <ng-template #routerLink>\n <a\n *ngIf=\"actionLink; else button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [target]=\"actionLink.target\"\n [replaceUrl]=\"actionLink.replaceUrl\"\n [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize: itemId:item:actionData)\"\n [queryParams]=\"actionLink.queryParams | parametrize: itemId:item:actionData\"\n [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n </ng-template>\n <ng-template #button>\n <button\n type=\"button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [pTooltip]=\"$any($tooltip | async)\"\n [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n (click)=\"triggerAction($event)\"\n [class]=\"buttonClass\"></button>\n </ng-template>\n <p-confirmDialog\n *ngIf=\"action.runConfirmationDialogDescriptor\"\n [key]=\"action.actionName + '_' + cmpId\"\n [baseZIndex]=\"50\"\n appendTo=\"body\"\n [closable]=\"action.runConfirmationDialogDescriptor.closable\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"] }]
|
|
8111
|
+
args: [{ selector: 'mng-action', changeDetection: ChangeDetectionStrategy.OnPush, providers: [ConfirmationService], template: "<ng-container *ngIf=\"($isVisible | async) && ($isPermitted | async)\">\n <a\n *ngIf=\"actionLink && actionLink.url !== ''; else routerLink\"\n pButton\n pRipple\n [label]=\"($label | async) ?? ''\"\n [icon]=\"$any(action.button.icon)\"\n [href]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.url | parametrize: itemId:item:actionData)\"\n [target]=\"actionLink.target\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n <ng-template #routerLink>\n <a\n *ngIf=\"actionLink; else button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [target]=\"actionLink.target\"\n [replaceUrl]=\"actionLink.replaceUrl\"\n [routerLink]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false) ? null : (actionLink.pathSegments | parametrize: itemId:item:actionData)\"\n [relativeTo]=\"route\"\n [queryParams]=\"actionLink.queryParams | parametrize: itemId:item:actionData\"\n [queryParamsHandling]=\"actionLink.queryParamsHandling\"\n [class.disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n [pTooltip]=\"$any($tooltip | async)\"\n [class]=\"buttonClass\"></a>\n </ng-template>\n <ng-template #button>\n <button\n type=\"button\"\n pButton\n pRipple\n [icon]=\"$any(action.button.icon)\"\n [label]=\"($label | async) ?? ''\"\n [pTooltip]=\"$any($tooltip | async)\"\n [loading]=\"(($loading | async) ?? false) || ((inputLoading | async) ?? false)\"\n [disabled]=\"($isEnabled | async) === false || ((inputDisabled | async) ?? false)\"\n (click)=\"triggerAction($event)\"\n [class]=\"buttonClass\"></button>\n </ng-template>\n <p-confirmDialog\n *ngIf=\"action.runConfirmationDialogDescriptor\"\n [key]=\"action.actionName + '_' + cmpId\"\n [baseZIndex]=\"50\"\n appendTo=\"body\"\n [closable]=\"action.runConfirmationDialogDescriptor.closable\"></p-confirmDialog>\n</ng-container>\n", styles: [":host{display:inline-block}\n"] }]
|
|
8084
8112
|
}], ctorParameters: function () {
|
|
8085
8113
|
return [{ type: i1.ActivatedRoute }, { type: i2.TranslateService }, { type: MngAuthorizationService }, { type: MngActionExecutorService }, { type: i2$1.ConfirmationService }, { type: MngViewContainerComponentService, decorators: [{
|
|
8086
8114
|
type: Optional
|
|
@@ -8103,6 +8131,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
|
|
|
8103
8131
|
type: Input
|
|
8104
8132
|
}], dataProvider: [{
|
|
8105
8133
|
type: Input
|
|
8134
|
+
}], hostComponent: [{
|
|
8135
|
+
type: Input
|
|
8136
|
+
}], routeInit: [{
|
|
8137
|
+
type: Input,
|
|
8138
|
+
args: ['route']
|
|
8106
8139
|
}], inputDisabled: [{
|
|
8107
8140
|
type: Input,
|
|
8108
8141
|
args: ['disabled']
|
|
@@ -8143,10 +8176,14 @@ class MngActionRouteComponent {
|
|
|
8143
8176
|
this.subscriptions.push(subscription);
|
|
8144
8177
|
}
|
|
8145
8178
|
ngOnDestroy() {
|
|
8179
|
+
var _a;
|
|
8146
8180
|
this.subscriptions.forEach(s => s.unsubscribe());
|
|
8147
8181
|
if (this.dialogRef) {
|
|
8182
|
+
// unsubscribe first, so that close event does not trigger
|
|
8183
|
+
(_a = this.dialogCloseSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
|
|
8148
8184
|
this.dialogRef.close();
|
|
8149
8185
|
}
|
|
8186
|
+
this.subscriptions.forEach(s => s.unsubscribe());
|
|
8150
8187
|
}
|
|
8151
8188
|
getConfirmationService() {
|
|
8152
8189
|
return this.confirmationService;
|
|
@@ -8171,9 +8208,11 @@ class MngActionRouteComponent {
|
|
|
8171
8208
|
const instance = this.actionExecutor.activateAction(action, new ActionParameters(itemId)
|
|
8172
8209
|
.withActionData(actionData)
|
|
8173
8210
|
.withViewContainer((_a = this.viewContainerService) !== null && _a !== void 0 ? _a : undefined)
|
|
8174
|
-
.withSourceComponent(this)
|
|
8211
|
+
.withSourceComponent(this)
|
|
8212
|
+
.withRoute(this.route));
|
|
8175
8213
|
this.activeActionInstance = instance;
|
|
8176
8214
|
if (instance.activationDialogRef) {
|
|
8215
|
+
this.dialogRef = instance.activationDialogRef;
|
|
8177
8216
|
this.dialogCloseSubscription = instance.activationDialogRef.onClose.subscribe(e => {
|
|
8178
8217
|
var _a;
|
|
8179
8218
|
const actionEv = e;
|
|
@@ -9145,7 +9184,7 @@ class MngActionEditorComponent {
|
|
|
9145
9184
|
this.subscriptions = [];
|
|
9146
9185
|
}
|
|
9147
9186
|
ngOnInit() {
|
|
9148
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
9187
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
|
9149
9188
|
if ((_a = this.dialogConfig) === null || _a === void 0 ? void 0 : _a.data) {
|
|
9150
9189
|
if (this.dialogConfig.data.actionInstance) {
|
|
9151
9190
|
this.instance = this.dialogConfig.data.actionInstance;
|
|
@@ -9158,6 +9197,7 @@ class MngActionEditorComponent {
|
|
|
9158
9197
|
this.actionData = (_g = (_f = this.instance) === null || _f === void 0 ? void 0 : _f.activationParameters) === null || _g === void 0 ? void 0 : _g.actionData;
|
|
9159
9198
|
this.viewContainer = (_j = (_h = this.instance) === null || _h === void 0 ? void 0 : _h.activationParameters) === null || _j === void 0 ? void 0 : _j.viewContainer;
|
|
9160
9199
|
this.sourceComponent = (_l = (_k = this.instance) === null || _k === void 0 ? void 0 : _k.activationParameters) === null || _l === void 0 ? void 0 : _l.sourceComponent;
|
|
9200
|
+
this.dialogRoute = (_o = (_m = this.instance) === null || _m === void 0 ? void 0 : _m.activationParameters) === null || _o === void 0 ? void 0 : _o.route;
|
|
9161
9201
|
if (!this.dataProvider && this.viewContainer) {
|
|
9162
9202
|
const dataProvider = this.viewContainer.getDataProvider();
|
|
9163
9203
|
if (dataProvider && typeof dataProvider['fetch'] === 'function') {
|
|
@@ -9170,7 +9210,7 @@ class MngActionEditorComponent {
|
|
|
9170
9210
|
}
|
|
9171
9211
|
else {
|
|
9172
9212
|
this.isDialog = false;
|
|
9173
|
-
this.viewContainer = (
|
|
9213
|
+
this.viewContainer = (_q = (_p = this.viewContainerInit) !== null && _p !== void 0 ? _p : this.viewContainerService) !== null && _q !== void 0 ? _q : undefined;
|
|
9174
9214
|
}
|
|
9175
9215
|
this.setTitle();
|
|
9176
9216
|
for (const action of this.action.editorActions) {
|
|
@@ -9201,15 +9241,15 @@ class MngActionEditorComponent {
|
|
|
9201
9241
|
}
|
|
9202
9242
|
this.placeActionsOnPositions(action);
|
|
9203
9243
|
}
|
|
9204
|
-
for (const action of (
|
|
9244
|
+
for (const action of (_s = (_r = this.viewContainer) === null || _r === void 0 ? void 0 : _r.getActions().filter(value => { var _a; return (_a = value.positionTableviewCategories) === null || _a === void 0 ? void 0 : _a.includes(this.action.tableviewCategory); })) !== null && _s !== void 0 ? _s : []) {
|
|
9205
9245
|
this.placeActionsOnPositions(action);
|
|
9206
9246
|
}
|
|
9207
9247
|
this.toolbarRightActions = this.toolbarRightActions.reverse();
|
|
9208
9248
|
this.footerRightActions = this.footerRightActions.reverse();
|
|
9209
9249
|
this.loadItemWithDataProvider();
|
|
9210
|
-
if (typeof ((
|
|
9250
|
+
if (typeof ((_t = this.viewContainer) === null || _t === void 0 ? void 0 : _t.getEditorReset$) === 'function') {
|
|
9211
9251
|
const viewContainerEditor = this.viewContainer;
|
|
9212
|
-
viewContainerEditor.getEditorReset$().subscribe({
|
|
9252
|
+
this.subscriptions.push(viewContainerEditor.getEditorReset$().subscribe({
|
|
9213
9253
|
next: e => {
|
|
9214
9254
|
var _a, _b;
|
|
9215
9255
|
if (e.fetch) {
|
|
@@ -9224,7 +9264,15 @@ class MngActionEditorComponent {
|
|
|
9224
9264
|
}
|
|
9225
9265
|
}
|
|
9226
9266
|
}
|
|
9227
|
-
});
|
|
9267
|
+
}));
|
|
9268
|
+
}
|
|
9269
|
+
if (typeof ((_u = this.viewContainer) === null || _u === void 0 ? void 0 : _u.getEditorClose$) === 'function') {
|
|
9270
|
+
const viewContainerEditor = this.viewContainer;
|
|
9271
|
+
this.subscriptions.push(viewContainerEditor.getEditorClose$().subscribe({
|
|
9272
|
+
next: e => {
|
|
9273
|
+
this.cancel();
|
|
9274
|
+
}
|
|
9275
|
+
}));
|
|
9228
9276
|
}
|
|
9229
9277
|
}
|
|
9230
9278
|
ngOnDestroy() {
|
|
@@ -9335,10 +9383,10 @@ class MngActionEditorComponent {
|
|
|
9335
9383
|
}
|
|
9336
9384
|
}
|
|
9337
9385
|
MngActionEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionEditorComponent, deps: [{ token: i0.Injector }, { token: i2.TranslateService }, { token: MngActionExecutorService }, { token: MngCommonsService }, { token: MngNavigationService }, { token: i3.DynamicDialogRef, optional: true }, { token: i3.DynamicDialogConfig, optional: true }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
9338
|
-
MngActionEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngActionEditorComponent, selector: "mng-action-editor", inputs: { action: "action", itemId: "itemId", item: "item", actionData: "actionData", dataProvider: "dataProvider", viewContainerInit: ["viewContainer", "viewContainerInit"] }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }, { propertyName: "editorComponent", first: true, predicate: MngFormEditorComponent, descendants: true }], ngImport: i0, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n <mng-action\n *ngFor=\"let action of toolbarLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n <ng-template pTemplate=\"right\">\n <mng-action\n *ngFor=\"let action of toolbarRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n </p-toolbar>\n </div>\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n <div class=\"text-center\" *ngIf=\"loading$ | async\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n </mng-form-editor>\n </div>\n\n <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n <div>\n <mng-action\n *ngFor=\"let action of footerLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n <div>\n <mng-action\n *ngFor=\"let action of footerRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$1.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { kind: "component", type: i7$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["style", "styleClass", "strokeWidth", "fill", "animationDuration"] }, { kind: "component", type: MngFormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isSubmitButtonVisible", "isFormDisabled"], outputs: ["formSubmit"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9386
|
+
MngActionEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngActionEditorComponent, selector: "mng-action-editor", inputs: { action: "action", itemId: "itemId", item: "item", actionData: "actionData", dataProvider: "dataProvider", viewContainerInit: ["viewContainer", "viewContainerInit"] }, outputs: { actionRunEventEmitter: "actionSubmit", actionCancelEventEmitter: "actionCancel" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true }, { propertyName: "editorComponent", first: true, predicate: MngFormEditorComponent, descendants: true }], ngImport: i0, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n <mng-action\n *ngFor=\"let action of toolbarLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n <ng-template pTemplate=\"right\">\n <mng-action\n *ngFor=\"let action of toolbarRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n </p-toolbar>\n </div>\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n <div class=\"text-center\" *ngIf=\"loading$ | async\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n </mng-form-editor>\n </div>\n\n <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n <div>\n <mng-action\n *ngFor=\"let action of footerLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n <div>\n <mng-action\n *ngFor=\"let action of footerRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$1.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { kind: "component", type: i7$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["style", "styleClass", "strokeWidth", "fill", "animationDuration"] }, { kind: "component", type: MngFormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isSubmitButtonVisible", "isFormDisabled"], outputs: ["formSubmit"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "hostComponent", "route", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9339
9387
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngActionEditorComponent, decorators: [{
|
|
9340
9388
|
type: Component,
|
|
9341
|
-
args: [{ selector: 'mng-action-editor', changeDetection: ChangeDetectionStrategy.OnPush, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n <mng-action\n *ngFor=\"let action of toolbarLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n <ng-template pTemplate=\"right\">\n <mng-action\n *ngFor=\"let action of toolbarRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n </p-toolbar>\n </div>\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n <div class=\"text-center\" *ngIf=\"loading$ | async\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n </mng-form-editor>\n </div>\n\n <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n <div>\n <mng-action\n *ngFor=\"let action of footerLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n <div>\n <mng-action\n *ngFor=\"let action of footerRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n </div>\n</div>\n" }]
|
|
9389
|
+
args: [{ selector: 'mng-action-editor', changeDetection: ChangeDetectionStrategy.OnPush, template: "<h5 *ngIf=\"!isDialog && title\">{{ title }}</h5>\n<div class=\"h-full flex flex-column\">\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n <mng-action\n *ngFor=\"let action of toolbarLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n <ng-template pTemplate=\"right\">\n <mng-action\n *ngFor=\"let action of toolbarRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </ng-template>\n </p-toolbar>\n </div>\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n <div class=\"text-center\" *ngIf=\"loading$ | async\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n <mng-form-editor *ngIf=\"action.editorDescriptor && (loading$ | async) === false\" [descriptor]=\"action.editorDescriptor\" [item]=\"item\" (formSubmit)=\"onSubmit($event)\">\n </mng-form-editor>\n </div>\n\n <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n <div>\n <mng-action\n *ngFor=\"let action of footerLeftActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n <div>\n <mng-action\n *ngFor=\"let action of footerRightActions\"\n [action]=\"action\"\n [disabled]=\"submitLoading$\"\n [viewContainer]=\"viewContainer\"\n [hostComponent]=\"this\"\n [route]=\"dialogRoute\"\n [item]=\"item\"\n [itemId]=\"itemId\"></mng-action>\n </div>\n </div>\n</div>\n" }]
|
|
9342
9390
|
}], ctorParameters: function () {
|
|
9343
9391
|
return [{ type: i0.Injector }, { type: i2.TranslateService }, { type: MngActionExecutorService }, { type: MngCommonsService }, { type: MngNavigationService }, { type: i3.DynamicDialogRef, decorators: [{
|
|
9344
9392
|
type: Optional
|
|
@@ -9496,7 +9544,7 @@ class MngFormlyFieldInputComponent extends FieldType {
|
|
|
9496
9544
|
}
|
|
9497
9545
|
}
|
|
9498
9546
|
MngFormlyFieldInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngFormlyFieldInputComponent, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Component });
|
|
9499
|
-
MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngFormlyFieldInputComponent, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"props.type\">\n <p-inputNumber\n *ngSwitchCase=\"'number'\"\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [min]=\"$any(descriptor.numberMin)\"\n [max]=\"$any(descriptor.numberMax)\"\n [step]=\"$any(descriptor.numberStep)\"\n [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n [inputStyleClass]=\"descriptor.inputClassName\"\n [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n [mode]=\"$any(numberFieldMode)\"\n [currency]=\"$any(currency)\"\n [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n </p-inputNumber>\n\n <div *ngSwitchCase=\"'switch'\" class=\"field flex flex-column\">\n <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ props?.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label>\n <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n <small *ngIf=\"showError\" class=\"p-error\">\n <formly-validation-message [field]=\"field\"></formly-validation-message>\n </small>\n </div>\n\n <ng-container *ngSwitchCase=\"'radio'\">\n <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n <p-radioButton\n [name]=\"$any(key)\"\n [value]=\"option.value\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n </div>\n </ng-container>\n\n <textarea\n *ngSwitchCase=\"'textarea'\"\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [rows]=\"descriptor.rows ?? 3\"\n pInputTextarea\n [class]=\"descriptor.inputClassName\">\n </textarea>\n\n <p-calendar\n *ngSwitchCase=\"'datepicker'\"\n appendTo=\"body\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n [minDate]=\"$any(descriptor.datePickerMin)\"\n [maxDate]=\"$any(descriptor.datePickerMax)\"\n [showTime]=\"descriptor.datePickerShowTime\"\n [showSeconds]=\"descriptor.datePickerShowSeconds\"\n [showIcon]=\"true\"\n [inputStyleClass]=\"descriptor.inputClassName\">\n </p-calendar>\n\n <p-inputMask\n *ngSwitchCase=\"'mask'\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [mask]=\"$any(descriptor.mask)\"\n [placeholder]=\"$any(descriptor.placeholder)\"\n [slotChar]=\"$any(descriptor.slotChar)\"\n [styleClass]=\"descriptor.inputClassName\">\n </p-inputMask>\n\n <p-fileUpload\n *ngSwitchCase=\"'file'\"\n [multiple]=\"descriptor.fileMultiple\"\n [accept]=\"$any(descriptor.fileAccept)\"\n [maxFileSize]=\"descriptor.fileMaxFileSize\"\n [showUploadButton]=\"false\"\n (onSelect)=\"onFileSelect($event)\"\n (onRemove)=\"onFileRemove($event)\"\n (onClear)=\"onFileClear($event)\">\n </p-fileUpload>\n\n <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$3.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "component", type: i4$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: i5$3.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler"] }, { kind: "component", type: i6$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: i7$2.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "component", type: i8.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "directive", type: i9$1.InputText, selector: "[pInputText]" }, { kind: "directive", type: i10.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "component", type: i11.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9547
|
+
MngFormlyFieldInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngFormlyFieldInputComponent, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"props.type\">\n <p-inputNumber\n *ngSwitchCase=\"'number'\"\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [min]=\"$any(descriptor.numberMin)\"\n [max]=\"$any(descriptor.numberMax)\"\n [step]=\"$any(descriptor.numberStep)\"\n [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n [inputStyleClass]=\"descriptor.inputClassName\"\n [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n [mode]=\"$any(numberFieldMode)\"\n [currency]=\"$any(currency)\"\n [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n </p-inputNumber>\n\n <div *ngSwitchCase=\"'switch'\" class=\"field flex flex-column\">\n <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ props?.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label>\n <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n <small *ngIf=\"showError\" class=\"p-error\">\n <formly-validation-message [field]=\"field\"></formly-validation-message>\n </small>\n </div>\n\n <ng-container *ngSwitchCase=\"'radio'\">\n <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n <p-radioButton\n [name]=\"$any(key)\"\n [value]=\"option.value\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n </div>\n </ng-container>\n\n <textarea\n *ngSwitchCase=\"'textarea'\"\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [rows]=\"descriptor.rows ?? 3\"\n pInputTextarea\n [class]=\"descriptor.inputClassName\">\n </textarea>\n\n <p-calendar\n *ngSwitchCase=\"'datepicker'\"\n appendTo=\"body\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n [minDate]=\"$any(descriptor.datePickerMin)\"\n [maxDate]=\"$any(descriptor.datePickerMax)\"\n [showTime]=\"descriptor.datePickerShowTime\"\n [showSeconds]=\"descriptor.datePickerShowSeconds\"\n [showIcon]=\"true\"\n [inputStyleClass]=\"descriptor.inputClassName\">\n </p-calendar>\n\n <p-inputMask\n *ngSwitchCase=\"'mask'\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [mask]=\"$any(descriptor.mask)\"\n [placeholder]=\"$any(descriptor.placeholder)\"\n [slotChar]=\"$any(descriptor.slotChar)\"\n [styleClass]=\"descriptor.inputClassName\">\n </p-inputMask>\n\n <p-fileUpload\n *ngSwitchCase=\"'file'\"\n [multiple]=\"descriptor.fileMultiple\"\n [accept]=\"$any(descriptor.fileAccept)\"\n [maxFileSize]=\"descriptor.fileMaxFileSize\"\n [showUploadButton]=\"false\"\n (onSelect)=\"onFileSelect($event)\"\n (onRemove)=\"onFileRemove($event)\"\n (onClear)=\"onFileClear($event)\">\n </p-fileUpload>\n\n <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$3.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "component", type: i4$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: i5$3.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError"] }, { kind: "component", type: i6$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: i7$2.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "component", type: i8.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }, { kind: "directive", type: i9$1.InputText, selector: "[pInputText]" }, { kind: "directive", type: i10.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "component", type: i11.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9500
9548
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngFormlyFieldInputComponent, decorators: [{
|
|
9501
9549
|
type: Component,
|
|
9502
9550
|
args: [{ selector: 'mng-formly-field-input', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"props.type\">\n <p-inputNumber\n *ngSwitchCase=\"'number'\"\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [min]=\"$any(descriptor.numberMin)\"\n [max]=\"$any(descriptor.numberMax)\"\n [step]=\"$any(descriptor.numberStep)\"\n [useGrouping]=\"$any(descriptor.numberUseGrouping)\"\n [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n [inputStyleClass]=\"descriptor.inputClassName\"\n [locale]=\"$any(descriptor.locale ?? applicationLocale)\"\n [mode]=\"$any(numberFieldMode)\"\n [currency]=\"$any(currency)\"\n [currencyDisplay]=\"$any(descriptor.currencyDisplay)\">\n </p-inputNumber>\n\n <div *ngSwitchCase=\"'switch'\" class=\"field flex flex-column\">\n <label [for]=\"key\" [class]=\"descriptor.labelClassName\">{{ props?.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label>\n <p-inputSwitch [id]=\"$any(key)\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [styleClass]=\"descriptor.inputClassName\"></p-inputSwitch>\n <small *ngIf=\"showError\" class=\"p-error\">\n <formly-validation-message [field]=\"field\"></formly-validation-message>\n </small>\n </div>\n\n <ng-container *ngSwitchCase=\"'radio'\">\n <div *ngFor=\"let option of descriptor.radioOptions\" [id]=\"$any(key)\" class=\"field-radiobutton\">\n <p-radioButton\n [name]=\"$any(key)\"\n [value]=\"option.value\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [styleClass]=\"descriptor.inputClassName\"></p-radioButton>\n <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + descriptor.labelClassName\">{{ option.title | translate }}</label>\n </div>\n </ng-container>\n\n <textarea\n *ngSwitchCase=\"'textarea'\"\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [rows]=\"descriptor.rows ?? 3\"\n pInputTextarea\n [class]=\"descriptor.inputClassName\">\n </textarea>\n\n <p-calendar\n *ngSwitchCase=\"'datepicker'\"\n appendTo=\"body\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n [minDate]=\"$any(descriptor.datePickerMin)\"\n [maxDate]=\"$any(descriptor.datePickerMax)\"\n [showTime]=\"descriptor.datePickerShowTime\"\n [showSeconds]=\"descriptor.datePickerShowSeconds\"\n [showIcon]=\"true\"\n [inputStyleClass]=\"descriptor.inputClassName\">\n </p-calendar>\n\n <p-inputMask\n *ngSwitchCase=\"'mask'\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [mask]=\"$any(descriptor.mask)\"\n [placeholder]=\"$any(descriptor.placeholder)\"\n [slotChar]=\"$any(descriptor.slotChar)\"\n [styleClass]=\"descriptor.inputClassName\">\n </p-inputMask>\n\n <p-fileUpload\n *ngSwitchCase=\"'file'\"\n [multiple]=\"descriptor.fileMultiple\"\n [accept]=\"$any(descriptor.fileAccept)\"\n [maxFileSize]=\"descriptor.fileMaxFileSize\"\n [showUploadButton]=\"false\"\n (onSelect)=\"onFileSelect($event)\"\n (onRemove)=\"onFileRemove($event)\"\n (onClear)=\"onFileClear($event)\">\n </p-fileUpload>\n\n <input *ngSwitchDefault pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" />\n</ng-container>\n" }]
|
|
@@ -9740,7 +9788,7 @@ class MngTableColumnFilterComponent {
|
|
|
9740
9788
|
}
|
|
9741
9789
|
}
|
|
9742
9790
|
MngTableColumnFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableColumnFilterComponent, deps: [{ token: i2$1.PrimeNGConfig }], target: i0.ɵɵFactoryTarget.Component });
|
|
9743
|
-
MngTableColumnFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: { descriptor: "descriptor", display: "display" }, viewQueries: [{ propertyName: "primeColumnFilter", first: true, predicate: ColumnFilter, descendants: true }], ngImport: i0, template: "<p-columnFilter\n class=\"ml-auto\"\n [type]=\"primeType\"\n [field]=\"descriptor.property\"\n [display]=\"primeDisplay\"\n [matchMode]=\"$any(primeDefaultMatchMode)\"\n [matchModeOptions]=\"$any(primeMatchModes)\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n [showMatchModes]=\"true\"\n [showOperator]=\"false\"\n [showAddButton]=\"false\"\n [hideOnClear]=\"true\"\n [showMenu]=\"primeShowMatchMode\"\n [minFractionDigits]=\"$any(descriptor.numberMinFractionDigits)\"\n [maxFractionDigits]=\"$any(descriptor.numberMaxFractionDigits)\"\n [useGrouping]=\"descriptor.numberUseGrouping\">\n <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n <mng-date-range\n [ngModel]=\"value\"\n (ngModelChange)=\"dateFilter($event, filterCallback)\"\n [showTime]=\"descriptor.datePickerShowTime\"\n [dateFormat]=\"descriptor.datePickerFormat\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"></mng-date-range>\n </ng-container>\n <ng-template #datePicker>\n <p-calendar\n appendTo=\"body\"\n [ngModel]=\"value\"\n (ngModelChange)=\"dateFilter($event, filterCallback)\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n [showIcon]=\"true\"\n [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n [showTime]=\"descriptor.datePickerShowTime\">\n </p-calendar>\n </ng-template>\n </ng-template>\n <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n <mng-autocomplete\n *ngSwitchCase=\"lookupTypeAutocomplete\"\n [ngModel]=\"value\"\n [dataProvider]=\"lookupDescriptor.dataProvider\"\n [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n [multiselect]=\"lookupDescriptor.multiselect\"\n [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n [className]=\"lookupDescriptor.className\"\n [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n </mng-autocomplete>\n <mng-dropdown\n *ngSwitchCase=\"lookupTypeDropdown\"\n [ngModel]=\"value\"\n [dataProvider]=\"lookupDescriptor.dataProvider\"\n [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n [multiselect]=\"lookupDescriptor.multiselect\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n [className]=\"lookupDescriptor.className\"\n [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n [showClear]=\"false\"\n [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n (valueChange)=\"dropdownFilter($event, filterCallback)\">\n </mng-dropdown>\n </ng-container>\n </ng-template>\n</p-columnFilter>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$3.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"] }, { kind: "component", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst"], outputs: ["valueChange"] }, { kind: "component", type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "component", type: MngDateRangeComponent, selector: "mng-date-range", inputs: ["placeholder", "showTime", "showSeconds", "dateFormat"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
9791
|
+
MngTableColumnFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: { descriptor: "descriptor", display: "display" }, viewQueries: [{ propertyName: "primeColumnFilter", first: true, predicate: ColumnFilter, descendants: true }], ngImport: i0, template: "<p-columnFilter\n class=\"ml-auto\"\n [type]=\"primeType\"\n [field]=\"descriptor.property\"\n [display]=\"primeDisplay\"\n [matchMode]=\"$any(primeDefaultMatchMode)\"\n [matchModeOptions]=\"$any(primeMatchModes)\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n [showMatchModes]=\"true\"\n [showOperator]=\"false\"\n [showAddButton]=\"false\"\n [hideOnClear]=\"true\"\n [showMenu]=\"primeShowMatchMode\"\n [minFractionDigits]=\"$any(descriptor.numberMinFractionDigits)\"\n [maxFractionDigits]=\"$any(descriptor.numberMaxFractionDigits)\"\n [useGrouping]=\"descriptor.numberUseGrouping\">\n <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n <mng-date-range\n [ngModel]=\"value\"\n (ngModelChange)=\"dateFilter($event, filterCallback)\"\n [showTime]=\"descriptor.datePickerShowTime\"\n [dateFormat]=\"descriptor.datePickerFormat\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"></mng-date-range>\n </ng-container>\n <ng-template #datePicker>\n <p-calendar\n appendTo=\"body\"\n [ngModel]=\"value\"\n (ngModelChange)=\"dateFilter($event, filterCallback)\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n [showIcon]=\"true\"\n [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n [showTime]=\"descriptor.datePickerShowTime\">\n </p-calendar>\n </ng-template>\n </ng-template>\n <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n <mng-autocomplete\n *ngSwitchCase=\"lookupTypeAutocomplete\"\n [ngModel]=\"value\"\n [dataProvider]=\"lookupDescriptor.dataProvider\"\n [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n [multiselect]=\"lookupDescriptor.multiselect\"\n [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n [className]=\"lookupDescriptor.className\"\n [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n </mng-autocomplete>\n <mng-dropdown\n *ngSwitchCase=\"lookupTypeDropdown\"\n [ngModel]=\"value\"\n [dataProvider]=\"lookupDescriptor.dataProvider\"\n [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n [multiselect]=\"lookupDescriptor.multiselect\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n [className]=\"lookupDescriptor.className\"\n [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n [showClear]=\"false\"\n [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n (valueChange)=\"dropdownFilter($event, filterCallback)\">\n </mng-dropdown>\n </ng-container>\n </ng-template>\n</p-columnFilter>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$3.ColumnFilter, selector: "p-columnFilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping", "showButtons"] }, { kind: "component", type: MngAutocompleteComponent, selector: "mng-autocomplete", inputs: ["dataProvider", "dataKeyProperty", "itemsValueProperty", "itemsLabelProperty", "itemsLabelTranslate", "inlineSearch", "openOnFocus", "multiselect", "placeholder", "className", "dropdownClassName", "showClear", "autoClear", "selectFirst"], outputs: ["valueChange"] }, { kind: "component", type: MngDropdownComponent, selector: "mng-dropdown", inputs: ["dataProvider", "dataKeyProperty", "itemsLabelProperty", "itemsLabelTranslate", "itemsValueProperty", "itemsDisabledProperty", "multiselect", "placeholder", "showClear", "selectFirstItem", "className", "dropdownClassName", "changeValueOnBlur"], outputs: ["valueChange"] }, { kind: "component", type: MngDateRangeComponent, selector: "mng-date-range", inputs: ["placeholder", "showTime", "showSeconds", "dateFormat"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
9744
9792
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableColumnFilterComponent, decorators: [{
|
|
9745
9793
|
type: Component,
|
|
9746
9794
|
args: [{ selector: 'mng-table-column-filter', template: "<p-columnFilter\n class=\"ml-auto\"\n [type]=\"primeType\"\n [field]=\"descriptor.property\"\n [display]=\"primeDisplay\"\n [matchMode]=\"$any(primeDefaultMatchMode)\"\n [matchModeOptions]=\"$any(primeMatchModes)\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n [showMatchModes]=\"true\"\n [showOperator]=\"false\"\n [showAddButton]=\"false\"\n [hideOnClear]=\"true\"\n [showMenu]=\"primeShowMatchMode\"\n [minFractionDigits]=\"$any(descriptor.numberMinFractionDigits)\"\n [maxFractionDigits]=\"$any(descriptor.numberMaxFractionDigits)\"\n [useGrouping]=\"descriptor.numberUseGrouping\">\n <ng-template *ngIf=\"primeType === 'date'\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n <ng-container *ngIf=\"activeMatchMode === 'between'; else datePicker\">\n <mng-date-range\n [ngModel]=\"value\"\n (ngModelChange)=\"dateFilter($event, filterCallback)\"\n [showTime]=\"descriptor.datePickerShowTime\"\n [dateFormat]=\"descriptor.datePickerFormat\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"></mng-date-range>\n </ng-container>\n <ng-template #datePicker>\n <p-calendar\n appendTo=\"body\"\n [ngModel]=\"value\"\n (ngModelChange)=\"dateFilter($event, filterCallback)\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.typeToFilter' | translate\"\n [showIcon]=\"true\"\n [dateFormat]=\"descriptor.datePickerFormat ?? 'dd.mm.yy'\"\n [showTime]=\"descriptor.datePickerShowTime\">\n </p-calendar>\n </ng-template>\n </ng-template>\n <ng-template *ngIf=\"lookupDescriptor\" pTemplate=\"filter\" let-value let-filterCallback=\"filterCallback\">\n <ng-container [ngSwitch]=\"lookupDescriptor.lookupType\">\n <mng-autocomplete\n *ngSwitchCase=\"lookupTypeAutocomplete\"\n [ngModel]=\"value\"\n [dataProvider]=\"lookupDescriptor.dataProvider\"\n [dataKeyProperty]=\"lookupDescriptor.dataKeyProperty\"\n [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n [multiselect]=\"lookupDescriptor.multiselect\"\n [openOnFocus]=\"lookupDescriptor.autocompleteOpenOnFocus\"\n [inlineSearch]=\"lookupDescriptor.autocompleteInlineSearch\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.searchToFilter' | translate\"\n [className]=\"lookupDescriptor.className\"\n [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n (valueChange)=\"autocompleteFilter($event, filterCallback)\">\n </mng-autocomplete>\n <mng-dropdown\n *ngSwitchCase=\"lookupTypeDropdown\"\n [ngModel]=\"value\"\n [dataProvider]=\"lookupDescriptor.dataProvider\"\n [itemsValueProperty]=\"lookupDescriptor.itemsValueProperty\"\n [itemsLabelProperty]=\"lookupDescriptor.itemsLabelProperty\"\n [itemsLabelTranslate]=\"lookupDescriptor.itemsLabelTranslate\"\n [multiselect]=\"lookupDescriptor.multiselect\"\n [placeholder]=\"descriptor.placeholder ?? 'mngTable.selectToFilter' | translate\"\n [className]=\"lookupDescriptor.className\"\n [dropdownClassName]=\"lookupDescriptor.dropdownClassName\"\n [showClear]=\"false\"\n [changeValueOnBlur]=\"lookupDescriptor.multiselect\"\n (valueChange)=\"dropdownFilter($event, filterCallback)\">\n </mng-dropdown>\n </ng-container>\n </ng-template>\n</p-columnFilter>\n" }]
|
|
@@ -9813,16 +9861,18 @@ class MngTableComponent {
|
|
|
9813
9861
|
this.subscriptions = [];
|
|
9814
9862
|
}
|
|
9815
9863
|
ngOnInit() {
|
|
9816
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m
|
|
9864
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
9817
9865
|
this.viewContainer = (_b = (_a = this.viewContainerInit) !== null && _a !== void 0 ? _a : this.viewContainerService) !== null && _b !== void 0 ? _b : undefined;
|
|
9866
|
+
// Used for configs within this method and is not dynamically set by TableDynamicDescriptor
|
|
9867
|
+
const baseConfigDescriptor = this.initialDescriptor;
|
|
9818
9868
|
if (!(this.initialDescriptor instanceof TableDynamicDescriptor)) {
|
|
9819
9869
|
this.descriptor = this.initialDescriptor;
|
|
9820
9870
|
}
|
|
9821
9871
|
// map row settings
|
|
9822
9872
|
this.filterDescriptors = (_d = (_c = this.descriptor) === null || _c === void 0 ? void 0 : _c.columns.filter(c => typeof c.filterDescriptor !== 'undefined').map(c => c.filterDescriptor)) !== null && _d !== void 0 ? _d : [];
|
|
9823
9873
|
this.hasColumnFilters = this.filterDescriptors.length > 0;
|
|
9824
|
-
this.rows = (
|
|
9825
|
-
this.rowsPerPageOptions = (
|
|
9874
|
+
this.rows = (_e = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.defaultNumRows) !== null && _e !== void 0 ? _e : 25;
|
|
9875
|
+
this.rowsPerPageOptions = (_f = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.rowsPerPageOptions) !== null && _f !== void 0 ? _f : [25, 50, 100];
|
|
9826
9876
|
// process actions
|
|
9827
9877
|
for (const action of this.actions) {
|
|
9828
9878
|
switch (action.position) {
|
|
@@ -9836,14 +9886,14 @@ class MngTableComponent {
|
|
|
9836
9886
|
}
|
|
9837
9887
|
this.showInlineActionsColumn = typeof this.columnActionComponent !== 'undefined' || this.rowInlineActions.length > 0;
|
|
9838
9888
|
// define all styles
|
|
9839
|
-
this.className = (
|
|
9840
|
-
this.tableFullHeightOffset = (
|
|
9841
|
-
this.rowHeight = (
|
|
9889
|
+
this.className = (_g = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.className) !== null && _g !== void 0 ? _g : '';
|
|
9890
|
+
this.tableFullHeightOffset = (_h = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.tableFullHeightOffset) !== null && _h !== void 0 ? _h : null;
|
|
9891
|
+
this.rowHeight = (_j = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.rowHeight) !== null && _j !== void 0 ? _j : null;
|
|
9842
9892
|
if (typeof this.isColumnClickable === 'undefined') {
|
|
9843
9893
|
// define if cell click is being observed via output
|
|
9844
9894
|
this.isColumnClickable = this.rowClickActions.length > 0 || this.cellClickEventEmitter.observed;
|
|
9845
9895
|
}
|
|
9846
|
-
switch (
|
|
9896
|
+
switch (baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.size) {
|
|
9847
9897
|
case TableSizeEnum.Small:
|
|
9848
9898
|
this.className += ' p-datatable-sm';
|
|
9849
9899
|
break;
|
|
@@ -9851,17 +9901,17 @@ class MngTableComponent {
|
|
|
9851
9901
|
this.className += ' p-datatable-lg';
|
|
9852
9902
|
break;
|
|
9853
9903
|
}
|
|
9854
|
-
if (
|
|
9904
|
+
if (baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.hasGridlines) {
|
|
9855
9905
|
this.className += ' p-datatable-gridlines';
|
|
9856
9906
|
}
|
|
9857
|
-
if (
|
|
9858
|
-
this.columnActionMinWidth = StylesUtil.calculateTableColumnActionWidth(
|
|
9907
|
+
if (baseConfigDescriptor && !this.columnActionMinWidth) {
|
|
9908
|
+
this.columnActionMinWidth = StylesUtil.calculateTableColumnActionWidth(baseConfigDescriptor, this.rowInlineActions);
|
|
9859
9909
|
}
|
|
9860
9910
|
// check if infinite scroll
|
|
9861
9911
|
let paginationMode = TablePaginationModeEnum.None;
|
|
9862
|
-
if (typeof (
|
|
9912
|
+
if (typeof (baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.paginationMode) !== 'undefined') {
|
|
9863
9913
|
// descriptor choice is the most strong - if defined, use this value
|
|
9864
|
-
paginationMode =
|
|
9914
|
+
paginationMode = baseConfigDescriptor.paginationMode;
|
|
9865
9915
|
}
|
|
9866
9916
|
else if (typeof this.dataProvider !== 'undefined') {
|
|
9867
9917
|
// when data provider is used, use pagination
|
|
@@ -9869,8 +9919,8 @@ class MngTableComponent {
|
|
|
9869
9919
|
}
|
|
9870
9920
|
if (paginationMode === TablePaginationModeEnum.InfiniteScroll) {
|
|
9871
9921
|
this.infiniteScroll = true;
|
|
9872
|
-
this.tableFullHeightOffset = (
|
|
9873
|
-
this.rowHeight = (
|
|
9922
|
+
this.tableFullHeightOffset = (_k = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.tableFullHeightOffset) !== null && _k !== void 0 ? _k : 315;
|
|
9923
|
+
this.rowHeight = (_l = baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.rowHeight) !== null && _l !== void 0 ? _l : 45;
|
|
9874
9924
|
this.useQueryParams = false;
|
|
9875
9925
|
}
|
|
9876
9926
|
else if (paginationMode === TablePaginationModeEnum.Pagination) {
|
|
@@ -9915,7 +9965,7 @@ class MngTableComponent {
|
|
|
9915
9965
|
return queryResult;
|
|
9916
9966
|
}));
|
|
9917
9967
|
if (!isObservable(this.items)) {
|
|
9918
|
-
this.itemsSubject.next((
|
|
9968
|
+
this.itemsSubject.next((_m = this.items) !== null && _m !== void 0 ? _m : []);
|
|
9919
9969
|
}
|
|
9920
9970
|
}
|
|
9921
9971
|
if (typeof this.loading !== 'undefined') {
|
|
@@ -9924,7 +9974,7 @@ class MngTableComponent {
|
|
|
9924
9974
|
}
|
|
9925
9975
|
const initialQueryParamMap = this.route.snapshot.queryParamMap;
|
|
9926
9976
|
if (this.useQueryParams &&
|
|
9927
|
-
((!initialQueryParamMap.has('sort') && (
|
|
9977
|
+
((!initialQueryParamMap.has('sort') && (baseConfigDescriptor === null || baseConfigDescriptor === void 0 ? void 0 : baseConfigDescriptor.hasDefaultSort)) ||
|
|
9928
9978
|
(!initialQueryParamMap.has('filter') && this.filterDescriptors.some(fd => fd.hasDefaultValue)))) {
|
|
9929
9979
|
// default sort/filters are applied, no additional filtering/sorting is specified in query param
|
|
9930
9980
|
// redirect must be done at first step
|
|
@@ -10062,6 +10112,10 @@ class MngTableComponent {
|
|
|
10062
10112
|
this.descriptor = this.initialDescriptor.toTableDescriptorFromData(res);
|
|
10063
10113
|
this.filterDescriptors = this.descriptor.columns.filter(c => typeof c.filterDescriptor !== 'undefined').map(c => c.filterDescriptor);
|
|
10064
10114
|
this.hasColumnFilters = this.filterDescriptors.length > 0;
|
|
10115
|
+
this.isPagination = false;
|
|
10116
|
+
this.infiniteScroll = false;
|
|
10117
|
+
this.rows = this.initialDescriptor.defaultNumRows;
|
|
10118
|
+
this.rowsPerPageOptions = this.initialDescriptor.rowsPerPageOptions;
|
|
10065
10119
|
// } else {
|
|
10066
10120
|
// this.descriptor = this.initialDescriptor.onDataReceivedTypeBuilding(res);
|
|
10067
10121
|
}
|
|
@@ -10257,10 +10311,10 @@ class MngTableComponent {
|
|
|
10257
10311
|
}
|
|
10258
10312
|
}
|
|
10259
10313
|
MngTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.TranslateService }, { token: MngActionExecutorService }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
10260
|
-
MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableComponent, selector: "mng-table", inputs: { initialDescriptor: ["descriptor", "initialDescriptor"], items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th\n *ngIf=\"col.isSortEnabled\"\n [pSortableColumn]=\"col.property\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th\n *ngIf=\"!col.isSortEnabled\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"\n col.className +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor ? ' mng-column-filter-' + col.filterDescriptor.filterType : '')\n \"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i6$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i6$3.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "component", type: i6$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i6$3.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i6$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i6$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i7$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { kind: "component", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: MngI18nPropertyPipe, name: "i18nProperty" }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10314
|
+
MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableComponent, selector: "mng-table", inputs: { initialDescriptor: ["descriptor", "initialDescriptor"], items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th\n *ngIf=\"col.isSortEnabled\"\n [pSortableColumn]=\"col.property\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th\n *ngIf=\"!col.isSortEnabled\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"\n col.className +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor ? ' mng-column-filter-' + col.filterDescriptor.filterType : '')\n \"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [viewContainer]=\"viewContainerInit\"\n [hostComponent]=\"this\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i6$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i6$3.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "component", type: i6$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i6$3.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i6$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i6$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i7$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { kind: "component", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "hostComponent", "route", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: MngI18nPropertyPipe, name: "i18nProperty" }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10261
10315
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableComponent, decorators: [{
|
|
10262
10316
|
type: Component,
|
|
10263
|
-
args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th\n *ngIf=\"col.isSortEnabled\"\n [pSortableColumn]=\"col.property\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th\n *ngIf=\"!col.isSortEnabled\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"\n col.className +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor ? ' mng-column-filter-' + col.filterDescriptor.filterType : '')\n \"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n" }]
|
|
10317
|
+
args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th\n *ngIf=\"col.isSortEnabled\"\n [pSortableColumn]=\"col.property\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th\n *ngIf=\"!col.isSortEnabled\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\"\n [class]=\"\n col.headerClassName +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor\n ? ' mng-column-filter-' + col.filterDescriptor.filterType\n : '')\n \">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"\n col.className +\n (descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters && col.filterDescriptor ? ' mng-column-filter-' + col.filterDescriptor.filterType : '')\n \"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\"\n [style.max-width.px]=\"col.maxWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [viewContainer]=\"viewContainerInit\"\n [hostComponent]=\"this\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n" }]
|
|
10264
10318
|
}], ctorParameters: function () {
|
|
10265
10319
|
return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2.TranslateService }, { type: MngActionExecutorService }, { type: MngViewContainerComponentService, decorators: [{
|
|
10266
10320
|
type: Optional
|
|
@@ -10398,10 +10452,10 @@ class MngTableviewComponent {
|
|
|
10398
10452
|
}
|
|
10399
10453
|
}
|
|
10400
10454
|
MngTableviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableviewComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2$1.MessageService }, { token: i2.TranslateService }, { token: i3.DialogService }, { token: i2$1.ConfirmationService }, { token: MngActionExecutorService }, { token: MngViewContainerComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
10401
|
-
MngTableviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableviewComponent, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [MessageService, ConfirmationService, MngViewContainerComponentService], queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "tableComponent", first: true, predicate: MngTableComponent, descendants: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n <p-toast></p-toast>\n\n <div class=\"card\">\n <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <ng-template pTemplate=\"left\">\n <mng-action
|
|
10455
|
+
MngTableviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableviewComponent, selector: "mng-tableview", inputs: { descriptor: "descriptor", dataProvider: "dataProvider", actions: "actions" }, providers: [MessageService, ConfirmationService, MngViewContainerComponentService], queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "tableComponent", first: true, predicate: MngTableComponent, descendants: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n <p-toast></p-toast>\n\n <div class=\"card\">\n <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <ng-template pTemplate=\"left\">\n <mng-action\n *ngFor=\"let action of toolbarLeftActions\"\n [action]=\"action\"\n [queryParam]=\"tableQueryParam\"\n [hostComponent]=\"this\"\n [selectedItems]=\"selectedItems\"></mng-action>\n </ng-template>\n\n <ng-template pTemplate=\"right\">\n <mng-action\n *ngFor=\"let action of toolbarRightActions\"\n [action]=\"action\"\n [queryParam]=\"tableQueryParam\"\n [hostComponent]=\"this\"\n [selectedItems]=\"selectedItems\"></mng-action>\n </ng-template>\n </p-toolbar>\n\n <mng-table\n [descriptor]=\"descriptor.table\"\n [dataProvider]=\"dataProvider\"\n [useQueryParams]=\"true\"\n [actions]=\"tableActions\"\n [selectionEnabled]=\"hasItemSelectionAction\"\n [selectionMode]=\"'multiple'\"\n (tableLoad)=\"onTableLoad($event)\"\n (selectionChange)=\"selectionChange($event)\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex flex-column md:flex-row md:justify-content-between table-header\">\n <h5 class=\"p-0 m-0\">{{ descriptor.tableTitle ?? '' | translate }}</h5>\n </div>\n </ng-template>\n\n <ng-template let-queryResult=\"queryResult\" mngTemplate=\"footer\">\n <ng-container *ngIf=\"footerTemplate\" [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </mng-table>\n </div>\n\n <router-outlet></router-outlet>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7$4.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "component", type: i6$1.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass"] }, { kind: "directive", type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "component", type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "hostComponent", "route", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
10402
10456
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableviewComponent, decorators: [{
|
|
10403
10457
|
type: Component,
|
|
10404
|
-
args: [{ selector: 'mng-tableview', providers: [MessageService, ConfirmationService, MngViewContainerComponentService], template: "<div class=\"mng-tableview\">\n <p-toast></p-toast>\n\n <div class=\"card\">\n <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <ng-template pTemplate=\"left\">\n <mng-action
|
|
10458
|
+
args: [{ selector: 'mng-tableview', providers: [MessageService, ConfirmationService, MngViewContainerComponentService], template: "<div class=\"mng-tableview\">\n <p-toast></p-toast>\n\n <div class=\"card\">\n <p-toolbar styleClass=\"mb-4\" *ngIf=\"toolbarLeftActions.length > 0 || toolbarRightActions.length > 0\">\n <ng-template pTemplate=\"left\">\n <mng-action\n *ngFor=\"let action of toolbarLeftActions\"\n [action]=\"action\"\n [queryParam]=\"tableQueryParam\"\n [hostComponent]=\"this\"\n [selectedItems]=\"selectedItems\"></mng-action>\n </ng-template>\n\n <ng-template pTemplate=\"right\">\n <mng-action\n *ngFor=\"let action of toolbarRightActions\"\n [action]=\"action\"\n [queryParam]=\"tableQueryParam\"\n [hostComponent]=\"this\"\n [selectedItems]=\"selectedItems\"></mng-action>\n </ng-template>\n </p-toolbar>\n\n <mng-table\n [descriptor]=\"descriptor.table\"\n [dataProvider]=\"dataProvider\"\n [useQueryParams]=\"true\"\n [actions]=\"tableActions\"\n [selectionEnabled]=\"hasItemSelectionAction\"\n [selectionMode]=\"'multiple'\"\n (tableLoad)=\"onTableLoad($event)\"\n (selectionChange)=\"selectionChange($event)\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex flex-column md:flex-row md:justify-content-between table-header\">\n <h5 class=\"p-0 m-0\">{{ descriptor.tableTitle ?? '' | translate }}</h5>\n </div>\n </ng-template>\n\n <ng-template let-queryResult=\"queryResult\" mngTemplate=\"footer\">\n <ng-container *ngIf=\"footerTemplate\" [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </mng-table>\n </div>\n\n <router-outlet></router-outlet>\n</div>\n" }]
|
|
10405
10459
|
}], ctorParameters: function () { return [{ type: i1.ActivatedRoute }, { type: i2$1.MessageService }, { type: i2.TranslateService }, { type: i3.DialogService }, { type: i2$1.ConfirmationService }, { type: MngActionExecutorService }, { type: MngViewContainerComponentService }]; }, propDecorators: { descriptor: [{
|
|
10406
10460
|
type: Input
|
|
10407
10461
|
}], dataProvider: [{
|
|
@@ -10435,7 +10489,10 @@ class AMngTableviewRouteComponent {
|
|
|
10435
10489
|
this.createActionDescriptorForEdit(),
|
|
10436
10490
|
this.createActionDescriptorForDelete(),
|
|
10437
10491
|
this.createActionDescriptorForRefresh(),
|
|
10438
|
-
this.createActionDescriptorForExport()
|
|
10492
|
+
this.createActionDescriptorForExport(),
|
|
10493
|
+
//details actions
|
|
10494
|
+
this.createActionDescriptorForDetailsEditLink(),
|
|
10495
|
+
this.createActionDescriptorForDetailsDelete()
|
|
10439
10496
|
].filter(e => e != null);
|
|
10440
10497
|
}
|
|
10441
10498
|
createActionDescriptorForDetails(descriptor = this.descriptor.detailsEditor) {
|
|
@@ -10447,6 +10504,37 @@ class AMngTableviewRouteComponent {
|
|
|
10447
10504
|
createActionDescriptorForEdit(descriptor = this.descriptor.editEditor) {
|
|
10448
10505
|
return !this.routeData.tableviewActions || this.routeData.tableviewActions.hasEdit ? new ActionEditorEditDescriptor(descriptor) : null;
|
|
10449
10506
|
}
|
|
10507
|
+
createActionDescriptorForDetailsEditLink(descriptor = this.descriptor.model) {
|
|
10508
|
+
if (!this.routeData.tableviewActions || this.routeData.tableviewActions.hasEdit) {
|
|
10509
|
+
const action = new ActionLinkDescriptor(descriptor, ActionEditorEditDescriptor.ACTION_NAME)
|
|
10510
|
+
.withTableviewCategory(TableviewActionDefaultCategories.EDIT)
|
|
10511
|
+
.withPositionTableviewCategories([TableviewActionDefaultCategories.DETAILS])
|
|
10512
|
+
.withPosition(ActionPositionEnum.FooterLeft)
|
|
10513
|
+
.withRouterLink('./edit');
|
|
10514
|
+
action.button.styleClass.withActionLevel(StyleLevelEnum.Secondary);
|
|
10515
|
+
action.button.withIcon('pi pi-pencil');
|
|
10516
|
+
return action;
|
|
10517
|
+
}
|
|
10518
|
+
return null;
|
|
10519
|
+
}
|
|
10520
|
+
createActionDescriptorForDetailsDelete(descriptor = this.descriptor.model) {
|
|
10521
|
+
const action = this.createActionDescriptorForDelete();
|
|
10522
|
+
if (action) {
|
|
10523
|
+
action
|
|
10524
|
+
.withTableviewCategory(TableviewActionDefaultCategories.DELETE)
|
|
10525
|
+
.withPositionTableviewCategories([TableviewActionDefaultCategories.DETAILS])
|
|
10526
|
+
.withPosition(ActionPositionEnum.FooterLeft)
|
|
10527
|
+
.withRunFunction(ctx => ActionDataProviderUtil.runDeleteOrFail(ctx).pipe(tap(() => {
|
|
10528
|
+
var _a, _b, _c, _d;
|
|
10529
|
+
(_b = (_a = ctx.parameters.viewContainer) === null || _a === void 0 ? void 0 : _a.reloadTable) === null || _b === void 0 ? void 0 : _b.call(_a, {});
|
|
10530
|
+
(_d = (_c = ctx.parameters.viewContainer) === null || _c === void 0 ? void 0 : _c.closeEditor) === null || _d === void 0 ? void 0 : _d.call(_c);
|
|
10531
|
+
})));
|
|
10532
|
+
action.button.withLabel(undefined);
|
|
10533
|
+
action.button.styleClass.withSize(StyleSizeEnum.Normal);
|
|
10534
|
+
return action;
|
|
10535
|
+
}
|
|
10536
|
+
return null;
|
|
10537
|
+
}
|
|
10450
10538
|
createActionDescriptorForDelete(descriptor = this.descriptor.model) {
|
|
10451
10539
|
return !this.routeData.tableviewActions || this.routeData.tableviewActions.hasDelete ? new ActionDeleteDescriptor(descriptor) : null;
|
|
10452
10540
|
}
|
|
@@ -10856,7 +10944,7 @@ class MngFormlyFieldTableDialogFormComponent extends FieldType {
|
|
|
10856
10944
|
}
|
|
10857
10945
|
}
|
|
10858
10946
|
MngFormlyFieldTableDialogFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngFormlyFieldTableDialogFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
10859
|
-
MngFormlyFieldTableDialogFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngFormlyFieldTableDialogFormComponent, selector: "mng-formly-table-dialog-form-field", usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.tableDescriptor\" [items]=\"items$\" [actions]=\"actions\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex flex-row justify-content-end align-items-center table-header\">\n <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n >{{ props?.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n >\n <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\"></mng-action>\n </div>\n </ng-template>\n</mng-table>\n", styles: [".submit-button{display:none!important;visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "component", type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10947
|
+
MngFormlyFieldTableDialogFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngFormlyFieldTableDialogFormComponent, selector: "mng-formly-table-dialog-form-field", usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.tableDescriptor\" [items]=\"items$\" [actions]=\"actions\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex flex-row justify-content-end align-items-center table-header\">\n <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n >{{ props?.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n >\n <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\"></mng-action>\n </div>\n </ng-template>\n</mng-table>\n", styles: [".submit-button{display:none!important;visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MngTemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "component", type: MngTableComponent, selector: "mng-table", inputs: ["descriptor", "items", "queryResult", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "actions", "isColumnClickable", "viewContainer", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnActionComponentInstance"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "hostComponent", "route", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10860
10948
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngFormlyFieldTableDialogFormComponent, decorators: [{
|
|
10861
10949
|
type: Component,
|
|
10862
10950
|
args: [{ selector: 'mng-formly-table-dialog-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mng-table [descriptor]=\"descriptor.tableDescriptor\" [items]=\"items$\" [actions]=\"actions\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex flex-row justify-content-end align-items-center table-header\">\n <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\"\n >{{ props?.label! | translate }} <span *ngIf=\"props.required && props['hideRequiredMarker'] !== true\">*</span></label\n >\n <mng-action *ngFor=\"let action of toolbarRightActions\" [action]=\"action\"></mng-action>\n </div>\n </ng-template>\n</mng-table>\n", styles: [".submit-button{display:none!important;visibility:hidden}\n"] }]
|
|
@@ -11106,6 +11194,8 @@ class MngMainLayoutComponentService {
|
|
|
11106
11194
|
this._pinActiveSubject = new BehaviorSubject(this._pinActive);
|
|
11107
11195
|
this._innerWidth = 1920;
|
|
11108
11196
|
this._innerWidthSubject = new BehaviorSubject(this._innerWidth);
|
|
11197
|
+
this.sidebarActive = !mngCommons.menuSidebarSlim;
|
|
11198
|
+
this.sidebarStatic = !mngCommons.menuSidebarSlim;
|
|
11109
11199
|
}
|
|
11110
11200
|
get overlayMenuActive$() {
|
|
11111
11201
|
return this._overlayMenuActiveSubject.asObservable();
|
|
@@ -13165,6 +13255,7 @@ class TableviewRouteBuilder {
|
|
|
13165
13255
|
// add route
|
|
13166
13256
|
if (this.hasAdd) {
|
|
13167
13257
|
const routeBuilder = RouteBuilder.create(this.addPath, MngActionRouteComponent);
|
|
13258
|
+
routeBuilder.withData(Object.assign({}, routeData));
|
|
13168
13259
|
if ((_c = this.permissions) === null || _c === void 0 ? void 0 : _c[TableviewActionDefaultCategories.ADD]) {
|
|
13169
13260
|
routeBuilder.withPermissions(this.permissions[TableviewActionDefaultCategories.ADD]);
|
|
13170
13261
|
}
|
|
@@ -13172,6 +13263,7 @@ class TableviewRouteBuilder {
|
|
|
13172
13263
|
}
|
|
13173
13264
|
if (this.hasDetails) {
|
|
13174
13265
|
const routeBuilder = RouteBuilder.create(this.detailsPath, MngActionRouteComponent);
|
|
13266
|
+
routeBuilder.withData(Object.assign({}, routeData));
|
|
13175
13267
|
if ((_d = this.permissions) === null || _d === void 0 ? void 0 : _d[TableviewActionDefaultCategories.DETAILS]) {
|
|
13176
13268
|
routeBuilder.withPermissions(this.permissions[TableviewActionDefaultCategories.DETAILS]);
|
|
13177
13269
|
}
|
|
@@ -13179,6 +13271,7 @@ class TableviewRouteBuilder {
|
|
|
13179
13271
|
}
|
|
13180
13272
|
if (this.hasEdit) {
|
|
13181
13273
|
const routeBuilder = RouteBuilder.create(this.editPath, MngActionRouteComponent);
|
|
13274
|
+
routeBuilder.withData(Object.assign({}, routeData));
|
|
13182
13275
|
if ((_e = this.permissions) === null || _e === void 0 ? void 0 : _e[TableviewActionDefaultCategories.EDIT]) {
|
|
13183
13276
|
routeBuilder.withPermissions(this.permissions[TableviewActionDefaultCategories.EDIT]);
|
|
13184
13277
|
}
|