barsa-sap-ui 2.3.79 → 2.3.81
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.
|
@@ -5573,11 +5573,11 @@ class CardItemComponent extends BaseViewItemPropsComponent {
|
|
|
5573
5573
|
}
|
|
5574
5574
|
}
|
|
5575
5575
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CardItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5576
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CardItemComponent, isStandalone: false, selector: "bsu-card-item", inputs: { setting: "setting", extraFooterComponent: "extraFooterComponent" }, 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\r\n [cardType]=\"setting.CardType$Caption\"\r\n [interactive]=\"true\"\r\n class=\"docs-flex-item-margin\"\r\n [class.openOnClick]=\"setting.openOnClick\"\r\n [class.hide-header-border]=\"setting.HideHeaderBorder\"\r\n [style.width]=\"cardWidth\"\r\n [style.min-width]=\"minWidth\"\r\n [style.max-width]=\"maxWidth\"\r\n [class.card-media]=\"cardMedia\"\r\n (click)=\"onRowCheck()\"\r\n (dblclick)=\"onRowClick()\"\r\n>\r\n @if(cardMedia){\r\n <fd-card-media>\r\n @if(isCardTypeBanner){\r\n <div\r\n fd-card-media-content-container\r\n [legendColor]=\"setting.CustomColor ? null : 13\"\r\n [style.background]=\"setting.CustomColor ? setting.CustomColor : null\"\r\n >\r\n <div fd-card-media-heading [level]=\"2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n <p fd-card-media-text>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </p>\r\n @if (contextMenuItems.length ) {\r\n\r\n <bsu-ulv-context-menu\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [styleIndex]=\"styleIndex\"\r\n [mo]=\"mo\"\r\n [index]=\"index\"\r\n (commandClick)=\"onUlvCommand()\"\r\n [deviceName]=\"deviceName\"\r\n [menuItems]=\"contextMenuItems\"\r\n [allColumns]=\"allColumns\"\r\n ></bsu-ulv-context-menu>\r\n }\r\n </div>\r\n }\r\n <div fd-card-media-image-container #container>\r\n <img\r\n fd-card-media-image\r\n [src]=\"\r\n setting.MediaField\r\n ? (mo[setting.MediaField.Name]?.FileId | picFieldSrc: 'ID':setting.MediaField.FieldDefId)\r\n : ''\r\n \"\r\n alt=\"pic not loaded\"\r\n [style.max-height.px]=\"isCardTypeBanner ? setting?.SliderHeight || 300 : null\"\r\n />\r\n </div>\r\n </fd-card-media>\r\n } @if(!isCardTypeBanner){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\r\n context: {\r\n $implicit: mo,\r\n index: this.index\r\n }\r\n \"\r\n ></ng-container>\r\n } @if (!noContent || contextMenuItems) {\r\n <fd-card-content ellipsify>\r\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: setting.ContentComponent,\r\n componentSettings: setting.ContentComponent?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n @for(item of setting.ContentComponents?.MoDataList;track item.Id){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n contentTemplateComponent;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: item.Component,\r\n componentSettings: item.Component?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n </div>\r\n </fd-card-content>\r\n } @if(detailsText || contextMenuEnabled && !isCardTypeBanner){\r\n <fd-card-footer\r\n [class.extra-footer]=\"extraFooterComponent?.Selector\"\r\n [class.hasDetailsAndContextMenu]=\"detailsText && contextMenuEnabled && contextMenuInFooter\"\r\n >\r\n @if(extraFooterComponent?.Selector){\r\n <bnrc-dynamic-item-component\r\n style=\"display: block; flex: 1\"\r\n [component]=\"extraFooterComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"extraFooterComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n } @if(detailsText){<button *fdCardFooterActionItem fd-button fdType=\"transparent\" [fdPopoverTrigger]=\"popover\">\r\n {{ detailsText }}\r\n </button>\r\n } @if(contextMenuInFooter){\r\n <div\r\n *fdCardFooterActionItem\r\n ulvContextMenu\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n <fd-popover #popover>\r\n @if (detailsColumns?.length) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsColumnsTemplate;\r\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\r\n \"\r\n ></ng-container>\r\n }\r\n </fd-popover>\r\n </fd-card-footer>\r\n }\r\n</fd-card>\r\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsFormItems;\r\n context: {\r\n $implicit: detailsColumns,\r\n mo: this.mo,\r\n inlineEditMode: this.inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n</ng-template>\r\n<ng-template\r\n #detailsFormItems\r\n let-detailsColumns\r\n let-mo=\"mo\"\r\n let-inlineEditMode=\"inlineEditMode\"\r\n let-layout94=\"layout94\"\r\n>\r\n <div class=\"form-items\" class=\"tw-p-2\">\r\n @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n <div\r\n fd-form-item\r\n class=\"!tw-flex-row\"\r\n [dynCommand]=\"column.$CustomComponent?.DynamicCommand\"\r\n [mo]=\"mo\"\r\n [enableCommand]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n bodyClick\r\n [class.tw-cursor-pointer]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n >\r\n @if(!column.$CustomComponent?.HideColumnCaption) {<label fd-form-label for=\"input-2\"\r\n >{{ column.Caption }}<span>:</span></label\r\n >}\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n mo: mo,\r\n index: columnIndex,\r\n inlineEditMode: inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n<ng-template\r\n #columnTemplate\r\n let-column\r\n let-mo=\"mo\"\r\n let-index=\"index\"\r\n let-layout94=\"layout94\"\r\n let-disableEllapsis=\"disableEllapsis\"\r\n let-fdTextMode=\"fdTextMode\"\r\n>\r\n @if (column) {\r\n <bsu-barsa-table-column\r\n [mo]=\"mo\"\r\n [allColumns]=\"allColumns\"\r\n [column]=\"column\"\r\n [isdirty]=\"false\"\r\n [value]=\"column | columnValue: mo\"\r\n [icon]=\"column | columnIcon: mo\"\r\n [customComponent]=\"column.$CustomComponent\"\r\n [column]=\"column\"\r\n [disableEllapsis]=\"disableEllapsis === false ? false : true\"\r\n [fdTextMode]=\"fdTextMode\"\r\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\r\n [inlineEditMode]=\"inlineEditMode\"\r\n [isChecked]=\"isChecked\"\r\n [index]=\"index\"\r\n [formSetting]=\"formSetting\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [layout94]=\"layout94\"\r\n (save)=\"onEditFormPanelSave(null)\"\r\n (cancel)=\"onEditFormPanelCancel(null)\"\r\n (tab)=\"onTabKeyDown($event, index)\"\r\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\r\n >\r\n </bsu-barsa-table-column>\r\n\r\n }\r\n</ng-template>\r\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\r\n @if (!noContent) {\r\n <fd-quick-view [id]=\"'id'\">\r\n <fd-quick-view-group>\r\n @for (column of setting.FieldListMapped; track column) {\r\n <fd-quick-view-group-item [class.rowDirection]=\"column?.$CustomComponent?.IsRowDirection\">\r\n @if (column) { @if(!column.$CustomComponent?.HideColumnCaption) {<fd-quick-view-group-item-label>\r\n {{ column.Caption | bbbTranslate }} </fd-quick-view-group-item-label\r\n >}\r\n <fd-quick-view-group-item-content>\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n } @if (setting.DescriptionField) {\r\n <fd-quick-view-group-item>\r\n <fd-quick-view-group-item-content>\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <fd-quick-view-group-item-label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </fd-quick-view-group-item-label>\r\n }\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n @if (setting.ActionFieldNameField) {\r\n <fd-quick-view-group-item-content\r\n class=\"action\"\r\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\r\n >\r\n <a fd-link>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.ActionFieldNameField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </a>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n }\r\n </fd-quick-view-group>\r\n </fd-quick-view>\r\n }\r\n</ng-template>\r\n<ng-template #contentTemplate let-mo let-index=\"index\">\r\n <fd-layout-grid>\r\n <div fdLayoutGridRow style=\"align-items: center\">\r\n <div [fdLayoutGridCol]=\"12\">\r\n @for (column of setting.FieldListMapped; track column) {\r\n <div style=\"display: flex\">\r\n <label fd-form-label [colon]=\"true\">{{ column.Caption | bbbTranslate }}</label>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n @if (setting.DescriptionField) {\r\n <div [fdLayoutGridCol]=\"12\">\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </label>\r\n }\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </fd-layout-grid>\r\n</ng-template>\r\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\r\n @if (visible) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"circle\"\r\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\r\n >\r\n </fd-avatar>\r\n }\r\n</ng-template>\r\n\r\n<ng-template\r\n #contentTemplateComponent\r\n let-mo\r\n let-index=\"index\"\r\n let-componentSettings=\"componentSettings\"\r\n let-component=\"component\"\r\n>\r\n <bnrc-dynamic-item-component\r\n [component]=\"component\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"componentSettings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n\r\n<ng-template #renderHeader let-mo let-index=\"index\">\r\n @if(!hideOpenIcon && (openOnClick || (canView && deviceName !== 'desktop'))){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderMobileCanView;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }@else{\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderDesktop;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n</ng-template>\r\n<ng-template #renderHeaderDesktop let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderDesktop\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if (setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n <span fd-card-counter status=\"positive\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.CounterField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </span>\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderMobileCanView let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderMobileCanView\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if ( setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }@else {\r\n <button\r\n fd-button\r\n fd-card-header-action\r\n class=\"view-btn\"\r\n stopPropagation\r\n (click)=\"onRowClick()\"\r\n [glyph]=\"navigationArrow\"\r\n fdType=\"transparent\"\r\n ></button>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\r\n <bnrc-dynamic-item-component\r\n [component]=\"setting.HeaderComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"setting.HeaderComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n [contextMenuItems]=\"contextMenuItems\"\r\n [canView]=\"canView\"\r\n [hideOpenIcon]=\"hideOpenIcon\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [navigationArrow]=\"navigationArrow\"\r\n [isCheckList]=\"isCheckList\"\r\n (events)=\"onDynamicComponentEvents($event)\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n", styles: ["fd-card.fd-card--banner>fd-card-media{border-radius:inherit}fd-card.fd-card--banner>fd-card-media .fd-card__media-image-container{z-index:4}fd-card div[ulvcontextmenu] ::ng-deep .fd-bar{background-color:transparent}fd-card fd-card-content ::ng-deep bsu-column-renderer div.renderGeneral{font-family:IranYekanDigits}fd-card fd-card-footer.extra-footer{flex-wrap:wrap}fd-card fd-card-footer.hasDetailsAndContextMenu ::ng-deep .fd-card__footer-actions{justify-content:space-between!important}fd-card fd-card-content{padding:0!important}fd-card fd-card-content>div>fd-quick-view ::ng-deep .fd-quick-view__content{padding-top:0}fd-card fd-card-content>div>fd-quick-view fd-quick-view-group-item.rowDirection ::ng-deep .fd-form-item{flex-direction:row}fd-card.hide-header-border ::ng-deep fd-card-header fd-card-main-header>.fd-card__header-main{border:none}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-card.card-media:not(.banner) ::ng-deep .fd-card__header-main{padding:0;--fdCard_Title_Font_Size: .725rem;--sapFontSize: .625rem}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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.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", "hideOpenIcon", "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.DynamicCommandDirective, selector: "[dynCommand]", inputs: ["dynCommand", "mo", "enableCommand"], outputs: ["commandClick"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.StopPropagationDirective, selector: "[stopPropagation]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$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: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "directive", type: i7$3.CardHeaderActionDirective, selector: "[fd-card-header-action]" }, { kind: "component", type: i7$3.CardExtendedHeaderComponent, selector: "fd-card-extended-header", inputs: ["ariaRoleDescription", "align"] }, { kind: "directive", type: i7$3.CardHeaderRowDirective, selector: "[fd-card-header-row]" }, { kind: "directive", type: i7$3.CardHeaderColumnDirective, selector: "[fd-card-header-column]", inputs: ["align"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i7$3.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["statusInput"] }, { kind: "component", type: i7$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i7$3.CardMediaComponent, selector: "fd-card-media", inputs: ["ariaRoleDescription", "hasPadding", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaImageDirective, selector: "[fd-card-media-image]" }, { kind: "directive", type: i7$3.CardMediaImageContainerDirective, selector: "[fd-card-media-image-container]" }, { kind: "directive", type: i7$3.CardMediaContentContainerDirective, selector: "[fd-card-media-content-container]", inputs: ["isOverlay", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaHeadingDirective, selector: "[fd-card-media-heading]", inputs: ["id", "level"] }, { kind: "directive", type: i7$3.CardMediaTextDirective, selector: "[fd-card-media-text]" }, { kind: "component", type: i2$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$4.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$4.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$4.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: i12.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i12.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i12.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i12.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis", "fdTextMode"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5576
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CardItemComponent, isStandalone: false, selector: "bsu-card-item", inputs: { setting: "setting", extraFooterComponent: "extraFooterComponent" }, 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\r\n [cardType]=\"setting.CardType$Caption\"\r\n [interactive]=\"setting.IsInteractive === false ? false : true\"\r\n class=\"docs-flex-item-margin\"\r\n [class.openOnClick]=\"setting.openOnClick\"\r\n [class.hide-header-border]=\"setting.HideHeaderBorder\"\r\n [style.width]=\"cardWidth\"\r\n [style.min-width]=\"minWidth\"\r\n [style.max-width]=\"maxWidth\"\r\n [class.card-media]=\"cardMedia\"\r\n (click)=\"onRowCheck()\"\r\n (dblclick)=\"onRowClick()\"\r\n>\r\n @if(cardMedia){\r\n <fd-card-media>\r\n @if(isCardTypeBanner){\r\n <div\r\n fd-card-media-content-container\r\n [legendColor]=\"setting.CustomColor ? null : 13\"\r\n [style.background]=\"setting.CustomColor ? setting.CustomColor : null\"\r\n >\r\n <div fd-card-media-heading [level]=\"2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n <p fd-card-media-text>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </p>\r\n @if (contextMenuItems.length ) {\r\n\r\n <bsu-ulv-context-menu\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [styleIndex]=\"styleIndex\"\r\n [mo]=\"mo\"\r\n [index]=\"index\"\r\n (commandClick)=\"onUlvCommand()\"\r\n [deviceName]=\"deviceName\"\r\n [menuItems]=\"contextMenuItems\"\r\n [allColumns]=\"allColumns\"\r\n ></bsu-ulv-context-menu>\r\n }\r\n </div>\r\n }\r\n <div fd-card-media-image-container #container>\r\n <img\r\n fd-card-media-image\r\n [src]=\"\r\n setting.MediaField\r\n ? (mo[setting.MediaField.Name]?.FileId | picFieldSrc: 'ID':setting.MediaField.FieldDefId)\r\n : ''\r\n \"\r\n alt=\"pic not loaded\"\r\n [style.max-height.px]=\"isCardTypeBanner ? setting?.SliderHeight || 300 : null\"\r\n />\r\n </div>\r\n </fd-card-media>\r\n } @if(!isCardTypeBanner){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\r\n context: {\r\n $implicit: mo,\r\n index: this.index\r\n }\r\n \"\r\n ></ng-container>\r\n } @if (!noContent || contextMenuItems) {\r\n <fd-card-content ellipsify>\r\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: setting.ContentComponent,\r\n componentSettings: setting.ContentComponent?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n @for(item of setting.ContentComponents?.MoDataList;track item.Id){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n contentTemplateComponent;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: item.Component,\r\n componentSettings: item.Component?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n </div>\r\n </fd-card-content>\r\n } @if(detailsText || contextMenuEnabled && !isCardTypeBanner){\r\n <fd-card-footer\r\n [class.extra-footer]=\"extraFooterComponent?.Selector\"\r\n [class.hasDetailsAndContextMenu]=\"detailsText && contextMenuEnabled && contextMenuInFooter\"\r\n >\r\n @if(extraFooterComponent?.Selector){\r\n <bnrc-dynamic-item-component\r\n style=\"display: block; flex: 1\"\r\n [component]=\"extraFooterComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"extraFooterComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n } @if(detailsText){<button *fdCardFooterActionItem fd-button fdType=\"transparent\" [fdPopoverTrigger]=\"popover\">\r\n {{ detailsText }}\r\n </button>\r\n } @if(contextMenuInFooter){\r\n <div\r\n *fdCardFooterActionItem\r\n ulvContextMenu\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n <fd-popover #popover>\r\n @if (detailsColumns?.length) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsColumnsTemplate;\r\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\r\n \"\r\n ></ng-container>\r\n }\r\n </fd-popover>\r\n </fd-card-footer>\r\n }\r\n</fd-card>\r\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsFormItems;\r\n context: {\r\n $implicit: detailsColumns,\r\n mo: this.mo,\r\n inlineEditMode: this.inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n</ng-template>\r\n<ng-template\r\n #detailsFormItems\r\n let-detailsColumns\r\n let-mo=\"mo\"\r\n let-inlineEditMode=\"inlineEditMode\"\r\n let-layout94=\"layout94\"\r\n>\r\n <div class=\"form-items\" class=\"tw-p-2\">\r\n @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n <div\r\n fd-form-item\r\n class=\"!tw-flex-row\"\r\n [dynCommand]=\"column.$CustomComponent?.DynamicCommand\"\r\n [mo]=\"mo\"\r\n [enableCommand]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n bodyClick\r\n [class.tw-cursor-pointer]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n >\r\n @if(!column.$CustomComponent?.HideColumnCaption) {<label fd-form-label for=\"input-2\"\r\n >{{ column.Caption }}<span>:</span></label\r\n >}\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n mo: mo,\r\n index: columnIndex,\r\n inlineEditMode: inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n<ng-template\r\n #columnTemplate\r\n let-column\r\n let-mo=\"mo\"\r\n let-index=\"index\"\r\n let-layout94=\"layout94\"\r\n let-disableEllapsis=\"disableEllapsis\"\r\n let-fdTextMode=\"fdTextMode\"\r\n>\r\n @if (column) {\r\n <bsu-barsa-table-column\r\n [mo]=\"mo\"\r\n [allColumns]=\"allColumns\"\r\n [column]=\"column\"\r\n [isdirty]=\"false\"\r\n [value]=\"column | columnValue: mo\"\r\n [icon]=\"column | columnIcon: mo\"\r\n [customComponent]=\"column.$CustomComponent\"\r\n [column]=\"column\"\r\n [disableEllapsis]=\"disableEllapsis === false ? false : true\"\r\n [fdTextMode]=\"fdTextMode\"\r\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\r\n [inlineEditMode]=\"inlineEditMode\"\r\n [isChecked]=\"isChecked\"\r\n [index]=\"index\"\r\n [formSetting]=\"formSetting\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [layout94]=\"layout94\"\r\n (save)=\"onEditFormPanelSave(null)\"\r\n (cancel)=\"onEditFormPanelCancel(null)\"\r\n (tab)=\"onTabKeyDown($event, index)\"\r\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\r\n >\r\n </bsu-barsa-table-column>\r\n\r\n }\r\n</ng-template>\r\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\r\n @if (!noContent) {\r\n <fd-quick-view [id]=\"'id'\">\r\n <fd-quick-view-group>\r\n @for (column of setting.FieldListMapped; track column) {\r\n <fd-quick-view-group-item [class.rowDirection]=\"column?.$CustomComponent?.IsRowDirection\">\r\n @if (column) { @if(!column.$CustomComponent?.HideColumnCaption) {<fd-quick-view-group-item-label>\r\n {{ column.Caption | bbbTranslate }} </fd-quick-view-group-item-label\r\n >}\r\n <fd-quick-view-group-item-content>\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n } @if (setting.DescriptionField) {\r\n <fd-quick-view-group-item>\r\n <fd-quick-view-group-item-content>\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <fd-quick-view-group-item-label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </fd-quick-view-group-item-label>\r\n }\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n @if (setting.ActionFieldNameField) {\r\n <fd-quick-view-group-item-content\r\n class=\"action\"\r\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\r\n >\r\n <a fd-link>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.ActionFieldNameField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </a>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n }\r\n </fd-quick-view-group>\r\n </fd-quick-view>\r\n }\r\n</ng-template>\r\n<ng-template #contentTemplate let-mo let-index=\"index\">\r\n <fd-layout-grid>\r\n <div fdLayoutGridRow style=\"align-items: center\">\r\n <div [fdLayoutGridCol]=\"12\">\r\n @for (column of setting.FieldListMapped; track column) {\r\n <div style=\"display: flex\">\r\n <label fd-form-label [colon]=\"true\">{{ column.Caption | bbbTranslate }}</label>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n @if (setting.DescriptionField) {\r\n <div [fdLayoutGridCol]=\"12\">\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </label>\r\n }\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </fd-layout-grid>\r\n</ng-template>\r\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\r\n @if (visible) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"circle\"\r\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\r\n >\r\n </fd-avatar>\r\n }\r\n</ng-template>\r\n\r\n<ng-template\r\n #contentTemplateComponent\r\n let-mo\r\n let-index=\"index\"\r\n let-componentSettings=\"componentSettings\"\r\n let-component=\"component\"\r\n>\r\n <bnrc-dynamic-item-component\r\n [component]=\"component\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"componentSettings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n\r\n<ng-template #renderHeader let-mo let-index=\"index\">\r\n @if(!hideOpenIcon && (openOnClick || (canView && deviceName !== 'desktop'))){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderMobileCanView;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }@else{\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderDesktop;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n</ng-template>\r\n<ng-template #renderHeaderDesktop let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderDesktop\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if (setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n <span fd-card-counter status=\"positive\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.CounterField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </span>\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderMobileCanView let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderMobileCanView\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if ( setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }@else {\r\n <button\r\n fd-button\r\n fd-card-header-action\r\n class=\"view-btn\"\r\n stopPropagation\r\n (click)=\"onRowClick()\"\r\n [glyph]=\"navigationArrow\"\r\n fdType=\"transparent\"\r\n ></button>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\r\n <bnrc-dynamic-item-component\r\n [component]=\"setting.HeaderComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"setting.HeaderComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n [contextMenuItems]=\"contextMenuItems\"\r\n [canView]=\"canView\"\r\n [hideOpenIcon]=\"hideOpenIcon\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [navigationArrow]=\"navigationArrow\"\r\n [isCheckList]=\"isCheckList\"\r\n (events)=\"onDynamicComponentEvents($event)\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n", styles: ["fd-card.fd-card--banner>fd-card-media{border-radius:inherit}fd-card.fd-card--banner>fd-card-media .fd-card__media-image-container{z-index:4}fd-card div[ulvcontextmenu] ::ng-deep .fd-bar{background-color:transparent}fd-card fd-card-content ::ng-deep bsu-column-renderer div.renderGeneral{font-family:IranYekanDigits}fd-card fd-card-footer.extra-footer{flex-wrap:wrap}fd-card fd-card-footer.hasDetailsAndContextMenu ::ng-deep .fd-card__footer-actions{justify-content:space-between!important}fd-card fd-card-content{padding:0!important}fd-card fd-card-content>div>fd-quick-view ::ng-deep .fd-quick-view__content{padding-top:0}fd-card fd-card-content>div>fd-quick-view fd-quick-view-group-item.rowDirection ::ng-deep .fd-form-item{flex-direction:row}fd-card.hide-header-border ::ng-deep fd-card-header fd-card-main-header>.fd-card__header-main{border:none}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-card.card-media:not(.banner) ::ng-deep .fd-card__header-main{padding:0;--fdCard_Title_Font_Size: .725rem;--sapFontSize: .625rem}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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.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", "hideOpenIcon", "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.DynamicCommandDirective, selector: "[dynCommand]", inputs: ["dynCommand", "mo", "enableCommand"], outputs: ["commandClick"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.StopPropagationDirective, selector: "[stopPropagation]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7$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: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "directive", type: i7$3.CardHeaderActionDirective, selector: "[fd-card-header-action]" }, { kind: "component", type: i7$3.CardExtendedHeaderComponent, selector: "fd-card-extended-header", inputs: ["ariaRoleDescription", "align"] }, { kind: "directive", type: i7$3.CardHeaderRowDirective, selector: "[fd-card-header-row]" }, { kind: "directive", type: i7$3.CardHeaderColumnDirective, selector: "[fd-card-header-column]", inputs: ["align"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i7$3.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["statusInput"] }, { kind: "component", type: i7$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i7$3.CardMediaComponent, selector: "fd-card-media", inputs: ["ariaRoleDescription", "hasPadding", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaImageDirective, selector: "[fd-card-media-image]" }, { kind: "directive", type: i7$3.CardMediaImageContainerDirective, selector: "[fd-card-media-image-container]" }, { kind: "directive", type: i7$3.CardMediaContentContainerDirective, selector: "[fd-card-media-content-container]", inputs: ["isOverlay", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaHeadingDirective, selector: "[fd-card-media-heading]", inputs: ["id", "level"] }, { kind: "directive", type: i7$3.CardMediaTextDirective, selector: "[fd-card-media-text]" }, { kind: "component", type: i2$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$4.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$4.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$4.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: i12.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i12.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i12.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i12.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis", "fdTextMode"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5577
5577
|
}
|
|
5578
5578
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CardItemComponent, decorators: [{
|
|
5579
5579
|
type: Component,
|
|
5580
|
-
args: [{ selector: 'bsu-card-item', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<fd-card\r\n [cardType]=\"setting.CardType$Caption\"\r\n [interactive]=\"true\"\r\n class=\"docs-flex-item-margin\"\r\n [class.openOnClick]=\"setting.openOnClick\"\r\n [class.hide-header-border]=\"setting.HideHeaderBorder\"\r\n [style.width]=\"cardWidth\"\r\n [style.min-width]=\"minWidth\"\r\n [style.max-width]=\"maxWidth\"\r\n [class.card-media]=\"cardMedia\"\r\n (click)=\"onRowCheck()\"\r\n (dblclick)=\"onRowClick()\"\r\n>\r\n @if(cardMedia){\r\n <fd-card-media>\r\n @if(isCardTypeBanner){\r\n <div\r\n fd-card-media-content-container\r\n [legendColor]=\"setting.CustomColor ? null : 13\"\r\n [style.background]=\"setting.CustomColor ? setting.CustomColor : null\"\r\n >\r\n <div fd-card-media-heading [level]=\"2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n <p fd-card-media-text>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </p>\r\n @if (contextMenuItems.length ) {\r\n\r\n <bsu-ulv-context-menu\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [styleIndex]=\"styleIndex\"\r\n [mo]=\"mo\"\r\n [index]=\"index\"\r\n (commandClick)=\"onUlvCommand()\"\r\n [deviceName]=\"deviceName\"\r\n [menuItems]=\"contextMenuItems\"\r\n [allColumns]=\"allColumns\"\r\n ></bsu-ulv-context-menu>\r\n }\r\n </div>\r\n }\r\n <div fd-card-media-image-container #container>\r\n <img\r\n fd-card-media-image\r\n [src]=\"\r\n setting.MediaField\r\n ? (mo[setting.MediaField.Name]?.FileId | picFieldSrc: 'ID':setting.MediaField.FieldDefId)\r\n : ''\r\n \"\r\n alt=\"pic not loaded\"\r\n [style.max-height.px]=\"isCardTypeBanner ? setting?.SliderHeight || 300 : null\"\r\n />\r\n </div>\r\n </fd-card-media>\r\n } @if(!isCardTypeBanner){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\r\n context: {\r\n $implicit: mo,\r\n index: this.index\r\n }\r\n \"\r\n ></ng-container>\r\n } @if (!noContent || contextMenuItems) {\r\n <fd-card-content ellipsify>\r\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: setting.ContentComponent,\r\n componentSettings: setting.ContentComponent?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n @for(item of setting.ContentComponents?.MoDataList;track item.Id){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n contentTemplateComponent;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: item.Component,\r\n componentSettings: item.Component?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n </div>\r\n </fd-card-content>\r\n } @if(detailsText || contextMenuEnabled && !isCardTypeBanner){\r\n <fd-card-footer\r\n [class.extra-footer]=\"extraFooterComponent?.Selector\"\r\n [class.hasDetailsAndContextMenu]=\"detailsText && contextMenuEnabled && contextMenuInFooter\"\r\n >\r\n @if(extraFooterComponent?.Selector){\r\n <bnrc-dynamic-item-component\r\n style=\"display: block; flex: 1\"\r\n [component]=\"extraFooterComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"extraFooterComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n } @if(detailsText){<button *fdCardFooterActionItem fd-button fdType=\"transparent\" [fdPopoverTrigger]=\"popover\">\r\n {{ detailsText }}\r\n </button>\r\n } @if(contextMenuInFooter){\r\n <div\r\n *fdCardFooterActionItem\r\n ulvContextMenu\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n <fd-popover #popover>\r\n @if (detailsColumns?.length) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsColumnsTemplate;\r\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\r\n \"\r\n ></ng-container>\r\n }\r\n </fd-popover>\r\n </fd-card-footer>\r\n }\r\n</fd-card>\r\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsFormItems;\r\n context: {\r\n $implicit: detailsColumns,\r\n mo: this.mo,\r\n inlineEditMode: this.inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n</ng-template>\r\n<ng-template\r\n #detailsFormItems\r\n let-detailsColumns\r\n let-mo=\"mo\"\r\n let-inlineEditMode=\"inlineEditMode\"\r\n let-layout94=\"layout94\"\r\n>\r\n <div class=\"form-items\" class=\"tw-p-2\">\r\n @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n <div\r\n fd-form-item\r\n class=\"!tw-flex-row\"\r\n [dynCommand]=\"column.$CustomComponent?.DynamicCommand\"\r\n [mo]=\"mo\"\r\n [enableCommand]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n bodyClick\r\n [class.tw-cursor-pointer]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n >\r\n @if(!column.$CustomComponent?.HideColumnCaption) {<label fd-form-label for=\"input-2\"\r\n >{{ column.Caption }}<span>:</span></label\r\n >}\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n mo: mo,\r\n index: columnIndex,\r\n inlineEditMode: inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n<ng-template\r\n #columnTemplate\r\n let-column\r\n let-mo=\"mo\"\r\n let-index=\"index\"\r\n let-layout94=\"layout94\"\r\n let-disableEllapsis=\"disableEllapsis\"\r\n let-fdTextMode=\"fdTextMode\"\r\n>\r\n @if (column) {\r\n <bsu-barsa-table-column\r\n [mo]=\"mo\"\r\n [allColumns]=\"allColumns\"\r\n [column]=\"column\"\r\n [isdirty]=\"false\"\r\n [value]=\"column | columnValue: mo\"\r\n [icon]=\"column | columnIcon: mo\"\r\n [customComponent]=\"column.$CustomComponent\"\r\n [column]=\"column\"\r\n [disableEllapsis]=\"disableEllapsis === false ? false : true\"\r\n [fdTextMode]=\"fdTextMode\"\r\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\r\n [inlineEditMode]=\"inlineEditMode\"\r\n [isChecked]=\"isChecked\"\r\n [index]=\"index\"\r\n [formSetting]=\"formSetting\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [layout94]=\"layout94\"\r\n (save)=\"onEditFormPanelSave(null)\"\r\n (cancel)=\"onEditFormPanelCancel(null)\"\r\n (tab)=\"onTabKeyDown($event, index)\"\r\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\r\n >\r\n </bsu-barsa-table-column>\r\n\r\n }\r\n</ng-template>\r\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\r\n @if (!noContent) {\r\n <fd-quick-view [id]=\"'id'\">\r\n <fd-quick-view-group>\r\n @for (column of setting.FieldListMapped; track column) {\r\n <fd-quick-view-group-item [class.rowDirection]=\"column?.$CustomComponent?.IsRowDirection\">\r\n @if (column) { @if(!column.$CustomComponent?.HideColumnCaption) {<fd-quick-view-group-item-label>\r\n {{ column.Caption | bbbTranslate }} </fd-quick-view-group-item-label\r\n >}\r\n <fd-quick-view-group-item-content>\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n } @if (setting.DescriptionField) {\r\n <fd-quick-view-group-item>\r\n <fd-quick-view-group-item-content>\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <fd-quick-view-group-item-label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </fd-quick-view-group-item-label>\r\n }\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n @if (setting.ActionFieldNameField) {\r\n <fd-quick-view-group-item-content\r\n class=\"action\"\r\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\r\n >\r\n <a fd-link>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.ActionFieldNameField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </a>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n }\r\n </fd-quick-view-group>\r\n </fd-quick-view>\r\n }\r\n</ng-template>\r\n<ng-template #contentTemplate let-mo let-index=\"index\">\r\n <fd-layout-grid>\r\n <div fdLayoutGridRow style=\"align-items: center\">\r\n <div [fdLayoutGridCol]=\"12\">\r\n @for (column of setting.FieldListMapped; track column) {\r\n <div style=\"display: flex\">\r\n <label fd-form-label [colon]=\"true\">{{ column.Caption | bbbTranslate }}</label>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n @if (setting.DescriptionField) {\r\n <div [fdLayoutGridCol]=\"12\">\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </label>\r\n }\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </fd-layout-grid>\r\n</ng-template>\r\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\r\n @if (visible) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"circle\"\r\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\r\n >\r\n </fd-avatar>\r\n }\r\n</ng-template>\r\n\r\n<ng-template\r\n #contentTemplateComponent\r\n let-mo\r\n let-index=\"index\"\r\n let-componentSettings=\"componentSettings\"\r\n let-component=\"component\"\r\n>\r\n <bnrc-dynamic-item-component\r\n [component]=\"component\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"componentSettings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n\r\n<ng-template #renderHeader let-mo let-index=\"index\">\r\n @if(!hideOpenIcon && (openOnClick || (canView && deviceName !== 'desktop'))){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderMobileCanView;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }@else{\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderDesktop;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n</ng-template>\r\n<ng-template #renderHeaderDesktop let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderDesktop\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if (setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n <span fd-card-counter status=\"positive\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.CounterField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </span>\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderMobileCanView let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderMobileCanView\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if ( setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }@else {\r\n <button\r\n fd-button\r\n fd-card-header-action\r\n class=\"view-btn\"\r\n stopPropagation\r\n (click)=\"onRowClick()\"\r\n [glyph]=\"navigationArrow\"\r\n fdType=\"transparent\"\r\n ></button>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\r\n <bnrc-dynamic-item-component\r\n [component]=\"setting.HeaderComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"setting.HeaderComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n [contextMenuItems]=\"contextMenuItems\"\r\n [canView]=\"canView\"\r\n [hideOpenIcon]=\"hideOpenIcon\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [navigationArrow]=\"navigationArrow\"\r\n [isCheckList]=\"isCheckList\"\r\n (events)=\"onDynamicComponentEvents($event)\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n", styles: ["fd-card.fd-card--banner>fd-card-media{border-radius:inherit}fd-card.fd-card--banner>fd-card-media .fd-card__media-image-container{z-index:4}fd-card div[ulvcontextmenu] ::ng-deep .fd-bar{background-color:transparent}fd-card fd-card-content ::ng-deep bsu-column-renderer div.renderGeneral{font-family:IranYekanDigits}fd-card fd-card-footer.extra-footer{flex-wrap:wrap}fd-card fd-card-footer.hasDetailsAndContextMenu ::ng-deep .fd-card__footer-actions{justify-content:space-between!important}fd-card fd-card-content{padding:0!important}fd-card fd-card-content>div>fd-quick-view ::ng-deep .fd-quick-view__content{padding-top:0}fd-card fd-card-content>div>fd-quick-view fd-quick-view-group-item.rowDirection ::ng-deep .fd-form-item{flex-direction:row}fd-card.hide-header-border ::ng-deep fd-card-header fd-card-main-header>.fd-card__header-main{border:none}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-card.card-media:not(.banner) ::ng-deep .fd-card__header-main{padding:0;--fdCard_Title_Font_Size: .725rem;--sapFontSize: .625rem}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"] }]
|
|
5580
|
+
args: [{ selector: 'bsu-card-item', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<fd-card\r\n [cardType]=\"setting.CardType$Caption\"\r\n [interactive]=\"setting.IsInteractive === false ? false : true\"\r\n class=\"docs-flex-item-margin\"\r\n [class.openOnClick]=\"setting.openOnClick\"\r\n [class.hide-header-border]=\"setting.HideHeaderBorder\"\r\n [style.width]=\"cardWidth\"\r\n [style.min-width]=\"minWidth\"\r\n [style.max-width]=\"maxWidth\"\r\n [class.card-media]=\"cardMedia\"\r\n (click)=\"onRowCheck()\"\r\n (dblclick)=\"onRowClick()\"\r\n>\r\n @if(cardMedia){\r\n <fd-card-media>\r\n @if(isCardTypeBanner){\r\n <div\r\n fd-card-media-content-container\r\n [legendColor]=\"setting.CustomColor ? null : 13\"\r\n [style.background]=\"setting.CustomColor ? setting.CustomColor : null\"\r\n >\r\n <div fd-card-media-heading [level]=\"2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n <p fd-card-media-text>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </p>\r\n @if (contextMenuItems.length ) {\r\n\r\n <bsu-ulv-context-menu\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [styleIndex]=\"styleIndex\"\r\n [mo]=\"mo\"\r\n [index]=\"index\"\r\n (commandClick)=\"onUlvCommand()\"\r\n [deviceName]=\"deviceName\"\r\n [menuItems]=\"contextMenuItems\"\r\n [allColumns]=\"allColumns\"\r\n ></bsu-ulv-context-menu>\r\n }\r\n </div>\r\n }\r\n <div fd-card-media-image-container #container>\r\n <img\r\n fd-card-media-image\r\n [src]=\"\r\n setting.MediaField\r\n ? (mo[setting.MediaField.Name]?.FileId | picFieldSrc: 'ID':setting.MediaField.FieldDefId)\r\n : ''\r\n \"\r\n alt=\"pic not loaded\"\r\n [style.max-height.px]=\"isCardTypeBanner ? setting?.SliderHeight || 300 : null\"\r\n />\r\n </div>\r\n </fd-card-media>\r\n } @if(!isCardTypeBanner){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.HeaderComponent ? renderHeaderComponent : renderHeader;\r\n context: {\r\n $implicit: mo,\r\n index: this.index\r\n }\r\n \"\r\n ></ng-container>\r\n } @if (!noContent || contextMenuItems) {\r\n <fd-card-content ellipsify>\r\n <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: setting.ContentComponent,\r\n componentSettings: setting.ContentComponent?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n @for(item of setting.ContentComponents?.MoDataList;track item.Id){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n contentTemplateComponent;\r\n context: {\r\n $implicit: mo,\r\n index: this.index,\r\n component: item.Component,\r\n componentSettings: item.Component?.Settings\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n </div>\r\n </fd-card-content>\r\n } @if(detailsText || contextMenuEnabled && !isCardTypeBanner){\r\n <fd-card-footer\r\n [class.extra-footer]=\"extraFooterComponent?.Selector\"\r\n [class.hasDetailsAndContextMenu]=\"detailsText && contextMenuEnabled && contextMenuInFooter\"\r\n >\r\n @if(extraFooterComponent?.Selector){\r\n <bnrc-dynamic-item-component\r\n style=\"display: block; flex: 1\"\r\n [component]=\"extraFooterComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"extraFooterComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n } @if(detailsText){<button *fdCardFooterActionItem fd-button fdType=\"transparent\" [fdPopoverTrigger]=\"popover\">\r\n {{ detailsText }}\r\n </button>\r\n } @if(contextMenuInFooter){\r\n <div\r\n *fdCardFooterActionItem\r\n ulvContextMenu\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n <fd-popover #popover>\r\n @if (detailsColumns?.length) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsColumnsTemplate;\r\n context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\r\n \"\r\n ></ng-container>\r\n }\r\n </fd-popover>\r\n </fd-card-footer>\r\n }\r\n</fd-card>\r\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n detailsFormItems;\r\n context: {\r\n $implicit: detailsColumns,\r\n mo: this.mo,\r\n inlineEditMode: this.inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n</ng-template>\r\n<ng-template\r\n #detailsFormItems\r\n let-detailsColumns\r\n let-mo=\"mo\"\r\n let-inlineEditMode=\"inlineEditMode\"\r\n let-layout94=\"layout94\"\r\n>\r\n <div class=\"form-items\" class=\"tw-p-2\">\r\n @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n <div\r\n fd-form-item\r\n class=\"!tw-flex-row\"\r\n [dynCommand]=\"column.$CustomComponent?.DynamicCommand\"\r\n [mo]=\"mo\"\r\n [enableCommand]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n bodyClick\r\n [class.tw-cursor-pointer]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n >\r\n @if(!column.$CustomComponent?.HideColumnCaption) {<label fd-form-label for=\"input-2\"\r\n >{{ column.Caption }}<span>:</span></label\r\n >}\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n mo: mo,\r\n index: columnIndex,\r\n inlineEditMode: inlineEditMode,\r\n layout94: layout94\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n</ng-template>\r\n<ng-template\r\n #columnTemplate\r\n let-column\r\n let-mo=\"mo\"\r\n let-index=\"index\"\r\n let-layout94=\"layout94\"\r\n let-disableEllapsis=\"disableEllapsis\"\r\n let-fdTextMode=\"fdTextMode\"\r\n>\r\n @if (column) {\r\n <bsu-barsa-table-column\r\n [mo]=\"mo\"\r\n [allColumns]=\"allColumns\"\r\n [column]=\"column\"\r\n [isdirty]=\"false\"\r\n [value]=\"column | columnValue: mo\"\r\n [icon]=\"column | columnIcon: mo\"\r\n [customComponent]=\"column.$CustomComponent\"\r\n [column]=\"column\"\r\n [disableEllapsis]=\"disableEllapsis === false ? false : true\"\r\n [fdTextMode]=\"fdTextMode\"\r\n [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\r\n [inlineEditMode]=\"inlineEditMode\"\r\n [isChecked]=\"isChecked\"\r\n [index]=\"index\"\r\n [formSetting]=\"formSetting\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [layout94]=\"layout94\"\r\n (save)=\"onEditFormPanelSave(null)\"\r\n (cancel)=\"onEditFormPanelCancel(null)\"\r\n (tab)=\"onTabKeyDown($event, index)\"\r\n (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\r\n >\r\n </bsu-barsa-table-column>\r\n\r\n }\r\n</ng-template>\r\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\r\n @if (!noContent) {\r\n <fd-quick-view [id]=\"'id'\">\r\n <fd-quick-view-group>\r\n @for (column of setting.FieldListMapped; track column) {\r\n <fd-quick-view-group-item [class.rowDirection]=\"column?.$CustomComponent?.IsRowDirection\">\r\n @if (column) { @if(!column.$CustomComponent?.HideColumnCaption) {<fd-quick-view-group-item-label>\r\n {{ column.Caption | bbbTranslate }} </fd-quick-view-group-item-label\r\n >}\r\n <fd-quick-view-group-item-content>\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n } @if (setting.DescriptionField) {\r\n <fd-quick-view-group-item>\r\n <fd-quick-view-group-item-content>\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <fd-quick-view-group-item-label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </fd-quick-view-group-item-label>\r\n }\r\n <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n </fd-quick-view-group-item-content>\r\n @if (setting.ActionFieldNameField) {\r\n <fd-quick-view-group-item-content\r\n class=\"action\"\r\n (click)=\"onAction(setting.ActionFieldCommandField || '')\"\r\n >\r\n <a fd-link>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.ActionFieldNameField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </a>\r\n </fd-quick-view-group-item-content>\r\n }\r\n </fd-quick-view-group-item>\r\n }\r\n </fd-quick-view-group>\r\n </fd-quick-view>\r\n }\r\n</ng-template>\r\n<ng-template #contentTemplate let-mo let-index=\"index\">\r\n <fd-layout-grid>\r\n <div fdLayoutGridRow style=\"align-items: center\">\r\n <div [fdLayoutGridCol]=\"12\">\r\n @for (column of setting.FieldListMapped; track column) {\r\n <div style=\"display: flex\">\r\n <label fd-form-label [colon]=\"true\">{{ column.Caption | bbbTranslate }}</label>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: column,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n @if (setting.DescriptionField) {\r\n <div [fdLayoutGridCol]=\"12\">\r\n @if (inlineEditMode && allowInlineEdit) {\r\n <label>\r\n {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n </label>\r\n }\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.DescriptionField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </fd-layout-grid>\r\n</ng-template>\r\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\r\n @if (visible) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"circle\"\r\n [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\r\n >\r\n </fd-avatar>\r\n }\r\n</ng-template>\r\n\r\n<ng-template\r\n #contentTemplateComponent\r\n let-mo\r\n let-index=\"index\"\r\n let-componentSettings=\"componentSettings\"\r\n let-component=\"component\"\r\n>\r\n <bnrc-dynamic-item-component\r\n [component]=\"component\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"componentSettings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n\r\n<ng-template #renderHeader let-mo let-index=\"index\">\r\n @if(!hideOpenIcon && (openOnClick || (canView && deviceName !== 'desktop'))){\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderMobileCanView;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }@else{\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n renderHeaderDesktop;\r\n context: {\r\n $implicit: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n }\r\n</ng-template>\r\n<ng-template #renderHeaderDesktop let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderDesktop\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if (setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n <span fd-card-counter status=\"positive\">\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.CounterField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n disableEllapsis: false\r\n }\r\n \"\r\n ></ng-container>\r\n </span>\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderMobileCanView let-mo let-index=\"index\">\r\n <fd-card-header class=\"HeaderMobileCanView\">\r\n <div>\r\n @if(isCheckList){\r\n <fd-checkbox\r\n [name]=\"mo.$Caption\"\r\n [ngModel]=\"isChecked\"\r\n (ngModelChange)=\"onRowCheck()\"\r\n stopPropagation\r\n ></fd-checkbox>\r\n }\r\n </div>\r\n <fd-card-main-header>\r\n @if ( setting.AvatarField || setting.Avatar) {\r\n <fd-avatar\r\n alterIcon=\"alt|content|backup|default-icon\"\r\n [circle]=\"setting.CircleAvatar\"\r\n [image]=\"\r\n setting.AvatarField\r\n ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n : ''\r\n \"\r\n [size]=\"\r\n deviceSize === 'xl' || deviceSize === 'l'\r\n ? setting.AvatarSizeDesktop$Caption\r\n : setting.AvatarSize$Caption\r\n \"\r\n [glyph]=\"\r\n setting.Avatar ||\r\n (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n \"\r\n ></fd-avatar>\r\n }\r\n <h2 fd-card-title>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.TitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index,\r\n fdTextMode: true\r\n }\r\n \"\r\n ></ng-container>\r\n </h2>\r\n <h3 fd-card-subtitle>\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n columnTemplate;\r\n context: {\r\n $implicit: setting.SubtitleField,\r\n layout94: layout$ | async,\r\n mo: mo,\r\n index: index\r\n }\r\n \"\r\n ></ng-container>\r\n </h3>\r\n\r\n @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n <div\r\n ulvContextMenu\r\n fd-card-header-action\r\n [allColumns]=\"allColumns\"\r\n [footerMode]=\"false\"\r\n [menuItems]=\"contextMenuItems\"\r\n [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n [styleIndex]=\"styleIndex\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [mo]=\"mo\"\r\n (commandClick)=\"onUlvCommand()\"\r\n ></div>\r\n }@else {\r\n <button\r\n fd-button\r\n fd-card-header-action\r\n class=\"view-btn\"\r\n stopPropagation\r\n (click)=\"onRowClick()\"\r\n [glyph]=\"navigationArrow\"\r\n fdType=\"transparent\"\r\n ></button>\r\n }\r\n </fd-card-main-header>\r\n @if(setting.hasExtHeader){\r\n <fd-card-extended-header>\r\n <div fd-card-header-column>\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n <div fd-card-header-column [align]=\"'right'\">\r\n <div fd-card-header-row>\r\n @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n </fd-card-extended-header>\r\n }\r\n </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\r\n <bnrc-dynamic-item-component\r\n [component]=\"setting.HeaderComponent\"\r\n [mo]=\"mo\"\r\n [styleIndex]=\"mo.$StyleIndex\"\r\n [isChecked]=\"isChecked\"\r\n [setting]=\"setting\"\r\n [parameters]=\"setting.HeaderComponent.Settings\"\r\n [editMode]=\"inlineEditMode\"\r\n [rtl]=\"rtl\"\r\n [deviceName]=\"deviceName\"\r\n [deviceSize]=\"deviceSize\"\r\n [index]=\"index\"\r\n [allColumns]=\"allColumns\"\r\n [contextMenuItems]=\"contextMenuItems\"\r\n [canView]=\"canView\"\r\n [hideOpenIcon]=\"hideOpenIcon\"\r\n [conditionalFormats]=\"conditionalFormats\"\r\n [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n [navigationArrow]=\"navigationArrow\"\r\n [isCheckList]=\"isCheckList\"\r\n (events)=\"onDynamicComponentEvents($event)\"\r\n ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n", styles: ["fd-card.fd-card--banner>fd-card-media{border-radius:inherit}fd-card.fd-card--banner>fd-card-media .fd-card__media-image-container{z-index:4}fd-card div[ulvcontextmenu] ::ng-deep .fd-bar{background-color:transparent}fd-card fd-card-content ::ng-deep bsu-column-renderer div.renderGeneral{font-family:IranYekanDigits}fd-card fd-card-footer.extra-footer{flex-wrap:wrap}fd-card fd-card-footer.hasDetailsAndContextMenu ::ng-deep .fd-card__footer-actions{justify-content:space-between!important}fd-card fd-card-content{padding:0!important}fd-card fd-card-content>div>fd-quick-view ::ng-deep .fd-quick-view__content{padding-top:0}fd-card fd-card-content>div>fd-quick-view fd-quick-view-group-item.rowDirection ::ng-deep .fd-form-item{flex-direction:row}fd-card.hide-header-border ::ng-deep fd-card-header fd-card-main-header>.fd-card__header-main{border:none}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-card.card-media:not(.banner) ::ng-deep .fd-card__header-main{padding:0;--fdCard_Title_Font_Size: .725rem;--sapFontSize: .625rem}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"] }]
|
|
5581
5581
|
}], propDecorators: { setting: [{
|
|
5582
5582
|
type: Input
|
|
5583
5583
|
}], _quickViewTemplate: [{
|
|
@@ -10431,11 +10431,11 @@ class LyTabContainerComponent extends LayoutItemBaseComponent {
|
|
|
10431
10431
|
this._tabsSource.next(visibleTabs);
|
|
10432
10432
|
}
|
|
10433
10433
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LyTabContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
10434
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LyTabContainerComponent, isStandalone: false, selector: "bsu-ly-tab-container", host: { properties: { "attr.ismobile": "this.isMobile", "style.flex": "this.flex" } }, viewQueries: [{ propertyName: "tabpages", predicate: TabPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fdp-icon-tab-bar\r\n [collapseOverflow]=\"true\"\r\n [expandOverflowText]=\"'More' | bbbTranslate\"\r\n iconTabSize=\"responsive-paddings\"\r\n [iconTabType]=\"iconTabType\"\r\n [layoutMode]=\"layoutMode\"\r\n>\r\n @for (tabPage of tabs$ | async; track tabPage; let tabindex = $index) {\r\n <fdp-icon-tab-bar-tab\r\n [label]=\"tabPage.Title || '' | bbbTranslate\"\r\n [title]=\"tabPage.Title || '' | bbbTranslate\"\r\n [disabled]=\"tabPage.disabled\"\r\n [class.control-disabled]=\"tabPage.Enable === false\"\r\n [class.readonly]=\"tabPage.Readonly\"\r\n [color]=\"tabPage.SemanticColor?.$Caption\"\r\n [icon]=\"tabPage.FontIcon\"\r\n [counter]=\"tabPage.CustomUi?.Settings?.CounterValue\"\r\n [iconFont]=\"tabPage.IconFontName?.$Caption\"\r\n >\r\n <fd-dynamic-page-content [attr.icon]=\"tabPage.FontIcon\" [attr.iconFont]=\"tabPage.IconFontName?.$Caption\">\r\n <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\r\n </fd-dynamic-page-content>\r\n </fdp-icon-tab-bar-tab>\r\n }\r\n</fdp-icon-tab-bar>\r\n", styles: [":host{width:100%;display:block}fdp-icon-tab-bar ::ng-deep>div{border:var(--sapField_BorderWidth) solid var(--sapGroup_TitleBorderColor)}\n"], dependencies: [{ kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10434
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LyTabContainerComponent, isStandalone: false, selector: "bsu-ly-tab-container", host: { properties: { "attr.ismobile": "this.isMobile", "style.flex": "this.flex" } }, viewQueries: [{ propertyName: "tabpages", predicate: TabPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fdp-icon-tab-bar\r\n [collapseOverflow]=\"true\"\r\n [expandOverflowText]=\"'More' | bbbTranslate\"\r\n iconTabSize=\"responsive-paddings\"\r\n [iconTabType]=\"iconTabType\"\r\n [layoutMode]=\"layoutMode\"\r\n>\r\n @for (tabPage of tabs$ | async; track tabPage; let tabindex = $index) {\r\n <fdp-icon-tab-bar-tab\r\n [label]=\"tabPage.Title || '' | bbbTranslate\"\r\n [title]=\"tabPage.Title || '' | bbbTranslate\"\r\n [disabled]=\"tabPage.disabled\"\r\n [class.control-disabled]=\"tabPage.Enable === false\"\r\n [class.readonly]=\"tabPage.Readonly\"\r\n [color]=\"tabPage.SemanticColor?.$Caption\"\r\n [icon]=\"tabPage.FontIcon\"\r\n [counter]=\"tabPage.CustomUi?.Settings?.CounterValue\"\r\n [iconFont]=\"tabPage.IconFontName?.$Caption\"\r\n >\r\n <fd-dynamic-page-content [attr.icon]=\"tabPage.FontIcon\" [attr.iconFont]=\"tabPage.IconFontName?.$Caption\">\r\n <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\r\n </fd-dynamic-page-content>\r\n </fdp-icon-tab-bar-tab>\r\n }\r\n</fdp-icon-tab-bar>\r\n", styles: [":host{width:100%;display:block}fdp-icon-tab-bar ::ng-deep>div{border:var(--sapField_BorderWidth) solid var(--sapGroup_TitleBorderColor)}fdp-icon-tab-bar ::ng-deep>div>div.fd-icon-tab-bar__content>fdp-icon-tab-bar-tab-content>fd-dynamic-page-content{padding-block:var(--fdPanel_Content_Padding_Block, .625rem);padding-inline:var(--fdPanel_Content_Padding_Inline, 1rem)}\n"], dependencies: [{ kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10435
10435
|
}
|
|
10436
10436
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LyTabContainerComponent, decorators: [{
|
|
10437
10437
|
type: Component,
|
|
10438
|
-
args: [{ selector: 'bsu-ly-tab-container', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<fdp-icon-tab-bar\r\n [collapseOverflow]=\"true\"\r\n [expandOverflowText]=\"'More' | bbbTranslate\"\r\n iconTabSize=\"responsive-paddings\"\r\n [iconTabType]=\"iconTabType\"\r\n [layoutMode]=\"layoutMode\"\r\n>\r\n @for (tabPage of tabs$ | async; track tabPage; let tabindex = $index) {\r\n <fdp-icon-tab-bar-tab\r\n [label]=\"tabPage.Title || '' | bbbTranslate\"\r\n [title]=\"tabPage.Title || '' | bbbTranslate\"\r\n [disabled]=\"tabPage.disabled\"\r\n [class.control-disabled]=\"tabPage.Enable === false\"\r\n [class.readonly]=\"tabPage.Readonly\"\r\n [color]=\"tabPage.SemanticColor?.$Caption\"\r\n [icon]=\"tabPage.FontIcon\"\r\n [counter]=\"tabPage.CustomUi?.Settings?.CounterValue\"\r\n [iconFont]=\"tabPage.IconFontName?.$Caption\"\r\n >\r\n <fd-dynamic-page-content [attr.icon]=\"tabPage.FontIcon\" [attr.iconFont]=\"tabPage.IconFontName?.$Caption\">\r\n <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\r\n </fd-dynamic-page-content>\r\n </fdp-icon-tab-bar-tab>\r\n }\r\n</fdp-icon-tab-bar>\r\n", styles: [":host{width:100%;display:block}fdp-icon-tab-bar ::ng-deep>div{border:var(--sapField_BorderWidth) solid var(--sapGroup_TitleBorderColor)}\n"] }]
|
|
10438
|
+
args: [{ selector: 'bsu-ly-tab-container', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<fdp-icon-tab-bar\r\n [collapseOverflow]=\"true\"\r\n [expandOverflowText]=\"'More' | bbbTranslate\"\r\n iconTabSize=\"responsive-paddings\"\r\n [iconTabType]=\"iconTabType\"\r\n [layoutMode]=\"layoutMode\"\r\n>\r\n @for (tabPage of tabs$ | async; track tabPage; let tabindex = $index) {\r\n <fdp-icon-tab-bar-tab\r\n [label]=\"tabPage.Title || '' | bbbTranslate\"\r\n [title]=\"tabPage.Title || '' | bbbTranslate\"\r\n [disabled]=\"tabPage.disabled\"\r\n [class.control-disabled]=\"tabPage.Enable === false\"\r\n [class.readonly]=\"tabPage.Readonly\"\r\n [color]=\"tabPage.SemanticColor?.$Caption\"\r\n [icon]=\"tabPage.FontIcon\"\r\n [counter]=\"tabPage.CustomUi?.Settings?.CounterValue\"\r\n [iconFont]=\"tabPage.IconFontName?.$Caption\"\r\n >\r\n <fd-dynamic-page-content [attr.icon]=\"tabPage.FontIcon\" [attr.iconFont]=\"tabPage.IconFontName?.$Caption\">\r\n <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\r\n </fd-dynamic-page-content>\r\n </fdp-icon-tab-bar-tab>\r\n }\r\n</fdp-icon-tab-bar>\r\n", styles: [":host{width:100%;display:block}fdp-icon-tab-bar ::ng-deep>div{border:var(--sapField_BorderWidth) solid var(--sapGroup_TitleBorderColor)}fdp-icon-tab-bar ::ng-deep>div>div.fd-icon-tab-bar__content>fdp-icon-tab-bar-tab-content>fd-dynamic-page-content{padding-block:var(--fdPanel_Content_Padding_Block, .625rem);padding-inline:var(--fdPanel_Content_Padding_Inline, 1rem)}\n"] }]
|
|
10439
10439
|
}], propDecorators: { tabpages: [{
|
|
10440
10440
|
type: ViewChildren,
|
|
10441
10441
|
args: [TabPanelComponent]
|