@mediusinc/mng-commons 0.17.3 → 0.17.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/action/editor/action-editor.component.mjs +1 -1
- package/esm2020/lib/components/form/formly/fields/formly-field-table-dialog-multiselect/formly-field-table-dialog-multiselect.component.mjs +1 -1
- package/esm2020/lib/components/layout/menu-item.component.mjs +34 -6
- package/esm2020/lib/components/layout/menu.component.mjs +1 -1
- package/esm2020/lib/components/tableview/table/table.component.mjs +3 -3
- package/esm2020/lib/descriptors/column.descriptor.mjs +2 -1
- package/esm2020/lib/descriptors/tableview.descriptor.mjs +21 -4
- package/esm2020/lib/pipes/enumerate-async.pipe.mjs +1 -1
- package/fesm2015/mediusinc-mng-commons.mjs +58 -12
- package/fesm2015/mediusinc-mng-commons.mjs.map +1 -1
- package/fesm2020/mediusinc-mng-commons.mjs +56 -10
- package/fesm2020/mediusinc-mng-commons.mjs.map +1 -1
- package/lib/components/layout/menu-item.component.d.ts +12 -4
- package/lib/descriptors/tableview.descriptor.d.ts +6 -0
- package/package.json +1 -1
- package/scss/mng-overrides/_layout_dialog.scss +15 -3
- package/scss/mng-overrides/_theme_datatable.scss +17 -11
- package/version-info.json +5 -5
|
@@ -2844,6 +2844,7 @@ class ColumnDescriptor {
|
|
|
2844
2844
|
obj._width = this._width;
|
|
2845
2845
|
obj._minWidth = this._minWidth;
|
|
2846
2846
|
obj._maxWidth = this._maxWidth;
|
|
2847
|
+
obj._customComponentType = this._customComponentType;
|
|
2847
2848
|
obj._hasCopyToClipboard = this._hasCopyToClipboard;
|
|
2848
2849
|
obj._template = this._template;
|
|
2849
2850
|
obj._getter = this._getter;
|
|
@@ -4588,9 +4589,9 @@ class TableviewDescriptor {
|
|
|
4588
4589
|
static from(modelType, idProperty, titleProperty) {
|
|
4589
4590
|
const descriptor = new TableviewDescriptor(modelType, idProperty, titleProperty);
|
|
4590
4591
|
descriptor._table = TableDescriptor.from(modelType, idProperty, titleProperty);
|
|
4591
|
-
descriptor._editEditor = EditorDescriptor.from(modelType, idProperty, titleProperty);
|
|
4592
|
-
descriptor._detailsEditor = EditorDescriptor.from(modelType, idProperty, titleProperty);
|
|
4593
|
-
descriptor._addEditor = EditorDescriptor.from(modelType, idProperty, titleProperty);
|
|
4592
|
+
descriptor._editEditor = EditorDescriptor.from(modelType, idProperty, titleProperty, TableviewEditorTypeEnum.Edit);
|
|
4593
|
+
descriptor._detailsEditor = EditorDescriptor.from(modelType, idProperty, titleProperty, TableviewEditorTypeEnum.Details).withDisabled();
|
|
4594
|
+
descriptor._addEditor = EditorDescriptor.from(modelType, idProperty, titleProperty, TableviewEditorTypeEnum.Add);
|
|
4594
4595
|
return descriptor;
|
|
4595
4596
|
}
|
|
4596
4597
|
/**
|
|
@@ -4651,6 +4652,23 @@ class TableviewDescriptor {
|
|
|
4651
4652
|
this._editEditor = descriptor;
|
|
4652
4653
|
return this;
|
|
4653
4654
|
}
|
|
4655
|
+
/**
|
|
4656
|
+
* creates new copy of editor descriptor and makes it disabled
|
|
4657
|
+
* usable in combination with this::withEditorDescriptors, where detailsDescriptor is made non disabled
|
|
4658
|
+
* @param type which editor type to set to disabled
|
|
4659
|
+
*/
|
|
4660
|
+
withDisabledEditorDescriptor(type = TableviewEditorTypeEnum.Details) {
|
|
4661
|
+
if (type === TableviewEditorTypeEnum.Edit) {
|
|
4662
|
+
this._editEditor = this._editEditor.copy().withDisabled();
|
|
4663
|
+
}
|
|
4664
|
+
else if (type === TableviewEditorTypeEnum.Details) {
|
|
4665
|
+
this._detailsEditor = this._detailsEditor.copy().withDisabled();
|
|
4666
|
+
}
|
|
4667
|
+
else if (type === TableviewEditorTypeEnum.Add) {
|
|
4668
|
+
this._addEditor = this._addEditor.copy().withDisabled();
|
|
4669
|
+
}
|
|
4670
|
+
return this;
|
|
4671
|
+
}
|
|
4654
4672
|
withTableTitle(title) {
|
|
4655
4673
|
this._tableTitle = title;
|
|
4656
4674
|
return this;
|
|
@@ -10081,10 +10099,10 @@ class MngTableComponent {
|
|
|
10081
10099
|
}
|
|
10082
10100
|
}
|
|
10083
10101
|
MngTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.TranslateService }, { token: MngActionExecutorService }, { token: MngViewContainerComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
10084
|
-
MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableComponent, selector: "mng-table", inputs: { initialDescriptor: ["descriptor", "initialDescriptor"], items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\" [class]=\"col.headerClassName\">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"!col.isSortEnabled\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"col.className\"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i6$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i6$3.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "component", type: i6$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i6$3.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i6$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i6$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i7$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { kind: "component", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: MngI18nPropertyPipe, name: "i18nProperty" }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10102
|
+
MngTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngTableComponent, selector: "mng-table", inputs: { initialDescriptor: ["descriptor", "initialDescriptor"], items: "items", queryResult: "queryResult", loading: "loading", dataProvider: "dataProvider", useQueryParams: "useQueryParams", selectionMode: "selectionMode", selectionEnabled: "selectionEnabled", actions: "actions", isColumnClickable: "isColumnClickable", viewContainerInit: ["viewContainer", "viewContainerInit"], captionComponent: "captionComponent", columnActionComponent: "columnActionComponent", columnActionMinWidth: "columnActionMinWidth" }, outputs: { loadEventEmitter: "tableLoad", cellClickEventEmitter: "cellClick", selectionChangeEventEmitter: "selectionChange", captionCmpInstEventEmitter: "captionComponentInstance", columnActionCmpInstEventEmitter: "columnActionComponentInstance" }, queries: [{ propertyName: "templates", predicate: MngTemplateDirective }], viewQueries: [{ propertyName: "primeTable", first: true, predicate: Table, descendants: true }, { propertyName: "components", predicate: MngComponentDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\" [class]=\"col.headerClassName\">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"!col.isSortEnabled\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\" [class]=\"col.headerClassName\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"col.className\"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i6$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i6$3.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "component", type: i6$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i6$3.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i6$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i6$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i7$3.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: MngComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "inputs"], outputs: ["instanceCreated"] }, { kind: "component", type: MngTableColumnValueComponent, selector: "mng-table-column-value", inputs: ["descriptor", "item"] }, { kind: "component", type: MngTableColumnFilterComponent, selector: "mng-table-column-filter", inputs: ["descriptor", "display"] }, { kind: "component", type: MngActionComponent, selector: "mng-action", inputs: ["action", "item", "itemId", "actionData", "queryParam", "dataProvider", "disabled", "loading", "viewContainer", "selectedItems"], outputs: ["finish"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "pipe", type: MngI18nPropertyPipe, name: "i18nProperty" }, { kind: "pipe", type: MngClassMapPipe, name: "mngClassMapPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
10085
10103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngTableComponent, decorators: [{
|
|
10086
10104
|
type: Component,
|
|
10087
|
-
args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\" [class]=\"col.headerClassName\">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"!col.isSortEnabled\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"col.className\"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n" }]
|
|
10105
|
+
args: [{ selector: 'mng-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [style.height]=\"tableFullHeightOffset ? 'calc(100vh - ' + tableFullHeightOffset + 'px)' : null\">\n <!-- MUST NOT use observable for value when using virtual scroll - does not work for some reason -->\n <p-table\n *ngIf=\"!useQueryParams || (useQueryParamsInitialized$ | async)\"\n [value]=\"infiniteScroll ? dataProviderInfiniteScrollItems : (queryResult$ | async)?.pageData ?? []\"\n [dataKey]=\"$any(descriptor?.dataKeyProperty ?? null)\"\n [lazy]=\"isLazy\"\n [loading]=\"(loading$ | async) ?? false\"\n [paginator]=\"isPagination && !infiniteScroll\"\n [rows]=\"$any(infiniteScroll ? 20 : rows)\"\n [first]=\"$any(infiniteScroll ? 0 : offset)\"\n [totalRecords]=\"$any(infiniteScroll ? null : (queryResult$ | async)?.allDataCount ?? 0)\"\n [rowsPerPageOptions]=\"$any(infiniteScroll ? null : rowsPerPageOptions)\"\n [showCurrentPageReport]=\"!infiniteScroll\"\n [currentPageReportTemplate]=\"'mngTable.paginationMsg' | translate\"\n [multiSortMeta]=\"$any(multiSortMeta)\"\n [filters]=\"filterMetadata\"\n sortMode=\"multiple\"\n [(selection)]=\"selection\"\n (selectionChange)=\"onSelectionChange($event)\"\n [selectionMode]=\"$any(selectionEnabled ? selectionMode : null)\"\n [scrollable]=\"true\"\n [virtualScroll]=\"infiniteScroll\"\n [virtualScrollItemSize]=\"$any(rowHeight)\"\n scrollHeight=\"flex\"\n [rowHover]=\"descriptor?.hasHover ?? true\"\n [styleClass]=\"className\"\n (onLazyLoad)=\"onTableLazyLoad($event)\"\n (onSort)=\"onTableSort($event)\"\n (onFilter)=\"onTableFilter($event)\">\n <ng-template *ngIf=\"captionTemplate || captionComponent || descriptor?.title\" pTemplate=\"caption\">\n <ng-container *ngIf=\"captionTemplate; else componentOrDefaultCaption\">\n <ng-container *ngTemplateOutlet=\"captionTemplate\"></ng-container>\n </ng-container>\n <ng-template #componentOrDefaultCaption>\n <div *ngIf=\"captionComponent; else defaultCaption\" [mngComponent]=\"captionComponent\" (instanceCreated)=\"onCaptionCmpInst($event)\"></div>\n <ng-template #defaultCaption>\n <h5 class=\"p-0 m-0\">{{ descriptor?.title }}</h5>\n </ng-template>\n </ng-template>\n </ng-template>\n\n <ng-template pTemplate=\"header\">\n <tr *ngIf=\"!descriptor?.hideHeader\" class=\"mng-table-header\" [class]=\"descriptor?.headerClassName\">\n <th *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" pFrozenColumn>\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n </th>\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\"></th>\n <ng-container *ngFor=\"let col of descriptor?.columns\">\n <th *ngIf=\"col.isSortEnabled\" [pSortableColumn]=\"col.property\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\" [class]=\"col.headerClassName\">\n <div class=\"flex justify-content-between align-items-center\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <p-sortIcon [field]=\"col.property\"></p-sortIcon>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"!col.isSortEnabled\" [style.width.%]=\"col.width\" [style.min-width.px]=\"col.minWidth\" [class]=\"col.headerClassName\">\n {{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}\n <ng-container>\n <mng-table-column-filter\n *ngIf=\"col.filterDescriptor && descriptor!.filterDisplay === filterDisplayMenu\"\n class=\"ml-auto\"\n [display]=\"descriptor!.filterDisplay\"\n [descriptor]=\"col.filterDescriptor\">\n </mng-table-column-filter>\n </ng-container>\n </th>\n </ng-container>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n <tr *ngIf=\"descriptor?.filterDisplay === filterDisplayRow && hasColumnFilters\" class=\"mng-column-filter-row\">\n <!-- We need the line below, because otherwise p-tableRadioButton shifts the rest of the columns in table -->\n <th *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"min-width: 36px\" pFrozenColumn></th>\n <th\n *ngFor=\"let col of descriptor?.columns\"\n [class]=\"(col.filterDescriptor ? 'mng-column-filter-' + col.filterDescriptor.filterType + ' ' : ' ') + col.filterDescriptor?.columnClassName\"\n [style.width.%]=\"col.filterDescriptor?.columnWidth ?? col.width\"\n [style.min-width.px]=\"col.filterDescriptor?.columnMinWidth ?? col.minWidth\">\n <div class=\"flex\" *ngIf=\"col.filterDescriptor\">\n <mng-table-column-filter [display]=\"descriptor!.filterDisplay\" [descriptor]=\"col.filterDescriptor\"></mng-table-column-filter>\n </div>\n </th>\n <th *ngIf=\"showInlineActionsColumn\" [style.min-width.px]=\"columnActionMinWidth\" pFrozenColumn></th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-item let-idx=\"rowIndex\">\n <tr [style.height.px]=\"rowHeight\" [class]=\"descriptor?.rowClassName | mngClassMapPipe: descriptor?.rowClassNameMapFn:item\">\n <td *ngIf=\"selectionEnabled && selectionMode === 'multiple'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableCheckbox [value]=\"item\"></p-tableCheckbox>\n </td>\n <td *ngIf=\"selectionEnabled && selectionMode === 'single'\" style=\"width: 3rem\" pFrozenColumn>\n <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n </td>\n <td\n *ngFor=\"let col of descriptor?.columns\"\n (click)=\"onCellClick($event, col, item, idx)\"\n [class]=\"col.className\"\n [class.clickable]=\"isColumnClickable\"\n [style.width.%]=\"col.width\"\n [style.min-width.px]=\"col.minWidth\">\n <span class=\"p-column-title\">{{ col.title ?? (col.property | i18nProperty: descriptor!.model) | translate }}</span>\n <mng-table-column-value [descriptor]=\"col\" [item]=\"item\"></mng-table-column-value>\n </td>\n <td\n *ngIf=\"showInlineActionsColumn\"\n class=\"column-action justify-content-end text-right\"\n [style.min-width.px]=\"columnActionMinWidth\"\n pFrozenColumn\n alignFrozen=\"right\">\n <ng-container *ngIf=\"columnActionTemplate; else showColumnActionComponentOrDefault\">\n <ng-container *ngTemplateOutlet=\"columnActionTemplate; context: {rowItem: item, rowIndex: idx}\"></ng-container>\n </ng-container>\n <ng-template #showColumnActionComponentOrDefault>\n <span\n *ngIf=\"columnActionComponent; else defaultColumnActions\"\n [mngComponent]=\"columnActionComponent!\"\n (instanceCreated)=\"onColumnActionCmpInst($event)\"></span>\n </ng-template>\n <ng-template #defaultColumnActions>\n <mng-action\n *ngFor=\"let action of rowInlineActions\"\n [action]=\"action\"\n [item]=\"item\"\n [itemId]=\"descriptor?.model?.idPropertyName ? item[descriptor!.model!.idPropertyName!] : null\"\n [actionData]=\"{itemIndex: idx}\"\n (finish)=\"onActionFinish($event)\">\n </mng-action>\n </ng-template>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"loadingbody\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n <div class=\"loading-text\"></div>\n <p-skeleton [ngStyle]=\"{width: '100%'}\"></p-skeleton>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"emptymessage\">\n <tr [style.height.px]=\"rowHeight\">\n <td [attr.colspan]=\"(descriptor?.columns?.length ?? 0) + (showInlineActionsColumn ? 1 : 0) + (selectionEnabled ? 1 : 0)\">\n {{ 'mngTable.noItems' | translate }}\n </td>\n </tr>\n </ng-template>\n\n <ng-template *ngIf=\"footerTemplate\" pTemplate=\"summary\">\n <ng-container [ngTemplateOutlet]=\"footerTemplate\" [ngTemplateOutletContext]=\"{queryResult: queryResult}\"></ng-container>\n </ng-template>\n </p-table>\n</div>\n" }]
|
|
10088
10106
|
}], ctorParameters: function () {
|
|
10089
10107
|
return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2.TranslateService }, { type: MngActionExecutorService }, { type: MngViewContainerComponentService, decorators: [{
|
|
10090
10108
|
type: Optional
|
|
@@ -11070,14 +11088,19 @@ class MngMenuItemComponent {
|
|
|
11070
11088
|
this.index = 0;
|
|
11071
11089
|
this.root = false;
|
|
11072
11090
|
this.parentKey = null;
|
|
11091
|
+
this.visibleChangeEventEmitter = new EventEmitter();
|
|
11073
11092
|
this.hostClassNoPadding = false;
|
|
11093
|
+
this.hostClassChildrenHidden = false;
|
|
11074
11094
|
this.key = '';
|
|
11075
11095
|
this.active = false;
|
|
11076
11096
|
this.hover = false;
|
|
11077
11097
|
this.guardsIsAllowedSubject = new BehaviorSubject(true);
|
|
11078
11098
|
this.isPermittedSubject = new BehaviorSubject(true);
|
|
11099
|
+
this.isVisibleSubject = new BehaviorSubject(true);
|
|
11100
|
+
this.childrenVisibilitySubject = [];
|
|
11079
11101
|
this.guardsIsAllowed$ = this.guardsIsAllowedSubject.asObservable().pipe(distinctUntilChanged());
|
|
11080
11102
|
this.isPermitted$ = this.isPermittedSubject.asObservable().pipe(distinctUntilChanged());
|
|
11103
|
+
this.isVisible$ = this.isVisibleSubject.asObservable().pipe(distinctUntilChanged());
|
|
11081
11104
|
}
|
|
11082
11105
|
ngOnInit() {
|
|
11083
11106
|
if (!this.mngCommons.menuModeIsSlim && this.item.routerLink) {
|
|
@@ -11122,11 +11145,23 @@ class MngMenuItemComponent {
|
|
|
11122
11145
|
});
|
|
11123
11146
|
}
|
|
11124
11147
|
this.checkIfMenuItemIsAllowedFromGuard(this.router.routerState.snapshot);
|
|
11125
|
-
this.isVisibleCombinedSubscription = combineLatest([this.isPermitted$, this.guardsIsAllowed$]).subscribe({
|
|
11148
|
+
this.isVisibleCombinedSubscription = combineLatest([of(this.item.visible !== false), this.isPermitted$, this.guardsIsAllowed$]).subscribe({
|
|
11126
11149
|
next: res => {
|
|
11127
|
-
|
|
11150
|
+
const isVisible = res.every(r => r === true);
|
|
11151
|
+
this.hostClassNoPadding = !isVisible;
|
|
11152
|
+
this.isVisibleSubject.next(isVisible);
|
|
11128
11153
|
}
|
|
11129
11154
|
});
|
|
11155
|
+
this.isVisibleSubscription = this.isVisible$.subscribe(v => {
|
|
11156
|
+
this.visibleChangeEventEmitter.emit(v);
|
|
11157
|
+
});
|
|
11158
|
+
if (this.item.items) {
|
|
11159
|
+
this.childrenVisibilitySubject = this.item.items.map(i => new BehaviorSubject(true));
|
|
11160
|
+
this.areChildrenVisibleSubscription = combineLatest(this.childrenVisibilitySubject.map(s => s.asObservable().pipe(distinctUntilChanged()))).subscribe(visible => {
|
|
11161
|
+
const anyChildVisible = visible.some(v => v === true);
|
|
11162
|
+
this.hostClassChildrenHidden = !anyChildVisible;
|
|
11163
|
+
});
|
|
11164
|
+
}
|
|
11130
11165
|
}
|
|
11131
11166
|
updateActiveStateFromRoute() {
|
|
11132
11167
|
if (this.itemUrl) {
|
|
@@ -11176,13 +11211,18 @@ class MngMenuItemComponent {
|
|
|
11176
11211
|
}
|
|
11177
11212
|
}
|
|
11178
11213
|
ngOnDestroy() {
|
|
11179
|
-
var _a, _b, _c, _d, _e, _f;
|
|
11214
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
11180
11215
|
(_a = this.menuSourceSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
|
|
11181
11216
|
(_b = this.menuResetSubscription) === null || _b === void 0 ? void 0 : _b.unsubscribe();
|
|
11182
11217
|
(_c = this.routerEventsSubscription) === null || _c === void 0 ? void 0 : _c.unsubscribe();
|
|
11183
11218
|
(_d = this.guardsIsAllowedSubscription) === null || _d === void 0 ? void 0 : _d.unsubscribe();
|
|
11184
11219
|
(_e = this.isPermittedSubscription) === null || _e === void 0 ? void 0 : _e.unsubscribe();
|
|
11185
|
-
(_f = this.
|
|
11220
|
+
(_f = this.isVisibleSubscription) === null || _f === void 0 ? void 0 : _f.unsubscribe();
|
|
11221
|
+
(_g = this.isVisibleCombinedSubscription) === null || _g === void 0 ? void 0 : _g.unsubscribe();
|
|
11222
|
+
(_h = this.areChildrenVisibleSubscription) === null || _h === void 0 ? void 0 : _h.unsubscribe();
|
|
11223
|
+
}
|
|
11224
|
+
onChildVisibleChange(visible, item, idx) {
|
|
11225
|
+
this.childrenVisibilitySubject[idx].next(visible);
|
|
11186
11226
|
}
|
|
11187
11227
|
checkIfMenuItemIsAllowedFromGuard(routerState) {
|
|
11188
11228
|
var _a, _b;
|
|
@@ -11221,7 +11261,7 @@ class MngMenuItemComponent {
|
|
|
11221
11261
|
}
|
|
11222
11262
|
}
|
|
11223
11263
|
MngMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngMenuItemComponent, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1.ActivatedRoute }, { token: MngAuthorizationService }, { token: MngCommonsService }, { token: MngMainLayoutComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
11224
|
-
MngMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey" }, host: { properties: { "class.layout-root-menuitem": "root", "class.active-menuitem": "active", "class.py-0": "this.hostClassNoPadding" } }, ngImport: i0, template: "<ng-container>\n <div *ngIf=\"root
|
|
11264
|
+
MngMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey" }, outputs: { visibleChangeEventEmitter: "visibleChange" }, host: { properties: { "class.layout-root-menuitem": "root", "class.active-menuitem": "active", "class.py-0": "this.hostClassNoPadding", "class.hidden": "this.hostClassChildrenHidden" } }, ngImport: i0, template: "<ng-container *ngIf=\"isVisible$ | async\">\n <div *ngIf=\"root\" class=\"layout-menuitem-root-text\">\n {{ item.label! | translate }}\n </div>\n <a\n *ngIf=\"!item.routerLink || item.items\"\n [attr.href]=\"item.href\"\n (click)=\"itemClick($event)\"\n (mouseenter)=\"onMouseEnter()\"\n (keydown.enter)=\"itemClick($event)\"\n [routerLink]=\"item.routerLink\"\n [attr.target]=\"item.target\"\n [attr.tabindex]=\"0\"\n [ngClass]=\"item.className ?? ''\"\n pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n </a>\n <a\n *ngIf=\"item.routerLink && !item.items\"\n (click)=\"itemClick($event)\"\n (mouseenter)=\"hover = true\"\n (mouseleave)=\"hover = false\"\n [routerLink]=\"item.routerLink\"\n routerLinkActive=\"active-menuitem-routerlink\"\n [attr.target]=\"item.target\"\n [attr.tabindex]=\"0\"\n [ngClass]=\"item.className ?? ''\"\n pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n </a>\n <ul\n *ngIf=\"item.items || (item.items && (mngCommons.menuModeIsStatic$ | async) && root)\"\n [@children]=\"\n (mngCommons.menuModeIsSlim$ | async) && (mainLayoutService.isMobile$ | async) === false && root\n ? active\n ? 'visible'\n : 'hidden'\n : (mngCommons.menuModeIsStatic$ | async) && root && (mainLayoutService.isMobile$ | async) === false\n ? 'visible'\n : active\n ? 'visibleAnimated'\n : 'hiddenAnimated'\n \">\n <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n <li mng-menuitem [item]=\"child\" [index]=\"i\" [parentKey]=\"key\" [class]=\"child.badgeClassName\" (visibleChange)=\"onChildVisibleChange($event, item, i)\"></li>\n </ng-template>\n </ul>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: i5.Ripple, selector: "[pRipple]" }, { kind: "component", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"], outputs: ["visibleChange"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], animations: [
|
|
11225
11265
|
trigger('children', [
|
|
11226
11266
|
state('void', style({
|
|
11227
11267
|
height: '0px'
|
|
@@ -11273,7 +11313,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
|
|
|
11273
11313
|
transition('hiddenAnimated => visibleAnimated', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
|
|
11274
11314
|
transition('void => visibleAnimated, visibleAnimated => void', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
|
|
11275
11315
|
])
|
|
11276
|
-
], template: "<ng-container>\n <div *ngIf=\"root
|
|
11316
|
+
], template: "<ng-container *ngIf=\"isVisible$ | async\">\n <div *ngIf=\"root\" class=\"layout-menuitem-root-text\">\n {{ item.label! | translate }}\n </div>\n <a\n *ngIf=\"!item.routerLink || item.items\"\n [attr.href]=\"item.href\"\n (click)=\"itemClick($event)\"\n (mouseenter)=\"onMouseEnter()\"\n (keydown.enter)=\"itemClick($event)\"\n [routerLink]=\"item.routerLink\"\n [attr.target]=\"item.target\"\n [attr.tabindex]=\"0\"\n [ngClass]=\"item.className ?? ''\"\n pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n </a>\n <a\n *ngIf=\"item.routerLink && !item.items\"\n (click)=\"itemClick($event)\"\n (mouseenter)=\"hover = true\"\n (mouseleave)=\"hover = false\"\n [routerLink]=\"item.routerLink\"\n routerLinkActive=\"active-menuitem-routerlink\"\n [attr.target]=\"item.target\"\n [attr.tabindex]=\"0\"\n [ngClass]=\"item.className ?? ''\"\n pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\" *ngIf=\"item.items\"></i>\n <span class=\"menuitem-badge\" *ngIf=\"item.badge\">{{ item.badge }}</span>\n </a>\n <ul\n *ngIf=\"item.items || (item.items && (mngCommons.menuModeIsStatic$ | async) && root)\"\n [@children]=\"\n (mngCommons.menuModeIsSlim$ | async) && (mainLayoutService.isMobile$ | async) === false && root\n ? active\n ? 'visible'\n : 'hidden'\n : (mngCommons.menuModeIsStatic$ | async) && root && (mainLayoutService.isMobile$ | async) === false\n ? 'visible'\n : active\n ? 'visibleAnimated'\n : 'hiddenAnimated'\n \">\n <ng-template ngFor let-child let-i=\"index\" [ngForOf]=\"item.items\">\n <li mng-menuitem [item]=\"child\" [index]=\"i\" [parentKey]=\"key\" [class]=\"child.badgeClassName\" (visibleChange)=\"onChildVisibleChange($event, item, i)\"></li>\n </ng-template>\n </ul>\n</ng-container>\n" }]
|
|
11277
11317
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.Router }, { type: i1.ActivatedRoute }, { type: MngAuthorizationService }, { type: MngCommonsService }, { type: MngMainLayoutComponentService }]; }, propDecorators: { item: [{
|
|
11278
11318
|
type: Input
|
|
11279
11319
|
}], index: [{
|
|
@@ -11282,9 +11322,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
|
|
|
11282
11322
|
type: Input
|
|
11283
11323
|
}], parentKey: [{
|
|
11284
11324
|
type: Input
|
|
11325
|
+
}], visibleChangeEventEmitter: [{
|
|
11326
|
+
type: Output,
|
|
11327
|
+
args: ['visibleChange']
|
|
11285
11328
|
}], hostClassNoPadding: [{
|
|
11286
11329
|
type: HostBinding,
|
|
11287
11330
|
args: ['class.py-0']
|
|
11331
|
+
}], hostClassChildrenHidden: [{
|
|
11332
|
+
type: HostBinding,
|
|
11333
|
+
args: ['class.hidden']
|
|
11288
11334
|
}] } });
|
|
11289
11335
|
|
|
11290
11336
|
class MngVersionService {
|
|
@@ -11382,7 +11428,7 @@ class MngMenuComponent {
|
|
|
11382
11428
|
}
|
|
11383
11429
|
}
|
|
11384
11430
|
MngMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngMenuComponent, deps: [{ token: MngCommonsService }, { token: MngMainLayoutComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
11385
|
-
MngMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngMenuComponent, selector: "mng-menu", ngImport: i0, template: "<div\n class=\"layout-menu-wrapper\"\n [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n (click)=\"mainLayoutService.onSidebarClick($event)\"\n (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n <div class=\"menu-logo\">\n <a routerLink=\"/\" class=\"logo\">\n <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n </a>\n\n <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n </a>\n <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n <span\n *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n class=\"pi pi-unlock\"></span>\n <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n </a>\n </div>\n\n <div class=\"layout-menu-container\">\n <ul class=\"layout-menu\">\n <ng-container *ngFor=\"let item of mngCommons.menuItems; let i = index\">\n <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n </ng-container>\n </ul>\n </div>\n\n <div class=\"menu-version\">\n <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"] }, { kind: "component", type: MngVersionComponent, selector: "mng-version", inputs: ["version"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11431
|
+
MngMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: MngMenuComponent, selector: "mng-menu", ngImport: i0, template: "<div\n class=\"layout-menu-wrapper\"\n [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n (click)=\"mainLayoutService.onSidebarClick($event)\"\n (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n <div class=\"menu-logo\">\n <a routerLink=\"/\" class=\"logo\">\n <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n </a>\n\n <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n </a>\n <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n <span\n *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n class=\"pi pi-unlock\"></span>\n <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n </a>\n </div>\n\n <div class=\"layout-menu-container\">\n <ul class=\"layout-menu\">\n <ng-container *ngFor=\"let item of mngCommons.menuItems; let i = index\">\n <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n </ng-container>\n </ul>\n </div>\n\n <div class=\"menu-version\">\n <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: MngMenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "index", "root", "parentKey"], outputs: ["visibleChange"] }, { kind: "component", type: MngVersionComponent, selector: "mng-version", inputs: ["version"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
11386
11432
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: MngMenuComponent, decorators: [{
|
|
11387
11433
|
type: Component,
|
|
11388
11434
|
args: [{ selector: 'mng-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"layout-menu-wrapper\"\n [ngClass]=\"{'layout-sidebar-active': (mainLayoutService.sidebarActive$ | async)}\"\n (click)=\"mainLayoutService.onSidebarClick($event)\"\n (mouseover)=\"mainLayoutService.onSidebarMouseOver($event)\"\n (mouseleave)=\"mainLayoutService.onSidebarMouseLeave($event)\">\n <div class=\"menu-logo\">\n <a routerLink=\"/\" class=\"logo\">\n <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoDark : mngCommons.appLogoLight\" />\n </a>\n\n <a routerLink=\"/\" class=\"app-name\" *ngIf=\"(mngCommons.menuModeIsSlim$ | async) === false || (mainLayoutService.isMobile$ | async)\">\n <img [src]=\"mngCommons.colorSchemeIsLight ? mngCommons.appLogoNameDark : mngCommons.appLogoNameLight\" />\n </a>\n <a *ngIf=\"mngCommons.menuPinEnabled\" class=\"menu-pin\" (click)=\"mainLayoutService.onToggleMenu($event)\">\n <span *ngIf=\"mngCommons.menuModeIsOverlay$ | async\" class=\"pi pi-times\"></span>\n <span\n *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) === false && (mainLayoutService.pinActive$ | async)\"\n class=\"pi pi-unlock\"></span>\n <span *ngIf=\"(mngCommons.menuModeIsSidebar$ | async) && (mainLayoutService.sidebarStatic$ | async) && (mainLayoutService.pinActive$ | async)\" class=\"pi pi-lock\"></span>\n </a>\n </div>\n\n <div class=\"layout-menu-container\">\n <ul class=\"layout-menu\">\n <ng-container *ngFor=\"let item of mngCommons.menuItems; let i = index\">\n <li mng-menuitem *ngIf=\"!item.separator\" [item]=\"item\" [index]=\"i\" [root]=\"true\"></li>\n <li *ngIf=\"item.separator\" class=\"menu-separator\"></li>\n </ng-container>\n </ul>\n </div>\n\n <div class=\"menu-version\">\n <mng-version [version]=\"mngCommons.appVersion\"></mng-version>\n </div>\n</div>\n" }]
|