barsa-sap-ui 2.1.11 → 2.1.13
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.
|
@@ -5791,11 +5791,11 @@ class BarsaTableHeaderComponent extends BaseComponent {
|
|
|
5791
5791
|
return `${column.Name}${index}`;
|
|
5792
5792
|
}
|
|
5793
5793
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTableHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5794
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTableHeaderComponent, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", actionList: "actionList", rowIndicator: "rowIndicator", rtl: "rtl", sticky: "sticky", showRowNumber: "showRowNumber", hasSecondaryColumns: "hasSecondaryColumns", disableResize: "disableResize", disableHeaderContextMenu: "disableHeaderContextMenu", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", columnResizing: "columnResizing", fitToContent: "fitToContent", fitToContainer: "fitToContainer", freeColumnSize: "freeColumnSize", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter", resetGridSettings: "resetGridSettings", headerRender: "headerRender" }, viewQueries: [{ propertyName: "theadRef", first: true, predicate: ["theadRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\n fd-table-header\n [class.inline-edit]=\"inlineEditMode\"\n [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n [style.position]=\"sticky ? 'sticky' : null\"\n #theadRef\n>\n <tr fd-table-row>\n @if (!hideHeader) { @if (rowIndicator) {\n <th fd-table-cell fd-table-status-indicator #rowIndicator></th>\n } @if (showRowNumber) {\n <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\n } @if (isCheckList) {\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n ></fd-checkbox>\n </th>\n } @if (!isCheckList && !showRowNumber) {\n <th fd-table-cell class=\"single-select\"></th>\n } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) {\n <th\n #thRef\n tableth\n fd-table-cell\n resizable\n [index]=\"i\"\n [last]=\"last\"\n [columnsLength]=\"columns.length\"\n [column]=\"column\"\n [tableHeaderMode]=\"tableHeaderMode\"\n [fieldTypeId]=\"+column.FieldTypeId\"\n [rtl]=\"rtl\"\n [caption]=\"column.Caption | bbbTranslate\"\n [name]=\"column.Name\"\n [icon]=\"column.Icon\"\n [colClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n [displayType]=\"column.Extra?.IconDisplayTypeEnum\"\n [isImageOrIcon]=\"(column | thImageOrIcon) === true\"\n [disableResize]=\"\n hasSecondaryColumns ||\n disableResize ||\n (tableHeaderMode === 2 && last) ||\n (column | thImageOrIcon) === true\n \"\n [disableHeaderContextMenu]=\"disableHeaderContextMenu\"\n [disableResponsive]=\"disableResponsive\"\n (sortAscending)=\"sortAscending.emit(column)\"\n (sortDescending)=\"sortDescending.emit(column)\"\n (filter)=\"filter.emit(column)\"\n (resetGridSettings)=\"resetGridSettings.emit()\"\n (widthChange)=\"onColumnWidthChange(column)\"\n (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n [style.width]=\"hasSecondaryColumns && last ? '100% !important' : null\"\n >\n @if(!disableHeaderContextMenu){\n <fd-popover #menu>\n <fd-popover-control>\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ul fd-list>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onFitToContent(column, i)\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"freeColumnSize.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\n </a>\n </li>\n </ul>\n </fd-popover-body>\n </fd-popover>\n } @else{\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n }\n </th>\n } @if (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode) {\n <th\n class=\"col-header col-context-menu\"\n fd-table-cell\n [fitContent]=\"disableOverflowContextMenu\"\n [style.width.px]=\"contextMenuWidth\"\n ></th>\n } @if (showDetailsInRow && !inlineEditMode) {\n <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? '44px' : '120px'\" fd-table-cell></th>\n } @if (showViewButton) {\n <th class=\"col-header col-view\" [style.width.px]=\"36 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\n } }\n </tr>\n</thead>\n<ng-template #headerValue let-column>\n <div style=\"display: flex\" [attr.title]=\"column.Caption | bbbTranslate\">\n @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\n <img [src]=\"column.Icon\" />\n } @else {\n {{ column.Caption | bbbTranslate }}\n }\n </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i3$3.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$3.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$3.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$3.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "directive", type: TableThDirective, selector: "[tableth]", inputs: ["fieldTypeId", "caption", "icon", "inlineEditMode", "isImageOrIcon", "columnsLength", "tableWidth", "last", "rtl", "column", "disableResponsive", "disableResize", "disableHeaderContextMenu", "tableHeaderMode", "colClass", "displayType", "name", "index"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ThImageOrIconePipe, name: "thImageOrIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5794
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTableHeaderComponent, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", actionList: "actionList", rowIndicator: "rowIndicator", rtl: "rtl", sticky: "sticky", showRowNumber: "showRowNumber", hasSecondaryColumns: "hasSecondaryColumns", disableResize: "disableResize", disableHeaderContextMenu: "disableHeaderContextMenu", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", columnResizing: "columnResizing", fitToContent: "fitToContent", fitToContainer: "fitToContainer", freeColumnSize: "freeColumnSize", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter", resetGridSettings: "resetGridSettings", headerRender: "headerRender" }, viewQueries: [{ propertyName: "theadRef", first: true, predicate: ["theadRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\n fd-table-header\n [class.inline-edit]=\"inlineEditMode\"\n [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n [style.position]=\"sticky ? 'sticky' : null\"\n #theadRef\n>\n <tr fd-table-row>\n @if (!hideHeader) { @if (rowIndicator) {\n <th fd-table-cell fd-table-status-indicator #rowIndicator></th>\n } @if (showRowNumber) {\n <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\n } @if (isCheckList) {\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n ></fd-checkbox>\n </th>\n } @if (!isCheckList && !showRowNumber) {\n <th fd-table-cell class=\"single-select\"></th>\n } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) {\n <th\n #thRef\n tableth\n fd-table-cell\n resizable\n [index]=\"i\"\n [last]=\"last\"\n [columnsLength]=\"columns.length\"\n [column]=\"column\"\n [tableHeaderMode]=\"tableHeaderMode\"\n [fieldTypeId]=\"+column.FieldTypeId\"\n [rtl]=\"rtl\"\n [caption]=\"column.Caption | bbbTranslate\"\n [name]=\"column.Name\"\n [icon]=\"column.Icon\"\n [colClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n [displayType]=\"column.Extra?.IconDisplayTypeEnum\"\n [isImageOrIcon]=\"(column | thImageOrIcon) === true\"\n [disableResize]=\"\n hasSecondaryColumns ||\n disableResize ||\n (tableHeaderMode === 2 && last) ||\n (column | thImageOrIcon) === true\n \"\n [disableHeaderContextMenu]=\"disableHeaderContextMenu\"\n [disableResponsive]=\"disableResponsive\"\n (sortAscending)=\"sortAscending.emit(column)\"\n (sortDescending)=\"sortDescending.emit(column)\"\n (filter)=\"filter.emit(column)\"\n (resetGridSettings)=\"resetGridSettings.emit()\"\n (widthChange)=\"onColumnWidthChange(column)\"\n (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n [style.width]=\"hasSecondaryColumns && last ? '100% !important' : null\"\n >\n @if(!disableHeaderContextMenu){\n <fd-popover #menu>\n <fd-popover-control>\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ul fd-list>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onFitToContent(column, i)\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"freeColumnSize.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\n </a>\n </li>\n </ul>\n </fd-popover-body>\n </fd-popover>\n } @else{\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n }\n </th>\n } @if (contextMenuItems && contextMenuItems.length > 0) {\n <th\n class=\"col-header col-context-menu\"\n fd-table-cell\n [fitContent]=\"disableOverflowContextMenu\"\n [style.width.px]=\"contextMenuWidth\"\n ></th>\n } @if (showDetailsInRow && !inlineEditMode) {\n <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? '44px' : '120px'\" fd-table-cell></th>\n } @if (showViewButton) {\n <th class=\"col-header col-view\" [style.width.px]=\"36 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\n } }\n </tr>\n</thead>\n<ng-template #headerValue let-column>\n <div style=\"display: flex\" [attr.title]=\"column.Caption | bbbTranslate\">\n @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\n <img [src]=\"column.Icon\" />\n } @else {\n {{ column.Caption | bbbTranslate }}\n }\n </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i3$3.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$3.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$3.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$3.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "directive", type: TableThDirective, selector: "[tableth]", inputs: ["fieldTypeId", "caption", "icon", "inlineEditMode", "isImageOrIcon", "columnsLength", "tableWidth", "last", "rtl", "column", "disableResponsive", "disableResize", "disableHeaderContextMenu", "tableHeaderMode", "colClass", "displayType", "name", "index"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ThImageOrIconePipe, name: "thImageOrIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5795
5795
|
}
|
|
5796
5796
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTableHeaderComponent, decorators: [{
|
|
5797
5797
|
type: Component,
|
|
5798
|
-
args: [{ selector: 'bsu-barsa-table-header', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<thead\n fd-table-header\n [class.inline-edit]=\"inlineEditMode\"\n [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n [style.position]=\"sticky ? 'sticky' : null\"\n #theadRef\n>\n <tr fd-table-row>\n @if (!hideHeader) { @if (rowIndicator) {\n <th fd-table-cell fd-table-status-indicator #rowIndicator></th>\n } @if (showRowNumber) {\n <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\n } @if (isCheckList) {\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n ></fd-checkbox>\n </th>\n } @if (!isCheckList && !showRowNumber) {\n <th fd-table-cell class=\"single-select\"></th>\n } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) {\n <th\n #thRef\n tableth\n fd-table-cell\n resizable\n [index]=\"i\"\n [last]=\"last\"\n [columnsLength]=\"columns.length\"\n [column]=\"column\"\n [tableHeaderMode]=\"tableHeaderMode\"\n [fieldTypeId]=\"+column.FieldTypeId\"\n [rtl]=\"rtl\"\n [caption]=\"column.Caption | bbbTranslate\"\n [name]=\"column.Name\"\n [icon]=\"column.Icon\"\n [colClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n [displayType]=\"column.Extra?.IconDisplayTypeEnum\"\n [isImageOrIcon]=\"(column | thImageOrIcon) === true\"\n [disableResize]=\"\n hasSecondaryColumns ||\n disableResize ||\n (tableHeaderMode === 2 && last) ||\n (column | thImageOrIcon) === true\n \"\n [disableHeaderContextMenu]=\"disableHeaderContextMenu\"\n [disableResponsive]=\"disableResponsive\"\n (sortAscending)=\"sortAscending.emit(column)\"\n (sortDescending)=\"sortDescending.emit(column)\"\n (filter)=\"filter.emit(column)\"\n (resetGridSettings)=\"resetGridSettings.emit()\"\n (widthChange)=\"onColumnWidthChange(column)\"\n (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n [style.width]=\"hasSecondaryColumns && last ? '100% !important' : null\"\n >\n @if(!disableHeaderContextMenu){\n <fd-popover #menu>\n <fd-popover-control>\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ul fd-list>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onFitToContent(column, i)\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"freeColumnSize.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\n </a>\n </li>\n </ul>\n </fd-popover-body>\n </fd-popover>\n } @else{\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n }\n </th>\n } @if (contextMenuItems && contextMenuItems.length > 0
|
|
5798
|
+
args: [{ selector: 'bsu-barsa-table-header', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<thead\n fd-table-header\n [class.inline-edit]=\"inlineEditMode\"\n [class.smallColumns]=\"columnsSmallerThanTableWidth\"\n [style.position]=\"sticky ? 'sticky' : null\"\n #theadRef\n>\n <tr fd-table-row>\n @if (!hideHeader) { @if (rowIndicator) {\n <th fd-table-cell fd-table-status-indicator #rowIndicator></th>\n } @if (showRowNumber) {\n <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\n } @if (isCheckList) {\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n ></fd-checkbox>\n </th>\n } @if (!isCheckList && !showRowNumber) {\n <th fd-table-cell class=\"single-select\"></th>\n } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) {\n <th\n #thRef\n tableth\n fd-table-cell\n resizable\n [index]=\"i\"\n [last]=\"last\"\n [columnsLength]=\"columns.length\"\n [column]=\"column\"\n [tableHeaderMode]=\"tableHeaderMode\"\n [fieldTypeId]=\"+column.FieldTypeId\"\n [rtl]=\"rtl\"\n [caption]=\"column.Caption | bbbTranslate\"\n [name]=\"column.Name\"\n [icon]=\"column.Icon\"\n [colClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\n [displayType]=\"column.Extra?.IconDisplayTypeEnum\"\n [isImageOrIcon]=\"(column | thImageOrIcon) === true\"\n [disableResize]=\"\n hasSecondaryColumns ||\n disableResize ||\n (tableHeaderMode === 2 && last) ||\n (column | thImageOrIcon) === true\n \"\n [disableHeaderContextMenu]=\"disableHeaderContextMenu\"\n [disableResponsive]=\"disableResponsive\"\n (sortAscending)=\"sortAscending.emit(column)\"\n (sortDescending)=\"sortDescending.emit(column)\"\n (filter)=\"filter.emit(column)\"\n (resetGridSettings)=\"resetGridSettings.emit()\"\n (widthChange)=\"onColumnWidthChange(column)\"\n (widthChanging)=\"onColumnWidthChanging(i, column, $event)\"\n [style.width]=\"hasSecondaryColumns && last ? '100% !important' : null\"\n >\n @if(!disableHeaderContextMenu){\n <fd-popover #menu>\n <fd-popover-control>\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n </fd-popover-control>\n <fd-popover-body>\n <ul fd-list>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortAscending(column, menu)\">\n <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\n <span fd-list-title\n >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\n >\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onFitToContent(column, i)\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"freeColumnSize.emit()\" bodyClick>\n <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\n </a>\n </li>\n <li fd-list-item>\n <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\n <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\n <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\n </a>\n </li>\n </ul>\n </fd-popover-body>\n </fd-popover>\n } @else{\n <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\n }\n </th>\n } @if (contextMenuItems && contextMenuItems.length > 0) {\n <th\n class=\"col-header col-context-menu\"\n fd-table-cell\n [fitContent]=\"disableOverflowContextMenu\"\n [style.width.px]=\"contextMenuWidth\"\n ></th>\n } @if (showDetailsInRow && !inlineEditMode) {\n <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? '44px' : '120px'\" fd-table-cell></th>\n } @if (showViewButton) {\n <th class=\"col-header col-view\" [style.width.px]=\"36 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\n } }\n </tr>\n</thead>\n<ng-template #headerValue let-column>\n <div style=\"display: flex\" [attr.title]=\"column.Caption | bbbTranslate\">\n @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\n <img [src]=\"column.Icon\" />\n } @else {\n {{ column.Caption | bbbTranslate }}\n }\n </div>\n</ng-template>\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"] }]
|
|
5799
5799
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }], propDecorators: { thList: [{
|
|
5800
5800
|
type: ViewChildren,
|
|
5801
5801
|
args: ['thRef', { read: ElementRef }]
|
|
@@ -5955,11 +5955,11 @@ class BarsaTableRowComponent extends BaseViewItemPropsComponent {
|
|
|
5955
5955
|
this._cdr.detectChanges();
|
|
5956
5956
|
}
|
|
5957
5957
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTableRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5958
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", previewColumn: "previewColumn", columnComponents: "columnComponents", dirtyColumns: "dirtyColumns", detailsCollapsed: "detailsCollapsed" }, outputs: { columnSummary: "columnSummary" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n [class.row-error]=\"hasError\"\n [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\n [class.hasForm]=\"formSetting\"\n [class.hasCartable]=\"!!cartableParams\"\n #trEl\n fd-table-row\n [activable]=\"false\"\n [hoverable]=\"true\"\n [main]=\"true\"\n [focusable]=\"true\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\n>\n @if (mo.$Group || mo.$Group === '') {\n <td\n [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n fd-table-cell\n style=\"font-weight: bold; font-size: 1rem\"\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n class=\"row-group\"\n [class.mobile-mode]=\"secondaryColumns?.length\"\n [attr.level]=\"level\"\n [class.root-group]=\"level === 0\"\n >\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick()\"\n ></button>\n {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\n </td>\n } @else {\n\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (isCheckList) {\n <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\n @if (workflowState?.state === 'Pending') {\n <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\n <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n </div>\n } @if (checkboxComponent?.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"checkboxComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"setting\"\n [parameters]=\"checkboxComponent.Parameters\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [value]=\"isChecked\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n (events)=\"onRowCheck()\"\n ></bnrc-dynamic-item-component>\n } @else {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n }\n </td>\n } @if (!isCheckList && !showRowNumber) {\n <td\n fd-table-cell\n class=\"single-select\"\n (click)=\"!isCheckList && onRowCheck()\"\n style=\"padding: 0; text-align: center\"\n >\n @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\n <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\n } @if (saving) {\n <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\n } @if (saved) {\n <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\n } } @else { @if (mo.$State === 'New' && !isChecked) {\n <fd-icon glyph=\"favorite\"></fd-icon>\n } @if (inlineEditMode && allowInlineEdit && isChecked) {\n <fd-icon glyph=\"edit\"></fd-icon>\n } }\n </td>\n }\n <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\n @for (column of columns; track column.Name; let columnIndex = $index) {\n <td\n class=\"rep-column\"\n [attr.dbName]=\"column.Name\"\n #tdEl\n fd-table-cell\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"tdEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n [focusable]=\"false\"\n (click)=\"onColumnClick()\"\n (dblclick)=\"onRowClick()\"\n [hoverable]=\"inlineEditMode && allowInlineEdit\"\n [class.control-readonly]=\"column.IsReadonly\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </td>\n } @if (contextMenuItems.length && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-context-menu\" fd-table-cell>\n <bsu-ulv-context-menu\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [mo]=\"mo\"\n [index]=\"index\"\n (commandClick)=\"onUlvCommand()\"\n [deviceName]=\"deviceName\"\n [menuItems]=\"contextMenuItems\"\n [allColumns]=\"allColumns\"\n ></bsu-ulv-context-menu>\n </td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\n @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\n <div class=\"tw-flex tw-justify-end tw-w-full\">\n <button\n fd-button\n [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n [fdType]=\"'transparent'\"\n (click)=\"onRowDetails()\"\n ></button>\n </div>\n }\n </td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\n <bsu-barsa-row-inline-actionlist\n [actionList]=\"actionList\"\n (btnClick)=\"actionListClick.emit($event)\"\n ></bsu-barsa-row-inline-actionlist>\n </td>\n } }\n</tr>\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"secondary-row\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\n }\n <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\n <div style=\"display: flex; flex-direction: column\">\n @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n style=\"font-family: 'BARSAFONT Medium'\"\n >\n <label fd-form-label>{{ column.Caption }} :</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n }\n </div>\n </td>\n</tr>\n} @if (cartableParams?.moId) {\n<tr\n [class.detailCollapsed]=\"detailsCollapsed\"\n fd-table-row\n class=\"showdetails cartable\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? 1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container>\n <bnrc-form\n #cartableFormRef\n class=\"cartable-template\"\n [inlineEditInReport]=\"true\"\n [params]=\"cartableParams\"\n (beforeTransition)=\"onCartableBeforeTansition()\"\n (afterTransition)=\"onCartableAfterTansition($event)\"\n (bruleAction)=\"onCartableBruleAction($event)\"\n (click)=\"OnCartableFormClick($event)\"\n (formClose)=\"onCartableFormClosed()\"\n ></bnrc-form>\n </ng-container>\n </td>\n</tr>\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n detailsColumnsTemplate;\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\n \"\n ></ng-container>\n @if (detailsComponent && detailsComponent.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"detailsComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"detailsComponentSetting\"\n [parameters]=\"detailsComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n ></bnrc-dynamic-item-component>\n }\n </td>\n</tr>\n} @if(previewColumn){\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"preview-column\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n (click)=\"onRowCheck()\"\n >\n <div style=\"display: flex; flex-direction: column\">\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"previewColumn.Name\"\n style=\"color: var(--sapAccentColor6)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: previewColumn,\n mo: mo,\n index: columns.length,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n </div>\n </td>\n</tr>\n} @if(isLastChildGroup && groupSummary){\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\"></td>\n } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <td fd-table-cell>\n <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\n </td>\n } @if (contextMenuItems.length && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-context-menu\" fd-table-cell></td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\n }\n</tr>\n} @if (bruleActionMessage && inlineEditMode) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n @if (bruleActionMessage.MessageType === 2) {\n <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\n {{ bruleActionMessage.MessageExpression }}\n </fd-message-strip>\n }\n </td>\n</tr>\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n </fd-message-strip>\n </td>\n</tr>\n}\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\n <ng-container\n *ngTemplateOutlet=\"\n detailsFormItems;\n context: {\n $implicit: detailsColumns,\n mo: this.mo,\n inlineEditMode: this.inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n</ng-template>\n<ng-template\n #detailsFormItems\n let-detailsColumns\n let-mo=\"mo\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <div class=\"form-items\">\n @for (column of detailsColumns; track column; let columnIndex = $index) {\n <div fd-form-item>\n <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n</ng-template>\n<ng-template\n #columnTemplate\n let-column\n let-mo=\"mo\"\n let-index=\"index\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <bsu-barsa-table-column\n [mo]=\"mo\"\n [allColumns]=\"allColumns\"\n [column]=\"column\"\n [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [customComponent]=\"column.$CustomComponent\"\n [column]=\"column\"\n [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [inlineEditMode]=\"inlineEditMode\"\n [isChecked]=\"isChecked\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [isMobile]=\"isMobile\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [layout94]=\"layout94\"\n (save)=\"onEditFormPanelSave(null)\"\n (cancel)=\"onEditFormPanelCancel(null)\"\n (tab)=\"onTabKeyDown($event, index)\"\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n >\n </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n @if (rowIndicator) {\n <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\n </bsu-barsa-column-indicator>\n }\n</ng-template>\n<ng-template #rowNumberTemplate>\n @if (showRowNumber) {\n <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\n }\n</ng-template>\n<tr fd-table-row style=\"pointer-events: none\"></tr>\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "uiComponent", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "showRowNumber", "rowNumber", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "component", type: i5$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i9.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i3$3.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$3.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$3.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis", "fdTextMode"] }, { kind: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "component", type: BarsaColumnRowNumberComponent, selector: "td[bsu-barsa-column-rownumber],bsu-barsa-column-rownumber", inputs: ["rowNumber"] }, { kind: "component", type: BarsaRowInlineActionlistComponent, selector: "bsu-barsa-row-inline-actionlist", inputs: ["actionList", "mo", "index"], outputs: ["btnClick"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5958
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", previewColumn: "previewColumn", columnComponents: "columnComponents", dirtyColumns: "dirtyColumns", detailsCollapsed: "detailsCollapsed" }, outputs: { columnSummary: "columnSummary" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n [class.row-error]=\"hasError\"\n [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\n [class.hasForm]=\"formSetting\"\n [class.hasCartable]=\"!!cartableParams\"\n #trEl\n fd-table-row\n [activable]=\"false\"\n [hoverable]=\"true\"\n [main]=\"true\"\n [focusable]=\"true\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\n>\n @if (mo.$Group || mo.$Group === '') {\n <td\n [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n fd-table-cell\n style=\"font-weight: bold; font-size: 1rem\"\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n class=\"row-group\"\n [class.mobile-mode]=\"secondaryColumns?.length\"\n [attr.level]=\"level\"\n [class.root-group]=\"level === 0\"\n >\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick()\"\n ></button>\n {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\n </td>\n } @else {\n\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (isCheckList) {\n <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\n @if (workflowState?.state === 'Pending') {\n <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\n <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n </div>\n } @if (checkboxComponent?.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"checkboxComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"setting\"\n [parameters]=\"checkboxComponent.Parameters\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [value]=\"isChecked\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n (events)=\"onRowCheck()\"\n ></bnrc-dynamic-item-component>\n } @else {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n }\n </td>\n } @if (!isCheckList && !showRowNumber) {\n <td\n fd-table-cell\n class=\"single-select\"\n (click)=\"!isCheckList && onRowCheck()\"\n style=\"padding: 0; text-align: center\"\n >\n @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\n <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\n } @if (saving) {\n <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\n } @if (saved) {\n <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\n } } @else { @if (mo.$State === 'New' && !isChecked) {\n <fd-icon glyph=\"favorite\"></fd-icon>\n } @if (inlineEditMode && allowInlineEdit && isChecked) {\n <fd-icon glyph=\"edit\"></fd-icon>\n } }\n </td>\n }\n <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\n @for (column of columns; track column.Name; let columnIndex = $index) {\n <td\n class=\"rep-column\"\n [attr.dbName]=\"column.Name\"\n #tdEl\n fd-table-cell\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"tdEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n [focusable]=\"false\"\n (click)=\"onColumnClick()\"\n (dblclick)=\"onRowClick()\"\n [hoverable]=\"inlineEditMode && allowInlineEdit\"\n [class.control-readonly]=\"column.IsReadonly\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </td>\n } @if (contextMenuItems.length ) {\n <td class=\"col-context-menu\" fd-table-cell>\n <bsu-ulv-context-menu\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [mo]=\"mo\"\n [index]=\"index\"\n (commandClick)=\"onUlvCommand()\"\n [deviceName]=\"deviceName\"\n [menuItems]=\"contextMenuItems\"\n [allColumns]=\"allColumns\"\n ></bsu-ulv-context-menu>\n </td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\n @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\n <div class=\"tw-flex tw-justify-end tw-w-full\">\n <button\n fd-button\n [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n [fdType]=\"'transparent'\"\n (click)=\"onRowDetails()\"\n ></button>\n </div>\n }\n </td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\n <bsu-barsa-row-inline-actionlist\n [actionList]=\"actionList\"\n (btnClick)=\"actionListClick.emit($event)\"\n ></bsu-barsa-row-inline-actionlist>\n </td>\n } }\n</tr>\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"secondary-row\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\n }\n <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\n <div style=\"display: flex; flex-direction: column\">\n @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n style=\"font-family: 'BARSAFONT Medium'\"\n >\n <label fd-form-label>{{ column.Caption }} :</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n }\n </div>\n </td>\n</tr>\n} @if (cartableParams?.moId) {\n<tr\n [class.detailCollapsed]=\"detailsCollapsed\"\n fd-table-row\n class=\"showdetails cartable\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? 1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container>\n <bnrc-form\n #cartableFormRef\n class=\"cartable-template\"\n [inlineEditInReport]=\"true\"\n [params]=\"cartableParams\"\n (beforeTransition)=\"onCartableBeforeTansition()\"\n (afterTransition)=\"onCartableAfterTansition($event)\"\n (bruleAction)=\"onCartableBruleAction($event)\"\n (click)=\"OnCartableFormClick($event)\"\n (formClose)=\"onCartableFormClosed()\"\n ></bnrc-form>\n </ng-container>\n </td>\n</tr>\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n detailsColumnsTemplate;\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\n \"\n ></ng-container>\n @if (detailsComponent && detailsComponent.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"detailsComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"detailsComponentSetting\"\n [parameters]=\"detailsComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n ></bnrc-dynamic-item-component>\n }\n </td>\n</tr>\n} @if(previewColumn){\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"preview-column\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n (click)=\"onRowCheck()\"\n >\n <div style=\"display: flex; flex-direction: column\">\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"previewColumn.Name\"\n style=\"color: var(--sapAccentColor6)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: previewColumn,\n mo: mo,\n index: columns.length,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n </div>\n </td>\n</tr>\n} @if(isLastChildGroup && groupSummary){\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\"></td>\n } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <td fd-table-cell>\n <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\n </td>\n } @if (contextMenuItems.length) {\n <td class=\"col-context-menu\" fd-table-cell></td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\n }\n</tr>\n} @if (bruleActionMessage && inlineEditMode) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n @if (bruleActionMessage.MessageType === 2) {\n <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\n {{ bruleActionMessage.MessageExpression }}\n </fd-message-strip>\n }\n </td>\n</tr>\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n </fd-message-strip>\n </td>\n</tr>\n}\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\n <ng-container\n *ngTemplateOutlet=\"\n detailsFormItems;\n context: {\n $implicit: detailsColumns,\n mo: this.mo,\n inlineEditMode: this.inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n</ng-template>\n<ng-template\n #detailsFormItems\n let-detailsColumns\n let-mo=\"mo\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <div class=\"form-items\">\n @for (column of detailsColumns; track column; let columnIndex = $index) {\n <div fd-form-item>\n <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n</ng-template>\n<ng-template\n #columnTemplate\n let-column\n let-mo=\"mo\"\n let-index=\"index\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <bsu-barsa-table-column\n [mo]=\"mo\"\n [allColumns]=\"allColumns\"\n [column]=\"column\"\n [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [customComponent]=\"column.$CustomComponent\"\n [column]=\"column\"\n [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [inlineEditMode]=\"inlineEditMode\"\n [isChecked]=\"isChecked\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [isMobile]=\"isMobile\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [layout94]=\"layout94\"\n (save)=\"onEditFormPanelSave(null)\"\n (cancel)=\"onEditFormPanelCancel(null)\"\n (tab)=\"onTabKeyDown($event, index)\"\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n >\n </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n @if (rowIndicator) {\n <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\n </bsu-barsa-column-indicator>\n }\n</ng-template>\n<ng-template #rowNumberTemplate>\n @if (showRowNumber) {\n <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\n }\n</ng-template>\n<tr fd-table-row style=\"pointer-events: none\"></tr>\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "uiComponent", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "showRowNumber", "rowNumber", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "component", type: i5$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i9.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i3$3.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$3.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$3.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis", "fdTextMode"] }, { kind: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "component", type: BarsaColumnRowNumberComponent, selector: "td[bsu-barsa-column-rownumber],bsu-barsa-column-rownumber", inputs: ["rowNumber"] }, { kind: "component", type: BarsaRowInlineActionlistComponent, selector: "bsu-barsa-row-inline-actionlist", inputs: ["actionList", "mo", "index"], outputs: ["btnClick"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5959
5959
|
}
|
|
5960
5960
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTableRowComponent, decorators: [{
|
|
5961
5961
|
type: Component,
|
|
5962
|
-
args: [{ selector: 'bsu-barsa-table-row', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n [class.row-error]=\"hasError\"\n [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\n [class.hasForm]=\"formSetting\"\n [class.hasCartable]=\"!!cartableParams\"\n #trEl\n fd-table-row\n [activable]=\"false\"\n [hoverable]=\"true\"\n [main]=\"true\"\n [focusable]=\"true\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\n>\n @if (mo.$Group || mo.$Group === '') {\n <td\n [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n fd-table-cell\n style=\"font-weight: bold; font-size: 1rem\"\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n class=\"row-group\"\n [class.mobile-mode]=\"secondaryColumns?.length\"\n [attr.level]=\"level\"\n [class.root-group]=\"level === 0\"\n >\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick()\"\n ></button>\n {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\n </td>\n } @else {\n\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (isCheckList) {\n <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\n @if (workflowState?.state === 'Pending') {\n <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\n <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n </div>\n } @if (checkboxComponent?.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"checkboxComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"setting\"\n [parameters]=\"checkboxComponent.Parameters\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [value]=\"isChecked\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n (events)=\"onRowCheck()\"\n ></bnrc-dynamic-item-component>\n } @else {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n }\n </td>\n } @if (!isCheckList && !showRowNumber) {\n <td\n fd-table-cell\n class=\"single-select\"\n (click)=\"!isCheckList && onRowCheck()\"\n style=\"padding: 0; text-align: center\"\n >\n @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\n <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\n } @if (saving) {\n <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\n } @if (saved) {\n <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\n } } @else { @if (mo.$State === 'New' && !isChecked) {\n <fd-icon glyph=\"favorite\"></fd-icon>\n } @if (inlineEditMode && allowInlineEdit && isChecked) {\n <fd-icon glyph=\"edit\"></fd-icon>\n } }\n </td>\n }\n <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\n @for (column of columns; track column.Name; let columnIndex = $index) {\n <td\n class=\"rep-column\"\n [attr.dbName]=\"column.Name\"\n #tdEl\n fd-table-cell\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"tdEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n [focusable]=\"false\"\n (click)=\"onColumnClick()\"\n (dblclick)=\"onRowClick()\"\n [hoverable]=\"inlineEditMode && allowInlineEdit\"\n [class.control-readonly]=\"column.IsReadonly\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </td>\n } @if (contextMenuItems.length && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-context-menu\" fd-table-cell>\n <bsu-ulv-context-menu\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [mo]=\"mo\"\n [index]=\"index\"\n (commandClick)=\"onUlvCommand()\"\n [deviceName]=\"deviceName\"\n [menuItems]=\"contextMenuItems\"\n [allColumns]=\"allColumns\"\n ></bsu-ulv-context-menu>\n </td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\n @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\n <div class=\"tw-flex tw-justify-end tw-w-full\">\n <button\n fd-button\n [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n [fdType]=\"'transparent'\"\n (click)=\"onRowDetails()\"\n ></button>\n </div>\n }\n </td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\n <bsu-barsa-row-inline-actionlist\n [actionList]=\"actionList\"\n (btnClick)=\"actionListClick.emit($event)\"\n ></bsu-barsa-row-inline-actionlist>\n </td>\n } }\n</tr>\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"secondary-row\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\n }\n <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\n <div style=\"display: flex; flex-direction: column\">\n @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n style=\"font-family: 'BARSAFONT Medium'\"\n >\n <label fd-form-label>{{ column.Caption }} :</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n }\n </div>\n </td>\n</tr>\n} @if (cartableParams?.moId) {\n<tr\n [class.detailCollapsed]=\"detailsCollapsed\"\n fd-table-row\n class=\"showdetails cartable\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? 1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container>\n <bnrc-form\n #cartableFormRef\n class=\"cartable-template\"\n [inlineEditInReport]=\"true\"\n [params]=\"cartableParams\"\n (beforeTransition)=\"onCartableBeforeTansition()\"\n (afterTransition)=\"onCartableAfterTansition($event)\"\n (bruleAction)=\"onCartableBruleAction($event)\"\n (click)=\"OnCartableFormClick($event)\"\n (formClose)=\"onCartableFormClosed()\"\n ></bnrc-form>\n </ng-container>\n </td>\n</tr>\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n detailsColumnsTemplate;\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\n \"\n ></ng-container>\n @if (detailsComponent && detailsComponent.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"detailsComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"detailsComponentSetting\"\n [parameters]=\"detailsComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n ></bnrc-dynamic-item-component>\n }\n </td>\n</tr>\n} @if(previewColumn){\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"preview-column\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n (click)=\"onRowCheck()\"\n >\n <div style=\"display: flex; flex-direction: column\">\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"previewColumn.Name\"\n style=\"color: var(--sapAccentColor6)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: previewColumn,\n mo: mo,\n index: columns.length,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n </div>\n </td>\n</tr>\n} @if(isLastChildGroup && groupSummary){\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\"></td>\n } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <td fd-table-cell>\n <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\n </td>\n } @if (contextMenuItems.length && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-context-menu\" fd-table-cell></td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\n }\n</tr>\n} @if (bruleActionMessage && inlineEditMode) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n @if (bruleActionMessage.MessageType === 2) {\n <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\n {{ bruleActionMessage.MessageExpression }}\n </fd-message-strip>\n }\n </td>\n</tr>\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 && !inlineEditMode ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n </fd-message-strip>\n </td>\n</tr>\n}\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\n <ng-container\n *ngTemplateOutlet=\"\n detailsFormItems;\n context: {\n $implicit: detailsColumns,\n mo: this.mo,\n inlineEditMode: this.inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n</ng-template>\n<ng-template\n #detailsFormItems\n let-detailsColumns\n let-mo=\"mo\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <div class=\"form-items\">\n @for (column of detailsColumns; track column; let columnIndex = $index) {\n <div fd-form-item>\n <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n</ng-template>\n<ng-template\n #columnTemplate\n let-column\n let-mo=\"mo\"\n let-index=\"index\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <bsu-barsa-table-column\n [mo]=\"mo\"\n [allColumns]=\"allColumns\"\n [column]=\"column\"\n [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [customComponent]=\"column.$CustomComponent\"\n [column]=\"column\"\n [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [inlineEditMode]=\"inlineEditMode\"\n [isChecked]=\"isChecked\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [isMobile]=\"isMobile\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [layout94]=\"layout94\"\n (save)=\"onEditFormPanelSave(null)\"\n (cancel)=\"onEditFormPanelCancel(null)\"\n (tab)=\"onTabKeyDown($event, index)\"\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n >\n </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n @if (rowIndicator) {\n <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\n </bsu-barsa-column-indicator>\n }\n</ng-template>\n<ng-template #rowNumberTemplate>\n @if (showRowNumber) {\n <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\n }\n</ng-template>\n<tr fd-table-row style=\"pointer-events: none\"></tr>\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"] }]
|
|
5962
|
+
args: [{ selector: 'bsu-barsa-table-row', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n [class.row-error]=\"hasError\"\n [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\n [class.hasForm]=\"formSetting\"\n [class.hasCartable]=\"!!cartableParams\"\n #trEl\n fd-table-row\n [activable]=\"false\"\n [hoverable]=\"true\"\n [main]=\"true\"\n [focusable]=\"true\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\n [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\n [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\n>\n @if (mo.$Group || mo.$Group === '') {\n <td\n [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\n fd-table-cell\n style=\"font-weight: bold; font-size: 1rem\"\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n class=\"row-group\"\n [class.mobile-mode]=\"secondaryColumns?.length\"\n [attr.level]=\"level\"\n [class.root-group]=\"level === 0\"\n >\n <button\n fd-button\n [fdType]=\"'transparent'\"\n [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\n class=\"cell-expand\"\n (click)=\"onExpandClick()\"\n ></button>\n {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\n </td>\n } @else {\n\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (isCheckList) {\n <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\n @if (workflowState?.state === 'Pending') {\n <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\n <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\n </div>\n } @if (checkboxComponent?.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"checkboxComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"setting\"\n [parameters]=\"checkboxComponent.Parameters\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [value]=\"isChecked\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n (events)=\"onRowCheck()\"\n ></bnrc-dynamic-item-component>\n } @else {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n }\n </td>\n } @if (!isCheckList && !showRowNumber) {\n <td\n fd-table-cell\n class=\"single-select\"\n (click)=\"!isCheckList && onRowCheck()\"\n style=\"padding: 0; text-align: center\"\n >\n @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\n <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\n } @if (saving) {\n <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\n } @if (saved) {\n <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\n } } @else { @if (mo.$State === 'New' && !isChecked) {\n <fd-icon glyph=\"favorite\"></fd-icon>\n } @if (inlineEditMode && allowInlineEdit && isChecked) {\n <fd-icon glyph=\"edit\"></fd-icon>\n } }\n </td>\n }\n <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\n @for (column of columns; track column.Name; let columnIndex = $index) {\n <td\n class=\"rep-column\"\n [attr.dbName]=\"column.Name\"\n #tdEl\n fd-table-cell\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"tdEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n [focusable]=\"false\"\n (click)=\"onColumnClick()\"\n (dblclick)=\"onRowClick()\"\n [hoverable]=\"inlineEditMode && allowInlineEdit\"\n [class.control-readonly]=\"column.IsReadonly\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </td>\n } @if (contextMenuItems.length ) {\n <td class=\"col-context-menu\" fd-table-cell>\n <bsu-ulv-context-menu\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [conditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [mo]=\"mo\"\n [index]=\"index\"\n (commandClick)=\"onUlvCommand()\"\n [deviceName]=\"deviceName\"\n [menuItems]=\"contextMenuItems\"\n [allColumns]=\"allColumns\"\n ></bsu-ulv-context-menu>\n </td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\n @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\n <div class=\"tw-flex tw-justify-end tw-w-full\">\n <button\n fd-button\n [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\n [fdType]=\"'transparent'\"\n (click)=\"onRowDetails()\"\n ></button>\n </div>\n }\n </td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\n <bsu-barsa-row-inline-actionlist\n [actionList]=\"actionList\"\n (btnClick)=\"actionListClick.emit($event)\"\n ></bsu-barsa-row-inline-actionlist>\n </td>\n } }\n</tr>\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"secondary-row\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\n }\n <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\n <div style=\"display: flex; flex-direction: column\">\n @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"column.Name\"\n style=\"font-family: 'BARSAFONT Medium'\"\n >\n <label fd-form-label>{{ column.Caption }} :</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n }\n </div>\n </td>\n</tr>\n} @if (cartableParams?.moId) {\n<tr\n [class.detailCollapsed]=\"detailsCollapsed\"\n fd-table-row\n class=\"showdetails cartable\"\n [attr.aria-selected]=\"isChecked\"\n [class.has-preview-column]=\"!!previewColumn\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? 1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container>\n <bnrc-form\n #cartableFormRef\n class=\"cartable-template\"\n [inlineEditInReport]=\"true\"\n [params]=\"cartableParams\"\n (beforeTransition)=\"onCartableBeforeTansition()\"\n (afterTransition)=\"onCartableAfterTansition($event)\"\n (bruleAction)=\"onCartableBruleAction($event)\"\n (click)=\"OnCartableFormClick($event)\"\n (formClose)=\"onCartableFormClosed()\"\n ></bnrc-form>\n </ng-container>\n </td>\n</tr>\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n (click)=\"onRowCheck()\"\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <ng-container\n *ngTemplateOutlet=\"\n detailsColumnsTemplate;\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\n \"\n ></ng-container>\n @if (detailsComponent && detailsComponent.Selector) {\n <bnrc-dynamic-item-component\n [component]=\"detailsComponent\"\n [mo]=\"mo\"\n [isChecked]=\"isChecked\"\n [UlvMainCtrlr]=\"UlvMainCtrlr\"\n [setting]=\"detailsComponentSetting\"\n [parameters]=\"detailsComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [typeDefId]=\"typeDefId\"\n ></bnrc-dynamic-item-component>\n }\n </td>\n</tr>\n} @if(previewColumn){\n<tr\n #trEl\n fd-table-row\n [secondary]=\"true\"\n class=\"preview-column\"\n [class.no-edit-mode]=\"!inlineEditMode\"\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"trEl\"\n [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\n>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n (click)=\"onRowCheck()\"\n >\n <div style=\"display: flex; flex-direction: column\">\n <p\n #pEl\n fd-table-text\n [applyConditionalFormats]=\"conditionalFormats\"\n [hostEl]=\"pEl\"\n [styleIndex]=\"styleIndex\"\n [dbName]=\"previewColumn.Name\"\n style=\"color: var(--sapAccentColor6)\"\n >\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: previewColumn,\n mo: mo,\n index: columns.length,\n inlineEditMode: inlineEditMode,\n layout94: layout$ | async\n }\n \"\n ></ng-container>\n </p>\n </div>\n </td>\n</tr>\n} @if(isLastChildGroup && groupSummary){\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n @if (!isCheckList) {\n <td fd-table-cell class=\"single-select\"></td>\n } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\n <td fd-table-cell>\n <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\n </td>\n } @if (contextMenuItems.length) {\n <td class=\"col-context-menu\" fd-table-cell></td>\n } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\n <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\n } @if (actionList?.length && !inlineEditMode) {\n <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\n }\n</tr>\n} @if (bruleActionMessage && inlineEditMode) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n @if (bruleActionMessage.MessageType === 2) {\n <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\n {{ bruleActionMessage.MessageExpression }}\n </fd-message-strip>\n }\n </td>\n</tr>\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\n<tr fd-table-row>\n <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\n <td\n fd-table-cell\n [attr.colspan]=\"\n columns.length +\n 1 +\n (rowIndicator ? -1 : 0) +\n (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\n (showViewButton ? 1 : 0) +\n (showDetailsInRow && !inlineEditMode ? 1 : 0)\n \"\n >\n <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\n {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\n </fd-message-strip>\n </td>\n</tr>\n}\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\n <ng-container\n *ngTemplateOutlet=\"\n detailsFormItems;\n context: {\n $implicit: detailsColumns,\n mo: this.mo,\n inlineEditMode: this.inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n</ng-template>\n<ng-template\n #detailsFormItems\n let-detailsColumns\n let-mo=\"mo\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <div class=\"form-items\">\n @for (column of detailsColumns; track column; let columnIndex = $index) {\n <div fd-form-item>\n <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n mo: mo,\n index: columnIndex,\n inlineEditMode: inlineEditMode,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n</ng-template>\n<ng-template\n #columnTemplate\n let-column\n let-mo=\"mo\"\n let-index=\"index\"\n let-inlineEditMode=\"inlineEditMode\"\n let-layout94=\"layout94\"\n>\n <bsu-barsa-table-column\n [mo]=\"mo\"\n [allColumns]=\"allColumns\"\n [column]=\"column\"\n [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\n [value]=\"column | columnValue: mo\"\n [icon]=\"column | columnIcon: mo\"\n [customComponent]=\"column.$CustomComponent\"\n [column]=\"column\"\n [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [inlineEditMode]=\"inlineEditMode\"\n [isChecked]=\"isChecked\"\n [index]=\"index\"\n [formSetting]=\"formSetting\"\n [rtl]=\"rtl\"\n [isMobile]=\"isMobile\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [layout94]=\"layout94\"\n (save)=\"onEditFormPanelSave(null)\"\n (cancel)=\"onEditFormPanelCancel(null)\"\n (tab)=\"onTabKeyDown($event, index)\"\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\n >\n </bsu-barsa-table-column>\n</ng-template>\n<ng-template #statusIndicator>\n @if (rowIndicator) {\n <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\n </bsu-barsa-column-indicator>\n }\n</ng-template>\n<ng-template #rowNumberTemplate>\n @if (showRowNumber) {\n <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\n }\n</ng-template>\n<tr fd-table-row style=\"pointer-events: none\"></tr>\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"] }]
|
|
5963
5963
|
}], propDecorators: { showDetailsInRow: [{
|
|
5964
5964
|
type: Input
|
|
5965
5965
|
}], previewColumn: [{
|
|
@@ -8972,6 +8972,7 @@ class FundamentalDynamicFormComponent extends BaseComponent {
|
|
|
8972
8972
|
this.hideTitle = true;
|
|
8973
8973
|
this.toolbarShouldOverflow = false;
|
|
8974
8974
|
this.worfklowButtonsOnFooter = false;
|
|
8975
|
+
this.hasLayoutButtons = true;
|
|
8975
8976
|
}
|
|
8976
8977
|
ngOnInit() {
|
|
8977
8978
|
super.ngOnInit();
|
|
@@ -8982,6 +8983,9 @@ class FundamentalDynamicFormComponent extends BaseComponent {
|
|
|
8982
8983
|
this.workflowButtonsComboMode = this.isMobile;
|
|
8983
8984
|
this.worfklowButtonsOnFooter = this.parameters?.WorkflowButtonsOnFooter;
|
|
8984
8985
|
// this.workflowButtons = workflowButtons;
|
|
8986
|
+
this.hasLayoutButtons =
|
|
8987
|
+
this.layoutActions.length > 0 ||
|
|
8988
|
+
(this.workflowButtons.length > 0 && (this.workflowButtonsComboMode || this.worfklowButtonsOnFooter));
|
|
8985
8989
|
this.canFullscreen = this.parameters?.CanFullscreen === true;
|
|
8986
8990
|
const toolbarButtonsCount = this.toolbarItems.filter((c) => typeof c !== 'string' && c.text !== '-').length;
|
|
8987
8991
|
if (this.deviceSize === 's' && toolbarButtonsCount > 1) {
|
|
@@ -9030,11 +9034,11 @@ class FundamentalDynamicFormComponent extends BaseComponent {
|
|
|
9030
9034
|
this.layout2 = GetFormLayoutGrid(false, this.colXl, this.colLg, this.colMd);
|
|
9031
9035
|
}
|
|
9032
9036
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FundamentalDynamicFormComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9033
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FundamentalDynamicFormComponent, selector: "bsu-fundamental-dynamic-form", inputs: { breadCrumbs: "breadCrumbs", toolbarVisible: "toolbarVisible", toolbarItems: "toolbarItems", layoutActions: "layoutActions", layout94: "layout94", parameters: "parameters", workflowPanelUi: "workflowPanelUi", context: "context", title: "title", subtitle: "subtitle", description: "description", facetList: "facetList", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", rtl: "rtl", hideFooter: "hideFooter", hideTitle: "hideTitle", hideClose: "hideClose", hidePin: "hidePin", fullscreen: "fullscreen", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", landscape: "landscape", standalone: "standalone", modernTabs: "modernTabs", formVisibilityStatus: "formVisibilityStatus", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "closeFormTemplate", first: true, predicate: ["closeForm"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (mask) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n [size]=\"isMobile ? 'small' : 'large'\"\n [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n [class.header-border]=\"!removeHeaderBorder\"\n [attr.isMobile]=\"isMobile\"\n [attr.contentIsPage]=\"contentIsPage\"\n mobile\n formClose\n [isMobile]=\"isMobile\"\n>\n <fd-dynamic-page-header\n [class.simple-title]=\"!description\"\n [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n [class.p-b0]=\"removeContentPadding\"\n [class.hide-title]=\"hideTitle === true && hideClose === true\"\n [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n #titleRef\n >\n <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n <fd-breadcrumb>\n @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n breadCrumb.url; let i = $index; let last = $last) {\n <fd-breadcrumb-item>\n <bsu-breadcrumb\n [index]=\"i\"\n [isLast]=\"last\"\n [breadCrumb]=\"breadCrumb\"\n [allBreadCrumb]=\"breadCrumbs\"\n ></bsu-breadcrumb>\n </fd-breadcrumb-item>\n } }\n </fd-breadcrumb>\n </fd-dynamic-page-breadcrumb>\n <fd-dynamic-page-global-actions>\n <!-- global actions -->\n\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (toolbarVisible) {\n <bsu-form-toolbar\n [deviceSize]=\"deviceSize\"\n [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n [dirValue]=\"dirValue\"\n [isFirefox]=\"isFirefox\"\n (toolbarClick)=\"toolbarClick.emit($event)\"\n #formToolbar\n ></bsu-form-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <!-- layout actions -->\n <!-- <div [formActions]=\"this.toolbar\"></div> -->\n @if (!hideClose) {\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n @if (deviceSize !== 's') {\n <fd-toolbar-separator></fd-toolbar-separator>\n }\n <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n </fd-toolbar>\n }\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n <fd-dynamic-page-subheader\n [class.header-no-description]=\"!(description || workflowInfoText)\"\n [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n [collapsible]=\"true\"\n [pinnable]=\"false\"\n [collapsed]=\"!facetList?.length && !workflowInfoText\"\n >\n @if (workflowInfoText) {\n <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n {{ workflowInfoText | bbbTranslate }}\n </fd-message-strip>\n }\n <fd-facet-group ariaLabel=\"Facet Group\">\n @if (avatar) {\n <fd-facet type=\"image\">\n <fd-avatar\n title=\"avatar\"\n [glyph]=\"avatar\"\n [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [transparent]=\"true\"\n [circle]=\"circleAvatar\"\n ></fd-avatar>\n <!-- <div\n class=\"fd-avatar fd-avatar--circle\"\n [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n >\n <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n </div> -->\n </fd-facet>\n } @for (facet of facetList; track facet) {\n <fd-facet\n [type]=\"facet.type\"\n [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n >\n @for (item of facet.mo.ItemList?.MoDataList; track item) {\n <fd-facet-content>\n <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n </fd-facet-content>\n } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n <span\n fd-object-status\n [status]=\"facet.mo.Status | facetValue\"\n [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n [large]=\"facet.mo.IsLarge\"\n [title]=\"facet.mo.Text | facetValue\"\n [aria-label]=\"facet.mo.Text | facetValue\"\n [glyph]=\"facet.mo.Icon\"\n >\n </span>\n } @else {\n <bnrc-dynamic-component\n [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n [component]=\"facet.mo.Component\"\n [value]=\"facet.mo.Text\"\n ></bnrc-dynamic-component>\n } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n <fd-object-number\n [number]=\"facet.mo.Text | facetValue\"\n [large]=\"facet.mo.IsLarge\"\n [unit]=\"facet.mo.Unit | facetValue\"\n [status]=\"facet.mo.Status | facetValue\"\n [decimal]=\"facet.mo.DecimalValue | facetValue\"\n ></fd-object-number>\n } @if (facet.type === 'plain-text') {\n <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n </div>\n } @if (facet.type === 'rating-indicator') {\n <fd-facet-content>\n <fd-rating-indicator\n style=\"pointer-events: none\"\n size=\"md\"\n [dynamicTextIndicator]=\"facet.mo.Footer\"\n [displayMode]=\"true\"\n [value]=\"facet.mo | facetValue: facet.type\"\n ></fd-rating-indicator>\n </fd-facet-content>\n } @if (facet.type === 'progress') {\n <div [style.width]=\"'10rem'\">\n <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n <fd-progress-indicator\n style=\"width: 10r em\"\n [state]=\"facet.mo.State\"\n [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n [valueNow]=\"facet.mo | facetValue: facet.type\"\n [valueMax]=\"10\"\n [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n ></fd-progress-indicator>\n <!-- <ui5-progress-indicator\n style=\"width: 10rem\"\n [valueState]=\"facet.mo.State\"\n [value]=\"getNumber(facet.mo.Value)\"\n ></ui5-progress-indicator> -->\n </div>\n } @if (facet.type === 'microcharts') {\n <div>\n <label wrap>in progress ...</label>\n </div>\n }\n </fd-facet>\n }\n </fd-facet-group>\n @if (description) {\n <span>{{ description }}</span>\n }\n </fd-dynamic-page-subheader>\n @if(!modernTabs.length && !contentIsPage){\n <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <ng-container\n *ngTemplateOutlet=\"\n parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n <fdp-icon-tab-bar-tab\n [id]=\"tab.id\"\n [label]=\"tab.Title!! | bbbTranslate\"\n [title]=\"tab.Title!! | bbbTranslate\"\n [class.is-expanded]=\"selectedTab === tab.Title\"\n #tablist\n >\n <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n </div>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n </fdp-icon-tab-bar-tab>\n }\n </fdp-icon-tab-bar>\n } @if(!hideFooter && layoutActions.length){\n <fd-dynamic-page-footer>\n <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n </fd-dynamic-page-footer>\n }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n *ngTemplateOutlet=\"\n renderLayoutComponent;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n <bsu-ly-layout-container-of-root\n [config]=\"layout94\"\n [isPanel]=\"false\"\n [isRoot]=\"true\"\n ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n <bnrc-dynamic-form-component\n [component]=\"component\"\n [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n [removeContentPadding]=\"removeContentPadding\"\n [breadCrumbs]=\"breadCrumbs\"\n [description]=\"description\"\n [title]=\"title\"\n [subtitle]=\"subtitle\"\n [toolbarItems]=\"toolbarItems\"\n [layoutActions]=\"layoutActions\"\n [footerDesign]=\"footerDesign\"\n [facetList]=\"facetList\"\n [settings]=\"component.Settings\"\n [workflowButtons]=\"workflowButtons\"\n [workflowPanelUi]=\"workflowPanelUi\"\n [isMobile]=\"isMobile\"\n [mo]=\"mo\"\n [layout94]=\"layout94\"\n [context]=\"context\"\n [rtl]=\"rtl\"\n [fieldDict]=\"fieldDict\"\n [mask]=\"mask\"\n [dirValue]=\"dirValue\"\n [deviceSize]=\"deviceSize\"\n [contentDensity]=\"contentDensity\"\n [modernTabs]=\"modernTabs\"\n [avatar]=\"avatar\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n</ng-template>\n<ng-template #fullscreenForm>\n @if (canFullscreen) {\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n (click)=\"fullscreenRequest.emit()\"\n [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n ></button>\n }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n <bsu-layout-actions\n [canSend]=\"canSend\"\n [buttons]=\"layoutActions\"\n [isMobile]=\"isMobile\"\n [landscape]=\"landscape\"\n [standalone]=\"standalone\"\n [footerDesign]=\"footerDesign\"\n [workflowButtons]=\"workflowButtons\"\n [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n [deviceSize]=\"deviceSize\"\n [rtl]=\"rtl\"\n (toolClick)=\"toolbarClick.emit($event)\"\n (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n >\n </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layoutActionsTemplateRef", "workflowButtons", "layout94", "footerDesign", "settings", "workflowPanelUi", "title", "subtitle", "description", "facetList", "removeHeaderBorder", "removeContentPadding", "isMobile", "avatar", "rtl", "mask", "mo", "contentDensity", "deviceSize", "dirValue", "fieldDict", "modernTabs"] }, { kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i1$6.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i9$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$1.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$1.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$1.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i9.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i3$8.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i14.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "nonInteractive", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i5$4.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "pipe", type: i1$2.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9037
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FundamentalDynamicFormComponent, selector: "bsu-fundamental-dynamic-form", inputs: { breadCrumbs: "breadCrumbs", toolbarVisible: "toolbarVisible", toolbarItems: "toolbarItems", layoutActions: "layoutActions", layout94: "layout94", parameters: "parameters", workflowPanelUi: "workflowPanelUi", context: "context", title: "title", subtitle: "subtitle", description: "description", facetList: "facetList", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", rtl: "rtl", hideFooter: "hideFooter", hideTitle: "hideTitle", hideClose: "hideClose", hidePin: "hidePin", fullscreen: "fullscreen", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", landscape: "landscape", standalone: "standalone", modernTabs: "modernTabs", formVisibilityStatus: "formVisibilityStatus", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "closeFormTemplate", first: true, predicate: ["closeForm"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (mask) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n [size]=\"isMobile ? 'small' : 'large'\"\n [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n [class.header-border]=\"!removeHeaderBorder\"\n [attr.isMobile]=\"isMobile\"\n [attr.contentIsPage]=\"contentIsPage\"\n mobile\n formClose\n [isMobile]=\"isMobile\"\n>\n <fd-dynamic-page-header\n [class.simple-title]=\"!description\"\n [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n [class.p-b0]=\"removeContentPadding\"\n [class.hide-title]=\"hideTitle === true && hideClose === true\"\n [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n #titleRef\n >\n <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n <fd-breadcrumb>\n @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n breadCrumb.url; let i = $index; let last = $last) {\n <fd-breadcrumb-item>\n <bsu-breadcrumb\n [index]=\"i\"\n [isLast]=\"last\"\n [breadCrumb]=\"breadCrumb\"\n [allBreadCrumb]=\"breadCrumbs\"\n ></bsu-breadcrumb>\n </fd-breadcrumb-item>\n } }\n </fd-breadcrumb>\n </fd-dynamic-page-breadcrumb>\n <fd-dynamic-page-global-actions>\n <!-- global actions -->\n\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (toolbarVisible) {\n <bsu-form-toolbar\n [deviceSize]=\"deviceSize\"\n [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n [dirValue]=\"dirValue\"\n [isFirefox]=\"isFirefox\"\n (toolbarClick)=\"toolbarClick.emit($event)\"\n #formToolbar\n ></bsu-form-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <!-- layout actions -->\n <!-- <div [formActions]=\"this.toolbar\"></div> -->\n @if (!hideClose) {\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n @if (deviceSize !== 's') {\n <fd-toolbar-separator></fd-toolbar-separator>\n }\n <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n </fd-toolbar>\n }\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n <fd-dynamic-page-subheader\n [class.header-no-description]=\"!(description || workflowInfoText)\"\n [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n [collapsible]=\"true\"\n [pinnable]=\"false\"\n [collapsed]=\"!facetList?.length && !workflowInfoText\"\n >\n @if (workflowInfoText) {\n <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n {{ workflowInfoText | bbbTranslate }}\n </fd-message-strip>\n }\n <fd-facet-group ariaLabel=\"Facet Group\">\n @if (avatar) {\n <fd-facet type=\"image\">\n <fd-avatar\n title=\"avatar\"\n [glyph]=\"avatar\"\n [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [transparent]=\"true\"\n [circle]=\"circleAvatar\"\n ></fd-avatar>\n <!-- <div\n class=\"fd-avatar fd-avatar--circle\"\n [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n >\n <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n </div> -->\n </fd-facet>\n } @for (facet of facetList; track facet) {\n <fd-facet\n [type]=\"facet.type\"\n [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n >\n @for (item of facet.mo.ItemList?.MoDataList; track item) {\n <fd-facet-content>\n <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n </fd-facet-content>\n } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n <span\n fd-object-status\n [status]=\"facet.mo.Status | facetValue\"\n [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n [large]=\"facet.mo.IsLarge\"\n [title]=\"facet.mo.Text | facetValue\"\n [aria-label]=\"facet.mo.Text | facetValue\"\n [glyph]=\"facet.mo.Icon\"\n >\n </span>\n } @else {\n <bnrc-dynamic-component\n [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n [component]=\"facet.mo.Component\"\n [value]=\"facet.mo.Text\"\n ></bnrc-dynamic-component>\n } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n <fd-object-number\n [number]=\"facet.mo.Text | facetValue\"\n [large]=\"facet.mo.IsLarge\"\n [unit]=\"facet.mo.Unit | facetValue\"\n [status]=\"facet.mo.Status | facetValue\"\n [decimal]=\"facet.mo.DecimalValue | facetValue\"\n ></fd-object-number>\n } @if (facet.type === 'plain-text') {\n <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n </div>\n } @if (facet.type === 'rating-indicator') {\n <fd-facet-content>\n <fd-rating-indicator\n style=\"pointer-events: none\"\n size=\"md\"\n [dynamicTextIndicator]=\"facet.mo.Footer\"\n [displayMode]=\"true\"\n [value]=\"facet.mo | facetValue: facet.type\"\n ></fd-rating-indicator>\n </fd-facet-content>\n } @if (facet.type === 'progress') {\n <div [style.width]=\"'10rem'\">\n <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n <fd-progress-indicator\n style=\"width: 10r em\"\n [state]=\"facet.mo.State\"\n [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n [valueNow]=\"facet.mo | facetValue: facet.type\"\n [valueMax]=\"10\"\n [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n ></fd-progress-indicator>\n <!-- <ui5-progress-indicator\n style=\"width: 10rem\"\n [valueState]=\"facet.mo.State\"\n [value]=\"getNumber(facet.mo.Value)\"\n ></ui5-progress-indicator> -->\n </div>\n } @if (facet.type === 'microcharts') {\n <div>\n <label wrap>in progress ...</label>\n </div>\n }\n </fd-facet>\n }\n </fd-facet-group>\n @if (description) {\n <span>{{ description }}</span>\n }\n </fd-dynamic-page-subheader>\n @if(!modernTabs.length && !contentIsPage){\n <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <ng-container\n *ngTemplateOutlet=\"\n parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n <fdp-icon-tab-bar-tab\n [id]=\"tab.id\"\n [label]=\"tab.Title!! | bbbTranslate\"\n [title]=\"tab.Title!! | bbbTranslate\"\n [class.is-expanded]=\"selectedTab === tab.Title\"\n #tablist\n >\n <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n </div>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n </fdp-icon-tab-bar-tab>\n }\n </fdp-icon-tab-bar>\n } @if(!hideFooter && hasLayoutButtons){\n <fd-dynamic-page-footer>\n <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n </fd-dynamic-page-footer>\n }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n *ngTemplateOutlet=\"\n renderLayoutComponent;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n <bsu-ly-layout-container-of-root\n [config]=\"layout94\"\n [isPanel]=\"false\"\n [isRoot]=\"true\"\n ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n <bnrc-dynamic-form-component\n [component]=\"component\"\n [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n [removeContentPadding]=\"removeContentPadding\"\n [breadCrumbs]=\"breadCrumbs\"\n [description]=\"description\"\n [title]=\"title\"\n [subtitle]=\"subtitle\"\n [toolbarItems]=\"toolbarItems\"\n [layoutActions]=\"layoutActions\"\n [footerDesign]=\"footerDesign\"\n [facetList]=\"facetList\"\n [settings]=\"component.Settings\"\n [workflowButtons]=\"workflowButtons\"\n [workflowPanelUi]=\"workflowPanelUi\"\n [isMobile]=\"isMobile\"\n [mo]=\"mo\"\n [layout94]=\"layout94\"\n [context]=\"context\"\n [rtl]=\"rtl\"\n [fieldDict]=\"fieldDict\"\n [mask]=\"mask\"\n [dirValue]=\"dirValue\"\n [deviceSize]=\"deviceSize\"\n [contentDensity]=\"contentDensity\"\n [modernTabs]=\"modernTabs\"\n [avatar]=\"avatar\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n</ng-template>\n<ng-template #fullscreenForm>\n @if (canFullscreen) {\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n (click)=\"fullscreenRequest.emit()\"\n [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n ></button>\n }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n <bsu-layout-actions\n [canSend]=\"canSend\"\n [buttons]=\"layoutActions\"\n [isMobile]=\"isMobile\"\n [landscape]=\"landscape\"\n [standalone]=\"standalone\"\n [footerDesign]=\"footerDesign\"\n [workflowButtons]=\"workflowButtons\"\n [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n [deviceSize]=\"deviceSize\"\n [rtl]=\"rtl\"\n (toolClick)=\"toolbarClick.emit($event)\"\n (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n >\n </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layoutActionsTemplateRef", "workflowButtons", "layout94", "footerDesign", "settings", "workflowPanelUi", "title", "subtitle", "description", "facetList", "removeHeaderBorder", "removeContentPadding", "isMobile", "avatar", "rtl", "mask", "mo", "contentDensity", "deviceSize", "dirValue", "fieldDict", "modernTabs"] }, { kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i1$6.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i9$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$1.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$1.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$1.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i9.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i3$8.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i14.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "nonInteractive", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i5$4.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "pipe", type: i1$2.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
9034
9038
|
}
|
|
9035
9039
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
|
|
9036
9040
|
type: Component,
|
|
9037
|
-
args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (mask) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n [size]=\"isMobile ? 'small' : 'large'\"\n [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n [class.header-border]=\"!removeHeaderBorder\"\n [attr.isMobile]=\"isMobile\"\n [attr.contentIsPage]=\"contentIsPage\"\n mobile\n formClose\n [isMobile]=\"isMobile\"\n>\n <fd-dynamic-page-header\n [class.simple-title]=\"!description\"\n [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n [class.p-b0]=\"removeContentPadding\"\n [class.hide-title]=\"hideTitle === true && hideClose === true\"\n [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n #titleRef\n >\n <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n <fd-breadcrumb>\n @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n breadCrumb.url; let i = $index; let last = $last) {\n <fd-breadcrumb-item>\n <bsu-breadcrumb\n [index]=\"i\"\n [isLast]=\"last\"\n [breadCrumb]=\"breadCrumb\"\n [allBreadCrumb]=\"breadCrumbs\"\n ></bsu-breadcrumb>\n </fd-breadcrumb-item>\n } }\n </fd-breadcrumb>\n </fd-dynamic-page-breadcrumb>\n <fd-dynamic-page-global-actions>\n <!-- global actions -->\n\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (toolbarVisible) {\n <bsu-form-toolbar\n [deviceSize]=\"deviceSize\"\n [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n [dirValue]=\"dirValue\"\n [isFirefox]=\"isFirefox\"\n (toolbarClick)=\"toolbarClick.emit($event)\"\n #formToolbar\n ></bsu-form-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <!-- layout actions -->\n <!-- <div [formActions]=\"this.toolbar\"></div> -->\n @if (!hideClose) {\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n @if (deviceSize !== 's') {\n <fd-toolbar-separator></fd-toolbar-separator>\n }\n <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n </fd-toolbar>\n }\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n <fd-dynamic-page-subheader\n [class.header-no-description]=\"!(description || workflowInfoText)\"\n [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n [collapsible]=\"true\"\n [pinnable]=\"false\"\n [collapsed]=\"!facetList?.length && !workflowInfoText\"\n >\n @if (workflowInfoText) {\n <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n {{ workflowInfoText | bbbTranslate }}\n </fd-message-strip>\n }\n <fd-facet-group ariaLabel=\"Facet Group\">\n @if (avatar) {\n <fd-facet type=\"image\">\n <fd-avatar\n title=\"avatar\"\n [glyph]=\"avatar\"\n [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [transparent]=\"true\"\n [circle]=\"circleAvatar\"\n ></fd-avatar>\n <!-- <div\n class=\"fd-avatar fd-avatar--circle\"\n [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n >\n <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n </div> -->\n </fd-facet>\n } @for (facet of facetList; track facet) {\n <fd-facet\n [type]=\"facet.type\"\n [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n >\n @for (item of facet.mo.ItemList?.MoDataList; track item) {\n <fd-facet-content>\n <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n </fd-facet-content>\n } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n <span\n fd-object-status\n [status]=\"facet.mo.Status | facetValue\"\n [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n [large]=\"facet.mo.IsLarge\"\n [title]=\"facet.mo.Text | facetValue\"\n [aria-label]=\"facet.mo.Text | facetValue\"\n [glyph]=\"facet.mo.Icon\"\n >\n </span>\n } @else {\n <bnrc-dynamic-component\n [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n [component]=\"facet.mo.Component\"\n [value]=\"facet.mo.Text\"\n ></bnrc-dynamic-component>\n } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n <fd-object-number\n [number]=\"facet.mo.Text | facetValue\"\n [large]=\"facet.mo.IsLarge\"\n [unit]=\"facet.mo.Unit | facetValue\"\n [status]=\"facet.mo.Status | facetValue\"\n [decimal]=\"facet.mo.DecimalValue | facetValue\"\n ></fd-object-number>\n } @if (facet.type === 'plain-text') {\n <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n </div>\n } @if (facet.type === 'rating-indicator') {\n <fd-facet-content>\n <fd-rating-indicator\n style=\"pointer-events: none\"\n size=\"md\"\n [dynamicTextIndicator]=\"facet.mo.Footer\"\n [displayMode]=\"true\"\n [value]=\"facet.mo | facetValue: facet.type\"\n ></fd-rating-indicator>\n </fd-facet-content>\n } @if (facet.type === 'progress') {\n <div [style.width]=\"'10rem'\">\n <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n <fd-progress-indicator\n style=\"width: 10r em\"\n [state]=\"facet.mo.State\"\n [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n [valueNow]=\"facet.mo | facetValue: facet.type\"\n [valueMax]=\"10\"\n [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n ></fd-progress-indicator>\n <!-- <ui5-progress-indicator\n style=\"width: 10rem\"\n [valueState]=\"facet.mo.State\"\n [value]=\"getNumber(facet.mo.Value)\"\n ></ui5-progress-indicator> -->\n </div>\n } @if (facet.type === 'microcharts') {\n <div>\n <label wrap>in progress ...</label>\n </div>\n }\n </fd-facet>\n }\n </fd-facet-group>\n @if (description) {\n <span>{{ description }}</span>\n }\n </fd-dynamic-page-subheader>\n @if(!modernTabs.length && !contentIsPage){\n <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <ng-container\n *ngTemplateOutlet=\"\n parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n <fdp-icon-tab-bar-tab\n [id]=\"tab.id\"\n [label]=\"tab.Title!! | bbbTranslate\"\n [title]=\"tab.Title!! | bbbTranslate\"\n [class.is-expanded]=\"selectedTab === tab.Title\"\n #tablist\n >\n <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n </div>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n </fdp-icon-tab-bar-tab>\n }\n </fdp-icon-tab-bar>\n } @if(!hideFooter && layoutActions.length){\n <fd-dynamic-page-footer>\n <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n </fd-dynamic-page-footer>\n }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n *ngTemplateOutlet=\"\n renderLayoutComponent;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n <bsu-ly-layout-container-of-root\n [config]=\"layout94\"\n [isPanel]=\"false\"\n [isRoot]=\"true\"\n ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n <bnrc-dynamic-form-component\n [component]=\"component\"\n [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n [removeContentPadding]=\"removeContentPadding\"\n [breadCrumbs]=\"breadCrumbs\"\n [description]=\"description\"\n [title]=\"title\"\n [subtitle]=\"subtitle\"\n [toolbarItems]=\"toolbarItems\"\n [layoutActions]=\"layoutActions\"\n [footerDesign]=\"footerDesign\"\n [facetList]=\"facetList\"\n [settings]=\"component.Settings\"\n [workflowButtons]=\"workflowButtons\"\n [workflowPanelUi]=\"workflowPanelUi\"\n [isMobile]=\"isMobile\"\n [mo]=\"mo\"\n [layout94]=\"layout94\"\n [context]=\"context\"\n [rtl]=\"rtl\"\n [fieldDict]=\"fieldDict\"\n [mask]=\"mask\"\n [dirValue]=\"dirValue\"\n [deviceSize]=\"deviceSize\"\n [contentDensity]=\"contentDensity\"\n [modernTabs]=\"modernTabs\"\n [avatar]=\"avatar\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n</ng-template>\n<ng-template #fullscreenForm>\n @if (canFullscreen) {\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n (click)=\"fullscreenRequest.emit()\"\n [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n ></button>\n }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n <bsu-layout-actions\n [canSend]=\"canSend\"\n [buttons]=\"layoutActions\"\n [isMobile]=\"isMobile\"\n [landscape]=\"landscape\"\n [standalone]=\"standalone\"\n [footerDesign]=\"footerDesign\"\n [workflowButtons]=\"workflowButtons\"\n [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n [deviceSize]=\"deviceSize\"\n [rtl]=\"rtl\"\n (toolClick)=\"toolbarClick.emit($event)\"\n (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n >\n </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"] }]
|
|
9041
|
+
args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (mask) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n [size]=\"isMobile ? 'small' : 'large'\"\n [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n [class.header-border]=\"!removeHeaderBorder\"\n [attr.isMobile]=\"isMobile\"\n [attr.contentIsPage]=\"contentIsPage\"\n mobile\n formClose\n [isMobile]=\"isMobile\"\n>\n <fd-dynamic-page-header\n [class.simple-title]=\"!description\"\n [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n [class.p-b0]=\"removeContentPadding\"\n [class.hide-title]=\"hideTitle === true && hideClose === true\"\n [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n #titleRef\n >\n <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n <fd-breadcrumb>\n @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n breadCrumb.url; let i = $index; let last = $last) {\n <fd-breadcrumb-item>\n <bsu-breadcrumb\n [index]=\"i\"\n [isLast]=\"last\"\n [breadCrumb]=\"breadCrumb\"\n [allBreadCrumb]=\"breadCrumbs\"\n ></bsu-breadcrumb>\n </fd-breadcrumb-item>\n } }\n </fd-breadcrumb>\n </fd-dynamic-page-breadcrumb>\n <fd-dynamic-page-global-actions>\n <!-- global actions -->\n\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (toolbarVisible) {\n <bsu-form-toolbar\n [deviceSize]=\"deviceSize\"\n [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n [dirValue]=\"dirValue\"\n [isFirefox]=\"isFirefox\"\n (toolbarClick)=\"toolbarClick.emit($event)\"\n #formToolbar\n ></bsu-form-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <!-- layout actions -->\n <!-- <div [formActions]=\"this.toolbar\"></div> -->\n @if (!hideClose) {\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n @if (deviceSize !== 's') {\n <fd-toolbar-separator></fd-toolbar-separator>\n }\n <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n </fd-toolbar>\n }\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n <fd-dynamic-page-subheader\n [class.header-no-description]=\"!(description || workflowInfoText)\"\n [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n [collapsible]=\"true\"\n [pinnable]=\"false\"\n [collapsed]=\"!facetList?.length && !workflowInfoText\"\n >\n @if (workflowInfoText) {\n <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n {{ workflowInfoText | bbbTranslate }}\n </fd-message-strip>\n }\n <fd-facet-group ariaLabel=\"Facet Group\">\n @if (avatar) {\n <fd-facet type=\"image\">\n <fd-avatar\n title=\"avatar\"\n [glyph]=\"avatar\"\n [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [transparent]=\"true\"\n [circle]=\"circleAvatar\"\n ></fd-avatar>\n <!-- <div\n class=\"fd-avatar fd-avatar--circle\"\n [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n >\n <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n </div> -->\n </fd-facet>\n } @for (facet of facetList; track facet) {\n <fd-facet\n [type]=\"facet.type\"\n [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n >\n @for (item of facet.mo.ItemList?.MoDataList; track item) {\n <fd-facet-content>\n <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n </fd-facet-content>\n } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n <span\n fd-object-status\n [status]=\"facet.mo.Status | facetValue\"\n [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n [large]=\"facet.mo.IsLarge\"\n [title]=\"facet.mo.Text | facetValue\"\n [aria-label]=\"facet.mo.Text | facetValue\"\n [glyph]=\"facet.mo.Icon\"\n >\n </span>\n } @else {\n <bnrc-dynamic-component\n [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n [component]=\"facet.mo.Component\"\n [value]=\"facet.mo.Text\"\n ></bnrc-dynamic-component>\n } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n <fd-object-number\n [number]=\"facet.mo.Text | facetValue\"\n [large]=\"facet.mo.IsLarge\"\n [unit]=\"facet.mo.Unit | facetValue\"\n [status]=\"facet.mo.Status | facetValue\"\n [decimal]=\"facet.mo.DecimalValue | facetValue\"\n ></fd-object-number>\n } @if (facet.type === 'plain-text') {\n <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n </div>\n } @if (facet.type === 'rating-indicator') {\n <fd-facet-content>\n <fd-rating-indicator\n style=\"pointer-events: none\"\n size=\"md\"\n [dynamicTextIndicator]=\"facet.mo.Footer\"\n [displayMode]=\"true\"\n [value]=\"facet.mo | facetValue: facet.type\"\n ></fd-rating-indicator>\n </fd-facet-content>\n } @if (facet.type === 'progress') {\n <div [style.width]=\"'10rem'\">\n <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n <fd-progress-indicator\n style=\"width: 10r em\"\n [state]=\"facet.mo.State\"\n [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n [valueNow]=\"facet.mo | facetValue: facet.type\"\n [valueMax]=\"10\"\n [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n ></fd-progress-indicator>\n <!-- <ui5-progress-indicator\n style=\"width: 10rem\"\n [valueState]=\"facet.mo.State\"\n [value]=\"getNumber(facet.mo.Value)\"\n ></ui5-progress-indicator> -->\n </div>\n } @if (facet.type === 'microcharts') {\n <div>\n <label wrap>in progress ...</label>\n </div>\n }\n </fd-facet>\n }\n </fd-facet-group>\n @if (description) {\n <span>{{ description }}</span>\n }\n </fd-dynamic-page-subheader>\n @if(!modernTabs.length && !contentIsPage){\n <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <ng-container\n *ngTemplateOutlet=\"\n parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n ></ng-container>\n </div>\n <div\n style=\"padding: 0\"\n [class.hide]=\"layout2.colXl === 0\"\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n <fdp-icon-tab-bar-tab\n [id]=\"tab.id\"\n [label]=\"tab.Title!! | bbbTranslate\"\n [title]=\"tab.Title!! | bbbTranslate\"\n [class.is-expanded]=\"selectedTab === tab.Title\"\n #tablist\n >\n <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n <div fdLayoutGridRow>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout1.colMd\"\n [colLg]=\"layout1.colLg\"\n [colXl]=\"layout1.colXl\"\n ></div>\n <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n </div>\n <div\n [fdLayoutGridCol]=\"0\"\n [colMd]=\"layout2.colMd\"\n [colLg]=\"layout2.colLg\"\n [colXl]=\"layout2.colXl\"\n ></div>\n </div>\n </fd-layout-grid>\n </fd-dynamic-page-content>\n </fdp-icon-tab-bar-tab>\n }\n </fdp-icon-tab-bar>\n } @if(!hideFooter && hasLayoutButtons){\n <fd-dynamic-page-footer>\n <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n </fd-dynamic-page-footer>\n }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n *ngTemplateOutlet=\"\n renderLayoutComponent;\n context: {\n $implicit: parameters?.LayoutComponent,\n layout94: layout94\n }\n \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n <bsu-ly-layout-container-of-root\n [config]=\"layout94\"\n [isPanel]=\"false\"\n [isRoot]=\"true\"\n ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n <bnrc-dynamic-form-component\n [component]=\"component\"\n [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n [removeContentPadding]=\"removeContentPadding\"\n [breadCrumbs]=\"breadCrumbs\"\n [description]=\"description\"\n [title]=\"title\"\n [subtitle]=\"subtitle\"\n [toolbarItems]=\"toolbarItems\"\n [layoutActions]=\"layoutActions\"\n [footerDesign]=\"footerDesign\"\n [facetList]=\"facetList\"\n [settings]=\"component.Settings\"\n [workflowButtons]=\"workflowButtons\"\n [workflowPanelUi]=\"workflowPanelUi\"\n [isMobile]=\"isMobile\"\n [mo]=\"mo\"\n [layout94]=\"layout94\"\n [context]=\"context\"\n [rtl]=\"rtl\"\n [fieldDict]=\"fieldDict\"\n [mask]=\"mask\"\n [dirValue]=\"dirValue\"\n [deviceSize]=\"deviceSize\"\n [contentDensity]=\"contentDensity\"\n [modernTabs]=\"modernTabs\"\n [avatar]=\"avatar\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n</ng-template>\n<ng-template #fullscreenForm>\n @if (canFullscreen) {\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n (click)=\"fullscreenRequest.emit()\"\n [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n ></button>\n }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n <bsu-layout-actions\n [canSend]=\"canSend\"\n [buttons]=\"layoutActions\"\n [isMobile]=\"isMobile\"\n [landscape]=\"landscape\"\n [standalone]=\"standalone\"\n [footerDesign]=\"footerDesign\"\n [workflowButtons]=\"workflowButtons\"\n [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n [deviceSize]=\"deviceSize\"\n [rtl]=\"rtl\"\n (toolClick)=\"toolbarClick.emit($event)\"\n (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n >\n </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"] }]
|
|
9038
9042
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { _dynamicPageComponent: [{
|
|
9039
9043
|
type: ViewChild,
|
|
9040
9044
|
args: [DynamicPageComponent, { static: true }]
|