@skysoftware-co/bayan-hr-widgets-ui 2.0.31 → 2.0.33
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.
|
@@ -4553,6 +4553,7 @@ class MyTeamPopupComponent {
|
|
|
4553
4553
|
dataScrollView;
|
|
4554
4554
|
shouldReloadAfterCurrentRequest = false;
|
|
4555
4555
|
baseUrl = input.required(...(ngDevMode ? [{ debugName: "baseUrl" }] : /* istanbul ignore next */ []));
|
|
4556
|
+
popupHeight = input('min(680px, 90vh)', ...(ngDevMode ? [{ debugName: "popupHeight" }] : /* istanbul ignore next */ []));
|
|
4556
4557
|
isLoadingChanged = output();
|
|
4557
4558
|
errorOccurred = output();
|
|
4558
4559
|
showGrade = input(false, ...(ngDevMode ? [{ debugName: "showGrade" }] : /* istanbul ignore next */ []));
|
|
@@ -4655,16 +4656,16 @@ class MyTeamPopupComponent {
|
|
|
4655
4656
|
this.loadPage(true);
|
|
4656
4657
|
}
|
|
4657
4658
|
onReachBottom() {
|
|
4658
|
-
if (this.isDataLoading()) {
|
|
4659
|
+
if (this.isDataLoading() || this.isInitialLoading()) {
|
|
4659
4660
|
this.dataScrollView?.instance?.release(false);
|
|
4660
4661
|
return;
|
|
4661
4662
|
}
|
|
4662
4663
|
if (!this.hasMoreData()) {
|
|
4663
|
-
this.dataScrollView?.instance?.release(
|
|
4664
|
+
this.dataScrollView?.instance?.release(true);
|
|
4664
4665
|
return;
|
|
4665
4666
|
}
|
|
4666
4667
|
void this.loadPage(false).finally(() => {
|
|
4667
|
-
this.dataScrollView?.instance?.release(
|
|
4668
|
+
this.dataScrollView?.instance?.release(!this.hasMoreData());
|
|
4668
4669
|
});
|
|
4669
4670
|
}
|
|
4670
4671
|
isScrollContentScrollable() {
|
|
@@ -4676,11 +4677,6 @@ class MyTeamPopupComponent {
|
|
|
4676
4677
|
}
|
|
4677
4678
|
return scrollableContent.scrollHeight > scrollableContainer.clientHeight + 1;
|
|
4678
4679
|
}
|
|
4679
|
-
async loadRemainingPagesIfNeeded() {
|
|
4680
|
-
while (this.hasMoreData() && !this.isScrollContentScrollable()) {
|
|
4681
|
-
await this.loadPage(false);
|
|
4682
|
-
}
|
|
4683
|
-
}
|
|
4684
4680
|
resetState() {
|
|
4685
4681
|
this.items.set([]);
|
|
4686
4682
|
this.hasMoreData.set(true);
|
|
@@ -4760,9 +4756,6 @@ class MyTeamPopupComponent {
|
|
|
4760
4756
|
this.dataScrollView?.instance?.update();
|
|
4761
4757
|
const hasMore = this.loadedCount < this.totalCount && pageData.length > 0;
|
|
4762
4758
|
this.hasMoreData.set(hasMore);
|
|
4763
|
-
if (reset) {
|
|
4764
|
-
await this.loadRemainingPagesIfNeeded();
|
|
4765
|
-
}
|
|
4766
4759
|
}
|
|
4767
4760
|
catch (err) {
|
|
4768
4761
|
this.errorOccurred.emit(err?.error?.ResponseData?.Errors?.[0]?.Message);
|
|
@@ -4782,13 +4775,10 @@ class MyTeamPopupComponent {
|
|
|
4782
4775
|
await this.loadPage(true);
|
|
4783
4776
|
return;
|
|
4784
4777
|
}
|
|
4785
|
-
if (!reset) {
|
|
4786
|
-
await this.loadRemainingPagesIfNeeded();
|
|
4787
|
-
}
|
|
4788
4778
|
}
|
|
4789
4779
|
}
|
|
4790
4780
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamPopupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4791
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: MyTeamPopupComponent, isStandalone: true, selector: "hr-my-team-popup", inputs: { baseUrl: { classPropertyName: "baseUrl", publicName: "baseUrl", isSignal: true, isRequired: true, transformFunction: null }, showGrade: { classPropertyName: "showGrade", publicName: "showGrade", isSignal: true, isRequired: false, transformFunction: null }, showPropertySymbol: { classPropertyName: "showPropertySymbol", publicName: "showPropertySymbol", isSignal: true, isRequired: false, transformFunction: null }, phoneIcon: { classPropertyName: "phoneIcon", publicName: "phoneIcon", isSignal: true, isRequired: false, transformFunction: null }, emailIcon: { classPropertyName: "emailIcon", publicName: "emailIcon", isSignal: true, isRequired: false, transformFunction: null }, headerRowClass: { classPropertyName: "headerRowClass", publicName: "headerRowClass", isSignal: true, isRequired: false, transformFunction: null }, switchContainerClass: { classPropertyName: "switchContainerClass", publicName: "switchContainerClass", isSignal: true, isRequired: false, transformFunction: null }, switchInputClass: { classPropertyName: "switchInputClass", publicName: "switchInputClass", isSignal: true, isRequired: false, transformFunction: null }, switchLabelClass: { classPropertyName: "switchLabelClass", publicName: "switchLabelClass", isSignal: true, isRequired: false, transformFunction: null }, scrollViewClass: { classPropertyName: "scrollViewClass", publicName: "scrollViewClass", isSignal: true, isRequired: false, transformFunction: null }, emptyStateClass: { classPropertyName: "emptyStateClass", publicName: "emptyStateClass", isSignal: true, isRequired: false, transformFunction: null }, groupHeaderClass: { classPropertyName: "groupHeaderClass", publicName: "groupHeaderClass", isSignal: true, isRequired: false, transformFunction: null }, employeeCardClass: { classPropertyName: "employeeCardClass", publicName: "employeeCardClass", isSignal: true, isRequired: false, transformFunction: null }, employeeCardHeight: { classPropertyName: "employeeCardHeight", publicName: "employeeCardHeight", isSignal: true, isRequired: false, transformFunction: null }, contactContainerClass: { classPropertyName: "contactContainerClass", publicName: "contactContainerClass", isSignal: true, isRequired: false, transformFunction: null }, contactTitleClass: { classPropertyName: "contactTitleClass", publicName: "contactTitleClass", isSignal: true, isRequired: false, transformFunction: null }, contactRowClass: { classPropertyName: "contactRowClass", publicName: "contactRowClass", isSignal: true, isRequired: false, transformFunction: null }, emailRowClass: { classPropertyName: "emailRowClass", publicName: "emailRowClass", isSignal: true, isRequired: false, transformFunction: null }, contactIconClass: { classPropertyName: "contactIconClass", publicName: "contactIconClass", isSignal: true, isRequired: false, transformFunction: null }, emailTextClass: { classPropertyName: "emailTextClass", publicName: "emailTextClass", isSignal: true, isRequired: false, transformFunction: null }, emailPlaceholderClass: { classPropertyName: "emailPlaceholderClass", publicName: "emailPlaceholderClass", isSignal: true, isRequired: false, transformFunction: null }, groupedListClass: { classPropertyName: "groupedListClass", publicName: "groupedListClass", isSignal: true, isRequired: false, transformFunction: null }, employeeRowClass: { classPropertyName: "employeeRowClass", publicName: "employeeRowClass", isSignal: true, isRequired: false, transformFunction: null }, employeeInfoColumnClass: { classPropertyName: "employeeInfoColumnClass", publicName: "employeeInfoColumnClass", isSignal: true, isRequired: false, transformFunction: null }, contactColumnClass: { classPropertyName: "contactColumnClass", publicName: "contactColumnClass", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, viewQueries: [{ propertyName: "dataScrollView", first: true, predicate: ["dataScrollView"], descendants: true }], ngImport: i0, template: "<dx-popup\n [visible]=\"isPopupVisible()\"\n [width]=\"'755px'\"\n [height]=\"'680px'\"\n [showCloseButton]=\"true\"\n [showTitle]=\"true\"\n [title]=\"'MyTeam' | translate\"\n shadingColor=\"rgba(0,0,0,0.4)\"\n (onShowing)=\"loadPage(true)\"\n (onHiding)=\"closePopup()\"\n>\n <ng-template #employeeCardTemplate let-employee>\n <div [class]=\"employeeCardClass()\" [style.height]=\"employeeCardHeight()\">\n <div [class]=\"employeeRowClass()\">\n <div [class]=\"employeeInfoColumnClass()\">\n <app-employee-main-info-card\n [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\n [searchValue]=\"searchValue()\"\n [showGrade]=\"showGrade()\"\n [showPropertySymbol]=\"showPropertySymbol()\"\n [showChangeEmployeeButton]=\"false\"\n ></app-employee-main-info-card>\n </div>\n <div [class]=\"contactColumnClass()\">\n <div [class]=\"contactContainerClass()\">\n <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\n <span [class]=\"emailRowClass()\">\n <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\n @if (hasEmployeeEmail(employee)) {\n <a\n [class]=\"emailTextClass()\"\n [href]=\"'mailto:' + getEmployeeEmailDisplay(employee)\"\n [title]=\"getEmployeeEmailDisplay(employee)\"\n [innerHTML]=\"getEmployeeEmailDisplay(employee)\"\n ></a>\n } @else {\n <span [class]=\"emailPlaceholderClass()\">-</span>\n }\n </span>\n <span [class]=\"contactRowClass()\">\n <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\n <span [title]=\"getEmployeePhoneDisplay(employee)\" [innerHTML]=\"getEmployeePhoneDisplay(employee)\"></span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div class=\"d-flex flex-column h-100 overflow-hidden position-relative\">\n <div [class]=\"headerRowClass()\">\n <div [class]=\"switchContainerClass()\">\n <input\n [class]=\"switchInputClass()\"\n type=\"checkbox\"\n role=\"switch\"\n id=\"myTeamDirectOnlySwitch\"\n [checked]=\"showAllSubordinates()\"\n (change)=\"onToggleChange($event)\"\n />\n <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\n {{ 'ShowAllSubordinates' | translate }}\n </label>\n </div>\n <dx-text-box\n [value]=\"searchValue()\"\n [placeholder]=\"'Search...' | translate\"\n [width]=\"'250px'\"\n mode=\"search\"\n (onValueChanged)=\"onSearchChanged($event.value)\"\n ></dx-text-box>\n </div>\n\n <div class=\"flex-grow-1 overflow-hidden\">\n <dx-scroll-view\n #dataScrollView\n [height]=\"'100%'\"\n [width]=\"'100%'\"\n [direction]=\"'vertical'\"\n [useNative]=\"false\"\n [elementAttr]=\"{ class: scrollViewClass() }\"\n [scrollByThumb]=\"true\"\n [showScrollbar]=\"'always'\"\n [bounceEnabled]=\"false\"\n (onReachBottom)=\"onReachBottom()\"\n >\n <div [class]=\"groupedListClass()\">\n @if (items().length === 0 && !isLoadingVisible()) {\n <div [class]=\"emptyStateClass()\">\n {{ 'NoDataToDisplay' | translate }}\n </div>\n } @else if (items().length > 0) {\n @for (group of items(); track group.adminUnitName) {\n @if (showAllSubordinates()) {\n <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\n }\n @for (emp of group.employees; track emp.EmployeeNumber) {\n <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\n }\n }\n }\n </div>\n </dx-scroll-view>\n </div>\n\n @if (isLoadingVisible()) {\n <div class=\"position-absolute top-50 start-50 translate-middle z-3\">\n <dx-load-indicator [visible]=\"true\"></dx-load-indicator>\n </div>\n }\n </div>\n</dx-popup>\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i1$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "ngmodule", type: DxTextBoxModule }, { kind: "component", type: i1$1.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i1$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadIndicatorModule }, { kind: "component", type: i1$1.DxLoadIndicatorComponent, selector: "dx-load-indicator", inputs: ["animationType", "elementAttr", "height", "hint", "indicatorSrc", "rtlEnabled", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "animationTypeChange", "elementAttrChange", "heightChange", "hintChange", "indicatorSrcChange", "rtlEnabledChange", "visibleChange", "widthChange"] }, { kind: "component", type: EmployeeMainInfoCardComponent, selector: "app-employee-main-info-card", inputs: ["employeeMainInfo", "searchValue", "badgeClass", "badgeImageClass", "badgeWidth", "badgeHeight", "employeeInfoContainerClass", "employeeDetailsClass", "employeeNameContainerClass", "employeeNameClass", "employeePositionClass", "employeeGradeClass", "showGrade", "showPropertySymbol", "showChangeEmployeeButton", "alignCenter"], outputs: ["ChangeEmployeeButtonHandler"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: HRTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4781
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: MyTeamPopupComponent, isStandalone: true, selector: "hr-my-team-popup", inputs: { baseUrl: { classPropertyName: "baseUrl", publicName: "baseUrl", isSignal: true, isRequired: true, transformFunction: null }, popupHeight: { classPropertyName: "popupHeight", publicName: "popupHeight", isSignal: true, isRequired: false, transformFunction: null }, showGrade: { classPropertyName: "showGrade", publicName: "showGrade", isSignal: true, isRequired: false, transformFunction: null }, showPropertySymbol: { classPropertyName: "showPropertySymbol", publicName: "showPropertySymbol", isSignal: true, isRequired: false, transformFunction: null }, phoneIcon: { classPropertyName: "phoneIcon", publicName: "phoneIcon", isSignal: true, isRequired: false, transformFunction: null }, emailIcon: { classPropertyName: "emailIcon", publicName: "emailIcon", isSignal: true, isRequired: false, transformFunction: null }, headerRowClass: { classPropertyName: "headerRowClass", publicName: "headerRowClass", isSignal: true, isRequired: false, transformFunction: null }, switchContainerClass: { classPropertyName: "switchContainerClass", publicName: "switchContainerClass", isSignal: true, isRequired: false, transformFunction: null }, switchInputClass: { classPropertyName: "switchInputClass", publicName: "switchInputClass", isSignal: true, isRequired: false, transformFunction: null }, switchLabelClass: { classPropertyName: "switchLabelClass", publicName: "switchLabelClass", isSignal: true, isRequired: false, transformFunction: null }, scrollViewClass: { classPropertyName: "scrollViewClass", publicName: "scrollViewClass", isSignal: true, isRequired: false, transformFunction: null }, emptyStateClass: { classPropertyName: "emptyStateClass", publicName: "emptyStateClass", isSignal: true, isRequired: false, transformFunction: null }, groupHeaderClass: { classPropertyName: "groupHeaderClass", publicName: "groupHeaderClass", isSignal: true, isRequired: false, transformFunction: null }, employeeCardClass: { classPropertyName: "employeeCardClass", publicName: "employeeCardClass", isSignal: true, isRequired: false, transformFunction: null }, employeeCardHeight: { classPropertyName: "employeeCardHeight", publicName: "employeeCardHeight", isSignal: true, isRequired: false, transformFunction: null }, contactContainerClass: { classPropertyName: "contactContainerClass", publicName: "contactContainerClass", isSignal: true, isRequired: false, transformFunction: null }, contactTitleClass: { classPropertyName: "contactTitleClass", publicName: "contactTitleClass", isSignal: true, isRequired: false, transformFunction: null }, contactRowClass: { classPropertyName: "contactRowClass", publicName: "contactRowClass", isSignal: true, isRequired: false, transformFunction: null }, emailRowClass: { classPropertyName: "emailRowClass", publicName: "emailRowClass", isSignal: true, isRequired: false, transformFunction: null }, contactIconClass: { classPropertyName: "contactIconClass", publicName: "contactIconClass", isSignal: true, isRequired: false, transformFunction: null }, emailTextClass: { classPropertyName: "emailTextClass", publicName: "emailTextClass", isSignal: true, isRequired: false, transformFunction: null }, emailPlaceholderClass: { classPropertyName: "emailPlaceholderClass", publicName: "emailPlaceholderClass", isSignal: true, isRequired: false, transformFunction: null }, groupedListClass: { classPropertyName: "groupedListClass", publicName: "groupedListClass", isSignal: true, isRequired: false, transformFunction: null }, employeeRowClass: { classPropertyName: "employeeRowClass", publicName: "employeeRowClass", isSignal: true, isRequired: false, transformFunction: null }, employeeInfoColumnClass: { classPropertyName: "employeeInfoColumnClass", publicName: "employeeInfoColumnClass", isSignal: true, isRequired: false, transformFunction: null }, contactColumnClass: { classPropertyName: "contactColumnClass", publicName: "contactColumnClass", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoadingChanged: "isLoadingChanged", errorOccurred: "errorOccurred" }, viewQueries: [{ propertyName: "dataScrollView", first: true, predicate: ["dataScrollView"], descendants: true }], ngImport: i0, template: "<dx-popup\n [visible]=\"isPopupVisible()\"\n [width]=\"'755px'\"\n [height]=\"popupHeight()\"\n [showCloseButton]=\"true\"\n [showTitle]=\"true\"\n [title]=\"'MyTeam' | translate\"\n shadingColor=\"rgba(0,0,0,0.4)\"\n (onShowing)=\"loadPage(true)\"\n (onHiding)=\"closePopup()\"\n>\n <ng-template #employeeCardTemplate let-employee>\n <div [class]=\"employeeCardClass()\" [style.height]=\"employeeCardHeight()\">\n <div [class]=\"employeeRowClass()\">\n <div [class]=\"employeeInfoColumnClass()\">\n <app-employee-main-info-card\n [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\n [searchValue]=\"searchValue()\"\n [showGrade]=\"showGrade()\"\n [showPropertySymbol]=\"showPropertySymbol()\"\n [showChangeEmployeeButton]=\"false\"\n ></app-employee-main-info-card>\n </div>\n <div [class]=\"contactColumnClass()\">\n <div [class]=\"contactContainerClass()\">\n <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\n <span [class]=\"emailRowClass()\">\n <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\n @if (hasEmployeeEmail(employee)) {\n <a\n [class]=\"emailTextClass()\"\n [href]=\"'mailto:' + getEmployeeEmailDisplay(employee)\"\n [title]=\"getEmployeeEmailDisplay(employee)\"\n [innerHTML]=\"getEmployeeEmailDisplay(employee)\"\n ></a>\n } @else {\n <span [class]=\"emailPlaceholderClass()\">-</span>\n }\n </span>\n <span [class]=\"contactRowClass()\">\n <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\n <span [title]=\"getEmployeePhoneDisplay(employee)\" [innerHTML]=\"getEmployeePhoneDisplay(employee)\"></span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div class=\"d-flex flex-column h-100 overflow-hidden position-relative\">\n <div [class]=\"headerRowClass()\">\n <div [class]=\"switchContainerClass()\">\n <input\n [class]=\"switchInputClass()\"\n type=\"checkbox\"\n role=\"switch\"\n id=\"myTeamDirectOnlySwitch\"\n [checked]=\"showAllSubordinates()\"\n (change)=\"onToggleChange($event)\"\n />\n <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\n {{ 'ShowAllSubordinates' | translate }}\n </label>\n </div>\n <dx-text-box\n [value]=\"searchValue()\"\n [placeholder]=\"'Search...' | translate\"\n [width]=\"'250px'\"\n mode=\"search\"\n (onValueChanged)=\"onSearchChanged($event.value)\"\n ></dx-text-box>\n </div>\n\n <div class=\"flex-grow-1 overflow-hidden\">\n <dx-scroll-view\n #dataScrollView\n [height]=\"'100%'\"\n [width]=\"'100%'\"\n [direction]=\"'vertical'\"\n [useNative]=\"false\"\n [elementAttr]=\"{ class: scrollViewClass() }\"\n [scrollByThumb]=\"true\"\n [showScrollbar]=\"'always'\"\n [bounceEnabled]=\"false\"\n (onReachBottom)=\"onReachBottom()\"\n >\n <div [class]=\"groupedListClass()\">\n @if (items().length === 0 && !isLoadingVisible()) {\n <div [class]=\"emptyStateClass()\">\n {{ 'NoDataToDisplay' | translate }}\n </div>\n } @else if (items().length > 0) {\n @for (group of items(); track group.adminUnitName) {\n @if (showAllSubordinates()) {\n <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\n }\n @for (emp of group.employees; track emp.EmployeeNumber) {\n <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\n }\n }\n }\n </div>\n </dx-scroll-view>\n </div>\n\n @if (isLoadingVisible()) {\n <div class=\"position-absolute top-50 start-50 translate-middle z-3\">\n <dx-load-indicator [visible]=\"true\"></dx-load-indicator>\n </div>\n }\n </div>\n</dx-popup>\n", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1$2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"], outputs: ["iconChange", "titleChange", "animationChange", "maskChange", "flipChange", "sizeChange", "pullChange", "borderChange", "inverseChange", "symbolChange", "rotateChange", "fixedWidthChange", "transformChange", "a11yRoleChange"] }, { kind: "ngmodule", type: DxPopupModule }, { kind: "component", type: i1$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "container", "contentTemplate", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "enableBodyScroll", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "containerChange", "contentTemplateChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "enableBodyScrollChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "ngmodule", type: DxTextBoxModule }, { kind: "component", type: i1$1.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isDirty", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isDirtyChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "ngmodule", type: DxScrollViewModule }, { kind: "component", type: i1$1.DxScrollViewComponent, selector: "dx-scroll-view", inputs: ["bounceEnabled", "direction", "disabled", "elementAttr", "height", "pulledDownText", "pullingDownText", "reachBottomText", "refreshingText", "rtlEnabled", "scrollByContent", "scrollByThumb", "showScrollbar", "useNative", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "onPullDown", "onReachBottom", "onScroll", "onUpdated", "bounceEnabledChange", "directionChange", "disabledChange", "elementAttrChange", "heightChange", "pulledDownTextChange", "pullingDownTextChange", "reachBottomTextChange", "refreshingTextChange", "rtlEnabledChange", "scrollByContentChange", "scrollByThumbChange", "showScrollbarChange", "useNativeChange", "widthChange"] }, { kind: "ngmodule", type: DxLoadIndicatorModule }, { kind: "component", type: i1$1.DxLoadIndicatorComponent, selector: "dx-load-indicator", inputs: ["animationType", "elementAttr", "height", "hint", "indicatorSrc", "rtlEnabled", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "animationTypeChange", "elementAttrChange", "heightChange", "hintChange", "indicatorSrcChange", "rtlEnabledChange", "visibleChange", "widthChange"] }, { kind: "component", type: EmployeeMainInfoCardComponent, selector: "app-employee-main-info-card", inputs: ["employeeMainInfo", "searchValue", "badgeClass", "badgeImageClass", "badgeWidth", "badgeHeight", "employeeInfoContainerClass", "employeeDetailsClass", "employeeNameContainerClass", "employeeNameClass", "employeePositionClass", "employeeGradeClass", "showGrade", "showPropertySymbol", "showChangeEmployeeButton", "alignCenter"], outputs: ["ChangeEmployeeButtonHandler"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: HighlightPipe, name: "highlight" }, { kind: "pipe", type: HRTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4792
4782
|
}
|
|
4793
4783
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: MyTeamPopupComponent, decorators: [{
|
|
4794
4784
|
type: Component,
|
|
@@ -4802,11 +4792,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImpo
|
|
|
4802
4792
|
NgTemplateOutlet,
|
|
4803
4793
|
HighlightPipe,
|
|
4804
4794
|
HRTranslatePipe,
|
|
4805
|
-
], template: "<dx-popup\n [visible]=\"isPopupVisible()\"\n [width]=\"'755px'\"\n [height]=\"
|
|
4795
|
+
], template: "<dx-popup\n [visible]=\"isPopupVisible()\"\n [width]=\"'755px'\"\n [height]=\"popupHeight()\"\n [showCloseButton]=\"true\"\n [showTitle]=\"true\"\n [title]=\"'MyTeam' | translate\"\n shadingColor=\"rgba(0,0,0,0.4)\"\n (onShowing)=\"loadPage(true)\"\n (onHiding)=\"closePopup()\"\n>\n <ng-template #employeeCardTemplate let-employee>\n <div [class]=\"employeeCardClass()\" [style.height]=\"employeeCardHeight()\">\n <div [class]=\"employeeRowClass()\">\n <div [class]=\"employeeInfoColumnClass()\">\n <app-employee-main-info-card\n [employeeMainInfo]=\"toEmployeeMainInfo(employee)\"\n [searchValue]=\"searchValue()\"\n [showGrade]=\"showGrade()\"\n [showPropertySymbol]=\"showPropertySymbol()\"\n [showChangeEmployeeButton]=\"false\"\n ></app-employee-main-info-card>\n </div>\n <div [class]=\"contactColumnClass()\">\n <div [class]=\"contactContainerClass()\">\n <span [class]=\"contactTitleClass()\">{{ 'ContactInfo' | translate }}:</span>\n <span [class]=\"emailRowClass()\">\n <fa-icon [icon]=\"emailIcon()\" [class]=\"contactIconClass()\"></fa-icon>\n @if (hasEmployeeEmail(employee)) {\n <a\n [class]=\"emailTextClass()\"\n [href]=\"'mailto:' + getEmployeeEmailDisplay(employee)\"\n [title]=\"getEmployeeEmailDisplay(employee)\"\n [innerHTML]=\"getEmployeeEmailDisplay(employee)\"\n ></a>\n } @else {\n <span [class]=\"emailPlaceholderClass()\">-</span>\n }\n </span>\n <span [class]=\"contactRowClass()\">\n <fa-icon [icon]=\"phoneIcon()\" [class]=\"contactIconClass()\"></fa-icon>\n <span [title]=\"getEmployeePhoneDisplay(employee)\" [innerHTML]=\"getEmployeePhoneDisplay(employee)\"></span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div class=\"d-flex flex-column h-100 overflow-hidden position-relative\">\n <div [class]=\"headerRowClass()\">\n <div [class]=\"switchContainerClass()\">\n <input\n [class]=\"switchInputClass()\"\n type=\"checkbox\"\n role=\"switch\"\n id=\"myTeamDirectOnlySwitch\"\n [checked]=\"showAllSubordinates()\"\n (change)=\"onToggleChange($event)\"\n />\n <label [class]=\"switchLabelClass()\" for=\"myTeamDirectOnlySwitch\">\n {{ 'ShowAllSubordinates' | translate }}\n </label>\n </div>\n <dx-text-box\n [value]=\"searchValue()\"\n [placeholder]=\"'Search...' | translate\"\n [width]=\"'250px'\"\n mode=\"search\"\n (onValueChanged)=\"onSearchChanged($event.value)\"\n ></dx-text-box>\n </div>\n\n <div class=\"flex-grow-1 overflow-hidden\">\n <dx-scroll-view\n #dataScrollView\n [height]=\"'100%'\"\n [width]=\"'100%'\"\n [direction]=\"'vertical'\"\n [useNative]=\"false\"\n [elementAttr]=\"{ class: scrollViewClass() }\"\n [scrollByThumb]=\"true\"\n [showScrollbar]=\"'always'\"\n [bounceEnabled]=\"false\"\n (onReachBottom)=\"onReachBottom()\"\n >\n <div [class]=\"groupedListClass()\">\n @if (items().length === 0 && !isLoadingVisible()) {\n <div [class]=\"emptyStateClass()\">\n {{ 'NoDataToDisplay' | translate }}\n </div>\n } @else if (items().length > 0) {\n @for (group of items(); track group.adminUnitName) {\n @if (showAllSubordinates()) {\n <div [class]=\"groupHeaderClass()\" [innerHTML]=\"group.adminUnitName | highlight: searchValue()\"></div>\n }\n @for (emp of group.employees; track emp.EmployeeNumber) {\n <ng-container *ngTemplateOutlet=\"employeeCardTemplate; context: { $implicit: emp }\"></ng-container>\n }\n }\n }\n </div>\n </dx-scroll-view>\n </div>\n\n @if (isLoadingVisible()) {\n <div class=\"position-absolute top-50 start-50 translate-middle z-3\">\n <dx-load-indicator [visible]=\"true\"></dx-load-indicator>\n </div>\n }\n </div>\n</dx-popup>\n" }]
|
|
4806
4796
|
}], propDecorators: { dataScrollView: [{
|
|
4807
4797
|
type: ViewChild,
|
|
4808
4798
|
args: ['dataScrollView']
|
|
4809
|
-
}], baseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseUrl", required: true }] }], isLoadingChanged: [{ type: i0.Output, args: ["isLoadingChanged"] }], errorOccurred: [{ type: i0.Output, args: ["errorOccurred"] }], showGrade: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGrade", required: false }] }], showPropertySymbol: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPropertySymbol", required: false }] }], phoneIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "phoneIcon", required: false }] }], emailIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailIcon", required: false }] }], headerRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRowClass", required: false }] }], switchContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchContainerClass", required: false }] }], switchInputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchInputClass", required: false }] }], switchLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchLabelClass", required: false }] }], scrollViewClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollViewClass", required: false }] }], emptyStateClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyStateClass", required: false }] }], groupHeaderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupHeaderClass", required: false }] }], employeeCardClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeCardClass", required: false }] }], employeeCardHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeCardHeight", required: false }] }], contactContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactContainerClass", required: false }] }], contactTitleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactTitleClass", required: false }] }], contactRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactRowClass", required: false }] }], emailRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailRowClass", required: false }] }], contactIconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactIconClass", required: false }] }], emailTextClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailTextClass", required: false }] }], emailPlaceholderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailPlaceholderClass", required: false }] }], groupedListClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupedListClass", required: false }] }], employeeRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeRowClass", required: false }] }], employeeInfoColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeInfoColumnClass", required: false }] }], contactColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactColumnClass", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }] } });
|
|
4799
|
+
}], baseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseUrl", required: true }] }], popupHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "popupHeight", required: false }] }], isLoadingChanged: [{ type: i0.Output, args: ["isLoadingChanged"] }], errorOccurred: [{ type: i0.Output, args: ["errorOccurred"] }], showGrade: [{ type: i0.Input, args: [{ isSignal: true, alias: "showGrade", required: false }] }], showPropertySymbol: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPropertySymbol", required: false }] }], phoneIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "phoneIcon", required: false }] }], emailIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailIcon", required: false }] }], headerRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerRowClass", required: false }] }], switchContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchContainerClass", required: false }] }], switchInputClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchInputClass", required: false }] }], switchLabelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "switchLabelClass", required: false }] }], scrollViewClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollViewClass", required: false }] }], emptyStateClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyStateClass", required: false }] }], groupHeaderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupHeaderClass", required: false }] }], employeeCardClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeCardClass", required: false }] }], employeeCardHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeCardHeight", required: false }] }], contactContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactContainerClass", required: false }] }], contactTitleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactTitleClass", required: false }] }], contactRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactRowClass", required: false }] }], emailRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailRowClass", required: false }] }], contactIconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactIconClass", required: false }] }], emailTextClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailTextClass", required: false }] }], emailPlaceholderClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "emailPlaceholderClass", required: false }] }], groupedListClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupedListClass", required: false }] }], employeeRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeRowClass", required: false }] }], employeeInfoColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "employeeInfoColumnClass", required: false }] }], contactColumnClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contactColumnClass", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }] } });
|
|
4810
4800
|
|
|
4811
4801
|
/*
|
|
4812
4802
|
* Public API Surface of shared-ui
|