barsa-sap-ui 2.0.48 → 2.0.50
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/barsa-ulv-main/barsa-ulv-main.component.mjs +3 -3
- package/esm2022/lib/card-item/card-item.component.mjs +3 -3
- package/esm2022/lib/report-navigator/report-navigator.component.mjs +2 -2
- package/esm2022/lib/ui-card-view/ui-card-view.component.mjs +2 -2
- package/esm2022/lib/ui-simple-combo/ui-simple-combo.component.mjs +3 -5
- package/fesm2022/barsa-sap-ui.mjs +9 -11
- package/fesm2022/barsa-sap-ui.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -5039,11 +5039,11 @@ class CardItemComponent extends BaseViewItemPropsComponent {
|
|
|
5039
5039
|
}
|
|
5040
5040
|
}
|
|
5041
5041
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: CardItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5042
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: CardItemComponent, selector: "bsu-card-item", inputs: { setting: "setting" }, providers: [FormPanelService], viewQueries: [{ propertyName: "_quickViewTemplate", first: true, predicate: ["quickViewTemplate"], descendants: true, static: true }, { propertyName: "_contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-card\n [cardType]=\"setting.CardType$Caption\"\n class=\"docs-flex-item-margin\"\n [class.openOnClick]=\"setting.openOnClick\"\n [style.width]=\"cardWidth\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n>\n <ng-container\n *ngTemplateOutlet=\"\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n\n @if (!noContent || contextMenuItems) {\n <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify>\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\n <ng-container\n *ngTemplateOutlet=\"\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n </div>\n @if (contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [footerMode]=\"true\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </fd-card-content>\n }\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n >@if (column) {\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo | bbbTranslate\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [isChecked]=\"isChecked\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n }\n</ng-template>\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\n @if (!noContent) {\n <fd-quick-view [id]=\"'id'\">\n <fd-quick-view-group>\n @if (setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField) {\n <fd-quick-view-subheader>\n @if (setting.AvatarField || setting.Avatar) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"setting.CircleAvatar\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [glyph]=\"\n setting.Avatar ||\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n } @if (setting.TitleField) {\n <fd-quick-view-subheader-title>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-title>\n } @if (setting.SubtitleField) {\n <fd-quick-view-subheader-subtitle>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-subtitle>\n }\n </fd-quick-view-subheader>\n } @for (column of setting.FieldListMapped; track column) {\n <fd-quick-view-group-item>\n @if (column) {\n <fd-quick-view-group-item-label>\n {{ column.Caption | bbbTranslate }}\n </fd-quick-view-group-item-label>\n <fd-quick-view-group-item-content>\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n } @if (setting.DescriptionField) {\n <fd-quick-view-group-item>\n <fd-quick-view-group-item-content>\n @if (inlineEditMode && allowInlineEdit) {\n <fd-quick-view-group-item-label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </fd-quick-view-group-item-label>\n }\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n @if (setting.ActionFieldNameField) {\n <fd-quick-view-group-item-content\n class=\"action\"\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\n >\n <a fd-link>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.ActionFieldNameField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </a>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n }\n </fd-quick-view-group>\n </fd-quick-view>\n }\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n <fd-layout-grid>\n <div fdLayoutGridRow style=\"align-items: center\">\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol\">\n <ng-container\n *ngTemplateOutlet=\"\n avatar;\n context: {\n $implicit: setting.Avatar,\n visible: setting.AvatarField || setting.Avatar,\n circle: setting.CircleAvatar,\n avatarField: setting.AvatarField\n }\n \"\n ></ng-container>\n </div>\n\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol: false\">\n @if (setting.TitleField) {\n <span style=\"font-weight: bold\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n } @if (setting.SubtitleField) {\n <span>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n }\n </div>\n\n <div [fdLayoutGridCol]=\"12\">\n @for (column of setting.FieldListMapped; track column) {\n <div style=\"display: flex\">\n <label fd-form-label [colon]=\"true\" for=\"form-value-11\">{{ column.Caption | bbbTranslate }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n @if (setting.DescriptionField) {\n <div [fdLayoutGridCol]=\"12\">\n @if (inlineEditMode && allowInlineEdit) {\n <label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </label>\n }\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n </fd-layout-grid>\n</ng-template>\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\n @if (visible) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"circle\"\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\n >\n </fd-avatar>\n }\n</ng-template>\n\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.ContentComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.ContentComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n\n<ng-template #renderHeader let-mo let-index=\"index\">\n @if ( (isCheckList || deviceName !== 'desktop' || (contextMenuItems && contextMenuItems.length > 0 &&\n !contextMenuInFooter)) && !(!isCheckList && openOnClick && !contextMenuItems?.length) ) {\n <fd-card-header>\n <div\n fd-card-title\n [style.justify-content]=\"!isCheckList && canView && deviceName !== 'desktop' ? 'left' : 'space-between'\"\n >\n <div style=\"display: flex; justify-content: start; flex-grow: 1\">\n @if (isCheckList) {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n } @if (!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </div>\n @if (canView) {\n <button\n fd-button\n class=\"view-btn\"\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n }\n </div>\n </fd-card-header>\n }\n</ng-template>\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.HeaderComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.HeaderComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n", styles: ["fd-card:hover{box-shadow:0 0 0 .0625rem #2235487a,0 .625rem 1.875rem #22354840}fd-card fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header:hover{background:var(--fdCard_Background_Color)}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-card fd-card-header:hover{background:inherit}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "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: i11.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i11.QuickViewSubheaderComponent, selector: "fd-quick-view-subheader" }, { kind: "component", type: i11.QuickViewSubheaderTitleComponent, selector: "fd-quick-view-subheader-title" }, { kind: "component", type: i11.QuickViewSubheaderSubtitleComponent, selector: "fd-quick-view-subheader-subtitle" }, { kind: "component", type: i11.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i11.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i11.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i11.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i11.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "disableEllapsis", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }, { kind: "pipe", type: AvatarGridColPipe, name: "avatarGridCol" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5042
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: CardItemComponent, selector: "bsu-card-item", inputs: { setting: "setting" }, providers: [FormPanelService], viewQueries: [{ propertyName: "_quickViewTemplate", first: true, predicate: ["quickViewTemplate"], descendants: true, static: true }, { propertyName: "_contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-card\n [cardType]=\"setting.CardType$Caption\"\n class=\"docs-flex-item-margin\"\n [class.openOnClick]=\"setting.openOnClick\"\n [style.width]=\"cardWidth\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n>\n <ng-container\n *ngTemplateOutlet=\"\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n\n @if (!noContent || contextMenuItems) {\n <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify>\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\n <ng-container\n *ngTemplateOutlet=\"\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n </div>\n @if (contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [footerMode]=\"true\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </fd-card-content>\n }\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n >@if (column) {\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo | bbbTranslate\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [isChecked]=\"isChecked\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n }\n</ng-template>\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\n @if (!noContent) {\n <fd-quick-view [id]=\"'id'\">\n <fd-quick-view-group>\n @if (setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField) {\n <fd-quick-view-subheader>\n @if (setting.AvatarField || setting.Avatar) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"setting.CircleAvatar\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"\n deviceSize === 'xl' || deviceSize === 'l'\n ? setting.AvatarSizeDesktop$Caption\n : setting.AvatarSize$Caption\n \"\n [glyph]=\"\n setting.Avatar ||\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n } @if (setting.TitleField) {\n <fd-quick-view-subheader-title>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-title>\n } @if (setting.SubtitleField) {\n <fd-quick-view-subheader-subtitle>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-subtitle>\n }\n </fd-quick-view-subheader>\n } @for (column of setting.FieldListMapped; track column) {\n <fd-quick-view-group-item>\n @if (column) {\n <fd-quick-view-group-item-label>\n {{ column.Caption | bbbTranslate }}\n </fd-quick-view-group-item-label>\n <fd-quick-view-group-item-content>\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n } @if (setting.DescriptionField) {\n <fd-quick-view-group-item>\n <fd-quick-view-group-item-content>\n @if (inlineEditMode && allowInlineEdit) {\n <fd-quick-view-group-item-label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </fd-quick-view-group-item-label>\n }\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n @if (setting.ActionFieldNameField) {\n <fd-quick-view-group-item-content\n class=\"action\"\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\n >\n <a fd-link>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.ActionFieldNameField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </a>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n }\n </fd-quick-view-group>\n </fd-quick-view>\n }\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n <fd-layout-grid>\n <div fdLayoutGridRow style=\"align-items: center\">\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol\">\n <ng-container\n *ngTemplateOutlet=\"\n avatar;\n context: {\n $implicit: setting.Avatar,\n visible: setting.AvatarField || setting.Avatar,\n circle: setting.CircleAvatar,\n avatarField: setting.AvatarField\n }\n \"\n ></ng-container>\n </div>\n\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol: false\">\n @if (setting.TitleField) {\n <span style=\"font-weight: bold\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n } @if (setting.SubtitleField) {\n <span>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n }\n </div>\n\n <div [fdLayoutGridCol]=\"12\">\n @for (column of setting.FieldListMapped; track column) {\n <div style=\"display: flex\">\n <label fd-form-label [colon]=\"true\" for=\"form-value-11\">{{ column.Caption | bbbTranslate }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n @if (setting.DescriptionField) {\n <div [fdLayoutGridCol]=\"12\">\n @if (inlineEditMode && allowInlineEdit) {\n <label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </label>\n }\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n </fd-layout-grid>\n</ng-template>\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\n @if (visible) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"circle\"\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\n [size]=\"\n deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\n \"\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\n >\n </fd-avatar>\n }\n</ng-template>\n\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.ContentComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.ContentComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n\n<ng-template #renderHeader let-mo let-index=\"index\">\n @if ( (isCheckList || deviceName !== 'desktop' || (contextMenuItems && contextMenuItems.length > 0 &&\n !contextMenuInFooter)) && !(!isCheckList && openOnClick && !contextMenuItems?.length) ) {\n <fd-card-header>\n <div\n fd-card-title\n [style.justify-content]=\"!isCheckList && canView && deviceName !== 'desktop' ? 'left' : 'space-between'\"\n >\n <div style=\"display: flex; justify-content: start; flex-grow: 1\">\n @if (isCheckList) {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n } @if (!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </div>\n @if (canView) {\n <button\n fd-button\n class=\"view-btn\"\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n }\n </div>\n </fd-card-header>\n }\n</ng-template>\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.HeaderComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.HeaderComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n", styles: ["fd-card:hover{box-shadow:0 0 0 .0625rem #2235487a,0 .625rem 1.875rem #22354840}fd-card fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header:hover{background:var(--fdCard_Background_Color)}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-card fd-card-header:hover{background:inherit}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "component", type: i3$3.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$4.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "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: i11.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i11.QuickViewSubheaderComponent, selector: "fd-quick-view-subheader" }, { kind: "component", type: i11.QuickViewSubheaderTitleComponent, selector: "fd-quick-view-subheader-title" }, { kind: "component", type: i11.QuickViewSubheaderSubtitleComponent, selector: "fd-quick-view-subheader-subtitle" }, { kind: "component", type: i11.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i11.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i11.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i11.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i11.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode"], outputs: ["commandClick"] }, { kind: "component", type: ColumnRendererComponent, selector: "bsu-column-renderer,[colRenderer]", inputs: ["column", "mo", "index", "editMode", "customRowHeight", "controlUi", "formLayoutShowLabel", "isChecked", "isNewInlineMo", "containerDom", "disableEllapsis", "rtl", "deviceName", "deviceSize", "value", "icon"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }, { kind: "pipe", type: AvatarGridColPipe, name: "avatarGridCol" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5043
5043
|
}
|
|
5044
5044
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: CardItemComponent, decorators: [{
|
|
5045
5045
|
type: Component,
|
|
5046
|
-
args: [{ selector: 'bsu-card-item', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-card\n [cardType]=\"setting.CardType$Caption\"\n class=\"docs-flex-item-margin\"\n [class.openOnClick]=\"setting.openOnClick\"\n [style.width]=\"cardWidth\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n>\n <ng-container\n *ngTemplateOutlet=\"\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n\n @if (!noContent || contextMenuItems) {\n <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify>\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\n <ng-container\n *ngTemplateOutlet=\"\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n </div>\n @if (contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [footerMode]=\"true\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </fd-card-content>\n }\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n >@if (column) {\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo | bbbTranslate\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [isChecked]=\"isChecked\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n }\n</ng-template>\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\n @if (!noContent) {\n <fd-quick-view [id]=\"'id'\">\n <fd-quick-view-group>\n @if (setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField) {\n <fd-quick-view-subheader>\n @if (setting.AvatarField || setting.Avatar) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"setting.CircleAvatar\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [glyph]=\"\n setting.Avatar ||\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n } @if (setting.TitleField) {\n <fd-quick-view-subheader-title>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-title>\n } @if (setting.SubtitleField) {\n <fd-quick-view-subheader-subtitle>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-subtitle>\n }\n </fd-quick-view-subheader>\n } @for (column of setting.FieldListMapped; track column) {\n <fd-quick-view-group-item>\n @if (column) {\n <fd-quick-view-group-item-label>\n {{ column.Caption | bbbTranslate }}\n </fd-quick-view-group-item-label>\n <fd-quick-view-group-item-content>\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n } @if (setting.DescriptionField) {\n <fd-quick-view-group-item>\n <fd-quick-view-group-item-content>\n @if (inlineEditMode && allowInlineEdit) {\n <fd-quick-view-group-item-label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </fd-quick-view-group-item-label>\n }\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n @if (setting.ActionFieldNameField) {\n <fd-quick-view-group-item-content\n class=\"action\"\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\n >\n <a fd-link>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.ActionFieldNameField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </a>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n }\n </fd-quick-view-group>\n </fd-quick-view>\n }\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n <fd-layout-grid>\n <div fdLayoutGridRow style=\"align-items: center\">\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol\">\n <ng-container\n *ngTemplateOutlet=\"\n avatar;\n context: {\n $implicit: setting.Avatar,\n visible: setting.AvatarField || setting.Avatar,\n circle: setting.CircleAvatar,\n avatarField: setting.AvatarField\n }\n \"\n ></ng-container>\n </div>\n\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol: false\">\n @if (setting.TitleField) {\n <span style=\"font-weight: bold\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n } @if (setting.SubtitleField) {\n <span>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n }\n </div>\n\n <div [fdLayoutGridCol]=\"12\">\n @for (column of setting.FieldListMapped; track column) {\n <div style=\"display: flex\">\n <label fd-form-label [colon]=\"true\" for=\"form-value-11\">{{ column.Caption | bbbTranslate }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n @if (setting.DescriptionField) {\n <div [fdLayoutGridCol]=\"12\">\n @if (inlineEditMode && allowInlineEdit) {\n <label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </label>\n }\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n </fd-layout-grid>\n</ng-template>\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\n @if (visible) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"circle\"\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\n [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\n >\n </fd-avatar>\n }\n</ng-template>\n\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.ContentComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.ContentComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n\n<ng-template #renderHeader let-mo let-index=\"index\">\n @if ( (isCheckList || deviceName !== 'desktop' || (contextMenuItems && contextMenuItems.length > 0 &&\n !contextMenuInFooter)) && !(!isCheckList && openOnClick && !contextMenuItems?.length) ) {\n <fd-card-header>\n <div\n fd-card-title\n [style.justify-content]=\"!isCheckList && canView && deviceName !== 'desktop' ? 'left' : 'space-between'\"\n >\n <div style=\"display: flex; justify-content: start; flex-grow: 1\">\n @if (isCheckList) {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n } @if (!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </div>\n @if (canView) {\n <button\n fd-button\n class=\"view-btn\"\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n }\n </div>\n </fd-card-header>\n }\n</ng-template>\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.HeaderComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.HeaderComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n", styles: ["fd-card:hover{box-shadow:0 0 0 .0625rem #2235487a,0 .625rem 1.875rem #22354840}fd-card fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header:hover{background:var(--fdCard_Background_Color)}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-card fd-card-header:hover{background:inherit}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"] }]
|
|
5046
|
+
args: [{ selector: 'bsu-card-item', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-card\n [cardType]=\"setting.CardType$Caption\"\n class=\"docs-flex-item-margin\"\n [class.openOnClick]=\"setting.openOnClick\"\n [style.width]=\"cardWidth\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n>\n <ng-container\n *ngTemplateOutlet=\"\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n\n @if (!noContent || contextMenuItems) {\n <fd-card-content (click)=\"onRowCheck()\" (dblclick)=\"onRowClick()\" ellipsify>\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\n <ng-container\n *ngTemplateOutlet=\"\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\n context: {\n $implicit: mo,\n index: this.index\n }\n \"\n ></ng-container>\n </div>\n @if (contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [footerMode]=\"true\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </fd-card-content>\n }\n</fd-card>\n\n<ng-template #columnTemplate let-column let-mo=\"mo\" let-index=\"index\" let-layout94=\"layout94\"\n >@if (column) {\n <div\n #divEl\n [applyConditionalFormats]=\"conditionalFormats\"\n [styleIndex]=\"styleIndex\"\n [hostEl]=\"divEl\"\n [dbName]=\"column.Name\"\n >\n <bsu-column-renderer\n [mo]=\"mo\"\n [column]=\"column\"\n [value]=\"column | columnValue: mo | bbbTranslate\"\n [icon]=\"column | columnIcon: mo\"\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\n [rtl]=\"rtl\"\n [isChecked]=\"isChecked\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [controlUi]=\"column.Caption | controlUi: layout94\"\n (keyup.control.enter)=\"onEditFormPanelSave($event)\"\n (keyup.esc)=\"onEditFormPanelCancel($event)\"\n (keydown.Tab)=\"onTabKeyDown($event, index)\"\n [formLayoutShowLabel]=\"true\"\n ></bsu-column-renderer>\n </div>\n }\n</ng-template>\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\n @if (!noContent) {\n <fd-quick-view [id]=\"'id'\">\n <fd-quick-view-group>\n @if (setting.Avatar || setting.AvatarField || setting.TitleField || setting.SubtitleField) {\n <fd-quick-view-subheader>\n @if (setting.AvatarField || setting.Avatar) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"setting.CircleAvatar\"\n [image]=\"\n setting.AvatarField\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\n : ''\n \"\n [size]=\"\n deviceSize === 'xl' || deviceSize === 'l'\n ? setting.AvatarSizeDesktop$Caption\n : setting.AvatarSize$Caption\n \"\n [glyph]=\"\n setting.Avatar ||\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\n \"\n >\n </fd-avatar>\n } @if (setting.TitleField) {\n <fd-quick-view-subheader-title>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-title>\n } @if (setting.SubtitleField) {\n <fd-quick-view-subheader-subtitle>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </fd-quick-view-subheader-subtitle>\n }\n </fd-quick-view-subheader>\n } @for (column of setting.FieldListMapped; track column) {\n <fd-quick-view-group-item>\n @if (column) {\n <fd-quick-view-group-item-label>\n {{ column.Caption | bbbTranslate }}\n </fd-quick-view-group-item-label>\n <fd-quick-view-group-item-content>\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n } @if (setting.DescriptionField) {\n <fd-quick-view-group-item>\n <fd-quick-view-group-item-content>\n @if (inlineEditMode && allowInlineEdit) {\n <fd-quick-view-group-item-label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </fd-quick-view-group-item-label>\n }\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n </fd-quick-view-group-item-content>\n @if (setting.ActionFieldNameField) {\n <fd-quick-view-group-item-content\n class=\"action\"\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\n >\n <a fd-link>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.ActionFieldNameField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </a>\n </fd-quick-view-group-item-content>\n }\n </fd-quick-view-group-item>\n }\n </fd-quick-view-group>\n </fd-quick-view>\n }\n</ng-template>\n<ng-template #contentTemplate let-mo let-index=\"index\">\n <fd-layout-grid>\n <div fdLayoutGridRow style=\"align-items: center\">\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol\">\n <ng-container\n *ngTemplateOutlet=\"\n avatar;\n context: {\n $implicit: setting.Avatar,\n visible: setting.AvatarField || setting.Avatar,\n circle: setting.CircleAvatar,\n avatarField: setting.AvatarField\n }\n \"\n ></ng-container>\n </div>\n\n <div [fdLayoutGridCol]=\"deviceSize | avatarGridCol: false\">\n @if (setting.TitleField) {\n <span style=\"font-weight: bold\">\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.TitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n } @if (setting.SubtitleField) {\n <span>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.SubtitleField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </span>\n }\n </div>\n\n <div [fdLayoutGridCol]=\"12\">\n @for (column of setting.FieldListMapped; track column) {\n <div style=\"display: flex\">\n <label fd-form-label [colon]=\"true\" for=\"form-value-11\">{{ column.Caption | bbbTranslate }}</label>\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: column,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n @if (setting.DescriptionField) {\n <div [fdLayoutGridCol]=\"12\">\n @if (inlineEditMode && allowInlineEdit) {\n <label>\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\n </label>\n }\n <ng-container\n *ngTemplateOutlet=\"\n columnTemplate;\n context: {\n $implicit: setting.DescriptionField,\n layout94: layout$ | async,\n mo: mo,\n index: index\n }\n \"\n ></ng-container>\n </div>\n }\n </div>\n </fd-layout-grid>\n</ng-template>\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\n @if (visible) {\n <fd-avatar\n alterIcon=\"alt|content|backup|default-icon\"\n [circle]=\"circle\"\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\n [size]=\"\n deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\n \"\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\n >\n </fd-avatar>\n }\n</ng-template>\n\n<ng-template #contentTemplateComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.ContentComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.ContentComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n\n<ng-template #renderHeader let-mo let-index=\"index\">\n @if ( (isCheckList || deviceName !== 'desktop' || (contextMenuItems && contextMenuItems.length > 0 &&\n !contextMenuInFooter)) && !(!isCheckList && openOnClick && !contextMenuItems?.length) ) {\n <fd-card-header>\n <div\n fd-card-title\n [style.justify-content]=\"!isCheckList && canView && deviceName !== 'desktop' ? 'left' : 'space-between'\"\n >\n <div style=\"display: flex; justify-content: start; flex-grow: 1\">\n @if (isCheckList) {\n <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\n } @if (!contextMenuInFooter && contextMenuItems && contextMenuItems.length > 0) {\n <div\n ulvContextMenu\n [allColumns]=\"allColumns\"\n [menuItems]=\"contextMenuItems\"\n [styleIndex]=\"styleIndex\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [mo]=\"mo\"\n (commandClick)=\"onUlvCommand()\"\n ></div>\n }\n </div>\n @if (canView) {\n <button\n fd-button\n class=\"view-btn\"\n (click)=\"onRowClick()\"\n [glyph]=\"navigationArrow\"\n fdType=\"transparent\"\n ></button>\n }\n </div>\n </fd-card-header>\n }\n</ng-template>\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\n <bnrc-dynamic-item-component\n [component]=\"setting.HeaderComponent\"\n [mo]=\"mo\"\n [styleIndex]=\"mo.$StyleIndex\"\n [isChecked]=\"isChecked\"\n [setting]=\"setting\"\n [parameters]=\"setting.HeaderComponent.Settings\"\n [editMode]=\"inlineEditMode\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [index]=\"index\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (events)=\"onDynamicComponentEvents($event)\"\n ></bnrc-dynamic-item-component>\n</ng-template>\n", styles: ["fd-card:hover{box-shadow:0 0 0 .0625rem #2235487a,0 .625rem 1.875rem #22354840}fd-card fd-card-content{padding:0!important}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header:hover{background:var(--fdCard_Background_Color)}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-card fd-card-header:hover{background:inherit}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"] }]
|
|
5047
5047
|
}], propDecorators: { setting: [{
|
|
5048
5048
|
type: Input
|
|
5049
5049
|
}], _quickViewTemplate: [{
|
|
@@ -5132,11 +5132,11 @@ class UiCardViewComponent extends ReportViewBaseComponent {
|
|
|
5132
5132
|
command();
|
|
5133
5133
|
}
|
|
5134
5134
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCardViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5135
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiCardViewComponent, selector: "bsu-ui-card-view", usesInheritance: true, ngImport: i0, template: "<fd-layout-panel>\n <fd-layout-panel-body [bleed]=\"true\">\n @if (isCheckList) {\n <table fd-table>\n <thead fd-table-header>\n <tr fd-table-row>\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n >{{ 'All' | bbbTranslate }}</fd-checkbox\n >\n </th>\n </tr>\n </thead>\n </table>\n }\n </fd-layout-panel-body>\n</fd-layout-panel>\n<bsu-card-view-content\n [moDataList]=\"moDataList\"\n [groupby]=\"groupby\"\n [setting]=\"cardSetting\"\n [openOnClick]=\"openOnClick\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [formSetting]=\"formSetting\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n (action)=\"onAction($event)\"\n></bsu-card-view-content>\n", styles: ["fd-layout-panel{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5135
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiCardViewComponent, selector: "bsu-ui-card-view", usesInheritance: true, ngImport: i0, template: "<fd-layout-panel>\n <fd-layout-panel-body [bleed]=\"true\">\n @if (isCheckList) {\n <table fd-table>\n <thead fd-table-header>\n <tr fd-table-row>\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n >{{ 'All' | bbbTranslate }}</fd-checkbox\n >\n </th>\n </tr>\n </thead>\n </table>\n }\n </fd-layout-panel-body>\n</fd-layout-panel>\n<bsu-card-view-content\n [moDataList]=\"moDataList\"\n [groupby]=\"groupby\"\n [setting]=\"cardSetting\"\n [openOnClick]=\"openOnClick\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [formSetting]=\"formSetting\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n (action)=\"onAction($event)\"\n></bsu-card-view-content>\n", styles: [":host{display:block;background-color:var(--sapBackgroundColor, #f7f7f7)}fd-layout-panel{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i3$1.TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "directive", type: i3$1.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$1.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$1.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "key"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5136
5136
|
}
|
|
5137
5137
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiCardViewComponent, decorators: [{
|
|
5138
5138
|
type: Component,
|
|
5139
|
-
args: [{ selector: 'bsu-ui-card-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-layout-panel>\n <fd-layout-panel-body [bleed]=\"true\">\n @if (isCheckList) {\n <table fd-table>\n <thead fd-table-header>\n <tr fd-table-row>\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n >{{ 'All' | bbbTranslate }}</fd-checkbox\n >\n </th>\n </tr>\n </thead>\n </table>\n }\n </fd-layout-panel-body>\n</fd-layout-panel>\n<bsu-card-view-content\n [moDataList]=\"moDataList\"\n [groupby]=\"groupby\"\n [setting]=\"cardSetting\"\n [openOnClick]=\"openOnClick\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [formSetting]=\"formSetting\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n (action)=\"onAction($event)\"\n></bsu-card-view-content>\n", styles: ["fd-layout-panel{box-shadow:none}\n"] }]
|
|
5139
|
+
args: [{ selector: 'bsu-ui-card-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-layout-panel>\n <fd-layout-panel-body [bleed]=\"true\">\n @if (isCheckList) {\n <table fd-table>\n <thead fd-table-header>\n <tr fd-table-row>\n <th fd-table-cell>\n <fd-checkbox\n name=\"allCheckbox\"\n [ngModel]=\"allChecked\"\n (ngModelChange)=\"onAllCheckbox($event)\"\n >{{ 'All' | bbbTranslate }}</fd-checkbox\n >\n </th>\n </tr>\n </thead>\n </table>\n }\n </fd-layout-panel-body>\n</fd-layout-panel>\n<bsu-card-view-content\n [moDataList]=\"moDataList\"\n [groupby]=\"groupby\"\n [setting]=\"cardSetting\"\n [openOnClick]=\"openOnClick\"\n [inlineEditMode]=\"inlineEditMode\"\n [allowInlineEdit]=\"allowInlineEdit\"\n [rtl]=\"rtl\"\n [deviceName]=\"deviceName\"\n [deviceSize]=\"deviceSize\"\n [allColumns]=\"allColumns\"\n [contextMenuItems]=\"contextMenuItems\"\n [canView]=\"canView\"\n [formSetting]=\"formSetting\"\n [conditionalFormats]=\"conditionalFormats\"\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n [navigationArrow]=\"navigationArrow\"\n [isCheckList]=\"isCheckList\"\n (rowCheck)=\"onRowCheck($event)\"\n (rowClick)=\"onRowClick($event)\"\n (ulvCommand)=\"onUlvCommand($event)\"\n (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n (action)=\"onAction($event)\"\n></bsu-card-view-content>\n", styles: [":host{display:block;background-color:var(--sapBackgroundColor, #f7f7f7)}fd-layout-panel{box-shadow:none}\n"] }]
|
|
5140
5140
|
}] });
|
|
5141
5141
|
|
|
5142
5142
|
class ListItemComponent extends BaseViewItemPropsComponent {
|
|
@@ -6200,7 +6200,7 @@ class ReportNavigatorComponent extends BaseComponent {
|
|
|
6200
6200
|
.pipe(takeUntil(this._onDestroy$), tap(() => this._setLoading(true)), map((params) => ({
|
|
6201
6201
|
Id: params.id.split('__')[0],
|
|
6202
6202
|
ReportId: params.id.split('__').length > 2 ? params.id.split('__')[2] : ''
|
|
6203
|
-
})), switchMap((navItem) => this._portalService.renderUlvMainUi(navItem, this.containerRef, this._injector, true)), tap((ulv) => this._setActiveReport(ulv)))
|
|
6203
|
+
})), tap((c) => this.containerRef.clear()), switchMap((navItem) => this._portalService.renderUlvMainUi(navItem, this.containerRef, this._injector, true)), tap((ulv) => this._setActiveReport(ulv)))
|
|
6204
6204
|
.subscribe(() => {
|
|
6205
6205
|
this._setLoading(false);
|
|
6206
6206
|
});
|
|
@@ -6453,11 +6453,11 @@ class BarsaUlvMainComponent extends BaseComponent {
|
|
|
6453
6453
|
this.selectSearchPanelSettings.emit(selectedSearchPanelSettingsId);
|
|
6454
6454
|
}
|
|
6455
6455
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaUlvMainComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6456
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: { viewerControl: "viewerControl", loading: "loading", viewerLoading: "viewerLoading", isReportPage: "isReportPage", deviceSize: "deviceSize", title: "title", searchPanelUi: "searchPanelUi", breadCrumbs: "breadCrumbs", allSearchPanelSettings: "allSearchPanelSettings", isAnonymous: "isAnonymous", canSaveGridSetting: "canSaveGridSetting", rtl: "rtl", selectedSearchPanelSettings: "selectedSearchPanelSettings", searchPanelMoChanged: "searchPanelMoChanged", selectedSearchPanelSettingsId: "selectedSearchPanelSettingsId", hideSearchPanel: "hideSearchPanel", pagingSetting: "pagingSetting", contentDensity: "contentDensity", context: "context", isMobile: "isMobile", standalone: "standalone", landscape: "landscape", layoutInfo: "layoutInfo" }, outputs: { closeEvent: "closeEvent", searchPanelMoChange: "searchPanelMoChange", openManageFilters: "openManageFilters", collapsedChange: "collapsedChange", hideSearchPanelClick: "hideSearchPanelClick", filterSave: "filterSave", filterSaveAs: "filterSaveAs", pageChange: "pageChange", showFilterFieldsSetting: "showFilterFieldsSetting", manageFilters: "manageFilters", clearSearch: "clearSearch", search: "search", selectSearchPanelSettings: "selectSearchPanelSettings" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["searchpanelDialog"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container\n *ngTemplateOutlet=\"\n isReportPage ? reportPageTemplate : reportTemplate;\n context: {\n $implicit: viewerControl,\n tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\n }\n \"\n>\n</ng-container>\n@if (loading) {\n<bsu-mask size=\"m\"></bsu-mask>\n}\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\n <fd-dynamic-page\n formClose\n mobile\n [attr.isMobile]=\"isMobile ? true : null\"\n [isMobile]=\"isMobile\"\n [size]=\"deviceSize | dynamicPageSize\"\n [attr.tabMode]=\"tabMode\"\n [autoResponsive]=\"false\"\n [class.notitle]=\"\n (!title && !searchPanelUi && !hideSearchPanel && !sideContentMode) ||\n (sideContentMode && !hideSearchPanel && !title)\n \"\n >\n <fd-dynamic-page-header\n [title]=\"\n (title | bbbTranslate)\n ? (title | bbbTranslate)\n : isMobile && breadCrumbs.length\n ? breadCrumbs[breadCrumbs.length - 1].label\n : ''\n \"\n class=\"p-b0\"\n >\n @if (!isMobile) {\n <fd-breadcrumb>\n @if (breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb;\n let i = $index; let last = $last) { @if (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 }\n <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\n\n <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\n <fd-toolbar\n class=\"global-actions\"\n fdType=\"transparent\"\n [clearBorder]=\"true\"\n [shouldOverflow]=\"deviceSize === 's'\"\n >\n @if (isAnonymous === false && canSaveGridSetting) {\n <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\n <fd-popover-control>\n <div style=\"display: flex; align-items: center\">\n <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\n {{\n selectedSearchPanelSettings?.IsStandard\n ? ''\n : selectedSearchPanelSettings?.Title\n }}\n @if (searchPanelMoChanged) {\n <strong>*</strong>\n }\n </h3>\n <button\n fd-button\n glyph=\"slim-arrow-down\"\n fdType=\"transparent\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </div>\n </fd-popover-control>\n <fd-popover-body mobile>\n <div fd-popover-body-header>\n <div fd-bar [fdCozy]>\n <div fd-bar-left>\n <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\n </div>\n </div>\n </div>\n <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\n @for (option of allSearchPanelSettings; track option) {\n <li\n fd-list-item\n [selected]=\"option.Id === selectedSearchPanelSettingsId\"\n (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\n >\n <span fd-list-title>{{ option.Title }}</span>\n </li>\n }\n </ul>\n <div fd-popover-body-footer>\n <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\n @if (selectedSearchPanelSettings) {\n <div fd-bar-right>\n @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'Save' | bbbTranslate\"\n fdType=\"emphasized\"\n (click)=\"onFilterSave(popover)\"\n >\n </fd-button-bar>\n } @if (searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'SaveAs' | bbbTranslate\"\n [fdType]=\"\n selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\n \"\n (click)=\"onFilterSaveAs(popover)\"\n >\n </fd-button-bar>\n }\n <fd-button-bar\n [label]=\"'Manage' | bbbTranslate\"\n fdkInitialFocus\n fdType=\"transparent\"\n (click)=\"onManageFilters(popover)\"\n >\n </fd-button-bar>\n </div>\n }\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n } @if (deviceSize !== 's') {\n <fd-toolbar-spacer></fd-toolbar-spacer>\n } @if (isMobile) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n (click)=\"onShowSearchpanelDialog()\"\n [glyph]=\"'filter'\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Filters' | bbbTranslate\"\n (click)=\"onShowFilterFieldsSetting()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Clear' | bbbTranslate\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n (click)=\"onHideSearchPanelClick()\"\n fdOverflowPriority=\"low\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n }\n </fd-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"closeEvent.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n </fd-toolbar>\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\n @if (!isMobile) {\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-dynamic-page-subheader>\n } @if (!tabMode) {\n\n <fd-dynamic-page-content>\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { noRenderPageing: true }\n \"\n ></ng-container>\n </fd-dynamic-page-content>\n\n } @if (pagingSetting?.TotalPages) {\n <fd-dynamic-page-footer>\n <!-- page footer content goes here -->\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-middle>\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n </div>\n </div>\n </fd-dynamic-page-footer>\n }\n </fd-dynamic-page>\n @if (tabMode) {\n <ng-container\n *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\n ></ng-container>\n }\n</ng-template>\n<ng-template #reportTemplate>\n @if (loading) {\n <bsu-mask size=\"s\"></bsu-mask>\n } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\n }\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { simpleReport: 'simpleReport' }\n \"\n >\n </ng-container>\n</ng-template>\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\n <fd-dynamic-side-content\n [class.rtl]=\"rtl\"\n [size]=\"deviceSize | sapSize\"\n fillEmptySpace\n [disable]=\"true\"\n [setMinHeight]=\"true\"\n >\n <fd-dynamic-side-content-side>\n <ng-container\n *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\n ></ng-container>\n </fd-dynamic-side-content-side>\n <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\n <ng-container *ngTemplateOutlet=\"viewerTemplate\"></ng-container>\n </fd-dynamic-side-content-main>\n </fd-dynamic-side-content>\n</ng-template>\n<ng-template\n #searchpanelTemplate\n let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\n let-hideButtons=\"hideButtons\"\n>\n @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n [hideButtons]=\"hideButtons\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n } } @else {\n <fd-card class=\"searchpanel-card\">\n <fd-card-header>\n <h2 fd-card-title>\n <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\n </h2>\n </fd-card-header>\n <fd-card-content style=\"flex-grow: 0\">\n @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [hideButtons]=\"true\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-card-content>\n <fd-card-footer style=\"border-bottom: none\">\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"transparent\"\n [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </fd-card-footer>\n </fd-card>\n }\n</ng-template>\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\n <div\n class=\"viewer-container\"\n fillEmptySpace\n [disable]=\"isReportPage || !fillPage\"\n [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\n [style.height]=\"viewerLoading ? '100%' : 'auto'\"\n [style.min-height]=\"isReportPage ? '100%' : null\"\n [style.position]=\"viewerLoading ? 'relative' : null\"\n >\n @if (viewerLoading) {\n <bsu-mask size=\"m\"></bsu-mask>\n } @if (viewerControl) {\n <ng-container\n [renderUlvViewer]=\"viewerControl\"\n [layoutInfo]=\"layoutInfo\"\n [isReportPage]=\"isReportPage\"\n ></ng-container>\n }\n </div>\n @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing) {\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n }\n</ng-template>\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n <fd-dialog-header>\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\n <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n </fd-dialog-header>\n <fd-dialog-body>\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n </fd-dialog-body>\n\n <fd-dialog-footer>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdkInitialFocus\n fdType=\"emphasized\"\n (click)=\"dialog.dismiss(); onSearch()\"\n [label]=\"'Search' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdType=\"transparent\"\n (click)=\"dialog.dismiss('Close button')\"\n [label]=\"'Cancel' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}fd-dynamic-page:not(.mobile).notitle ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{background-color:var(--sapBaseColor);min-height:100%;height:auto}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.fd-dynamic-page,fd-dynamic-page-content{padding:1rem 0!important}.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RenderUlvViewerDirective, selector: "[renderUlvViewer]", inputs: ["mask", "isReportPage", "layoutInfo", "renderUlvViewer"] }, { kind: "directive", type: i2.RenderUlvPaginDirective, selector: "[renderUlvPaging]", inputs: ["mask", "pagingSetting", "renderUlvPaging"], outputs: ["pageChange"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$4.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$4.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i5$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$2.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { 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: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i5$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: SearchPanelComponent, selector: "bsu-search-panel", inputs: ["searchPanelUi", "hideButtons", "isSearcPanelInSideContent"], outputs: ["moChanged"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "pipe", type: i1$3.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }, { kind: "pipe", type: SapSizePipe, name: "sapSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6456
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: { viewerControl: "viewerControl", loading: "loading", viewerLoading: "viewerLoading", isReportPage: "isReportPage", deviceSize: "deviceSize", title: "title", searchPanelUi: "searchPanelUi", breadCrumbs: "breadCrumbs", allSearchPanelSettings: "allSearchPanelSettings", isAnonymous: "isAnonymous", canSaveGridSetting: "canSaveGridSetting", rtl: "rtl", selectedSearchPanelSettings: "selectedSearchPanelSettings", searchPanelMoChanged: "searchPanelMoChanged", selectedSearchPanelSettingsId: "selectedSearchPanelSettingsId", hideSearchPanel: "hideSearchPanel", pagingSetting: "pagingSetting", contentDensity: "contentDensity", context: "context", isMobile: "isMobile", standalone: "standalone", landscape: "landscape", layoutInfo: "layoutInfo" }, outputs: { closeEvent: "closeEvent", searchPanelMoChange: "searchPanelMoChange", openManageFilters: "openManageFilters", collapsedChange: "collapsedChange", hideSearchPanelClick: "hideSearchPanelClick", filterSave: "filterSave", filterSaveAs: "filterSaveAs", pageChange: "pageChange", showFilterFieldsSetting: "showFilterFieldsSetting", manageFilters: "manageFilters", clearSearch: "clearSearch", search: "search", selectSearchPanelSettings: "selectSearchPanelSettings" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["searchpanelDialog"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container\n *ngTemplateOutlet=\"\n isReportPage ? reportPageTemplate : reportTemplate;\n context: {\n $implicit: viewerControl,\n tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\n }\n \"\n>\n</ng-container>\n@if (loading) {\n<bsu-mask size=\"m\"></bsu-mask>\n}\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\n <fd-dynamic-page\n formClose\n mobile\n [attr.isMobile]=\"isMobile ? true : null\"\n [isMobile]=\"isMobile\"\n [size]=\"deviceSize | dynamicPageSize\"\n [attr.tabMode]=\"tabMode\"\n [autoResponsive]=\"false\"\n [class.notitle]=\"\n (!title && !searchPanelUi && !hideSearchPanel && !sideContentMode) ||\n (sideContentMode && !hideSearchPanel && !title)\n \"\n >\n <fd-dynamic-page-header\n [title]=\"\n (title | bbbTranslate)\n ? (title | bbbTranslate)\n : isMobile && breadCrumbs.length\n ? breadCrumbs[breadCrumbs.length - 1].label\n : ''\n \"\n class=\"p-b0\"\n >\n @if (!isMobile) {\n <fd-breadcrumb>\n @if (breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb;\n let i = $index; let last = $last) { @if (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 }\n <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\n\n <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\n <fd-toolbar\n class=\"global-actions\"\n fdType=\"transparent\"\n [clearBorder]=\"true\"\n [shouldOverflow]=\"deviceSize === 's'\"\n >\n @if (isAnonymous === false && canSaveGridSetting) {\n <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\n <fd-popover-control>\n <div style=\"display: flex; align-items: center\">\n <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\n {{\n selectedSearchPanelSettings?.IsStandard\n ? ''\n : selectedSearchPanelSettings?.Title\n }}\n @if (searchPanelMoChanged) {\n <strong>*</strong>\n }\n </h3>\n <button\n fd-button\n glyph=\"slim-arrow-down\"\n fdType=\"transparent\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </div>\n </fd-popover-control>\n <fd-popover-body mobile>\n <div fd-popover-body-header>\n <div fd-bar [fdCozy]>\n <div fd-bar-left>\n <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\n </div>\n </div>\n </div>\n <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\n @for (option of allSearchPanelSettings; track option) {\n <li\n fd-list-item\n [selected]=\"option.Id === selectedSearchPanelSettingsId\"\n (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\n >\n <span fd-list-title>{{ option.Title }}</span>\n </li>\n }\n </ul>\n <div fd-popover-body-footer>\n <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\n @if (selectedSearchPanelSettings) {\n <div fd-bar-right>\n @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'Save' | bbbTranslate\"\n fdType=\"emphasized\"\n (click)=\"onFilterSave(popover)\"\n >\n </fd-button-bar>\n } @if (searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'SaveAs' | bbbTranslate\"\n [fdType]=\"\n selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\n \"\n (click)=\"onFilterSaveAs(popover)\"\n >\n </fd-button-bar>\n }\n <fd-button-bar\n [label]=\"'Manage' | bbbTranslate\"\n fdkInitialFocus\n fdType=\"transparent\"\n (click)=\"onManageFilters(popover)\"\n >\n </fd-button-bar>\n </div>\n }\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n } @if (deviceSize !== 's') {\n <fd-toolbar-spacer></fd-toolbar-spacer>\n } @if (isMobile) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n (click)=\"onShowSearchpanelDialog()\"\n [glyph]=\"'filter'\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Filters' | bbbTranslate\"\n (click)=\"onShowFilterFieldsSetting()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Clear' | bbbTranslate\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n (click)=\"onHideSearchPanelClick()\"\n fdOverflowPriority=\"low\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n }\n </fd-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"closeEvent.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n </fd-toolbar>\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\n @if (!isMobile) {\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-dynamic-page-subheader>\n } @if (!tabMode) {\n\n <fd-dynamic-page-content>\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { noRenderPageing: true }\n \"\n ></ng-container>\n </fd-dynamic-page-content>\n\n } @if (pagingSetting?.TotalPages) {\n <fd-dynamic-page-footer>\n <!-- page footer content goes here -->\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-middle>\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n </div>\n </div>\n </fd-dynamic-page-footer>\n }\n </fd-dynamic-page>\n @if (tabMode) {\n <ng-container\n *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\n ></ng-container>\n }\n</ng-template>\n<ng-template #reportTemplate>\n @if (loading) {\n <bsu-mask size=\"s\"></bsu-mask>\n } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\n }\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { simpleReport: 'simpleReport' }\n \"\n >\n </ng-container>\n</ng-template>\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\n <fd-dynamic-side-content\n [class.rtl]=\"rtl\"\n [size]=\"deviceSize | sapSize\"\n fillEmptySpace\n [disable]=\"true\"\n [setMinHeight]=\"true\"\n >\n <fd-dynamic-side-content-side>\n <ng-container\n *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\n ></ng-container>\n </fd-dynamic-side-content-side>\n <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\n <ng-container\n *ngTemplateOutlet=\"viewerTemplate; context: { noRenderPageing: isReportPage ? true : false }\"\n ></ng-container>\n </fd-dynamic-side-content-main>\n </fd-dynamic-side-content>\n</ng-template>\n<ng-template\n #searchpanelTemplate\n let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\n let-hideButtons=\"hideButtons\"\n>\n @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n [hideButtons]=\"hideButtons\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n } } @else {\n <fd-card class=\"searchpanel-card\">\n <fd-card-header>\n <h2 fd-card-title>\n <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\n </h2>\n </fd-card-header>\n <fd-card-content style=\"flex-grow: 0\">\n @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [hideButtons]=\"true\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-card-content>\n <fd-card-footer style=\"border-bottom: none\">\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"transparent\"\n [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </fd-card-footer>\n </fd-card>\n }\n</ng-template>\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\n <div\n class=\"viewer-container\"\n fillEmptySpace\n [disable]=\"isReportPage || !fillPage\"\n [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\n [style.height]=\"viewerLoading ? '100%' : 'auto'\"\n [style.min-height]=\"isReportPage ? '100%' : null\"\n [style.position]=\"viewerLoading ? 'relative' : null\"\n >\n @if (viewerLoading) {\n <bsu-mask size=\"m\"></bsu-mask>\n } @if (viewerControl) {\n <ng-container\n [renderUlvViewer]=\"viewerControl\"\n [layoutInfo]=\"layoutInfo\"\n [isReportPage]=\"isReportPage\"\n ></ng-container>\n }\n </div>\n @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing) {\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n }\n</ng-template>\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n <fd-dialog-header>\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\n <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n </fd-dialog-header>\n <fd-dialog-body>\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n </fd-dialog-body>\n\n <fd-dialog-footer>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdkInitialFocus\n fdType=\"emphasized\"\n (click)=\"dialog.dismiss(); onSearch()\"\n [label]=\"'Search' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdType=\"transparent\"\n (click)=\"dialog.dismiss('Close button')\"\n [label]=\"'Cancel' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}fd-dynamic-page:not(.mobile).notitle ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{background-color:var(--sapBackgroundColor, #f7f7f7);min-height:100%;height:auto}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.fd-dynamic-page,fd-dynamic-page-content{padding:1rem 0!important}.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RenderUlvViewerDirective, selector: "[renderUlvViewer]", inputs: ["mask", "isReportPage", "layoutInfo", "renderUlvViewer"] }, { kind: "directive", type: i2.RenderUlvPaginDirective, selector: "[renderUlvPaging]", inputs: ["mask", "pagingSetting", "renderUlvPaging"], outputs: ["pageChange"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i4.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$4.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$4.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "directive", type: i3$4.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i5$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i5$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i9$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$2.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { 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: "component", type: i4$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i4$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i4$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i4$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i4$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i5$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: SearchPanelComponent, selector: "bsu-search-panel", inputs: ["searchPanelUi", "hideButtons", "isSearcPanelInSideContent"], outputs: ["moChanged"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "pipe", type: i1$3.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }, { kind: "pipe", type: SapSizePipe, name: "sapSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
6457
6457
|
}
|
|
6458
6458
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaUlvMainComponent, decorators: [{
|
|
6459
6459
|
type: Component,
|
|
6460
|
-
args: [{ selector: 'bsu-barsa-ulv-main', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container\n *ngTemplateOutlet=\"\n isReportPage ? reportPageTemplate : reportTemplate;\n context: {\n $implicit: viewerControl,\n tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\n }\n \"\n>\n</ng-container>\n@if (loading) {\n<bsu-mask size=\"m\"></bsu-mask>\n}\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\n <fd-dynamic-page\n formClose\n mobile\n [attr.isMobile]=\"isMobile ? true : null\"\n [isMobile]=\"isMobile\"\n [size]=\"deviceSize | dynamicPageSize\"\n [attr.tabMode]=\"tabMode\"\n [autoResponsive]=\"false\"\n [class.notitle]=\"\n (!title && !searchPanelUi && !hideSearchPanel && !sideContentMode) ||\n (sideContentMode && !hideSearchPanel && !title)\n \"\n >\n <fd-dynamic-page-header\n [title]=\"\n (title | bbbTranslate)\n ? (title | bbbTranslate)\n : isMobile && breadCrumbs.length\n ? breadCrumbs[breadCrumbs.length - 1].label\n : ''\n \"\n class=\"p-b0\"\n >\n @if (!isMobile) {\n <fd-breadcrumb>\n @if (breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb;\n let i = $index; let last = $last) { @if (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 }\n <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\n\n <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\n <fd-toolbar\n class=\"global-actions\"\n fdType=\"transparent\"\n [clearBorder]=\"true\"\n [shouldOverflow]=\"deviceSize === 's'\"\n >\n @if (isAnonymous === false && canSaveGridSetting) {\n <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\n <fd-popover-control>\n <div style=\"display: flex; align-items: center\">\n <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\n {{\n selectedSearchPanelSettings?.IsStandard\n ? ''\n : selectedSearchPanelSettings?.Title\n }}\n @if (searchPanelMoChanged) {\n <strong>*</strong>\n }\n </h3>\n <button\n fd-button\n glyph=\"slim-arrow-down\"\n fdType=\"transparent\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </div>\n </fd-popover-control>\n <fd-popover-body mobile>\n <div fd-popover-body-header>\n <div fd-bar [fdCozy]>\n <div fd-bar-left>\n <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\n </div>\n </div>\n </div>\n <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\n @for (option of allSearchPanelSettings; track option) {\n <li\n fd-list-item\n [selected]=\"option.Id === selectedSearchPanelSettingsId\"\n (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\n >\n <span fd-list-title>{{ option.Title }}</span>\n </li>\n }\n </ul>\n <div fd-popover-body-footer>\n <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\n @if (selectedSearchPanelSettings) {\n <div fd-bar-right>\n @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'Save' | bbbTranslate\"\n fdType=\"emphasized\"\n (click)=\"onFilterSave(popover)\"\n >\n </fd-button-bar>\n } @if (searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'SaveAs' | bbbTranslate\"\n [fdType]=\"\n selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\n \"\n (click)=\"onFilterSaveAs(popover)\"\n >\n </fd-button-bar>\n }\n <fd-button-bar\n [label]=\"'Manage' | bbbTranslate\"\n fdkInitialFocus\n fdType=\"transparent\"\n (click)=\"onManageFilters(popover)\"\n >\n </fd-button-bar>\n </div>\n }\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n } @if (deviceSize !== 's') {\n <fd-toolbar-spacer></fd-toolbar-spacer>\n } @if (isMobile) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n (click)=\"onShowSearchpanelDialog()\"\n [glyph]=\"'filter'\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Filters' | bbbTranslate\"\n (click)=\"onShowFilterFieldsSetting()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Clear' | bbbTranslate\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n (click)=\"onHideSearchPanelClick()\"\n fdOverflowPriority=\"low\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n }\n </fd-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"closeEvent.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n </fd-toolbar>\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\n @if (!isMobile) {\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-dynamic-page-subheader>\n } @if (!tabMode) {\n\n <fd-dynamic-page-content>\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { noRenderPageing: true }\n \"\n ></ng-container>\n </fd-dynamic-page-content>\n\n } @if (pagingSetting?.TotalPages) {\n <fd-dynamic-page-footer>\n <!-- page footer content goes here -->\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-middle>\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n </div>\n </div>\n </fd-dynamic-page-footer>\n }\n </fd-dynamic-page>\n @if (tabMode) {\n <ng-container\n *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\n ></ng-container>\n }\n</ng-template>\n<ng-template #reportTemplate>\n @if (loading) {\n <bsu-mask size=\"s\"></bsu-mask>\n } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\n }\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { simpleReport: 'simpleReport' }\n \"\n >\n </ng-container>\n</ng-template>\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\n <fd-dynamic-side-content\n [class.rtl]=\"rtl\"\n [size]=\"deviceSize | sapSize\"\n fillEmptySpace\n [disable]=\"true\"\n [setMinHeight]=\"true\"\n >\n <fd-dynamic-side-content-side>\n <ng-container\n *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\n ></ng-container>\n </fd-dynamic-side-content-side>\n <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\n <ng-container *ngTemplateOutlet=\"viewerTemplate\"></ng-container>\n </fd-dynamic-side-content-main>\n </fd-dynamic-side-content>\n</ng-template>\n<ng-template\n #searchpanelTemplate\n let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\n let-hideButtons=\"hideButtons\"\n>\n @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n [hideButtons]=\"hideButtons\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n } } @else {\n <fd-card class=\"searchpanel-card\">\n <fd-card-header>\n <h2 fd-card-title>\n <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\n </h2>\n </fd-card-header>\n <fd-card-content style=\"flex-grow: 0\">\n @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [hideButtons]=\"true\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-card-content>\n <fd-card-footer style=\"border-bottom: none\">\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"transparent\"\n [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </fd-card-footer>\n </fd-card>\n }\n</ng-template>\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\n <div\n class=\"viewer-container\"\n fillEmptySpace\n [disable]=\"isReportPage || !fillPage\"\n [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\n [style.height]=\"viewerLoading ? '100%' : 'auto'\"\n [style.min-height]=\"isReportPage ? '100%' : null\"\n [style.position]=\"viewerLoading ? 'relative' : null\"\n >\n @if (viewerLoading) {\n <bsu-mask size=\"m\"></bsu-mask>\n } @if (viewerControl) {\n <ng-container\n [renderUlvViewer]=\"viewerControl\"\n [layoutInfo]=\"layoutInfo\"\n [isReportPage]=\"isReportPage\"\n ></ng-container>\n }\n </div>\n @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing) {\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n }\n</ng-template>\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n <fd-dialog-header>\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\n <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n </fd-dialog-header>\n <fd-dialog-body>\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n </fd-dialog-body>\n\n <fd-dialog-footer>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdkInitialFocus\n fdType=\"emphasized\"\n (click)=\"dialog.dismiss(); onSearch()\"\n [label]=\"'Search' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdType=\"transparent\"\n (click)=\"dialog.dismiss('Close button')\"\n [label]=\"'Cancel' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}fd-dynamic-page:not(.mobile).notitle ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{background-color:var(--sapBaseColor);min-height:100%;height:auto}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.fd-dynamic-page,fd-dynamic-page-content{padding:1rem 0!important}.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"] }]
|
|
6460
|
+
args: [{ selector: 'bsu-barsa-ulv-main', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container\n *ngTemplateOutlet=\"\n isReportPage ? reportPageTemplate : reportTemplate;\n context: {\n $implicit: viewerControl,\n tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\n }\n \"\n>\n</ng-container>\n@if (loading) {\n<bsu-mask size=\"m\"></bsu-mask>\n}\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\n <fd-dynamic-page\n formClose\n mobile\n [attr.isMobile]=\"isMobile ? true : null\"\n [isMobile]=\"isMobile\"\n [size]=\"deviceSize | dynamicPageSize\"\n [attr.tabMode]=\"tabMode\"\n [autoResponsive]=\"false\"\n [class.notitle]=\"\n (!title && !searchPanelUi && !hideSearchPanel && !sideContentMode) ||\n (sideContentMode && !hideSearchPanel && !title)\n \"\n >\n <fd-dynamic-page-header\n [title]=\"\n (title | bbbTranslate)\n ? (title | bbbTranslate)\n : isMobile && breadCrumbs.length\n ? breadCrumbs[breadCrumbs.length - 1].label\n : ''\n \"\n class=\"p-b0\"\n >\n @if (!isMobile) {\n <fd-breadcrumb>\n @if (breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb;\n let i = $index; let last = $last) { @if (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 }\n <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\n\n <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\n <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n <!-- added this because in mobile landscape toolbar disapper -->\n @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\n <fd-toolbar\n class=\"global-actions\"\n fdType=\"transparent\"\n [clearBorder]=\"true\"\n [shouldOverflow]=\"deviceSize === 's'\"\n >\n @if (isAnonymous === false && canSaveGridSetting) {\n <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\n <fd-popover-control>\n <div style=\"display: flex; align-items: center\">\n <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\n {{\n selectedSearchPanelSettings?.IsStandard\n ? ''\n : selectedSearchPanelSettings?.Title\n }}\n @if (searchPanelMoChanged) {\n <strong>*</strong>\n }\n </h3>\n <button\n fd-button\n glyph=\"slim-arrow-down\"\n fdType=\"transparent\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </div>\n </fd-popover-control>\n <fd-popover-body mobile>\n <div fd-popover-body-header>\n <div fd-bar [fdCozy]>\n <div fd-bar-left>\n <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\n </div>\n </div>\n </div>\n <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\n @for (option of allSearchPanelSettings; track option) {\n <li\n fd-list-item\n [selected]=\"option.Id === selectedSearchPanelSettingsId\"\n (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\n >\n <span fd-list-title>{{ option.Title }}</span>\n </li>\n }\n </ul>\n <div fd-popover-body-footer>\n <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\n @if (selectedSearchPanelSettings) {\n <div fd-bar-right>\n @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'Save' | bbbTranslate\"\n fdType=\"emphasized\"\n (click)=\"onFilterSave(popover)\"\n >\n </fd-button-bar>\n } @if (searchPanelMoChanged) {\n <fd-button-bar\n [label]=\"'SaveAs' | bbbTranslate\"\n [fdType]=\"\n selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\n \"\n (click)=\"onFilterSaveAs(popover)\"\n >\n </fd-button-bar>\n }\n <fd-button-bar\n [label]=\"'Manage' | bbbTranslate\"\n fdkInitialFocus\n fdType=\"transparent\"\n (click)=\"onManageFilters(popover)\"\n >\n </fd-button-bar>\n </div>\n }\n </div>\n </div>\n </fd-popover-body>\n </fd-popover>\n } @if (deviceSize !== 's') {\n <fd-toolbar-spacer></fd-toolbar-spacer>\n } @if (isMobile) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n (click)=\"onShowSearchpanelDialog()\"\n [glyph]=\"'filter'\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdOverflowPriority=\"never\"\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Filters' | bbbTranslate\"\n (click)=\"onShowFilterFieldsSetting()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n fdOverflowPriority=\"low\"\n [label]=\"'Clear' | bbbTranslate\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n } @if (!isMobile && !sideContentMode) {\n <button\n fd-button\n fd-toolbar-item\n fdType=\"transparent\"\n [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n (click)=\"onHideSearchPanelClick()\"\n fdOverflowPriority=\"low\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n }\n </fd-toolbar>\n }\n </fd-dynamic-page-global-actions>\n <fd-dynamic-page-layout-actions>\n <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"closeEvent.emit()\" title=\"Close\">\n <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n </button>\n </fd-toolbar>\n </fd-dynamic-page-layout-actions>\n </fd-dynamic-page-header>\n @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\n @if (!isMobile) {\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-dynamic-page-subheader>\n } @if (!tabMode) {\n\n <fd-dynamic-page-content>\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { noRenderPageing: true }\n \"\n ></ng-container>\n </fd-dynamic-page-content>\n\n } @if (pagingSetting?.TotalPages) {\n <fd-dynamic-page-footer>\n <!-- page footer content goes here -->\n <div fd-bar [barDesign]=\"'footer'\">\n <div fd-bar-middle>\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n </div>\n </div>\n </fd-dynamic-page-footer>\n }\n </fd-dynamic-page>\n @if (tabMode) {\n <ng-container\n *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\n ></ng-container>\n }\n</ng-template>\n<ng-template #reportTemplate>\n @if (loading) {\n <bsu-mask size=\"s\"></bsu-mask>\n } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\n <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\n }\n <ng-container\n *ngTemplateOutlet=\"\n sideContentMode ? sideContentTemplate : viewerTemplate;\n context: { simpleReport: 'simpleReport' }\n \"\n >\n </ng-container>\n</ng-template>\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\n <fd-dynamic-side-content\n [class.rtl]=\"rtl\"\n [size]=\"deviceSize | sapSize\"\n fillEmptySpace\n [disable]=\"true\"\n [setMinHeight]=\"true\"\n >\n <fd-dynamic-side-content-side>\n <ng-container\n *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\n ></ng-container>\n </fd-dynamic-side-content-side>\n <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\n <ng-container\n *ngTemplateOutlet=\"viewerTemplate; context: { noRenderPageing: isReportPage ? true : false }\"\n ></ng-container>\n </fd-dynamic-side-content-main>\n </fd-dynamic-side-content>\n</ng-template>\n<ng-template\n #searchpanelTemplate\n let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\n let-hideButtons=\"hideButtons\"\n>\n @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n [hideButtons]=\"hideButtons\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n } } @else {\n <fd-card class=\"searchpanel-card\">\n <fd-card-header>\n <h2 fd-card-title>\n <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\n </h2>\n </fd-card-header>\n <fd-card-content style=\"flex-grow: 0\">\n @if (!hideSearchPanel && searchPanelUi) {\n <bsu-search-panel\n [searchPanelUi]=\"searchPanelUi\"\n [hideButtons]=\"true\"\n [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n }\n </fd-card-content>\n <fd-card-footer style=\"border-bottom: none\">\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"emphasized\"\n [label]=\"'Search' | bbbTranslate\"\n (click)=\"onSearch()\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n <button\n *fdCardFooterActionItem\n fd-button\n fdType=\"transparent\"\n [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\n (click)=\"onClearSearch()\"\n [fdOverflowGroup]=\"1\"\n [fdContentDensity]=\"contentDensity\"\n ></button>\n </fd-card-footer>\n </fd-card>\n }\n</ng-template>\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\n <div\n class=\"viewer-container\"\n fillEmptySpace\n [disable]=\"isReportPage || !fillPage\"\n [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\n [style.height]=\"viewerLoading ? '100%' : 'auto'\"\n [style.min-height]=\"isReportPage ? '100%' : null\"\n [style.position]=\"viewerLoading ? 'relative' : null\"\n >\n @if (viewerLoading) {\n <bsu-mask size=\"m\"></bsu-mask>\n } @if (viewerControl) {\n <ng-container\n [renderUlvViewer]=\"viewerControl\"\n [layoutInfo]=\"layoutInfo\"\n [isReportPage]=\"isReportPage\"\n ></ng-container>\n }\n </div>\n @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing) {\n <ng-container\n [renderUlvPaging]=\"context\"\n [pagingSetting]=\"pagingSetting\"\n (pageChange)=\"onPageChange($event)\"\n ></ng-container>\n }\n</ng-template>\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n <fd-dialog-header>\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\n <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\n </fd-dialog-header>\n <fd-dialog-body>\n <bsu-search-panel\n [hideButtons]=\"true\"\n [searchPanelUi]=\"searchPanelUi\"\n (moChanged)=\"onSearchPanelMoChanged()\"\n ></bsu-search-panel>\n </fd-dialog-body>\n\n <fd-dialog-footer>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdkInitialFocus\n fdType=\"emphasized\"\n (click)=\"dialog.dismiss(); onSearch()\"\n [label]=\"'Search' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\n </fd-dialog-footer-button>\n <fd-dialog-footer-button>\n <button\n fd-button\n fdType=\"transparent\"\n (click)=\"dialog.dismiss('Close button')\"\n [label]=\"'Cancel' | bbbTranslate\"\n ></button>\n </fd-dialog-footer-button>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}fd-dynamic-page:not(.mobile).notitle ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{background-color:var(--sapBackgroundColor, #f7f7f7);min-height:100%;height:auto}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.fd-dynamic-page,fd-dynamic-page-content{padding:1rem 0!important}.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"] }]
|
|
6461
6461
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$1.DialogService }], propDecorators: { _dynamicPageComponent: [{
|
|
6462
6462
|
type: ViewChild,
|
|
6463
6463
|
args: [DynamicPageComponent]
|
|
@@ -12139,8 +12139,6 @@ class UiSimpleComboComponent extends FieldBaseComponent {
|
|
|
12139
12139
|
}
|
|
12140
12140
|
ngOnInit() {
|
|
12141
12141
|
super.ngOnInit();
|
|
12142
|
-
this.mobileConfig.approveButtonText = false;
|
|
12143
|
-
this.mobileConfig.cancelButtonText = false;
|
|
12144
12142
|
this.popupMode = this.parameters?.PopupMode;
|
|
12145
12143
|
if (this.value) {
|
|
12146
12144
|
this.tvalue = this.context.store.data[this.context.store.root].find((c) => c.id === this.value);
|
|
@@ -12163,11 +12161,11 @@ class UiSimpleComboComponent extends FieldBaseComponent {
|
|
|
12163
12161
|
this.fireContextEvent('select', this.value);
|
|
12164
12162
|
}
|
|
12165
12163
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiSimpleComboComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
12166
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiSimpleComboComponent, selector: "bsu-ui-simple-combo", inputs: { MinSize: "MinSize" }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\n<!-- <fd-select\n style=\"width: 100%\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [value]=\"value\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [mobileConfig]=\"mobileConfig\"\n (valueChange)=\"onValueChange($event)\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\n [readonly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n>\n @for (item of context.store.data[context.store.root]; track item) {\n <fd-option\n [value]=\"item.id\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [class.control-disabled]=\"item.IsEmpty\"\n [class.list-empty-item]=\"item.IsEmpty\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\n </fd-option>\n }\n</fd-select> -->\n<fd-combobox\n [inputId]=\"id\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [displayFn]=\"displayFn\"\n [(ngModel)]=\"tvalue\"\n [readOnly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n [fillOnSelect]=\"true\"\n [dropdownValues]=\"context.store.data[context.store.root]\"\n (itemClicked)=\"onItemClick($event)\"\n (change)=\"onChange($event)\"\n>\n <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\n <!-- Note that in this case you are responsible for highlighting. -->\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\n }\n </ng-container>\n</fd-combobox>\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n <fd-popover-control>\n <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\n @if (value && value !== '0') {\n <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\n }\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"combo-popupmode\">\n @for (item of context.store.data[context.store.root]; track item) {\n <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\n @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n }\n </button>\n }\n </fd-popover-body>\n</fd-popover>\n}\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\n }\n</ng-template>\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host ::ng-deep .fd-popover-custom{width:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$5.ComboboxComponent, selector: "fd-combobox", inputs: ["comboboxId", "inputId", "ariaLabel", "ariaLabelledBy", "required", "dropdownValues", "filterFn", "disabled", "placeholder", "isSearch", "glyph", "glyphFont", "showClearButton", "triggers", "closeOnOutsideClick", "openOnKeyboardEvent", "state", "itemTemplate", "groupFn", "maxHeight", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "directive", type: i4$5.ComboboxItemDirective, selector: "[fdComboboxItem]", inputs: ["fdComboboxItemUse"] }, { 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: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ComboRowImagePipe, name: "comboRowImg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
12164
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UiSimpleComboComponent, selector: "bsu-ui-simple-combo", inputs: { MinSize: "MinSize" }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\n<!-- <fd-select\n style=\"width: 100%\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [value]=\"value\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [mobileConfig]=\"mobileConfig\"\n (valueChange)=\"onValueChange($event)\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\n [readonly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n>\n @for (item of context.store.data[context.store.root]; track item) {\n <fd-option\n [value]=\"item.id\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [class.control-disabled]=\"item.IsEmpty\"\n [class.list-empty-item]=\"item.IsEmpty\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\n </fd-option>\n }\n</fd-select> -->\n<fd-combobox\n [inputId]=\"id\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [displayFn]=\"displayFn\"\n [mobileConfig]=\"mobileConfig\"\n [(ngModel)]=\"tvalue\"\n [readOnly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n [fillOnSelect]=\"true\"\n [dropdownValues]=\"context.store.data[context.store.root]\"\n (itemClicked)=\"onItemClick($event)\"\n (change)=\"onChange($event)\"\n>\n <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\n <!-- Note that in this case you are responsible for highlighting. -->\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\n }\n </ng-container>\n</fd-combobox>\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n <fd-popover-control>\n <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\n @if (value && value !== '0') {\n <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\n }\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"combo-popupmode\">\n @for (item of context.store.data[context.store.root]; track item) {\n <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\n @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n }\n </button>\n }\n </fd-popover-body>\n</fd-popover>\n}\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\n }\n</ng-template>\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host ::ng-deep .fd-popover-custom{width:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$5.ComboboxComponent, selector: "fd-combobox", inputs: ["comboboxId", "inputId", "ariaLabel", "ariaLabelledBy", "required", "dropdownValues", "filterFn", "disabled", "placeholder", "isSearch", "glyph", "glyphFont", "showClearButton", "triggers", "closeOnOutsideClick", "openOnKeyboardEvent", "state", "itemTemplate", "groupFn", "maxHeight", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "directive", type: i4$5.ComboboxItemDirective, selector: "[fdComboboxItem]", inputs: ["fdComboboxItemUse"] }, { 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: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ComboRowImagePipe, name: "comboRowImg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
12167
12165
|
}
|
|
12168
12166
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UiSimpleComboComponent, decorators: [{
|
|
12169
12167
|
type: Component,
|
|
12170
|
-
args: [{ selector: 'bsu-ui-simple-combo', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\n<!-- <fd-select\n style=\"width: 100%\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [value]=\"value\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [mobileConfig]=\"mobileConfig\"\n (valueChange)=\"onValueChange($event)\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\n [readonly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n>\n @for (item of context.store.data[context.store.root]; track item) {\n <fd-option\n [value]=\"item.id\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [class.control-disabled]=\"item.IsEmpty\"\n [class.list-empty-item]=\"item.IsEmpty\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\n </fd-option>\n }\n</fd-select> -->\n<fd-combobox\n [inputId]=\"id\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [displayFn]=\"displayFn\"\n [(ngModel)]=\"tvalue\"\n [readOnly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n [fillOnSelect]=\"true\"\n [dropdownValues]=\"context.store.data[context.store.root]\"\n (itemClicked)=\"onItemClick($event)\"\n (change)=\"onChange($event)\"\n>\n <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\n <!-- Note that in this case you are responsible for highlighting. -->\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\n }\n </ng-container>\n</fd-combobox>\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n <fd-popover-control>\n <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\n @if (value && value !== '0') {\n <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\n }\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"combo-popupmode\">\n @for (item of context.store.data[context.store.root]; track item) {\n <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\n @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n }\n </button>\n }\n </fd-popover-body>\n</fd-popover>\n}\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\n }\n</ng-template>\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host ::ng-deep .fd-popover-custom{width:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"] }]
|
|
12168
|
+
args: [{ selector: 'bsu-ui-simple-combo', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\n<!-- <fd-select\n style=\"width: 100%\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [value]=\"value\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [mobileConfig]=\"mobileConfig\"\n (valueChange)=\"onValueChange($event)\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\n [readonly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n>\n @for (item of context.store.data[context.store.root]; track item) {\n <fd-option\n [value]=\"item.id\"\n [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\n [class.control-disabled]=\"item.IsEmpty\"\n [class.list-empty-item]=\"item.IsEmpty\"\n >\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\n </fd-option>\n }\n</fd-select> -->\n<fd-combobox\n [inputId]=\"id\"\n [mobile]=\"(deviceSize$ | async) === 's'\"\n [placeholder]=\"'Select' | bbbTranslate\"\n [displayFn]=\"displayFn\"\n [mobileConfig]=\"mobileConfig\"\n [(ngModel)]=\"tvalue\"\n [readOnly]=\"(readonly$ | async) === true ? true : false\"\n [disabled]=\"(disable$ | async) === true ? true : false\"\n [fillOnSelect]=\"true\"\n [dropdownValues]=\"context.store.data[context.store.root]\"\n (itemClicked)=\"onItemClick($event)\"\n (change)=\"onChange($event)\"\n>\n <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\n <!-- Note that in this case you are responsible for highlighting. -->\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\n }\n </ng-container>\n</fd-combobox>\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\n <fd-popover-control>\n <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\n @if (value && value !== '0') {\n <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\n }\n </button>\n </fd-popover-control>\n <fd-popover-body class=\"combo-popupmode\">\n @for (item of context.store.data[context.store.root]; track item) {\n <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\n @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n }\n </button>\n }\n </fd-popover-body>\n</fd-popover>\n}\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\n @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\n <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\n } } @if (Setting.IconDisplayType !== 'Image') {\n {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\n }\n</ng-template>\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host ::ng-deep .fd-popover-custom{width:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"] }]
|
|
12171
12169
|
}], propDecorators: { fdComboRef: [{
|
|
12172
12170
|
type: ViewChild,
|
|
12173
12171
|
args: [ComboboxComponent]
|