@mediusinc/mng-commons 5.4.0-rc.0 → 5.4.0-rc.1
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/esm2022/core/helpers/object.mjs +8 -1
- package/esm2022/table/api/data-providers/table.data-provider.mjs +12 -6
- package/esm2022/table/api/models/table-event.model.mjs +1 -1
- package/esm2022/table/components/table/table.component.mjs +14 -7
- package/esm2022/tableview/action/components/action/action.component.mjs +2 -2
- package/esm2022/tableview/action/components/editor/injector-context/action-editor-injector-context.component.mjs +31 -17
- package/esm2022/tableview/action/components/table/action-table.component.mjs +4 -4
- package/esm2022/tableview/action/services/view-container.service.mjs +1 -1
- package/esm2022/tableview/api/action/models/execution/view-container.model.mjs +1 -1
- package/esm2022/tableview/api/editor/data-providers/editor.data-provider.mjs +9 -2
- package/esm2022/tableview/api/editor/descriptors/editor.descriptor.mjs +18 -1
- package/esm2022/tableview/api/editor/models/form-editor.event.mjs +1 -1
- package/esm2022/tableview/api/editor/models/form-editor.interface.mjs +1 -1
- package/esm2022/tableview/api/tableview/data-providers/tableview.data-provider.mjs +18 -6
- package/esm2022/tableview/editor/components/editor/auto-save-status/auto-save-status.component.mjs +82 -0
- package/esm2022/tableview/editor/components/editor/form-editor.component.mjs +164 -14
- package/esm2022/tableview/editor/helpers/editor-autosave.mjs +49 -0
- package/esm2022/tableview/editor/models/editor-auto-save-preview.model.mjs +2 -0
- package/esm2022/tableview/editor/services/form-editor.service.mjs +1 -1
- package/esm2022/tableview/index.mjs +3 -1
- package/fesm2022/mediusinc-mng-commons-core.mjs +7 -0
- package/fesm2022/mediusinc-mng-commons-core.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-table-api.mjs +11 -5
- package/fesm2022/mediusinc-mng-commons-table-api.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-table.mjs +13 -6
- package/fesm2022/mediusinc-mng-commons-table.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-tableview-api.mjs +42 -6
- package/fesm2022/mediusinc-mng-commons-tableview-api.mjs.map +1 -1
- package/fesm2022/mediusinc-mng-commons-tableview.mjs +322 -40
- package/fesm2022/mediusinc-mng-commons-tableview.mjs.map +1 -1
- package/i18n/en.json +14 -0
- package/i18n/sl.json +14 -0
- package/package.json +1 -1
- package/table/api/data-providers/table.data-provider.d.ts +14 -5
- package/table/api/models/table-event.model.d.ts +4 -3
- package/table/components/table/table.component.d.ts +11 -2
- package/tableview/action/components/editor/injector-context/action-editor-injector-context.component.d.ts +4 -0
- package/tableview/action/components/table/action-table.component.d.ts +2 -2
- package/tableview/action/services/view-container.service.d.ts +6 -5
- package/tableview/api/action/models/execution/view-container.model.d.ts +7 -24
- package/tableview/api/editor/data-providers/editor.data-provider.d.ts +10 -1
- package/tableview/api/editor/descriptors/editor.descriptor.d.ts +5 -0
- package/tableview/api/editor/descriptors/field-base.descriptor.d.ts +1 -1
- package/tableview/api/editor/descriptors/field.descriptor.d.ts +1 -1
- package/tableview/api/editor/models/form-editor.event.d.ts +9 -0
- package/tableview/api/editor/models/form-editor.interface.d.ts +2 -2
- package/tableview/api/tableview/data-providers/tableview.data-provider.d.ts +10 -3
- package/tableview/editor/components/editor/auto-save-status/auto-save-status.component.d.ts +10 -0
- package/tableview/editor/components/editor/form-editor.component.d.ts +51 -4
- package/tableview/editor/helpers/editor-autosave.d.ts +17 -0
- package/tableview/editor/models/editor-auto-save-preview.model.d.ts +10 -0
- package/tableview/editor/services/form-editor.service.d.ts +2 -2
- package/tableview/index.d.ts +2 -0
- package/version-info.json +5 -5
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as i2 from '@angular/common';
|
|
2
|
-
import { AsyncPipe, NgTemplateOutlet, JsonPipe, NgStyle
|
|
2
|
+
import { AsyncPipe, DatePipe, NgTemplateOutlet, JsonPipe, NgStyle } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { InjectionToken, Injectable, signal, inject, Injector, input, booleanAttribute, output, viewChild, computed, effect, Component, ChangeDetectionStrategy, Optional, DestroyRef, untracked, ElementRef, afterNextRender, HostListener, contentChildren, viewChildren, QueryList, Directive, Pipe, LOCALE_ID, HostBinding, ViewChild } from '@angular/core';
|
|
5
|
-
import { takeUntilDestroyed, toSignal, toObservable as toObservable$1 } from '@angular/core/rxjs-interop';
|
|
4
|
+
import { InjectionToken, Injectable, signal, inject, Injector, input, booleanAttribute, output, viewChild, computed, effect, Component, ChangeDetectionStrategy, Optional, DestroyRef, model, untracked, ElementRef, afterNextRender, HostListener, contentChildren, viewChildren, QueryList, Directive, Pipe, LOCALE_ID, HostBinding, ViewChild } from '@angular/core';
|
|
5
|
+
import { takeUntilDestroyed, toSignal, outputFromObservable, toObservable as toObservable$1 } from '@angular/core/rxjs-interop';
|
|
6
6
|
import * as i1 from '@angular/router';
|
|
7
7
|
import { NavigationEnd, Router, ActivatedRoute, NavigationStart, NavigationCancel, NavigationError, NavigationSkipped, RouterOutlet } from '@angular/router';
|
|
8
8
|
import * as i1$1 from '@ngx-translate/core';
|
|
@@ -17,19 +17,19 @@ import * as i9 from 'primeng/splitbutton';
|
|
|
17
17
|
import { SplitButtonModule } from 'primeng/splitbutton';
|
|
18
18
|
import * as i8 from 'primeng/tooltip';
|
|
19
19
|
import { TooltipModule } from 'primeng/tooltip';
|
|
20
|
-
import { ReplaySubject, BehaviorSubject, distinctUntilChanged, Subject, take, of, switchMap, mergeMap as mergeMap$1, from, timeout, combineLatest, debounceTime, combineLatestWith, isObservable, throwError, filter as filter$1 } from 'rxjs';
|
|
20
|
+
import { ReplaySubject, BehaviorSubject, distinctUntilChanged, Subject, take, of, switchMap, mergeMap as mergeMap$1, from, timeout, combineLatest, debounceTime, tap, combineLatestWith, NEVER, isObservable, throwError, filter as filter$1 } from 'rxjs';
|
|
21
21
|
import * as i3 from '@mediusinc/mng-commons/core';
|
|
22
|
-
import { getI18n, getI18nAsync, toastMessage, getI18nForError, LoggerService, CommonsService, ParametrizePipe, escapeHtmlAny, toObservable, CommonsInternalError, StyleSizeEnum, CommonsHttpError, Permissions, ComponentDirective, objectDeepCopy, Styles, TemplateDirective, findTemplateByName, getI18nTypePropertyKey, getI18nTypeGroupKey, getI18nTypeTabKey, fromSubscribeError, getErrorLogLevel,
|
|
22
|
+
import { getI18n, getI18nAsync, toastMessage, getI18nForError, LoggerService, CommonsService, ParametrizePipe, escapeHtmlAny, toObservable, CommonsInternalError, StyleSizeEnum, CommonsHttpError, Permissions, ComponentDirective, CommonsStorageService, StyleLevelEnum, objectDeepCopy, Styles, TemplateDirective, findTemplateByName, getI18nTypePropertyKey, getI18nTypeGroupKey, getI18nTypeTabKey, fromSubscribeError, getErrorLogLevel, getObjectPropertyByPath, FilterMatchMode, COMMONS_MODULE_CONFIG_IT, dateToIsoString, RouteBuilder, createLazyRoute, CommonsFeatureTypeEnum } from '@mediusinc/mng-commons/core';
|
|
23
23
|
import { ActionActivationTriggerEnum, ActionTypeEnum, DataProviderExecutor, ActionDeleteDescriptorInst, ActionEditorEditDescriptorInst, ActionEditorDetailsDescriptorInst, ActionEditorAddDescriptorInst, ActionEditorDescriptorInst, CommonsActionError, ActionLinkDescriptorInst, TableviewEditorTypeEnum, TableviewDescriptorInst, FieldInputDescriptor, FieldInputTypeEnum, FieldActionDescriptor, FieldLookupEnumDescriptor, FieldLookupTypeEnum, FieldLookupDescriptor, FieldManyToManyEditorDescriptor, FieldManyEditorDescriptor, FieldValidationDescriptor, FormEventTypeEnum, FormFieldEventComponentSubtype, ActionEditorSubmitTypeEnum, ActionEditorSubmitDescriptorInst, ActionPositionEnum, runFnFromDataProviderOrFallback, runGetAllFromDataProvider, runFetchFromDataProvider, runCreateFromDataProvider, runUpdateFromDataProvider, runDeleteFromDataProvider, FormFieldEventTypeEnum, AFieldDescriptor, AFieldGroupDescriptor, FieldGroupTypeEnum, FormFieldEventDialogSubtype, FieldManyEditorActionEnum, ActionEditorDescriptor, actionEditorCancel, ActionDescriptorInst, FieldManyToManyEditorActionEnum, TableviewActionDefaultCategories, DATA_LANGUAGE_DROPDOWN_COMPONENT_IT } from '@mediusinc/mng-commons/tableview/api';
|
|
24
24
|
import { mergeMap, map, filter, startWith, catchError, first, take as take$1 } from 'rxjs/operators';
|
|
25
25
|
import { getI18nModelParams, getI18nModelParamsAsync, type } from '@mediusinc/mng-commons/model';
|
|
26
26
|
import { HttpErrorResponse } from '@angular/common/http';
|
|
27
|
-
import * as i2$
|
|
27
|
+
import * as i2$2 from 'primeng/api';
|
|
28
28
|
import { MessageService, ConfirmationService, SharedModule } from 'primeng/api';
|
|
29
29
|
import { DialogService, DynamicDialogConfig } from 'primeng/dynamicdialog';
|
|
30
30
|
import * as i1$3 from 'primeng/progressspinner';
|
|
31
31
|
import { ProgressSpinnerModule } from 'primeng/progressspinner';
|
|
32
|
-
import * as i2$
|
|
32
|
+
import * as i2$3 from 'primeng/toolbar';
|
|
33
33
|
import { ToolbarModule } from 'primeng/toolbar';
|
|
34
34
|
import { ZIndexUtils } from 'primeng/utils';
|
|
35
35
|
import * as i1$2 from '@angular/forms';
|
|
@@ -38,8 +38,8 @@ import * as i2$1 from '@ngx-formly/core';
|
|
|
38
38
|
import { FormlyConfig, FormlyModule, FieldType, FieldWrapper, FORMLY_CONFIG } from '@ngx-formly/core';
|
|
39
39
|
import * as i3$1 from 'primeng/messages';
|
|
40
40
|
import { MessagesModule } from 'primeng/messages';
|
|
41
|
+
import { ButtonStyleBuilder, ButtonStyleRoundedEnum, lookupDataProvider, ActionButtonDescriptor } from '@mediusinc/mng-commons/form/api';
|
|
41
42
|
import { DropdownComponent, AutocompleteComponent, InputTrimDirective } from '@mediusinc/mng-commons/form';
|
|
42
|
-
import { lookupDataProvider, ActionButtonDescriptor, ButtonStyleBuilder } from '@mediusinc/mng-commons/form/api';
|
|
43
43
|
import { TableComponent } from '@mediusinc/mng-commons/table';
|
|
44
44
|
import { TableSizeEnum } from '@mediusinc/mng-commons/table/api';
|
|
45
45
|
import * as i5 from 'primeng/message';
|
|
@@ -1468,7 +1468,7 @@ class ActionComponent {
|
|
|
1468
1468
|
next: () => {
|
|
1469
1469
|
this.finish.emit(instance);
|
|
1470
1470
|
if (action.hasItemsSelection) {
|
|
1471
|
-
this.viewContainer?.reloadTable(
|
|
1471
|
+
this.viewContainer?.reloadTable();
|
|
1472
1472
|
}
|
|
1473
1473
|
}
|
|
1474
1474
|
});
|
|
@@ -1620,6 +1620,131 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImpor
|
|
|
1620
1620
|
type: Optional
|
|
1621
1621
|
}] }] });
|
|
1622
1622
|
|
|
1623
|
+
class EditorAutoSaveStatusComponent {
|
|
1624
|
+
constructor() {
|
|
1625
|
+
this.status = input();
|
|
1626
|
+
this.label = computed(() => {
|
|
1627
|
+
switch (this.status()?.state) {
|
|
1628
|
+
case 'saving':
|
|
1629
|
+
case 'saved':
|
|
1630
|
+
return 'mngEditor.autoSave.autosavedAt';
|
|
1631
|
+
case 'preview':
|
|
1632
|
+
return 'mngEditor.autoSave.preview';
|
|
1633
|
+
case 'previewCurrent':
|
|
1634
|
+
return 'mngEditor.autoSave.previewCurrent';
|
|
1635
|
+
case 'restored':
|
|
1636
|
+
return 'mngEditor.autoSave.restored';
|
|
1637
|
+
default:
|
|
1638
|
+
return undefined;
|
|
1639
|
+
}
|
|
1640
|
+
});
|
|
1641
|
+
this.timestampDateFormat = computed(() => {
|
|
1642
|
+
switch (this.status()?.state) {
|
|
1643
|
+
case 'saving':
|
|
1644
|
+
case 'saved':
|
|
1645
|
+
return 'HH:mm:ss';
|
|
1646
|
+
default:
|
|
1647
|
+
return 'dd. MM. yyyy HH:mm:ss';
|
|
1648
|
+
}
|
|
1649
|
+
});
|
|
1650
|
+
this.icon = computed(() => {
|
|
1651
|
+
switch (this.status()?.state) {
|
|
1652
|
+
case 'saved':
|
|
1653
|
+
return 'pi pi-save';
|
|
1654
|
+
case 'saving':
|
|
1655
|
+
return 'pi pi-hourglass pi-spin';
|
|
1656
|
+
case 'preview':
|
|
1657
|
+
case 'previewCurrent':
|
|
1658
|
+
return 'pi pi-eye';
|
|
1659
|
+
case 'restored':
|
|
1660
|
+
return 'pi pi-sync';
|
|
1661
|
+
default:
|
|
1662
|
+
return undefined;
|
|
1663
|
+
}
|
|
1664
|
+
});
|
|
1665
|
+
}
|
|
1666
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: EditorAutoSaveStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1667
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: EditorAutoSaveStatusComponent, isStandalone: true, selector: "mng-editor-auto-save-status", inputs: { status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
1668
|
+
<span>
|
|
1669
|
+
@if (icon(); as icon) {
|
|
1670
|
+
<i [class]="icon"></i>
|
|
1671
|
+
}
|
|
1672
|
+
@if (label(); as label) {
|
|
1673
|
+
|
|
1674
|
+
<span [innerHTML]="label | translate: {timestamp: status()?.timestamp | date: timestampDateFormat()}"></span>
|
|
1675
|
+
}
|
|
1676
|
+
</span>
|
|
1677
|
+
`, isInline: true, dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1678
|
+
}
|
|
1679
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: EditorAutoSaveStatusComponent, decorators: [{
|
|
1680
|
+
type: Component,
|
|
1681
|
+
args: [{
|
|
1682
|
+
standalone: true,
|
|
1683
|
+
selector: 'mng-editor-auto-save-status',
|
|
1684
|
+
imports: [DatePipe, TranslateModule],
|
|
1685
|
+
template: `
|
|
1686
|
+
<span>
|
|
1687
|
+
@if (icon(); as icon) {
|
|
1688
|
+
<i [class]="icon"></i>
|
|
1689
|
+
}
|
|
1690
|
+
@if (label(); as label) {
|
|
1691
|
+
|
|
1692
|
+
<span [innerHTML]="label | translate: {timestamp: status()?.timestamp | date: timestampDateFormat()}"></span>
|
|
1693
|
+
}
|
|
1694
|
+
</span>
|
|
1695
|
+
`,
|
|
1696
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
1697
|
+
}]
|
|
1698
|
+
}] });
|
|
1699
|
+
|
|
1700
|
+
/**
|
|
1701
|
+
* Generates a unique key for autosave data of an editor.
|
|
1702
|
+
*
|
|
1703
|
+
* @param {EditorDescriptorInst<Item>} descriptor - The editor descriptor instance.
|
|
1704
|
+
* @param {Item | undefined} item - The item associated with the editor.
|
|
1705
|
+
* @param {string} url - The URL of the editor.
|
|
1706
|
+
* @param {Object} [opts] - An optional object containing additional options.
|
|
1707
|
+
* @param {string} [opts.editorId] - The custom editor ID.
|
|
1708
|
+
* @param {IdType} [opts.itemId] - The custom item ID.
|
|
1709
|
+
* @return {string} - The generated autosave editor key.
|
|
1710
|
+
*/
|
|
1711
|
+
function generateAutosaveEditorKey(descriptor, item, url, opts) {
|
|
1712
|
+
const autoSaveIdentifier = descriptor.autoSaveIdentifier ?? url;
|
|
1713
|
+
const editorId = generateEditorId(descriptor, opts?.editorId);
|
|
1714
|
+
const itemId = generateItemId(descriptor, item, opts?.itemId);
|
|
1715
|
+
return `autoSave~~${editorId}${itemId}~~${autoSaveIdentifier}`;
|
|
1716
|
+
}
|
|
1717
|
+
/**
|
|
1718
|
+
* Generates an ID for the editor based on the provided parameters.
|
|
1719
|
+
*
|
|
1720
|
+
* @template Item - The type of the item.
|
|
1721
|
+
* @param {EditorDescriptorInst<Item>} descriptor - The editor descriptor instance.
|
|
1722
|
+
* @param {string} [editorId] - The optional editor ID.
|
|
1723
|
+
* @returns {string} - The generated editor ID.
|
|
1724
|
+
*/
|
|
1725
|
+
function generateEditorId({ model, tableviewEditorType }, editorId) {
|
|
1726
|
+
if (editorId !== undefined) {
|
|
1727
|
+
return editorId;
|
|
1728
|
+
}
|
|
1729
|
+
const editorTypeString = TableviewEditorTypeEnum[tableviewEditorType ?? TableviewEditorTypeEnum.None];
|
|
1730
|
+
return `${model.i18nBaseKey}::${editorTypeString}`;
|
|
1731
|
+
}
|
|
1732
|
+
/**
|
|
1733
|
+
* Generates an item ID.
|
|
1734
|
+
*
|
|
1735
|
+
* @param {EditorDescriptorInst<Item>} model - The model descriptor.
|
|
1736
|
+
* @param {Item} [item] - The item to generate an ID for.
|
|
1737
|
+
* @param {IdType} [itemId] - The existing item ID (if any).
|
|
1738
|
+
* @returns {string} - The generated item ID, prefixed with "::" or an empty string if no item ID exists.
|
|
1739
|
+
*/
|
|
1740
|
+
function generateItemId({ model }, item, itemId) {
|
|
1741
|
+
if (itemId === undefined && item) {
|
|
1742
|
+
const idProperty = model?.idProperty;
|
|
1743
|
+
itemId = item?.[idProperty]?.toString();
|
|
1744
|
+
}
|
|
1745
|
+
return itemId ? `::${itemId}` : '';
|
|
1746
|
+
}
|
|
1747
|
+
|
|
1623
1748
|
const minDateValidationName = 'minDate';
|
|
1624
1749
|
const minDateValidator = (min) => {
|
|
1625
1750
|
return ({ fieldFormControl, fieldFormlyConfig }) => {
|
|
@@ -2152,16 +2277,26 @@ class FormEditorComponent {
|
|
|
2152
2277
|
this.formlyConfig = inject(FormlyConfig);
|
|
2153
2278
|
this.translateService = inject(TranslateService);
|
|
2154
2279
|
this.commons = inject(CommonsService);
|
|
2155
|
-
this.
|
|
2280
|
+
this.cmpTypeName = 'FormEditorComponent';
|
|
2281
|
+
this.logger = inject(LoggerService).create(this.cmpTypeName);
|
|
2156
2282
|
this.destroyRef = inject(DestroyRef);
|
|
2157
2283
|
this.formService = inject((FormEditorService));
|
|
2284
|
+
this.commonsStorageService = inject(CommonsStorageService);
|
|
2285
|
+
this.router = inject(Router);
|
|
2286
|
+
this.autoSaveStorageKeyCompInit = true;
|
|
2287
|
+
this.autoSaveStorageKey = computed(() => generateAutosaveEditorKey(this.descriptor(), this.item(), this.router.url, { editorId: this.editorId(), itemId: this.itemId() }));
|
|
2158
2288
|
this.descriptor = input.required();
|
|
2159
|
-
this.submitLoading = input(false);
|
|
2160
|
-
this.item =
|
|
2161
|
-
this.isFormDisabled = input(false);
|
|
2289
|
+
this.submitLoading = input(false, { transform: booleanAttribute });
|
|
2290
|
+
this.item = model(undefined);
|
|
2291
|
+
this.isFormDisabled = input(false, { transform: booleanAttribute });
|
|
2292
|
+
this.editorId = input(undefined);
|
|
2293
|
+
this.itemId = input(undefined);
|
|
2294
|
+
this.showAutoSaveStatus = input(true, { transform: booleanAttribute });
|
|
2162
2295
|
// event outputs
|
|
2163
2296
|
this.formSubmit = output();
|
|
2164
2297
|
this.valueChange = output();
|
|
2298
|
+
this.autoSaveStatusSubject = new BehaviorSubject({ state: 'initial', timestamp: new Date() });
|
|
2299
|
+
this.autoSaveStatus = outputFromObservable(this.autoSaveStatusSubject.asObservable());
|
|
2165
2300
|
// content and view queries
|
|
2166
2301
|
this.submitButtonElementRef = viewChild('submitButton');
|
|
2167
2302
|
// formly specifics
|
|
@@ -2179,6 +2314,27 @@ class FormEditorComponent {
|
|
|
2179
2314
|
this._formlyInitialItem = {}; // initialized in ngOnInit, should not be changed after
|
|
2180
2315
|
this.setterFields = computed(() => this.descriptor().fields.filter(f => typeof f.setter === 'function'));
|
|
2181
2316
|
this.formMessages = signal([]);
|
|
2317
|
+
// autosave
|
|
2318
|
+
this.restoreLocalStateButtonStyle = ButtonStyleBuilder.create(StyleLevelEnum.Success, StyleSizeEnum.Small).build();
|
|
2319
|
+
this.previewLocalStateButtonStyle = ButtonStyleBuilder.create(StyleLevelEnum.Info, StyleSizeEnum.Small).build();
|
|
2320
|
+
this.clearLocalStateButtonStyle = ButtonStyleBuilder.create(StyleLevelEnum.Danger, StyleSizeEnum.Small)
|
|
2321
|
+
.withRoundedButton(ButtonStyleRoundedEnum.SQUARE)
|
|
2322
|
+
.withTextButton()
|
|
2323
|
+
.build();
|
|
2324
|
+
this.autoSaveRestore = signal(null);
|
|
2325
|
+
this.autoSave = toSignal(this.autoSaveStatusSubject);
|
|
2326
|
+
this.autoSavePreviewButtonLabel = computed(() => {
|
|
2327
|
+
switch (this.autoSave()?.state) {
|
|
2328
|
+
case 'preview':
|
|
2329
|
+
return 'mngEditor.autoSave.restore.previewCurrent';
|
|
2330
|
+
case 'previewCurrent':
|
|
2331
|
+
return 'mngEditor.autoSave.restore.previewAutosaved';
|
|
2332
|
+
default:
|
|
2333
|
+
return 'mngEditor.autoSave.restore.preview';
|
|
2334
|
+
}
|
|
2335
|
+
});
|
|
2336
|
+
this.autoSaveShowRestore = computed(() => this.autoSaveRestore()?.saved != null);
|
|
2337
|
+
this.autoSavePreviewDisabledForm = signal(false);
|
|
2182
2338
|
this.formService.init(this);
|
|
2183
2339
|
effect(() => {
|
|
2184
2340
|
const item = this.item();
|
|
@@ -2190,11 +2346,22 @@ class FormEditorComponent {
|
|
|
2190
2346
|
// resetModel uses signal like concept
|
|
2191
2347
|
{ allowSignalWrites: true });
|
|
2192
2348
|
effect(() => {
|
|
2193
|
-
this._formlyOptions.formState.disabled =
|
|
2349
|
+
this._formlyOptions.formState.disabled =
|
|
2350
|
+
this.isFormDisabled() || this.autoSavePreviewDisabledForm() || this._formlyOptions.formState.descriptor?.disabled === true || this._formlyOptions.formState.details;
|
|
2194
2351
|
untracked(() => {
|
|
2195
2352
|
this._formlyStateDisabledSubject.next(this._formlyOptions.formState.disabled);
|
|
2196
2353
|
});
|
|
2197
2354
|
});
|
|
2355
|
+
effect(() => {
|
|
2356
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
2357
|
+
const key = this.autoSaveStorageKey();
|
|
2358
|
+
untracked(() => {
|
|
2359
|
+
this.autoSaveStopValueChangeListen();
|
|
2360
|
+
this.autoSaveLoadSavedFromStorage();
|
|
2361
|
+
this.autoSaveStartEventChangeListen(this.autoSaveStorageKeyCompInit);
|
|
2362
|
+
this.autoSaveStorageKeyCompInit = false;
|
|
2363
|
+
});
|
|
2364
|
+
});
|
|
2198
2365
|
}
|
|
2199
2366
|
ngOnInit() {
|
|
2200
2367
|
// init form state
|
|
@@ -2264,6 +2431,7 @@ class FormEditorComponent {
|
|
|
2264
2431
|
submitValid: true,
|
|
2265
2432
|
submitValue: formSubmitItem
|
|
2266
2433
|
});
|
|
2434
|
+
this.onAutoSaveDismiss();
|
|
2267
2435
|
}
|
|
2268
2436
|
else {
|
|
2269
2437
|
// find and mark invalid tabs
|
|
@@ -2359,6 +2527,63 @@ class FormEditorComponent {
|
|
|
2359
2527
|
return false;
|
|
2360
2528
|
}
|
|
2361
2529
|
}
|
|
2530
|
+
/**
|
|
2531
|
+
* Restores the saved local state.
|
|
2532
|
+
* If local storage keys exist for local state and local timestamp, restore their corresponding values.
|
|
2533
|
+
*/
|
|
2534
|
+
onAutoSaveRestore() {
|
|
2535
|
+
const restore = this.autoSaveRestore();
|
|
2536
|
+
if (restore?.saved) {
|
|
2537
|
+
this.autoSaveStopValueChangeListen();
|
|
2538
|
+
this.resetFormModel(restore.saved);
|
|
2539
|
+
this.autoSaveRestore.set(null);
|
|
2540
|
+
this.autoSaveStatusSubject.next({ state: 'restored', timestamp: restore.savedAt ?? new Date() });
|
|
2541
|
+
this.autoSavePreviewDisabledForm.set(false);
|
|
2542
|
+
this.autoSaveStartEventChangeListen();
|
|
2543
|
+
}
|
|
2544
|
+
}
|
|
2545
|
+
/**
|
|
2546
|
+
* Previews the saved local state.
|
|
2547
|
+
* If local storage keys exist for local state and local timestamp, restore their corresponding values.
|
|
2548
|
+
*/
|
|
2549
|
+
onAutoSavePreview() {
|
|
2550
|
+
if (!this.autoSaveRestore()?.saved) {
|
|
2551
|
+
return;
|
|
2552
|
+
}
|
|
2553
|
+
this.autoSaveStopValueChangeListen();
|
|
2554
|
+
this.autoSavePreviewDisabledForm.set(true);
|
|
2555
|
+
const state = this.autoSaveStatusSubject.value.state;
|
|
2556
|
+
if (state !== 'preview' && state !== 'previewCurrent') {
|
|
2557
|
+
// must store original value from current value form
|
|
2558
|
+
this.autoSaveRestore.update(i => ({ ...i, original: this.getFormValue() }));
|
|
2559
|
+
}
|
|
2560
|
+
const restore = this.autoSaveRestore();
|
|
2561
|
+
if (state === 'preview' && restore?.original) {
|
|
2562
|
+
this.resetFormModel(restore.original);
|
|
2563
|
+
this.autoSaveStatusSubject.next({ state: 'previewCurrent' });
|
|
2564
|
+
}
|
|
2565
|
+
else if (state !== 'preview' && restore?.saved) {
|
|
2566
|
+
this.resetFormModel(restore.saved);
|
|
2567
|
+
this.autoSaveStatusSubject.next({ state: 'preview', timestamp: restore.savedAt ?? new Date() });
|
|
2568
|
+
}
|
|
2569
|
+
}
|
|
2570
|
+
/**
|
|
2571
|
+
* Removes local state from local storage.
|
|
2572
|
+
* If local storage keys exist for local state and local timestamp, remove their corresponding values.
|
|
2573
|
+
*/
|
|
2574
|
+
onAutoSaveDismiss() {
|
|
2575
|
+
if (this.autoSaveStorageKey()) {
|
|
2576
|
+
const restore = this.autoSaveRestore();
|
|
2577
|
+
if (this.autoSaveStatusSubject.value.state === 'preview' && restore?.original) {
|
|
2578
|
+
this.resetFormModel(restore.original);
|
|
2579
|
+
this.autoSaveStatusSubject.next({ state: 'initial', timestamp: new Date() });
|
|
2580
|
+
}
|
|
2581
|
+
this.commonsStorageService.removeItem(this.cmpTypeName, this.autoSaveStorageKey());
|
|
2582
|
+
this.autoSaveRestore.set(null);
|
|
2583
|
+
this.autoSavePreviewDisabledForm.set(false);
|
|
2584
|
+
this.autoSaveStartEventChangeListen();
|
|
2585
|
+
}
|
|
2586
|
+
}
|
|
2362
2587
|
getFormModelFromItem(item) {
|
|
2363
2588
|
const formModel = objectDeepCopy(item, { mapGettersToProperties: true }) ?? {};
|
|
2364
2589
|
const descriptor = this.descriptor();
|
|
@@ -2419,12 +2644,56 @@ class FormEditorComponent {
|
|
|
2419
2644
|
}
|
|
2420
2645
|
return false;
|
|
2421
2646
|
}
|
|
2647
|
+
autoSaveStartEventChangeListen(init = false) {
|
|
2648
|
+
if (!this.descriptor().autoSave) {
|
|
2649
|
+
return;
|
|
2650
|
+
}
|
|
2651
|
+
setTimeout(() => {
|
|
2652
|
+
if (!this.autoSaveEventsSubscription) {
|
|
2653
|
+
this.autoSaveEventsSubscription = this._form.valueChanges
|
|
2654
|
+
.pipe(debounceTime(250), distinctUntilChanged(),
|
|
2655
|
+
// skip first one on init
|
|
2656
|
+
tap(() => {
|
|
2657
|
+
if (this.autoSaveStatusSubject.value.state !== 'saved' && this.autoSaveStatusSubject.value.state !== 'preview')
|
|
2658
|
+
this.autoSaveStatusSubject.next({ ...this.autoSaveStatusSubject.value, state: 'saving' });
|
|
2659
|
+
}), debounceTime(750), takeUntilDestroyed(this.destroyRef))
|
|
2660
|
+
.subscribe(() => {
|
|
2661
|
+
this.autoSaveSaveToStorage();
|
|
2662
|
+
});
|
|
2663
|
+
}
|
|
2664
|
+
}, init ? 0 : 500 // delay initial event listening for all the initializations to take place
|
|
2665
|
+
);
|
|
2666
|
+
}
|
|
2667
|
+
autoSaveStopValueChangeListen() {
|
|
2668
|
+
this.autoSaveEventsSubscription?.unsubscribe();
|
|
2669
|
+
this.autoSaveEventsSubscription = undefined;
|
|
2670
|
+
}
|
|
2671
|
+
/**
|
|
2672
|
+
* Saves the form value to localStorage if autoSave is enabled and the required keys are defined.
|
|
2673
|
+
* @returns {void}
|
|
2674
|
+
*/
|
|
2675
|
+
autoSaveSaveToStorage() {
|
|
2676
|
+
if (this.descriptor().autoSave !== true || this.autoSaveStatusSubject.value.state === 'preview' || this.autoSaveStatusSubject.value.state === 'previewCurrent') {
|
|
2677
|
+
return;
|
|
2678
|
+
}
|
|
2679
|
+
this.commonsStorageService.setItem(this.cmpTypeName, this.autoSaveStorageKey(), { saved: this.getFormValue(), savedAt: new Date() });
|
|
2680
|
+
this.autoSaveStatusSubject.next({ state: 'saved', timestamp: new Date() });
|
|
2681
|
+
}
|
|
2682
|
+
/**
|
|
2683
|
+
* Loads the value from the local storage if available
|
|
2684
|
+
*/
|
|
2685
|
+
autoSaveLoadSavedFromStorage() {
|
|
2686
|
+
const { autoSave, model } = this.descriptor();
|
|
2687
|
+
if (autoSave && model.i18nBaseKey) {
|
|
2688
|
+
this.autoSaveRestore.set(this.commonsStorageService.getItem(this.cmpTypeName, this.autoSaveStorageKey()) ?? null);
|
|
2689
|
+
}
|
|
2690
|
+
}
|
|
2422
2691
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2423
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
2692
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormEditorComponent, isStandalone: true, selector: "mng-form-editor", inputs: { descriptor: { classPropertyName: "descriptor", publicName: "descriptor", isSignal: true, isRequired: true, transformFunction: null }, submitLoading: { classPropertyName: "submitLoading", publicName: "submitLoading", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isFormDisabled: { classPropertyName: "isFormDisabled", publicName: "isFormDisabled", isSignal: true, isRequired: false, transformFunction: null }, editorId: { classPropertyName: "editorId", publicName: "editorId", isSignal: true, isRequired: false, transformFunction: null }, itemId: { classPropertyName: "itemId", publicName: "itemId", isSignal: true, isRequired: false, transformFunction: null }, showAutoSaveStatus: { classPropertyName: "showAutoSaveStatus", publicName: "showAutoSaveStatus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { item: "itemChange", formSubmit: "formSubmit", valueChange: "valueChange", autoSaveStatus: "autoSaveStatus" }, providers: [provideFormComponent()], viewQueries: [{ propertyName: "submitButtonElementRef", first: true, predicate: ["submitButton"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (autoSaveShowRestore()) {\n <p-messages severity=\"warn\">\n <ng-template pTemplate>\n <div class=\"flex flex-grow-1 justify-content-between align-items-center\">\n <h6 class=\"m-0 p-0\">\n <em class=\"pi pi-save mr-4\"></em>\n {{\n 'mngEditor.autoSave.restore.title'\n | translate: {lastChange: autoSaveRestore()?.savedAt ? (autoSaveRestore()?.savedAt! | date: 'dd. MM. YYYY HH:mm:ss') : ''}\n }}\n </h6>\n <div>\n <p-button\n icon=\"pi pi-sync\"\n size=\"small\"\n [label]=\"'mngEditor.autoSave.restore.restore' | translate\"\n [styleClass]=\"restoreLocalStateButtonStyle\"\n [text]=\"true\"\n (click)=\"onAutoSaveRestore()\"></p-button>\n @if (autoSave()?.state !== 'preview' || autoSave()?.state !== 'previewCurrent') {\n <p-button\n icon=\"pi pi-eye\"\n size=\"small\"\n [label]=\"autoSavePreviewButtonLabel() | translate\"\n [styleClass]=\"previewLocalStateButtonStyle\"\n [text]=\"true\"\n (click)=\"onAutoSavePreview()\"></p-button>\n }\n <p-button\n icon=\"pi pi-times\"\n size=\"small\"\n [label]=\"'mngEditor.autoSave.restore.dismiss' | translate\"\n [styleClass]=\"clearLocalStateButtonStyle\"\n (click)=\"onAutoSaveDismiss()\"></p-button>\n </div>\n </div>\n </ng-template>\n </p-messages>\n}\n\n<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n <formly-form [form]=\"form\" [fields]=\"formlyFields\" [options]=\"formlyOptions\" [model]=\"formlyInitialItem\"></formly-form>\n <button #submitButton pButton type=\"submit\" class=\"hidden\" [disabled]=\"form.disabled\" [loading]=\"submitLoading()\" loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages()\" [enableService]=\"false\"></p-messages>\n\n@if (descriptor().autoSave && showAutoSaveStatus()) {\n <mng-editor-auto-save-status [status]=\"autoSave()\"></mng-editor-auto-save-status>\n}\n", dependencies: [{ kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i3$1.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i4.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: EditorAutoSaveStatusComponent, selector: "mng-editor-auto-save-status", inputs: ["status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2424
2693
|
}
|
|
2425
2694
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormEditorComponent, decorators: [{
|
|
2426
2695
|
type: Component,
|
|
2427
|
-
args: [{ standalone: true, selector: 'mng-form-editor', imports: [FormlyModule, ReactiveFormsModule, MessagesModule, AsyncPipe, ButtonModule], providers: [provideFormComponent()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n <formly-form [form]=\"form\" [fields]=\"formlyFields\" [options]=\"formlyOptions\" [model]=\"formlyInitialItem\"></formly-form>\n <button #submitButton pButton type=\"submit\" class=\"hidden\" [disabled]=\"form.disabled\" [loading]=\"submitLoading()\" loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages()\" [enableService]=\"false\"></p-messages>\n" }]
|
|
2696
|
+
args: [{ standalone: true, selector: 'mng-form-editor', imports: [FormlyModule, ReactiveFormsModule, MessagesModule, AsyncPipe, ButtonModule, TranslateModule, DatePipe, EditorAutoSaveStatusComponent], providers: [provideFormComponent()], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (autoSaveShowRestore()) {\n <p-messages severity=\"warn\">\n <ng-template pTemplate>\n <div class=\"flex flex-grow-1 justify-content-between align-items-center\">\n <h6 class=\"m-0 p-0\">\n <em class=\"pi pi-save mr-4\"></em>\n {{\n 'mngEditor.autoSave.restore.title'\n | translate: {lastChange: autoSaveRestore()?.savedAt ? (autoSaveRestore()?.savedAt! | date: 'dd. MM. YYYY HH:mm:ss') : ''}\n }}\n </h6>\n <div>\n <p-button\n icon=\"pi pi-sync\"\n size=\"small\"\n [label]=\"'mngEditor.autoSave.restore.restore' | translate\"\n [styleClass]=\"restoreLocalStateButtonStyle\"\n [text]=\"true\"\n (click)=\"onAutoSaveRestore()\"></p-button>\n @if (autoSave()?.state !== 'preview' || autoSave()?.state !== 'previewCurrent') {\n <p-button\n icon=\"pi pi-eye\"\n size=\"small\"\n [label]=\"autoSavePreviewButtonLabel() | translate\"\n [styleClass]=\"previewLocalStateButtonStyle\"\n [text]=\"true\"\n (click)=\"onAutoSavePreview()\"></p-button>\n }\n <p-button\n icon=\"pi pi-times\"\n size=\"small\"\n [label]=\"'mngEditor.autoSave.restore.dismiss' | translate\"\n [styleClass]=\"clearLocalStateButtonStyle\"\n (click)=\"onAutoSaveDismiss()\"></p-button>\n </div>\n </div>\n </ng-template>\n </p-messages>\n}\n\n<form [formGroup]=\"form\" (ngSubmit)=\"onSubmit($event)\">\n <formly-form [form]=\"form\" [fields]=\"formlyFields\" [options]=\"formlyOptions\" [model]=\"formlyInitialItem\"></formly-form>\n <button #submitButton pButton type=\"submit\" class=\"hidden\" [disabled]=\"form.disabled\" [loading]=\"submitLoading()\" loadingIcon=\"pi pi-spin pi-spinner\"></button>\n</form>\n<p-messages [value]=\"formMessages()\" [enableService]=\"false\"></p-messages>\n\n@if (descriptor().autoSave && showAutoSaveStatus()) {\n <mng-editor-auto-save-status [status]=\"autoSave()\"></mng-editor-auto-save-status>\n}\n" }]
|
|
2428
2697
|
}], ctorParameters: () => [] });
|
|
2429
2698
|
|
|
2430
2699
|
class ActionEditorInjectorContextComponent {
|
|
@@ -2499,6 +2768,7 @@ class ActionEditorInjectorContextComponent {
|
|
|
2499
2768
|
this.loading = signal(false);
|
|
2500
2769
|
this.formValue = signal(undefined);
|
|
2501
2770
|
this.submitLoading = signal(false);
|
|
2771
|
+
this.autoSaveStatus = signal(undefined);
|
|
2502
2772
|
// updates for title
|
|
2503
2773
|
effect(() => {
|
|
2504
2774
|
const hasTitle = this.hasTitle();
|
|
@@ -2526,19 +2796,12 @@ class ActionEditorInjectorContextComponent {
|
|
|
2526
2796
|
});
|
|
2527
2797
|
// subscribe to events that could be triggered from outside from any reason
|
|
2528
2798
|
this.viewContainer?.editorReset$.pipe(takeUntilDestroyed()).subscribe({
|
|
2529
|
-
next: e =>
|
|
2530
|
-
|
|
2531
|
-
|
|
2532
|
-
|
|
2533
|
-
|
|
2534
|
-
|
|
2535
|
-
}
|
|
2536
|
-
else if (e.fields) {
|
|
2537
|
-
for (const key in e.fields) {
|
|
2538
|
-
this.formEditorCmp()?.resetFieldValue(key, e.fields[key]);
|
|
2539
|
-
}
|
|
2540
|
-
}
|
|
2541
|
-
}
|
|
2799
|
+
next: e => this.onEditorReset(e)
|
|
2800
|
+
});
|
|
2801
|
+
toObservable$1(this.dataProvider)
|
|
2802
|
+
.pipe(switchMap(dp => dp?.editorReset$ ?? NEVER), takeUntilDestroyed())
|
|
2803
|
+
.subscribe({
|
|
2804
|
+
next: e => this.onEditorReset(e)
|
|
2542
2805
|
});
|
|
2543
2806
|
this.viewContainer?.editorClose$.pipe(takeUntilDestroyed()).subscribe({
|
|
2544
2807
|
next: () => {
|
|
@@ -2628,6 +2891,9 @@ class ActionEditorInjectorContextComponent {
|
|
|
2628
2891
|
onValueChange(value) {
|
|
2629
2892
|
this.formValue.set(value);
|
|
2630
2893
|
}
|
|
2894
|
+
onAutoSave(value) {
|
|
2895
|
+
this.autoSaveStatus.set(value);
|
|
2896
|
+
}
|
|
2631
2897
|
fetchItem() {
|
|
2632
2898
|
if (!this.instance) {
|
|
2633
2899
|
throw new CommonsInternalError(`Action is not instantiated in action editor for action ${this.editorAction().actionName}.`);
|
|
@@ -2785,12 +3051,28 @@ class ActionEditorInjectorContextComponent {
|
|
|
2785
3051
|
});
|
|
2786
3052
|
return subject.asObservable();
|
|
2787
3053
|
}
|
|
3054
|
+
onEditorReset(event) {
|
|
3055
|
+
if (event?.fetch) {
|
|
3056
|
+
this.fetchItem();
|
|
3057
|
+
}
|
|
3058
|
+
else if (event?.item) {
|
|
3059
|
+
this.formEditorCmp()?.resetFormModel(event.item);
|
|
3060
|
+
}
|
|
3061
|
+
else if (event?.fields) {
|
|
3062
|
+
for (const key in event.fields) {
|
|
3063
|
+
this.formEditorCmp()?.resetFieldValue(key, event.fields[key]);
|
|
3064
|
+
}
|
|
3065
|
+
}
|
|
3066
|
+
else {
|
|
3067
|
+
this.formEditorCmp()?.resetFormModel();
|
|
3068
|
+
}
|
|
3069
|
+
}
|
|
2788
3070
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: ActionEditorInjectorContextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2789
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: ActionEditorInjectorContextComponent, isStandalone: true, selector: "mng-action-editor-injector-context", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { actionRun: "actionRun", actionCancel: "actionCancel" }, host: { listeners: { "window:beforeunload": "beforeWindowUnload()", "window:keydown.Escape": "onEscapePressed()" } }, providers: [provideActionExecutor()], viewQueries: [{ propertyName: "formEditorCmp", first: true, predicate: FormEditorComponent, descendants: true, isSignal: true }, { propertyName: "focusThiefElRef", first: true, predicate: ["focusThiefInput"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (!data().isDialog && title()) {\n <h5>{{ title() }}</h5>\n}\n@if (data().isDialog && editorAction().activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n <span class=\"p-dialog-header dialog-close-button-wrapper\">\n <button\n class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n type=\"button\"\n (click)=\"closeWithUnsavedChangesConfirmation()\"\n (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n </button>\n </span>\n}\n<div class=\"h-full flex flex-column\">\n @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n @for (action of toolbarLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n <ng-template pTemplate=\"right\">\n @for (action of toolbarRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n </p-toolbar>\n </div>\n }\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n @if (loading()) {\n <div class=\"text-center\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n }\n <input type=\"hidden\" #focusThiefInput tabindex=\"0\" />\n @if (editorAction().editorDescriptor && !loading()) {\n <mng-form-editor\n [descriptor]=\"editorAction().editorDescriptor\"\n [item]=\"item()\"\n [isFormDisabled]=\"isFormDisabled()\"\n (valueChange)=\"onValueChange($event)\"\n (formSubmit)=\"onSubmit($event)\">\n </mng-form-editor>\n }\n </div>\n\n <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n <div>\n @for (action of footerLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </div>\n <div>\n @for (action of footerRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </div>\n </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"], dependencies: [{ kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i1$3.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: FormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isFormDisabled"], outputs: ["formSubmit", "valueChange"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$
|
|
3071
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: ActionEditorInjectorContextComponent, isStandalone: true, selector: "mng-action-editor-injector-context", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { actionRun: "actionRun", actionCancel: "actionCancel" }, host: { listeners: { "window:beforeunload": "beforeWindowUnload()", "window:keydown.Escape": "onEscapePressed()" } }, providers: [provideActionExecutor()], viewQueries: [{ propertyName: "formEditorCmp", first: true, predicate: FormEditorComponent, descendants: true, isSignal: true }, { propertyName: "focusThiefElRef", first: true, predicate: ["focusThiefInput"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (!data().isDialog && title()) {\n <h5>{{ title() }}</h5>\n}\n@if (data().isDialog && editorAction().activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n <span class=\"p-dialog-header dialog-close-button-wrapper\">\n <button\n class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n type=\"button\"\n (click)=\"closeWithUnsavedChangesConfirmation()\"\n (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n </button>\n </span>\n}\n<div class=\"h-full flex flex-column\">\n @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n @for (action of toolbarLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n <ng-template pTemplate=\"right\">\n @for (action of toolbarRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n </p-toolbar>\n </div>\n }\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n @if (loading()) {\n <div class=\"text-center\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n }\n <input type=\"hidden\" #focusThiefInput tabindex=\"0\" />\n @if (editorAction().editorDescriptor && !loading()) {\n <mng-form-editor\n [descriptor]=\"editorAction().editorDescriptor\"\n [editorId]=\"editorAction().actionNameLong\"\n [item]=\"item()\"\n [itemId]=\"itemId()\"\n [isFormDisabled]=\"isFormDisabled()\"\n showAutoSaveStatus=\"false\"\n (valueChange)=\"onValueChange($event)\"\n (formSubmit)=\"onSubmit($event)\"\n (autoSaveStatus)=\"onAutoSave($event)\">\n </mng-form-editor>\n }\n </div>\n\n <div class=\"flex flex-row justify-content-between align-items-center mng-action-editor-footer-container\">\n <div>\n @for (action of footerLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n @if (editorAction().editorDescriptor.autoSave) {\n <mng-editor-auto-save-status [status]=\"autoSaveStatus()\"></mng-editor-auto-save-status>\n }\n </div>\n <div>\n @for (action of footerRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </div>\n </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"], dependencies: [{ kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i1$3.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: FormEditorComponent, selector: "mng-form-editor", inputs: ["descriptor", "submitLoading", "item", "isFormDisabled", "editorId", "itemId", "showAutoSaveStatus"], outputs: ["itemChange", "formSubmit", "valueChange", "autoSaveStatus"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$3.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: EditorAutoSaveStatusComponent, selector: "mng-editor-auto-save-status", inputs: ["status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2790
3072
|
}
|
|
2791
3073
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: ActionEditorInjectorContextComponent, decorators: [{
|
|
2792
3074
|
type: Component,
|
|
2793
|
-
args: [{ standalone: true, selector: 'mng-action-editor-injector-context', imports: [ActionComponent, ProgressSpinnerModule, FormEditorComponent, ComponentDirective, ToolbarModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [provideActionExecutor()], template: "@if (!data().isDialog && title()) {\n <h5>{{ title() }}</h5>\n}\n@if (data().isDialog && editorAction().activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n <span class=\"p-dialog-header dialog-close-button-wrapper\">\n <button\n class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n type=\"button\"\n (click)=\"closeWithUnsavedChangesConfirmation()\"\n (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n </button>\n </span>\n}\n<div class=\"h-full flex flex-column\">\n @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n @for (action of toolbarLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n <ng-template pTemplate=\"right\">\n @for (action of toolbarRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n </p-toolbar>\n </div>\n }\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n @if (loading()) {\n <div class=\"text-center\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n }\n <input type=\"hidden\" #focusThiefInput tabindex=\"0\" />\n @if (editorAction().editorDescriptor && !loading()) {\n <mng-form-editor\n [descriptor]=\"editorAction().editorDescriptor\"\n [item]=\"item()\"\n [isFormDisabled]=\"isFormDisabled()\"\n (valueChange)=\"onValueChange($event)\"\n (formSubmit)=\"onSubmit($event)\">\n </mng-form-editor>\n }\n </div>\n\n <div class=\"flex flex-row justify-content-between mng-action-editor-footer-container\">\n <div>\n @for (action of footerLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </div>\n <div>\n @for (action of footerRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </div>\n </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"] }]
|
|
3075
|
+
args: [{ standalone: true, selector: 'mng-action-editor-injector-context', imports: [ActionComponent, ProgressSpinnerModule, FormEditorComponent, ComponentDirective, ToolbarModule, EditorAutoSaveStatusComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [provideActionExecutor()], template: "@if (!data().isDialog && title()) {\n <h5>{{ title() }}</h5>\n}\n@if (data().isDialog && editorAction().activationTrigger === ActionActivationTriggerEnum.OnRoute) {\n <span class=\"p-dialog-header dialog-close-button-wrapper\">\n <button\n class=\"p-dialog-header-icon p-dialog-header-maximize p-link\"\n type=\"button\"\n (click)=\"closeWithUnsavedChangesConfirmation()\"\n (keydown.enter)=\"closeWithUnsavedChangesConfirmation()\">\n <span class=\"p-dialog-header-close-icon pi pi-times\"></span>\n </button>\n </span>\n}\n<div class=\"h-full flex flex-column\">\n @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n <div class=\"flex-grow-1 mng-action-editor-toolbar-container\">\n <p-toolbar styleClass=\"mng-action-editor-toolbar\">\n <ng-template pTemplate=\"left\">\n @for (action of toolbarLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n <ng-template pTemplate=\"right\">\n @for (action of toolbarRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </ng-template>\n </p-toolbar>\n </div>\n }\n\n <div class=\"flex-grow-1 mng-action-editor-form-container\">\n @if (loading()) {\n <div class=\"text-center\">\n <p-progressSpinner [style]=\"{width: '3rem', height: '3rem'}\" strokeWidth=\"3\"></p-progressSpinner>\n </div>\n }\n <input type=\"hidden\" #focusThiefInput tabindex=\"0\" />\n @if (editorAction().editorDescriptor && !loading()) {\n <mng-form-editor\n [descriptor]=\"editorAction().editorDescriptor\"\n [editorId]=\"editorAction().actionNameLong\"\n [item]=\"item()\"\n [itemId]=\"itemId()\"\n [isFormDisabled]=\"isFormDisabled()\"\n showAutoSaveStatus=\"false\"\n (valueChange)=\"onValueChange($event)\"\n (formSubmit)=\"onSubmit($event)\"\n (autoSaveStatus)=\"onAutoSave($event)\">\n </mng-form-editor>\n }\n </div>\n\n <div class=\"flex flex-row justify-content-between align-items-center mng-action-editor-footer-container\">\n <div>\n @for (action of footerLeftActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n @if (editorAction().editorDescriptor.autoSave) {\n <mng-editor-auto-save-status [status]=\"autoSaveStatus()\"></mng-editor-auto-save-status>\n }\n </div>\n <div>\n @for (action of footerRightActions(); track action) {\n <mng-action\n [action]=\"action\"\n [disabled]=\"submitLoading()\"\n [loading]=\"$any(action).submitType === actionEditorSubmitTypeSubmit ? submitLoading() : false\"\n [hostComponent]=\"this\"\n [item]=\"formValue()\"\n [itemId]=\"itemId()\"></mng-action>\n }\n </div>\n </div>\n</div>\n", styles: [".dialog-close-button-wrapper{position:absolute;top:1.286rem;right:1.714rem;background:transparent;padding:0}\n"] }]
|
|
2794
3076
|
}], ctorParameters: () => [], propDecorators: { beforeWindowUnload: [{
|
|
2795
3077
|
type: HostListener,
|
|
2796
3078
|
args: ['window:beforeunload']
|
|
@@ -3124,10 +3406,10 @@ class ActionTableComponent {
|
|
|
3124
3406
|
this.rowInlineActions = computed(() => {
|
|
3125
3407
|
return this.actions().filter(action => action.position === ActionPositionEnum.RowInline);
|
|
3126
3408
|
});
|
|
3127
|
-
this.viewContainer?.tableReload$.pipe(takeUntilDestroyed()).subscribe(e => this.reload(e
|
|
3409
|
+
this.viewContainer?.tableReload$.pipe(takeUntilDestroyed()).subscribe(e => this.reload(e));
|
|
3128
3410
|
}
|
|
3129
|
-
reload(
|
|
3130
|
-
this.table().reload(
|
|
3411
|
+
reload(e) {
|
|
3412
|
+
this.table().reload(e);
|
|
3131
3413
|
}
|
|
3132
3414
|
onCellClick(event) {
|
|
3133
3415
|
if (this.rowClickActions().length) {
|
|
@@ -3613,7 +3895,7 @@ class FormlyFieldInputComponent extends ACommonsFormlyFieldType {
|
|
|
3613
3895
|
}
|
|
3614
3896
|
}
|
|
3615
3897
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
3616
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldInputComponent, isStandalone: true, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "@switch (props.type) {\n @case ('number') {\n <p-inputNumber\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin ?? NUMBER_MIN_SAFE : undefined\"\n [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax ?? NUMBER_MAX_SAFE : undefined\"\n [step]=\"$any(descriptor.numberStep)\"\n [useGrouping]=\"descriptor.numberUseGrouping\"\n [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n [inputStyleClass]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-number'\"\n [locale]=\"descriptor.locale ?? applicationLocale\"\n [mode]=\"numberFieldMode\"\n [currency]=\"currency\"\n [currencyDisplay]=\"descriptor.currencyDisplay\">\n </p-inputNumber>\n }\n\n @case ('switch') {\n <div class=\"field flex flex-column\">\n <label [for]=\"key\" [class]=\"descriptor.labelClassName ?? ''\"\n >{{ descriptor | mngFormlyFieldLabel: editorDescriptor | translate }}\n @if (props.required && props['hideRequiredMarker'] !== true) {\n <span>*</span>\n }\n </label>\n <p-inputSwitch\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [styleClass]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-switch'\"></p-inputSwitch>\n @if (showError) {\n <small class=\"p-error\">\n <formly-validation-message [field]=\"field\"></formly-validation-message>\n </small>\n }\n </div>\n }\n @case ('radio') {\n @for (option of descriptor.radioOptions; track option) {\n <div [id]=\"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 ?? 'mng-formly-field-input mng-formly-field-input-radio'\"></p-radioButton>\n <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + (descriptor.labelClassName ?? '')\">{{ option.title | translate }}</label>\n </div>\n }\n }\n @case ('textarea') {\n <textarea\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [rows]=\"descriptor.rows ?? 3\"\n pInputTextarea\n [class]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-textarea'\">\n </textarea>\n }\n @case ('mask') {\n <p-inputMask\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [mask]=\"descriptor.mask\"\n [placeholder]=\"descriptor.placeholder\"\n [slotChar]=\"$any(descriptor.slotChar)\"\n [styleClass]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-mask'\">\n </p-inputMask>\n }\n @case ('file') {\n <p-fileUpload\n #fileUploadInput\n [id]=\"$any(key)\"\n [disabled]=\"iFormControl.disabled\"\n [multiple]=\"descriptor.fileMultiple ?? false\"\n [accept]=\"descriptor.fileAccept ?? (descriptor.fieldType === DESC_INPUT_TYPE_IMAGE_FILE ? 'image/*' : undefined)\"\n [maxFileSize]=\"descriptor.fileMaxFileSize ?? 500000\"\n [showUploadButton]=\"false\"\n (onSelect)=\"onFileSelect($event)\"\n (onRemove)=\"onFileRemove($event)\"\n (onClear)=\"onFileClear($event)\">\n <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n <div class=\"p-fileupload-row\">\n <div>\n @if (fileUploadInput.isImage(file)) {\n @if (descriptor.imagePreview) {\n @if (descriptor.imagePreviewComponent) {\n <ng-container\n [mngComponent]=\"descriptor.imagePreviewComponent\"\n [inputs]=\"{\n imageUrl: file.objectURL\n }\">\n </ng-container>\n } @else if (!isFileImageSvg(file) || descriptor.imagePreviewAllowSvg) {\n <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n } @else {\n <span class=\"flex align-items-center justify-content-center\">\n <i class=\"pi pi-image text-2xl\"></i>\n </span>\n }\n } @else {\n <span class=\"flex align-items-center justify-content-center\">\n <i class=\"pi pi-image text-2xl\"></i>\n </span>\n }\n } @else {\n <span class=\"flex align-items-center justify-content-center\">\n <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n </span>\n }\n </div>\n <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n <div>\n <button\n type=\"button\"\n pButton\n (click)=\"fileUploadInput.remove($event, idx)\"\n [disabled]=\"fileUploadInput.uploading\"\n class=\"p-button-icon-only\"\n [class]=\"fileUploadInput.removeStyleClass\">\n @if (!fileUploadInput.cancelIconTemplate) {\n <TimesIcon />\n }\n </button>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"content\" let-files>\n @if (files.length === 0) {\n <div class=\"text-gray-300 dropdown-area\">\n <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n </div>\n }\n </ng-template>\n </p-fileUpload>\n }\n @case ('imageUrl') {\n <div>\n @if (descriptor.imagePreview) {\n <div class=\"flex flex-wrap justify-content-start\">\n @for (image of imageFormArray.controls; track image; let idx = $index) {\n @if (imageFormArray.at(idx).valid && imageFormArray.at(idx).value) {\n @if (descriptor.imagePreviewComponent) {\n <ng-container\n [mngComponent]=\"descriptor.imagePreviewComponent\"\n [inputs]=\"{\n imageUrl: imageFormArray.at(idx).value\n }\">\n </ng-container>\n } @else if (!isUrlSvgImage(imageFormArray.at(idx).value) || descriptor.imagePreviewAllowSvg) {\n <p-image [src]=\"imageFormArray.at(idx).value\" [preview]=\"true\" (onImageError)=\"onImageUrlLoadError()\" styleClass=\"mng-image m-2\"></p-image>\n } @else {\n <span class=\"mng-image m-2 p-image-preview-container no-image\">\n <div class=\"p-image-preview-indicator\">\n <i class=\"p-image-preview-icon pi ban\"></i>\n </div>\n </span>\n }\n }\n }\n </div>\n }\n @if (!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled) {\n @for (imageCtrlName of imageFormArray.controls; track imageCtrlName; let idx = $index) {\n <div class=\"p-inputgroup\">\n <input\n pInputText\n [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n [id]=\"$any(key)\"\n type=\"text\"\n [formControl]=\"$any(imageFormArray.at(idx))\"\n [formlyAttributes]=\"field\" />\n @if (descriptor.fileMultiple && !iFormControl.disabled) {\n <button type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n }\n </div>\n }\n @if (descriptor.fileMultiple && !iFormControl.disabled) {\n <button\n type=\"button\"\n pButton\n pRipple\n icon=\"pi pi-plus\"\n class=\"p-button-primary w-auto\"\n [label]=\"'mngEditor.imageUrlAdd' | translate\"\n (click)=\"addImageUrl()\"></button>\n }\n }\n </div>\n }\n @default {\n <input pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [mngInputTrim]=\"descriptor.trimOption\" />\n }\n}\n", dependencies: [{ kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i1$5.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i6.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i7$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i8$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "variant", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autofocus", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i9$1.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", "onRemoveUploadedFile"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "ngmodule", type: ImageModule }, { kind: "component", type: i11.Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i12.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }, { kind: "directive", type: InputTrimDirective, selector: "[mngInputTrim]", inputs: ["mngInputTrim"] }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "parentInjector"], outputs: ["instanceCreated"] }, { kind: "pipe", type: FormlyFieldLabelPipe, name: "mngFormlyFieldLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3898
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldInputComponent, isStandalone: true, selector: "mng-formly-field-input", usesInheritance: true, ngImport: i0, template: "@switch (props.type) {\n @case ('number') {\n <p-inputNumber\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [min]=\"descriptor.numberAutoCorrect ? descriptor.numberMin ?? NUMBER_MIN_SAFE : undefined\"\n [max]=\"descriptor.numberAutoCorrect ? descriptor.numberMax ?? NUMBER_MAX_SAFE : undefined\"\n [step]=\"$any(descriptor.numberStep)\"\n [useGrouping]=\"descriptor.numberUseGrouping\"\n [minFractionDigits]=\"descriptor.numberMinFractionDigits || 0\"\n [maxFractionDigits]=\"descriptor.numberMaxFractionDigits || 0\"\n [inputStyleClass]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-number'\"\n [locale]=\"descriptor.locale ?? applicationLocale\"\n [mode]=\"numberFieldMode\"\n [currency]=\"currency\"\n [currencyDisplay]=\"descriptor.currencyDisplay\">\n </p-inputNumber>\n }\n\n @case ('switch') {\n <div class=\"field flex flex-column\">\n <label [for]=\"key\" [class]=\"descriptor.labelClassName ?? ''\"\n >{{ descriptor | mngFormlyFieldLabel: editorDescriptor | translate }}\n @if (props.required && props['hideRequiredMarker'] !== true) {\n <span>*</span>\n }\n </label>\n <p-inputSwitch\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [styleClass]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-switch'\"></p-inputSwitch>\n @if (showError) {\n <small class=\"p-error\">\n <formly-validation-message [field]=\"field\"></formly-validation-message>\n </small>\n }\n </div>\n }\n @case ('radio') {\n @for (option of descriptor.radioOptions; track option) {\n <div [id]=\"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 ?? 'mng-formly-field-input mng-formly-field-input-radio'\"></p-radioButton>\n <label [for]=\"option.value\" [class]=\"'mng-radio-button-label ' + (descriptor.labelClassName ?? '')\">{{ option.title | translate }}</label>\n </div>\n }\n }\n @case ('textarea') {\n <textarea\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [rows]=\"descriptor.rows ?? 3\"\n pInputTextarea\n [class]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-textarea'\">\n </textarea>\n }\n @case ('mask') {\n <p-inputMask\n [id]=\"$any(key)\"\n [formControl]=\"iFormControl\"\n [formlyAttributes]=\"field\"\n [mask]=\"descriptor.mask\"\n [placeholder]=\"descriptor.placeholder\"\n [slotChar]=\"$any(descriptor.slotChar)\"\n [styleClass]=\"descriptor.inputClassName ?? 'mng-formly-field-input mng-formly-field-input-mask'\">\n </p-inputMask>\n }\n @case ('file') {\n <p-fileUpload\n #fileUploadInput\n [id]=\"$any(key)\"\n [disabled]=\"iFormControl.disabled\"\n [multiple]=\"descriptor.fileMultiple ?? false\"\n [accept]=\"descriptor.fileAccept ?? (descriptor.fieldType === DESC_INPUT_TYPE_IMAGE_FILE ? 'image/*' : undefined)\"\n [maxFileSize]=\"descriptor.fileMaxFileSize ?? 500000\"\n [showUploadButton]=\"false\"\n (onSelect)=\"onFileSelect($event)\"\n (onRemove)=\"onFileRemove($event)\"\n (onClear)=\"onFileClear($event)\">\n <ng-template let-file let-idx=\"index\" pTemplate=\"file\">\n <div class=\"p-fileupload-row\">\n <div>\n @if (fileUploadInput.isImage(file)) {\n @if (descriptor.imagePreview) {\n @if (descriptor.imagePreviewComponent) {\n <ng-container\n [mngComponent]=\"descriptor.imagePreviewComponent\"\n [inputs]=\"{\n imageUrl: file.objectURL\n }\">\n </ng-container>\n } @else if (!isFileImageSvg(file) || descriptor.imagePreviewAllowSvg) {\n <img [src]=\"file.objectURL\" [width]=\"fileUploadInput.previewWidth\" (error)=\"fileUploadInput.imageError($event)\" />\n } @else {\n <span class=\"flex align-items-center justify-content-center\">\n <i class=\"pi pi-image text-2xl\"></i>\n </span>\n }\n } @else {\n <span class=\"flex align-items-center justify-content-center\">\n <i class=\"pi pi-image text-2xl\"></i>\n </span>\n }\n } @else {\n <span class=\"flex align-items-center justify-content-center\">\n <i [class]=\"'pi ' + getFileDocumentTypeIcon(file) + ' text-2xl'\"></i>\n </span>\n }\n </div>\n <div class=\"p-fileupload-filename\">{{ file.name }}</div>\n <div>{{ fileUploadInput.formatSize(file.size) }}</div>\n <div>\n <button\n type=\"button\"\n pButton\n (click)=\"fileUploadInput.remove($event, idx)\"\n [disabled]=\"fileUploadInput.uploading\"\n class=\"p-button-icon-only\"\n [class]=\"fileUploadInput.removeStyleClass\">\n @if (!fileUploadInput.cancelIconTemplate) {\n <TimesIcon />\n }\n </button>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"content\" let-files>\n @if (files.length === 0) {\n <div class=\"text-gray-300 dropdown-area\">\n <span><i class=\"pi pi-file-import mr-2\"></i>{{ 'fileUpload.dragAndDrop' | translate }}</span>\n </div>\n }\n </ng-template>\n </p-fileUpload>\n }\n @case ('imageUrl') {\n <div>\n @if (descriptor.imagePreview) {\n <div class=\"flex flex-wrap justify-content-start\">\n @for (image of imageFormArray.controls; track image; let idx = $index) {\n @if (imageFormArray.at(idx).valid && imageFormArray.at(idx).value) {\n @if (descriptor.imagePreviewComponent) {\n <ng-container\n [mngComponent]=\"descriptor.imagePreviewComponent\"\n [inputs]=\"{\n imageUrl: imageFormArray.at(idx).value\n }\">\n </ng-container>\n } @else if (!isUrlSvgImage(imageFormArray.at(idx).value) || descriptor.imagePreviewAllowSvg) {\n <p-image [src]=\"imageFormArray.at(idx).value\" [preview]=\"true\" (onImageError)=\"onImageUrlLoadError()\" styleClass=\"mng-image m-2\"></p-image>\n } @else {\n <span class=\"mng-image m-2 p-image-preview-container no-image\">\n <div class=\"p-image-preview-indicator\">\n <i class=\"p-image-preview-icon pi ban\"></i>\n </div>\n </span>\n }\n }\n }\n </div>\n }\n @if (!descriptor.imagePreview || descriptor.imageUrlInputVisibleOnDisabled || !iFormControl.disabled) {\n @for (imageCtrlName of imageFormArray.controls; track imageCtrlName; let idx = $index) {\n <div class=\"p-inputgroup\">\n <input\n pInputText\n [placeholder]=\"'mngEditor.imageUrlPlaceholder' | translate\"\n [id]=\"$any(key)\"\n type=\"text\"\n [formControl]=\"$any(imageFormArray.at(idx))\"\n [formlyAttributes]=\"field\" />\n @if (descriptor.fileMultiple && !iFormControl.disabled) {\n <button type=\"button\" pButton pRipple icon=\"pi pi-minus\" (click)=\"removeImageUrlAt(idx)\"></button>\n }\n </div>\n }\n @if (descriptor.fileMultiple && !iFormControl.disabled) {\n <button\n type=\"button\"\n pButton\n pRipple\n icon=\"pi pi-plus\"\n class=\"p-button-primary w-auto\"\n [label]=\"'mngEditor.imageUrlAdd' | translate\"\n (click)=\"addImageUrl()\"></button>\n }\n }\n </div>\n }\n @default {\n <input pInputText [id]=\"$any(key)\" [type]=\"props.type || 'text'\" [formControl]=\"iFormControl\" [formlyAttributes]=\"field\" [mngInputTrim]=\"descriptor.trimOption\" />\n }\n}\n", dependencies: [{ kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i1$5.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "component", type: i2$1.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i6.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i7$1.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputMaskModule }, { kind: "component", type: i8$1.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "variant", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autofocus", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i9$1.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", "onRemoveUploadedFile"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "ngmodule", type: ImageModule }, { kind: "component", type: i11.Image, selector: "p-image", inputs: ["imageClass", "imageStyle", "styleClass", "style", "src", "srcSet", "sizes", "previewImageSrc", "previewImageSrcSet", "previewImageSizes", "alt", "width", "height", "loading", "appendTo", "preview", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide", "onImageError"] }, { kind: "ngmodule", type: InputTextareaModule }, { kind: "directive", type: i12.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }, { kind: "directive", type: InputTrimDirective, selector: "[mngInputTrim]", inputs: ["mngInputTrim"] }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "parentInjector"], outputs: ["instanceCreated"] }, { kind: "pipe", type: FormlyFieldLabelPipe, name: "mngFormlyFieldLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3617
3899
|
}
|
|
3618
3900
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldInputComponent, decorators: [{
|
|
3619
3901
|
type: Component,
|
|
@@ -3816,7 +4098,7 @@ class FormlyFieldLookupDialogComponent extends ACommonsFormlyFieldType {
|
|
|
3816
4098
|
}
|
|
3817
4099
|
}
|
|
3818
4100
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldLookupDialogComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3819
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldLookupDialogComponent, isStandalone: true, selector: "mng-formly-field-lookup-dialog", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "table", first: true, predicate: TableComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [class]=\"'p-inputgroup mng-dropdown-dialog' + (descriptor.inputClassName ?? 'mng-formly-field-lookup-dialog')\"\n [class.p-inputtext-sm]=\"descriptor.isSizeSmall\"\n [class.p-inputtext-lg]=\"descriptor.isSizeLarge\">\n <input pInputText type=\"text\" [id]=\"$any(key)\" [readonly]=\"true\" [formlyAttributes]=\"field\" [formControl]=\"fieldLabelFormControl\" />\n @if (!props.required && formControl.value && !formControl.disabled) {\n <i class=\"mng-dropdown-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n }\n <button\n pButton\n pRipple\n class=\"mng-dropdown-dialog-search-button\"\n type=\"button\"\n [label]=\"'general.search' | translate: {item: ''}\"\n [disabled]=\"formControl.disabled\"\n (click)=\"openSelectDialog()\"></button>\n</div>\n\n<p-dialog\n [(visible)]=\"isDialogVisible\"\n [draggable]=\"false\"\n [header]=\"'general.search' | translate: {item: props.label!}\"\n [modal]=\"true\"\n appendTo=\"body\"\n styleClass=\"p-fluid mng-dialog mng-formly-field-lookup-dialog\">\n <ng-template pTemplate=\"content\" mngDialogKeydownHandler>\n <mng-table\n [descriptor]=\"descriptor.dialogTableDescriptor!\"\n [dataProvider]=\"descriptor.dialogTableDataProvider\"\n [result]=\"addItems()\"\n [selectionEnabled]=\"true\"\n [selectionMode]=\"'single'\"\n [loading]=\"dialogIsLoading()\"\n [captionComponent]=\"config.table?.captionComponent\"\n [columnCustomLastComponent]=\"config.table?.columnActionComponent\"\n (selectionChange)=\"onSelectionChange($event)\"\n (captionComponentInstance)=\"onCaptionCmpInst($event)\"\n (columnCustomLastComponentInstance)=\"onColumnActionCmpInst($event)\">\n </mng-table>\n <p-messages [value]=\"dialogMessages\"></p-messages>\n </ng-template>\n\n <ng-template pTemplate=\"footer\">\n <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n <button\n pButton\n pRipple\n type=\"button\"\n [label]=\"'general.select' | translate\"\n icon=\"pi pi-check\"\n class=\"p-button-text\"\n (click)=\"onAddItem()\"\n [loading]=\"dialogIsLoading()\"\n loadingIcon=\"pi pi-spin pi-spinner\"\n [disabled]=\"form.disabled\"></button>\n </ng-template>\n</p-dialog>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "directive", type: i2$
|
|
4101
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldLookupDialogComponent, isStandalone: true, selector: "mng-formly-field-lookup-dialog", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "table", first: true, predicate: TableComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n [class]=\"'p-inputgroup mng-dropdown-dialog' + (descriptor.inputClassName ?? 'mng-formly-field-lookup-dialog')\"\n [class.p-inputtext-sm]=\"descriptor.isSizeSmall\"\n [class.p-inputtext-lg]=\"descriptor.isSizeLarge\">\n <input pInputText type=\"text\" [id]=\"$any(key)\" [readonly]=\"true\" [formlyAttributes]=\"field\" [formControl]=\"fieldLabelFormControl\" />\n @if (!props.required && formControl.value && !formControl.disabled) {\n <i class=\"mng-dropdown-clear-icon pi pi-times\" (click)=\"clear()\"></i>\n }\n <button\n pButton\n pRipple\n class=\"mng-dropdown-dialog-search-button\"\n type=\"button\"\n [label]=\"'general.search' | translate: {item: ''}\"\n [disabled]=\"formControl.disabled\"\n (click)=\"openSelectDialog()\"></button>\n</div>\n\n<p-dialog\n [(visible)]=\"isDialogVisible\"\n [draggable]=\"false\"\n [header]=\"'general.search' | translate: {item: props.label!}\"\n [modal]=\"true\"\n appendTo=\"body\"\n styleClass=\"p-fluid mng-dialog mng-formly-field-lookup-dialog\">\n <ng-template pTemplate=\"content\" mngDialogKeydownHandler>\n <mng-table\n [descriptor]=\"descriptor.dialogTableDescriptor!\"\n [dataProvider]=\"descriptor.dialogTableDataProvider\"\n [result]=\"addItems()\"\n [selectionEnabled]=\"true\"\n [selectionMode]=\"'single'\"\n [loading]=\"dialogIsLoading()\"\n [captionComponent]=\"config.table?.captionComponent\"\n [columnCustomLastComponent]=\"config.table?.columnActionComponent\"\n (selectionChange)=\"onSelectionChange($event)\"\n (captionComponentInstance)=\"onCaptionCmpInst($event)\"\n (columnCustomLastComponentInstance)=\"onColumnActionCmpInst($event)\">\n </mng-table>\n <p-messages [value]=\"dialogMessages\"></p-messages>\n </ng-template>\n\n <ng-template pTemplate=\"footer\">\n <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n <button\n pButton\n pRipple\n type=\"button\"\n [label]=\"'general.select' | translate\"\n icon=\"pi pi-check\"\n class=\"p-button-text\"\n (click)=\"onAddItem()\"\n [loading]=\"dialogIsLoading()\"\n loadingIcon=\"pi pi-spin pi-spinner\"\n [disabled]=\"form.disabled\"></button>\n </ng-template>\n</p-dialog>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "directive", type: i2$1.ɵFormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "cellClickEnabled", "selectionMode", "selectionEnabled", "rowReorderEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance", "rowReorder"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: i3$1.Messages, selector: "p-messages", inputs: ["value", "closable", "style", "styleClass", "enableService", "key", "escape", "severity", "showTransitionOptions", "hideTransitionOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]", inputs: ["variant"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3820
4102
|
}
|
|
3821
4103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldLookupDialogComponent, decorators: [{
|
|
3822
4104
|
type: Component,
|
|
@@ -4203,7 +4485,7 @@ class FormlyFieldTableDialogMultiselectComponent extends ACommonsFormlyFieldType
|
|
|
4203
4485
|
this.descriptor.nextEvent(FormFieldEventTypeEnum.RowReorder, this, { dragIndex: event.dragIndex, dropIndex: event.dropIndex });
|
|
4204
4486
|
}
|
|
4205
4487
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldTableDialogMultiselectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
4206
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldTableDialogMultiselectComponent, isStandalone: true, selector: "mng-formly-table-multiselect-add-field", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "addTableComponent", first: true, predicate: ["addTableComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"items()\" [rowReorderEnabled]=\"!disableRowReorder()\" (rowReorder)=\"onRowReorder($event)\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex justify-content-end align-items-center\">\n <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\">\n {{ descriptor | mngFormlyFieldLabel: editorDescriptor | translate }}\n @if (props.required && props['hideRequiredMarker'] !== true) {\n <span>*</span>\n }\n </label>\n <div>\n @if (hasAddAction && !options.formState?.disabled) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-plus\"\n class=\"p-button-rounded mng-button-xs\"\n (click)=\"openAddDialog()\"\n [disabled]=\"formControl!.disabled\"></button>\n }\n </div>\n </div>\n </ng-template>\n <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\">\n @if (hasDeleteAction && !options.formState?.disabled) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-trash\"\n class=\"p-button-rounded p-button-danger mng-button-xs\"\n (click)=\"removeItem(item)\"\n [disabled]=\"formControl!.disabled\"></button>\n }\n </ng-template>\n</mng-table>\n\n@if (hasAddAction) {\n <p-dialog\n [(visible)]=\"isDialogVisible\"\n [draggable]=\"false\"\n [header]=\"'general.addItem' | translate: {item: props.label! | translate}\"\n [modal]=\"true\"\n appendTo=\"body\"\n styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n <ng-template pTemplate=\"content\" class=\"table-container\" mngDialogKeydownHandler>\n <div class=\"h-full flex flex-column\">\n <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n <mng-table\n #addTableComponent\n [descriptor]=\"descriptor.lookupTableDescriptor\"\n [globalFilterFields]=\"descriptor.searchFields\"\n [result]=\"addItems()\"\n [selectionEnabled]=\"true\"\n [loading]=\"dialogIsLoading()\"\n (selectionChange)=\"onSelectionChange($event)\">\n @if (descriptor.searchEnabled) {\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex\">\n <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n <i class=\"pi pi-search\"></i>\n <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n </span>\n </div>\n </ng-template>\n }\n </mng-table>\n </div>\n </div>\n <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n <button\n pButton\n pRipple\n type=\"button\"\n [label]=\"'general.add' | translate\"\n icon=\"pi pi-check\"\n class=\"p-button-primary\"\n (click)=\"onAddItems()\"\n [loading]=\"dialogIsLoading()\"\n loadingIcon=\"pi pi-spin pi-spinner\"\n [disabled]=\"form.disabled\"></button>\n </div>\n </div>\n </ng-template>\n </p-dialog>\n}\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "cellClickEnabled", "selectionMode", "selectionEnabled", "rowReorderEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance", "rowReorder"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i2$
|
|
4488
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldTableDialogMultiselectComponent, isStandalone: true, selector: "mng-formly-table-multiselect-add-field", providers: [provideViewContainer(false)], viewQueries: [{ propertyName: "addTableComponent", first: true, predicate: ["addTableComponent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<mng-table [descriptor]=\"descriptor.mainTableDescriptor\" [items]=\"items()\" [rowReorderEnabled]=\"!disableRowReorder()\" (rowReorder)=\"onRowReorder($event)\">\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex justify-content-end align-items-center\">\n <label class=\"mng-datatable-form-label p-0 m-0\" [for]=\"key\">\n {{ descriptor | mngFormlyFieldLabel: editorDescriptor | translate }}\n @if (props.required && props['hideRequiredMarker'] !== true) {\n <span>*</span>\n }\n </label>\n <div>\n @if (hasAddAction && !options.formState?.disabled) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-plus\"\n class=\"p-button-rounded mng-button-xs\"\n (click)=\"openAddDialog()\"\n [disabled]=\"formControl!.disabled\"></button>\n }\n </div>\n </div>\n </ng-template>\n <ng-template mngTemplate=\"columnCustomLast\" let-item=\"rowItem\">\n @if (hasDeleteAction && !options.formState?.disabled) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-trash\"\n class=\"p-button-rounded p-button-danger mng-button-xs\"\n (click)=\"removeItem(item)\"\n [disabled]=\"formControl!.disabled\"></button>\n }\n </ng-template>\n</mng-table>\n\n@if (hasAddAction) {\n <p-dialog\n [(visible)]=\"isDialogVisible\"\n [draggable]=\"false\"\n [header]=\"'general.addItem' | translate: {item: props.label! | translate}\"\n [modal]=\"true\"\n appendTo=\"body\"\n styleClass=\"p-fluid mng-dialog mng-dialog-sm mng-formly-field-table-multiselect-dialog\">\n <ng-template pTemplate=\"content\" class=\"table-container\" mngDialogKeydownHandler>\n <div class=\"h-full flex flex-column\">\n <div class=\"flex-grow-1 formly-field-table-multiselect-dialog-form-container\">\n <div class=\"mng-formly-field-table-multiselect-dialog-table\">\n <mng-table\n #addTableComponent\n [descriptor]=\"descriptor.lookupTableDescriptor\"\n [globalFilterFields]=\"descriptor.searchFields\"\n [result]=\"addItems()\"\n [selectionEnabled]=\"true\"\n [loading]=\"dialogIsLoading()\"\n (selectionChange)=\"onSelectionChange($event)\">\n @if (descriptor.searchEnabled) {\n <ng-template mngTemplate=\"caption\">\n <div class=\"flex\">\n <span class=\"p-input-icon-left ml-auto\" [ngStyle]=\"{width: 'unset'}\">\n <i class=\"pi pi-search\"></i>\n <input pInputText type=\"text\" (input)=\"onSearch($event)\" [placeholder]=\"'general.search' | translate\" />\n </span>\n </div>\n </ng-template>\n }\n </mng-table>\n </div>\n </div>\n <div class=\"flex flex-row justify-content-end mng-formly-field-table-multiselect-dialog-footer\">\n <button pButton pRipple type=\"button\" [label]=\"'general.cancel' | translate\" icon=\"pi pi-times\" class=\"p-button-text\" (click)=\"hideDialog()\"></button>\n <button\n pButton\n pRipple\n type=\"button\"\n [label]=\"'general.add' | translate\"\n icon=\"pi pi-check\"\n class=\"p-button-primary\"\n (click)=\"onAddItems()\"\n [loading]=\"dialogIsLoading()\"\n loadingIcon=\"pi pi-spin pi-spinner\"\n [disabled]=\"form.disabled\"></button>\n </div>\n </div>\n </ng-template>\n </p-dialog>\n}\n", styles: [".table-footer{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:center;align-content:center;margin-top:2rem}.table-container{overflow:hidden}.table-footer button{width:8rem}.table-footer button:not(:first-child){margin-left:1.5rem}.table-scroll{max-height:75vh;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "component", type: TableComponent, selector: "mng-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "cellClickEnabled", "selectionMode", "selectionEnabled", "rowReorderEnabled", "columnLastMinWidth", "captionComponent", "columnCustomLastComponent", "globalFilterFields"], outputs: ["tableLoad", "cellClick", "selectionChange", "captionComponentInstance", "columnCustomLastComponentInstance", "rowReorder"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i7$2.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i7.Ripple, selector: "[pRipple]" }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i13.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: FormlyFieldLabelPipe, name: "mngFormlyFieldLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4207
4489
|
}
|
|
4208
4490
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldTableDialogMultiselectComponent, decorators: [{
|
|
4209
4491
|
type: Component,
|
|
@@ -4223,7 +4505,7 @@ class FormlyFieldTabsComponent extends ACommonsFormlyFieldType {
|
|
|
4223
4505
|
this.fieldGroup.set(this.field.fieldGroup === undefined ? [] : this.field.fieldGroup);
|
|
4224
4506
|
}
|
|
4225
4507
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldTabsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
4226
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldTabsComponent, isStandalone: true, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView [scrollable]=\"true\">\n @for (tab of fieldGroup(); track tab) {\n <p-tabPanel\n [header]=\"tab.props.descriptor | mngFormlyFieldLabel: tab.props.editorDescriptor | translate\"\n [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n <ng-template pTemplate=\"header\">\n <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.key ?? '') + '_invalid']\">{{\n tab.props.descriptor | mngFormlyFieldLabel: tab.props.editorDescriptor | translate\n }}</span>\n </ng-template>\n <formly-field [field]=\"tab\"></formly-field>\n </p-tabPanel>\n }\n</p-tabView>\n", dependencies: [{ kind: "ngmodule", type: TabViewModule }, { kind: "component", type: i1$6.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i1$6.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "directive", type: i2$
|
|
4508
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: FormlyFieldTabsComponent, isStandalone: true, selector: "mng-formly-field-tabs", usesInheritance: true, ngImport: i0, template: "<p-tabView [scrollable]=\"true\">\n @for (tab of fieldGroup(); track tab) {\n <p-tabPanel\n [header]=\"tab.props.descriptor | mngFormlyFieldLabel: tab.props.editorDescriptor | translate\"\n [headerStyleClass]=\"formControl!.valid ? 'p-tabview-title' : undefined\">\n <ng-template pTemplate=\"header\">\n <span class=\"p-tabview-title\" [class.p-tabview-title-error]=\"formState.submittedOn && formState['tab_' + (tab.id ? tab.id : tab.key ?? '') + '_invalid']\">{{\n tab.props.descriptor | mngFormlyFieldLabel: tab.props.editorDescriptor | translate\n }}</span>\n </ng-template>\n <formly-field [field]=\"tab\"></formly-field>\n </p-tabPanel>\n }\n</p-tabView>\n", dependencies: [{ kind: "ngmodule", type: TabViewModule }, { kind: "component", type: i1$6.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i1$6.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$1.FormlyField, selector: "formly-field", inputs: ["field"] }, { kind: "pipe", type: FormlyFieldLabelPipe, name: "mngFormlyFieldLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4227
4509
|
}
|
|
4228
4510
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: FormlyFieldTabsComponent, decorators: [{
|
|
4229
4511
|
type: Component,
|
|
@@ -4740,7 +5022,7 @@ class TableviewComponent {
|
|
|
4740
5022
|
return actions.filter(action => (action.positionTableviewCategories?.includes(TableviewActionDefaultCategories.READ) ?? true) && actionPositions.includes(action.position));
|
|
4741
5023
|
}
|
|
4742
5024
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: TableviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4743
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: TableviewComponent, isStandalone: true, selector: "mng-tableview", inputs: { descriptor: { classPropertyName: "descriptor", publicName: "descriptor", isSignal: true, isRequired: true, transformFunction: null }, dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideViewContainer()], queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n <div class=\"card\">\n @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n <p-toolbar styleClass=\"mb-4\">\n <ng-template pTemplate=\"left\">\n @for (action of toolbarLeftActions(); track action) {\n <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n }\n </ng-template>\n <ng-template pTemplate=\"right\">\n @for (action of toolbarRightActions(); track action) {\n <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n }\n </ng-template>\n </p-toolbar>\n }\n\n <mng-action-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 @if (rowExpandTemplate()) {\n <ng-template mngTemplate=\"rowExpandContent\" let-item=\"rowItem\">\n <ng-container *ngTemplateOutlet=\"rowExpandTemplate(); context: {rowItem: item}\"></ng-container>\n </ng-template>\n }\n\n @if (footerTemplate()) {\n <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n <ng-container *ngTemplateOutlet=\"footerTemplate(); context: {data, totalCount}\"></ng-container>\n </ng-template>\n }\n </mng-action-table>\n </div>\n\n <router-outlet></router-outlet>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$
|
|
5025
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.5", type: TableviewComponent, isStandalone: true, selector: "mng-tableview", inputs: { descriptor: { classPropertyName: "descriptor", publicName: "descriptor", isSignal: true, isRequired: true, transformFunction: null }, dataProvider: { classPropertyName: "dataProvider", publicName: "dataProvider", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [provideViewContainer()], queries: [{ propertyName: "templates", predicate: TemplateDirective, isSignal: true }], ngImport: i0, template: "<div class=\"mng-tableview\">\n <div class=\"card\">\n @if (toolbarLeftActions().length > 0 || toolbarRightActions().length > 0) {\n <p-toolbar styleClass=\"mb-4\">\n <ng-template pTemplate=\"left\">\n @for (action of toolbarLeftActions(); track action) {\n <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n }\n </ng-template>\n <ng-template pTemplate=\"right\">\n @for (action of toolbarRightActions(); track action) {\n <mng-action [action]=\"action\" [dataListParams]=\"tableParams()\" [hostComponent]=\"this\" [selectedItems]=\"selectedItems()\"></mng-action>\n }\n </ng-template>\n </p-toolbar>\n }\n\n <mng-action-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 @if (rowExpandTemplate()) {\n <ng-template mngTemplate=\"rowExpandContent\" let-item=\"rowItem\">\n <ng-container *ngTemplateOutlet=\"rowExpandTemplate(); context: {rowItem: item}\"></ng-container>\n </ng-template>\n }\n\n @if (footerTemplate()) {\n <ng-template mngTemplate=\"footer\" let-data=\"data\" let-totalCount=\"totalCount\">\n <ng-container *ngTemplateOutlet=\"footerTemplate(); context: {data, totalCount}\"></ng-container>\n </ng-template>\n }\n </mng-action-table>\n </div>\n\n <router-outlet></router-outlet>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i2$3.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "directive", type: i2$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "dataListParams", "dataProvider", "hostComponent", "route", "disabled", "loading", "selectedItems"], outputs: ["finish"] }, { kind: "component", type: ActionTableComponent, selector: "mng-action-table", inputs: ["descriptor", "items", "result", "loading", "dataProvider", "useQueryParams", "selectionMode", "selectionEnabled", "globalFilterFields", "rowReorderEnabled", "actions", "captionComponent", "columnActionComponent", "columnActionMinWidth"], outputs: ["tableLoad", "selectionChange", "captionComponentInstance", "columnActionComponentInstance", "rowReorder"] }, { kind: "directive", type: TemplateDirective, selector: "[mngTemplate]", inputs: ["type", "mngTemplate"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4744
5026
|
}
|
|
4745
5027
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.5", ngImport: i0, type: TableviewComponent, decorators: [{
|
|
4746
5028
|
type: Component,
|
|
@@ -4984,5 +5266,5 @@ function withTableview(config) {
|
|
|
4984
5266
|
* Generated bundle index. Do not edit.
|
|
4985
5267
|
*/
|
|
4986
5268
|
|
|
4987
|
-
export { ACTION_EDITOR_COMPONENT_IT, ActionComponent, ActionContext, ActionDataProviderSource, ActionEditorComponent, ActionErrorMapperService, ActionExecutorService, ActionInstance, ActionInstanceStateEnum, ActionTableComponent, COMMONS_TABLEVIEW_FEATURE_CONFIG_IT, ComponentActionExecutorService, DataLanguageDropdownComponent, DefaultActionErrorMapperService, DefaultDataProviderExecutor, FormEditorComponent, FormEditorService, FormlyFieldActionComponent, FormlyFieldAutocompleteComponent, FormlyFieldCustomComponent, FormlyFieldDropdownComponent, FormlyFieldFieldsetComponent, FormlyFieldInputComponent, FormlyFieldLabelComponent, FormlyFieldLookupDialogComponent, FormlyFieldNoLabelWrapperComponent, FormlyFieldTableDialogFormComponent, FormlyFieldTableDialogMultiselectComponent, FormlyFieldTabsComponent, FormlyFieldWrapperComponent, NavigationService, RootActionExecutorService, TableviewComponent, TableviewRouteBuilder, TableviewRouteComponent, ViewContainer, actionNotificationError, actionNotificationSuccess, addAsyncValidationsToFormlyField, addValidationsToFormlyField, calculateTableColumnActionWidth, commonsFormlyConfigProvider, createFormlyConfigFromDescriptor, createFormlyField, createFormlyFields, createFormlyGroupType, createFormlyLocalizationsTab, createFormlyTabType, createFormlyValidation, createTableviewLazyRoute, createTableviewRoute, emailValidationName, emailValidator, formlyTypesConfig, formlyWrappersConfig, getActionButtonRoundedWidth, getEditorFieldLabel, getEmailValidationMessage, getFormEditorInfoMessage, getFormEditorWarningMessage, getFormlyValidationMessages, getI18nActionEditorTitleAsync, getI18nActionParams, getI18nActionParamsAsync, getI18nActionTitleAsync, getI18nForAction, getI18nForActionAsync, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTableCellPaddingX, getTextPatternValidationMessage, maxDateValidationName, maxDateValidator, minDateValidationName, minDateValidator, populateI18nActionParams, provideActionExecutor, provideFormComponent, provideViewContainer, unsavedChangesGuard, withTableview };
|
|
5269
|
+
export { ACTION_EDITOR_COMPONENT_IT, ActionComponent, ActionContext, ActionDataProviderSource, ActionEditorComponent, ActionErrorMapperService, ActionExecutorService, ActionInstance, ActionInstanceStateEnum, ActionTableComponent, COMMONS_TABLEVIEW_FEATURE_CONFIG_IT, ComponentActionExecutorService, DataLanguageDropdownComponent, DefaultActionErrorMapperService, DefaultDataProviderExecutor, EditorAutoSaveStatusComponent, FormEditorComponent, FormEditorService, FormlyFieldActionComponent, FormlyFieldAutocompleteComponent, FormlyFieldCustomComponent, FormlyFieldDropdownComponent, FormlyFieldFieldsetComponent, FormlyFieldInputComponent, FormlyFieldLabelComponent, FormlyFieldLookupDialogComponent, FormlyFieldNoLabelWrapperComponent, FormlyFieldTableDialogFormComponent, FormlyFieldTableDialogMultiselectComponent, FormlyFieldTabsComponent, FormlyFieldWrapperComponent, NavigationService, RootActionExecutorService, TableviewComponent, TableviewRouteBuilder, TableviewRouteComponent, ViewContainer, actionNotificationError, actionNotificationSuccess, addAsyncValidationsToFormlyField, addValidationsToFormlyField, calculateTableColumnActionWidth, commonsFormlyConfigProvider, createFormlyConfigFromDescriptor, createFormlyField, createFormlyFields, createFormlyGroupType, createFormlyLocalizationsTab, createFormlyTabType, createFormlyValidation, createTableviewLazyRoute, createTableviewRoute, emailValidationName, emailValidator, formlyTypesConfig, formlyWrappersConfig, getActionButtonRoundedWidth, getEditorFieldLabel, getEmailValidationMessage, getFormEditorInfoMessage, getFormEditorWarningMessage, getFormlyValidationMessages, getI18nActionEditorTitleAsync, getI18nActionParams, getI18nActionParamsAsync, getI18nActionTitleAsync, getI18nForAction, getI18nForActionAsync, getMaxDateValidationMessage, getMaxLengthValidationMessage, getMaxValidationMessage, getMinDateValidationMessage, getMinLengthValidationMessage, getMinValidationMessage, getRequiredValidationMessage, getTableCellPaddingX, getTextPatternValidationMessage, maxDateValidationName, maxDateValidator, minDateValidationName, minDateValidator, populateI18nActionParams, provideActionExecutor, provideFormComponent, provideViewContainer, unsavedChangesGuard, withTableview };
|
|
4988
5270
|
//# sourceMappingURL=mediusinc-mng-commons-tableview.mjs.map
|