tnx-shared 5.2.17 → 5.2.18

package/esm2020/components/common-app-component/app-root-menu/app-root-menu.component.mjs

@@ -10,10 +10,10 @@ export class AppRootMenuComponent extends ComponentBase {
         this._injector = _injector;
     }
 }
-AppRootMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppRootMenuComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
-AppRootMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: AppRootMenuComponent, selector: "app-root-menu", providers: [ComponentContextService], usesInheritance: true, ngImport: i0, template: "<span class=\"rootMenu\" *ngIf=\"rootModel.currentAppMetadata\">\r\n    <i class=\"pi pi-slack\" style=\"margin-right: 5px;\"></i>\r\n    {{rootModel.currentAppMetadata.longtitle | translate}}</span>\r\n    ", styles: [""], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i2.TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppRootMenuComponent, decorators: [{
+AppRootMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppRootMenuComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+AppRootMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: AppRootMenuComponent, selector: "app-root-menu", providers: [ComponentContextService], usesInheritance: true, ngImport: i0, template: "<span class=\"rootMenu\" *ngIf=\"rootModel.currentAppMetadata\">\r\n    <i class=\"pi pi-slack\" style=\"margin-right: 5px;\"></i>\r\n    {{rootModel.currentAppMetadata.longtitle | translate}}</span>\r\n    ", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppRootMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-root-menu', providers: [ComponentContextService], template: "<span class=\"rootMenu\" *ngIf=\"rootModel.currentAppMetadata\">\r\n    <i class=\"pi pi-slack\" style=\"margin-right: 5px;\"></i>\r\n    {{rootModel.currentAppMetadata.longtitle | translate}}</span>\r\n    ", styles: [""] }]
+            args: [{ selector: 'app-root-menu', providers: [ComponentContextService], template: "<span class=\"rootMenu\" *ngIf=\"rootModel.currentAppMetadata\">\r\n    <i class=\"pi pi-slack\" style=\"margin-right: 5px;\"></i>\r\n    {{rootModel.currentAppMetadata.longtitle | translate}}</span>\r\n    " }]
         }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXBwLXJvb3QtbWVudS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zaGFyZWQvc3JjL2xpYi9jb21wb25lbnRzL2NvbW1vbi1hcHAtY29tcG9uZW50L2FwcC1yb290LW1lbnUvYXBwLXJvb3QtbWVudS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zaGFyZWQvc3JjL2xpYi9jb21wb25lbnRzL2NvbW1vbi1hcHAtY29tcG9uZW50L2FwcC1yb290LW1lbnUvYXBwLXJvb3QtbWVudS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFZLE1BQU0sZUFBZSxDQUFDO0FBQ3BELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3pGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQzs7OztBQVFyRSxNQUFNLE9BQU8sb0JBQXFCLFNBQVEsYUFBYTtJQUVuRCxZQUNjLFNBQW1CO1FBRTdCLEtBQUssQ0FBQyxTQUFTLENBQUMsQ0FBQztRQUZQLGNBQVMsR0FBVCxTQUFTLENBQVU7SUFHakMsQ0FBQzs7aUhBTlEsb0JBQW9CO3FHQUFwQixvQkFBb0Isd0NBRmxCLENBQUMsdUJBQXVCLENBQUMsaURDUnhDLGlOQUdJOzJGRE9TLG9CQUFvQjtrQkFOaEMsU0FBUzsrQkFDSSxlQUFlLGFBR2QsQ0FBQyx1QkFBdUIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5qZWN0b3IgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tcG9uZW50Q29udGV4dFNlcnZpY2UgfSBmcm9tICcuLi8uLi8uLi9hcHAtY29udGV4dC9jb21wb25lbnQtY29udGV4dC5zZXJ2aWNlJztcclxuaW1wb3J0IHsgQ29tcG9uZW50QmFzZSB9IGZyb20gJy4uLy4uLy4uL2NsYXNzZXMvYmFzZS9jb21wb25lbnQtYmFzZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnYXBwLXJvb3QtbWVudScsXHJcbiAgICB0ZW1wbGF0ZVVybDogJy4vYXBwLXJvb3QtbWVudS5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9hcHAtcm9vdC1tZW51LmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgICBwcm92aWRlcnM6IFtDb21wb25lbnRDb250ZXh0U2VydmljZV0sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBBcHBSb290TWVudUNvbXBvbmVudCBleHRlbmRzIENvbXBvbmVudEJhc2Uge1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKFxyXG4gICAgICAgIHByb3RlY3RlZCBfaW5qZWN0b3I6IEluamVjdG9yXHJcbiAgICApIHtcclxuICAgICAgICBzdXBlcihfaW5qZWN0b3IpO1xyXG4gICAgfVxyXG59XHJcbiIsIjxzcGFuIGNsYXNzPVwicm9vdE1lbnVcIiAqbmdJZj1cInJvb3RNb2RlbC5jdXJyZW50QXBwTWV0YWRhdGFcIj5cclxuICAgIDxpIGNsYXNzPVwicGkgcGktc2xhY2tcIiBzdHlsZT1cIm1hcmdpbi1yaWdodDogNXB4O1wiPjwvaT5cclxuICAgIHt7cm9vdE1vZGVsLmN1cnJlbnRBcHBNZXRhZGF0YS5sb25ndGl0bGUgfCB0cmFuc2xhdGV9fTwvc3Bhbj5cclxuICAgICJdfQ==

package/esm2020/components/common-app-component/app-topbar-v1/app-topbar-v1.component.mjs

@@ -15,14 +15,14 @@ import * as i7 from "../../../services/user.service";
 import * as i8 from "../../../services/notifier.service";
 import * as i9 from "@ngx-translate/core";
 import * as i10 from "../../../services/customize-ui.service";
-import * as i11 from "../../tn-app-help/tn-app-help.component";
-import * as i12 from "../../tn-app-notification/tn-app-notification.component";
-import * as i13 from "../../tn-custom-scrollbar/tn-custom-scrollbar.component";
-import * as i14 from "../../tn-dialog/tn-dialog.component";
-import * as i15 from "../default-setting-form/default-data-settings.component";
-import * as i16 from "@angular/common";
-import * as i17 from "ngx-img-fallback";
-import * as i18 from "tn-custom-primeng/tooltip";
+import * as i11 from "@angular/common";
+import * as i12 from "tn-custom-primeng/tooltip";
+import * as i13 from "ngx-img-fallback";
+import * as i14 from "../default-setting-form/default-data-settings.component";
+import * as i15 from "../../tn-dialog/tn-dialog.component";
+import * as i16 from "../../tn-custom-scrollbar/tn-custom-scrollbar.component";
+import * as i17 from "../../tn-app-help/tn-app-help.component";
+import * as i18 from "../../tn-app-notification/tn-app-notification.component";
 export class AppTopBarV1Component extends ComponentBase {
     constructor(
     // public app: AppComponent,
@@ -398,9 +398,9 @@ export class AppTopBarV1Component extends ComponentBase {
         top.location.reload();
     }
 }
-AppTopBarV1Component.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppTopBarV1Component, deps: [{ token: i1.CustomRouterService }, { token: i2.Router }, { token: i3.CommonService }, { token: i4.AuthenService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i5.PermissionService }, { token: i6.EnvironmentService }, { token: i7.UserService }, { token: i8.NotifierService }, { token: i9.TranslateService }, { token: i10.CustomizeUiService }], target: i0.ɵɵFactoryTarget.Component });
-AppTopBarV1Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: AppTopBarV1Component, selector: "app-topbar-v1", providers: [ComponentContextService], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "notify", first: true, predicate: ["notify"], descendants: true, static: true }, { propertyName: "messages", first: true, predicate: ["messages"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"topbar clearfix tn-l-top-bar\">\r\n    <div class=\"topbar-left tn-l-top-bar-left\" [ngClass]=\"{'beta-version': !config.isProduction }\">\r\n        <div class=\"tn-l-left-menu-toggle-block\">\r\n            <a tabindex=\"1\" id=\"menu-button\" class=\"tn-l-left-menu-toggle\" href=\"#\"\r\n                (click)=\"_commonService.onMenuButtonClick($event)\">\r\n                <i class=\"pi pi-chevron-left\"></i>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"topbar-logo tn-l-logo-wrapper\">\r\n            <a tabindex=\"2\" href=\"javascript:\" style=\"display: inline-block;\">\r\n                <img class=\"topbar-logo tn-l-logo\" [src]=\"config.logo\" (click)=\"goToHome()\" /></a>\r\n        </div>\r\n        <div class=\"topbar-title tn-l-logo-title-block\">\r\n            <div class=\"topbar-owner\">\r\n                {{config.owner}}\r\n            </div>\r\n            <div class=\"topbar-description\">\r\n                {{config.title}}\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"setting-default-container\">\r\n        <ng-container *ngIf=\"showDefaultSetting && currentUser\">\r\n            <a tabindex=\"3\" href=\"javascript:void(0)\" class=\"tn-l-m-default-setting pi pi-cog\"\r\n                (click)=\"showDefaultSettingForm()\">\r\n            </a>\r\n            <h3 class=\"tn-l-default-detting\" (click)=\"showDefaultSettingForm()\">\r\n                {{defaultSettingModel.data.text}} <i class=\"pi pi-pencil\" style=\"margin-left:10px\"></i></h3>\r\n        </ng-container>\r\n    </div>\r\n    <div #notify class=\"notify-message\">\r\n        <marquee (mouseover)=\"handleMouseOver($event)\" (mouseout)=\"handleMouseOut($event)\">{{message}}</marquee>\r\n    </div>\r\n    <div class=\"topbar-right tn-l-top-bar-right\" [ngClass]=\"{'beta-version': !config.isProduction}\"\r\n        oncontextmenu=\"return false\">\r\n        <div class=\"tn-l-top-bar-right-block-1\">\r\n            <a tabindex=\"4\" class=\"topbar-menu-button\" id=\"topbar-menu-button\" href=\"#\"\r\n                (click)=\"_commonService.onTopbarMenuButtonClick($event)\">\r\n                <svg focusable=\"false\" class=\"tn-m-topbar-menu-toggle\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                    viewBox=\"0 0 448 512\">\r\n                    <path fill=\"currentColor\"\r\n                        d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                    </path>\r\n                </svg>\r\n                <span *ngIf=\"messages && messages.totalUnRead > 0\" class=\"topbar-badge animated rubberBand\"\r\n                    [ngClass]=\"{'topbar-badge-bounce': messages.bounceNoti}\">{{messages.totalUnRead}}</span>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"tn-l-top-bar-right-block-2\">\r\n            <ul class=\"topbar-items fadeInDown\" [ngClass]=\"{'topbar-items-visible': _commonService.topbarMenuActive}\">\r\n                <li *ngIf=\"_commonService.profileMode==='top'||_commonService.isHorizontal()\" #profile\r\n                    class=\"profile-item tn-l-top-bar-menu-item\"\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === profile}\">\r\n\r\n                    <a href=\"#\" tabindex=\"10\" class=\"UserPane tn-l-top-bar-menu-item-inner\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,profile)\">\r\n                        <div class=\"profile-image-wrapper topbar-icon-left\">\r\n                            <img class=\"profile-image tn-l-profile-img\" [src-fallback]=\"defaultAvatar\"\r\n                                [src]=\"getCurrentUserAvatar()\" />\r\n                        </div>\r\n                        <div class=\"profile-info-wrapper\">\r\n                            <div class=\"topbar-item-name-wrapper\"\r\n                                [ngClass]=\"{'not-show-position': !getCurrentUserPosition()}\">\r\n                                <span class=\"topbar-item-name tn-l-user-name\">{{getCurrentUserFullName()}}</span>\r\n                            </div>\r\n                            <div class=\"topbar-item-role-wrapper tn-l-topbar-item-role-wrapper\"><span\r\n                                    class=\"topbar-item-role\">{{getCurrentUserPosition()}}</span></div>\r\n                        </div>\r\n                        <i class=\"pi pi-user\" style=\"opacity: 0; position: absolute;\"></i>\r\n                    </a>\r\n\r\n                    <ul class=\"layout-menu fadeInDown tn-l-switcher\">\r\n                        <ng-container *ngIf=\"currentUser\">\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"#\" (click)=\"onEditInfo($event)\">\r\n                                    <i class=\"pi pi-inbox\"></i>\r\n                                    <span>Th\u01B0 m\u1EE5c c\u00E1 nh\u00E2n</span>\r\n                                </a>\r\n                            </li>\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"#\" (click)=\"onEditInfo($event)\">\r\n                                    <i class=\"pi pi-user-edit\"></i>\r\n                                    <span>C\u1EADp nh\u1EADt th\u00F4ng tin</span>\r\n                                </a>\r\n                            </li>\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"javascript:;\" (click)=\"onTopbarLogout()\">\r\n                                    <i class=\"pi pi-sign-out\"></i>\r\n                                    <span>\u0110\u0103ng xu\u1EA5t</span>\r\n                                </a>\r\n                            </li>\r\n                        </ng-container>\r\n                        <li *ngIf=\"!currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"login()\">\r\n                                <i class=\"pi pi-sign-in\"></i>\r\n                                <span>\u0110\u0103ng nh\u1EADp</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowHelp()\" #help class=\"menu-help tn-l-top-bar-menu-item\" tn-app-help>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowNotification()\" id=\"li-notifications\"\r\n                    class=\"tn-l-top-bar-menu-item\" #messages\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === messages || _commonService.activeTopbarItem === 0}\"\r\n                    tn-app-notification (openMenu)=\"_commonService.onTopbarItemClick($event,messages)\"></li>\r\n                <li id=\"li-app-switcher\" class=\"tn-l-top-bar-menu-item\" #modules\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === modules || _commonService.activeTopbarItem === 1}\">\r\n                    <a href=\"#\" tabindex=\"7\" class=\"tn-l-top-bar-menu-item-inner\" style=\"height: 30px;\"\r\n                        pTooltip=\"Danh s\u00E1ch ph\u00E2n h\u1EC7\" tooltipPosition=\"bottom\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,modules)\">\r\n                        <span class=\"topbar-icon-left tn-l-topbar-icon-left\">\r\n                            <svg focusable=\"false\" class=\"topbar-icon animated swing svgmodule\" role=\"img\"\r\n                                xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n                                <path fill=\"currentColor\"\r\n                                    d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                                </path>\r\n                            </svg>\r\n                            <!-- <i class=\"pi pi-microsoft\"></i> -->\r\n                        </span>\r\n                        <span class=\"topbar-item-name\">{{ 'Danh s\u00E1ch ph\u00E2n h\u1EC7' | translate}}</span>\r\n                    </a>\r\n                    <ul class=\"app-switcher layout-menu fadeInDown\">\r\n                        <tn-custom-scrollbar #scrollbar class=\"app-switcher-holder\">\r\n                            <li role=\"menuitem\" class=\"wrapper-appswitch\">\r\n                                <ng-container *ngFor=\"let item of appSwitcherItems; let ind = index;\">\r\n                                    <a class=\"switcher-item tn-l-switcher-item\" href=\"javascript:\"\r\n                                        (click)=\"switchApp(item, true)\">\r\n                                        <span class=\"tn-l-switcher-item-inner\">\r\n                                            <i class=\"{{item.icon}} app-switcher-item-icon tn-l-switcher-item-icon\"></i>\r\n                                            <div class=\"tn-l-switcher-item-label\">\r\n                                                {{ item.title | translate}}\r\n                                            </div>\r\n                                        </span>\r\n                                    </a>\r\n                                </ng-container>\r\n                            </li>\r\n                        </tn-custom-scrollbar>\r\n                    </ul>\r\n                </li>\r\n            </ul>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<tn-dialog *ngIf=\"defaultSettingModel.showEditForm\" [header]=\"defaultSettingModel.header | translate\"\r\n    [popupSize]=\"defaultSettingModel.popupSize\" (onHide)=\"defaultSettingModel.showEditForm = false\">\r\n    <default-data-settings #formBase (onHide)=\"defaultSettingModel.showEditForm = false;\"></default-data-settings>\r\n</tn-dialog>", styles: [".topBarSearchButton:disabled{opacity:1;background-color:#eee!important;border:1px solid #c8c8c8!important;border-right:none!important;color:#c1c1c1!important}::ng-deep app-topbar a{outline:none}input:disabled::placeholder{color:#b1b1b1}.UserPane.UserPane{display:flex}.profile-image-wrapper{order:1}.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name{margin-top:0;float:none}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{display:inline-flex;flex-direction:column;justify-content:center;order:0;text-align:right;float:none}.tn-l-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tn-l-default-detting{color:#fff;cursor:pointer;margin:0}.tn-l-left-menu-toggle-block{align-self:stretch;display:flex;align-items:center;box-shadow:0 0 5px #00000060}.tn-l-left-menu-toggle{color:#fff;padding:8px;transition:transform .25s ease-in-out}::ng-deep .layout-menu-static-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-left:0;margin-right:30px}.topbar-logo.topbar-logo.topbar-logo{float:none}.tn-l-logo.tn-l-logo.tn-l-logo.tn-l-logo{width:auto;height:40px;margin:0}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{margin:0;font-size:0;width:auto;height:auto;padding-left:8px;padding-right:8px}.tn-l-top-bar{display:flex}.topbar-owner,.topbar-description{white-space:nowrap}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:15px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:11px;text-transform:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{float:none;width:auto;display:flex}.tn-l-top-bar-left{align-items:center}.tn-m-topbar-menu-toggle{width:30px;height:28px;margin:auto;display:block}.tn-m-topbar-menu-toggle g{stroke:#fff}.tn-m-topbar-menu-toggle path{fill:#fff}.tn-l-m-default-setting{display:none}.setting-default-container{display:flex;align-items:center;justify-content:center;margin-left:30px}.notify-message{flex:1 1;overflow:hidden;margin-left:30px;display:flex;align-items:center}.notify-message>marquee{white-space:nowrap;color:#ff0;font-size:500}.search-item{margin-right:10px}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{background:#fff}.tn-l-switcher-item-label{text-shadow:none;color:#52abff;text-align:center}.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon{font-size:38px;margin:5px auto;text-shadow:none;color:#52abff}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{padding:8px}.tn-l-switcher.tn-l-switcher{margin-bottom:0}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item{width:unset;margin-top:0}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+0){border-left:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+1){border-right:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+2){border:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+1):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+2):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a span{line-height:1.2}::ng-deep .layout-wrapper app-topbar-v1 .topbar .topbar-left{box-shadow:none}::ng-deep .layout-wrapper app-topbar-v1 .wrapper-appswitch{text-align:center;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}@media (max-width: 1024px){::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item{width:unset}}@media (min-width: 1025px){.tn-l-top-bar-right{display:flex;justify-content:space-between;align-items:center}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding:0 15px}.topbar-items.topbar-items.topbar-items{margin:0;display:flex;justify-content:flex-start;flex-direction:row-reverse;align-items:center}.topbar-items.topbar-items.topbar-items,.topbar-items.topbar-items.topbar-items>li{float:none}::ng-deep .topbar .topbar-items>li>a{margin-top:0}::ng-deep .topbar .topbar-items>li>a>span>i{color:#fff;font-size:24px}.topbar .topbar-items>li>a.UserPane{height:auto;line-height:inherit;top:0}a.UserPane .profile-image.profile-image.profile-image.profile-image{margin-top:0}}@media (min-width: 1025px) and (max-width: 1400px){.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-right:19px}.search-item{margin-right:0}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding-left:15px}.topbar-items>li.profile-item{margin-left:14px}}@media (max-width: 1024px){.tn-l-m-default-setting{display:flex;align-items:center;justify-content:center;height:36px;font-size:28px;width:36px;color:#fff}.tn-l-default-detting{display:none}::ng-deep .layout-menu-static-mobile-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{text-align:left}.topbar .topbar-right #topbar-menu-button{display:flex;align-items:center;width:36px;justify-content:center}.tn-l-top-bar-right-block-1{display:flex}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{padding-left:5px;padding-right:5px}.tn-l-top-bar-left,.tn-l-logo-title-block,.topbar-owner,.topbar-description{overflow:hidden}.topbar-owner,.topbar-description{text-overflow:ellipsis}.tn-l-top-bar-menu-item:empty{display:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{padding-left:0;padding-right:0}.topbar-title.topbar-title.topbar-title.topbar-title{margin:0}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:14px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:10px}.tn-l-top-bar-right{flex:1;position:relative}.topbar-menu-button span.topbar-badge{right:-4px}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{display:flex;padding:0 .5em;align-items:center;justify-content:flex-end}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right #topbar-menu-button{position:relative;margin-left:.5em;top:0;right:0}.app-switcher.layout-menu.layout-menu.layout-menu.layout-menu{width:270px}.profile-image-wrapper{order:0}.tn-l-user-name{width:220px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep app-topbar .tn-l-top-bar-menu-item .topbar-icon-left{display:flex;justify-content:center;align-items:center}.tn-l-topbar-item-role-wrapper{display:none}}\n"], components: [{ type: i11.TnAppHelpComponent, selector: "li[tn-app-help]" }, { type: i12.TnAppNotificationComponent, selector: "li[tn-app-notification]", outputs: ["openMenu"] }, { type: i13.TnCustomScrollbarComponent, selector: "tn-custom-scrollbar", inputs: ["style", "useDefaultScrollBar", "autoMode", "class", "config", "whiteBackGround", "showScrollHorizontal"], outputs: ["scrollY", "scrollUp", "scrollDown", "scrollLeft", "scrollRight", "scrollYReachEnd", "scrollYReachStart", "scrollXReachEnd", "scrollXReachStart"] }, { type: i14.TnDialogComponent, selector: "tn-dialog", inputs: ["maskClass", "styleClass", "scrollBarStyleClass", "useDefaultScrollBar", "visible", "disabledButton", "modal", "header", "popupSize", "closeOnEscape", "showFooter", "positionTop", "minY", "hiddenSave", "maximizable"], outputs: ["onSave", "onCancel", "onShow", "onHide"] }, { type: i15.DefaultDataSettingsComponent, selector: "default-data-settings", inputs: ["settingKey"], outputs: ["onShow", "onHide"] }], directives: [{ type: i16.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i17.ImgFallbackDirective, selector: "[src-fallback]", inputs: ["src-fallback"], outputs: ["loaded"] }, { type: i18.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "tooltipZIndex", "escape", "tooltipDisabled", "pTooltip", "positionStyle", "tooltipStyleClass", "showDelay", "hideDelay", "life"] }, { type: i16.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i9.TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppTopBarV1Component, decorators: [{
+AppTopBarV1Component.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppTopBarV1Component, deps: [{ token: i1.CustomRouterService }, { token: i2.Router }, { token: i3.CommonService }, { token: i4.AuthenService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i5.PermissionService }, { token: i6.EnvironmentService }, { token: i7.UserService }, { token: i8.NotifierService }, { token: i9.TranslateService }, { token: i10.CustomizeUiService }], target: i0.ɵɵFactoryTarget.Component });
+AppTopBarV1Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: AppTopBarV1Component, selector: "app-topbar-v1", providers: [ComponentContextService], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "notify", first: true, predicate: ["notify"], descendants: true, static: true }, { propertyName: "messages", first: true, predicate: ["messages"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"topbar clearfix tn-l-top-bar\">\r\n    <div class=\"topbar-left tn-l-top-bar-left\" [ngClass]=\"{'beta-version': !config.isProduction }\">\r\n        <div class=\"tn-l-left-menu-toggle-block\">\r\n            <a tabindex=\"1\" id=\"menu-button\" class=\"tn-l-left-menu-toggle\" href=\"#\"\r\n                (click)=\"_commonService.onMenuButtonClick($event)\">\r\n                <i class=\"pi pi-chevron-left\"></i>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"topbar-logo tn-l-logo-wrapper\">\r\n            <a tabindex=\"2\" href=\"javascript:\" style=\"display: inline-block;\">\r\n                <img class=\"topbar-logo tn-l-logo\" [src]=\"config.logo\" (click)=\"goToHome()\" /></a>\r\n        </div>\r\n        <div class=\"topbar-title tn-l-logo-title-block\">\r\n            <div class=\"topbar-owner\">\r\n                {{config.owner}}\r\n            </div>\r\n            <div class=\"topbar-description\">\r\n                {{config.title}}\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"setting-default-container\">\r\n        <ng-container *ngIf=\"showDefaultSetting && currentUser\">\r\n            <a tabindex=\"3\" href=\"javascript:void(0)\" class=\"tn-l-m-default-setting pi pi-cog\"\r\n                (click)=\"showDefaultSettingForm()\">\r\n            </a>\r\n            <h3 class=\"tn-l-default-detting\" (click)=\"showDefaultSettingForm()\">\r\n                {{defaultSettingModel.data.text}} <i class=\"pi pi-pencil\" style=\"margin-left:10px\"></i></h3>\r\n        </ng-container>\r\n    </div>\r\n    <div #notify class=\"notify-message\">\r\n        <marquee (mouseover)=\"handleMouseOver($event)\" (mouseout)=\"handleMouseOut($event)\">{{message}}</marquee>\r\n    </div>\r\n    <div class=\"topbar-right tn-l-top-bar-right\" [ngClass]=\"{'beta-version': !config.isProduction}\"\r\n        oncontextmenu=\"return false\">\r\n        <div class=\"tn-l-top-bar-right-block-1\">\r\n            <a tabindex=\"4\" class=\"topbar-menu-button\" id=\"topbar-menu-button\" href=\"#\"\r\n                (click)=\"_commonService.onTopbarMenuButtonClick($event)\">\r\n                <svg focusable=\"false\" class=\"tn-m-topbar-menu-toggle\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                    viewBox=\"0 0 448 512\">\r\n                    <path fill=\"currentColor\"\r\n                        d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                    </path>\r\n                </svg>\r\n                <span *ngIf=\"messages && messages.totalUnRead > 0\" class=\"topbar-badge animated rubberBand\"\r\n                    [ngClass]=\"{'topbar-badge-bounce': messages.bounceNoti}\">{{messages.totalUnRead}}</span>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"tn-l-top-bar-right-block-2\">\r\n            <ul class=\"topbar-items fadeInDown\" [ngClass]=\"{'topbar-items-visible': _commonService.topbarMenuActive}\">\r\n                <li *ngIf=\"_commonService.profileMode==='top'||_commonService.isHorizontal()\" #profile\r\n                    class=\"profile-item tn-l-top-bar-menu-item\"\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === profile}\">\r\n\r\n                    <a href=\"#\" tabindex=\"10\" class=\"UserPane tn-l-top-bar-menu-item-inner\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,profile)\">\r\n                        <div class=\"profile-image-wrapper topbar-icon-left\">\r\n                            <img class=\"profile-image tn-l-profile-img\" [src-fallback]=\"defaultAvatar\"\r\n                                [src]=\"getCurrentUserAvatar()\" />\r\n                        </div>\r\n                        <div class=\"profile-info-wrapper\">\r\n                            <div class=\"topbar-item-name-wrapper\"\r\n                                [ngClass]=\"{'not-show-position': !getCurrentUserPosition()}\">\r\n                                <span class=\"topbar-item-name tn-l-user-name\">{{getCurrentUserFullName()}}</span>\r\n                            </div>\r\n                            <div class=\"topbar-item-role-wrapper tn-l-topbar-item-role-wrapper\"><span\r\n                                    class=\"topbar-item-role\">{{getCurrentUserPosition()}}</span></div>\r\n                        </div>\r\n                        <i class=\"pi pi-user\" style=\"opacity: 0; position: absolute;\"></i>\r\n                    </a>\r\n\r\n                    <ul class=\"layout-menu fadeInDown tn-l-switcher\">\r\n                        <ng-container *ngIf=\"currentUser\">\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"#\" (click)=\"onEditInfo($event)\">\r\n                                    <i class=\"pi pi-inbox\"></i>\r\n                                    <span>Th\u01B0 m\u1EE5c c\u00E1 nh\u00E2n</span>\r\n                                </a>\r\n                            </li>\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"#\" (click)=\"onEditInfo($event)\">\r\n                                    <i class=\"pi pi-user-edit\"></i>\r\n                                    <span>C\u1EADp nh\u1EADt th\u00F4ng tin</span>\r\n                                </a>\r\n                            </li>\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"javascript:;\" (click)=\"onTopbarLogout()\">\r\n                                    <i class=\"pi pi-sign-out\"></i>\r\n                                    <span>\u0110\u0103ng xu\u1EA5t</span>\r\n                                </a>\r\n                            </li>\r\n                        </ng-container>\r\n                        <li *ngIf=\"!currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"login()\">\r\n                                <i class=\"pi pi-sign-in\"></i>\r\n                                <span>\u0110\u0103ng nh\u1EADp</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowHelp()\" #help class=\"menu-help tn-l-top-bar-menu-item\" tn-app-help>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowNotification()\" id=\"li-notifications\"\r\n                    class=\"tn-l-top-bar-menu-item\" #messages\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === messages || _commonService.activeTopbarItem === 0}\"\r\n                    tn-app-notification (openMenu)=\"_commonService.onTopbarItemClick($event,messages)\"></li>\r\n                <li id=\"li-app-switcher\" class=\"tn-l-top-bar-menu-item\" #modules\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === modules || _commonService.activeTopbarItem === 1}\">\r\n                    <a href=\"#\" tabindex=\"7\" class=\"tn-l-top-bar-menu-item-inner\" style=\"height: 30px;\"\r\n                        pTooltip=\"Danh s\u00E1ch ph\u00E2n h\u1EC7\" tooltipPosition=\"bottom\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,modules)\">\r\n                        <span class=\"topbar-icon-left tn-l-topbar-icon-left\">\r\n                            <svg focusable=\"false\" class=\"topbar-icon animated swing svgmodule\" role=\"img\"\r\n                                xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n                                <path fill=\"currentColor\"\r\n                                    d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                                </path>\r\n                            </svg>\r\n                            <!-- <i class=\"pi pi-microsoft\"></i> -->\r\n                        </span>\r\n                        <span class=\"topbar-item-name\">{{ 'Danh s\u00E1ch ph\u00E2n h\u1EC7' | translate}}</span>\r\n                    </a>\r\n                    <ul class=\"app-switcher layout-menu fadeInDown\">\r\n                        <tn-custom-scrollbar #scrollbar class=\"app-switcher-holder\">\r\n                            <li role=\"menuitem\" class=\"wrapper-appswitch\">\r\n                                <ng-container *ngFor=\"let item of appSwitcherItems; let ind = index;\">\r\n                                    <a class=\"switcher-item tn-l-switcher-item\" href=\"javascript:\"\r\n                                        (click)=\"switchApp(item, true)\">\r\n                                        <span class=\"tn-l-switcher-item-inner\">\r\n                                            <i class=\"{{item.icon}} app-switcher-item-icon tn-l-switcher-item-icon\"></i>\r\n                                            <div class=\"tn-l-switcher-item-label\">\r\n                                                {{ item.title | translate}}\r\n                                            </div>\r\n                                        </span>\r\n                                    </a>\r\n                                </ng-container>\r\n                            </li>\r\n                        </tn-custom-scrollbar>\r\n                    </ul>\r\n                </li>\r\n            </ul>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<tn-dialog *ngIf=\"defaultSettingModel.showEditForm\" [header]=\"defaultSettingModel.header | translate\"\r\n    [popupSize]=\"defaultSettingModel.popupSize\" (onHide)=\"defaultSettingModel.showEditForm = false\">\r\n    <default-data-settings #formBase (onHide)=\"defaultSettingModel.showEditForm = false;\"></default-data-settings>\r\n</tn-dialog>", styles: [".topBarSearchButton:disabled{opacity:1;background-color:#eee!important;border:1px solid #c8c8c8!important;border-right:none!important;color:#c1c1c1!important}::ng-deep app-topbar a{outline:none}input:disabled::placeholder{color:#b1b1b1}.UserPane.UserPane{display:flex}.profile-image-wrapper{order:1}.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name{margin-top:0;float:none}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{display:inline-flex;flex-direction:column;justify-content:center;order:0;text-align:right;float:none}.tn-l-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tn-l-default-detting{color:#fff;cursor:pointer;margin:0}.tn-l-left-menu-toggle-block{align-self:stretch;display:flex;align-items:center;box-shadow:0 0 5px #00000060}.tn-l-left-menu-toggle{color:#fff;padding:8px;transition:transform .25s ease-in-out}::ng-deep .layout-menu-static-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-left:0;margin-right:30px}.topbar-logo.topbar-logo.topbar-logo{float:none}.tn-l-logo.tn-l-logo.tn-l-logo.tn-l-logo{width:auto;height:40px;margin:0}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{margin:0;font-size:0;width:auto;height:auto;padding-left:8px;padding-right:8px}.tn-l-top-bar{display:flex}.topbar-owner,.topbar-description{white-space:nowrap}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:15px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:11px;text-transform:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{float:none;width:auto;display:flex}.tn-l-top-bar-left{align-items:center}.tn-m-topbar-menu-toggle{width:30px;height:28px;margin:auto;display:block}.tn-m-topbar-menu-toggle g{stroke:#fff}.tn-m-topbar-menu-toggle path{fill:#fff}.tn-l-m-default-setting{display:none}.setting-default-container{display:flex;align-items:center;justify-content:center;margin-left:30px}.notify-message{flex:1 1;overflow:hidden;margin-left:30px;display:flex;align-items:center}.notify-message>marquee{white-space:nowrap;color:#ff0;font-size:500}.search-item{margin-right:10px}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{background:#fff}.tn-l-switcher-item-label{text-shadow:none;color:#52abff;text-align:center}.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon{font-size:38px;margin:5px auto;text-shadow:none;color:#52abff}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{padding:8px}.tn-l-switcher.tn-l-switcher{margin-bottom:0}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item{width:unset;margin-top:0}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+0){border-left:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+1){border-right:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+2){border:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+1):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+2):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a span{line-height:1.2}::ng-deep .layout-wrapper app-topbar-v1 .topbar .topbar-left{box-shadow:none}::ng-deep .layout-wrapper app-topbar-v1 .wrapper-appswitch{text-align:center;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}@media (max-width: 1024px){::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item{width:unset}}@media (min-width: 1025px){.tn-l-top-bar-right{display:flex;justify-content:space-between;align-items:center}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding:0 15px}.topbar-items.topbar-items.topbar-items{margin:0;display:flex;justify-content:flex-start;flex-direction:row-reverse;align-items:center}.topbar-items.topbar-items.topbar-items,.topbar-items.topbar-items.topbar-items>li{float:none}::ng-deep .topbar .topbar-items>li>a{margin-top:0}::ng-deep .topbar .topbar-items>li>a>span>i{color:#fff;font-size:24px}.topbar .topbar-items>li>a.UserPane{height:auto;line-height:inherit;top:0}a.UserPane .profile-image.profile-image.profile-image.profile-image{margin-top:0}}@media (min-width: 1025px) and (max-width: 1400px){.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-right:19px}.search-item{margin-right:0}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding-left:15px}.topbar-items>li.profile-item{margin-left:14px}}@media (max-width: 1024px){.tn-l-m-default-setting{display:flex;align-items:center;justify-content:center;height:36px;font-size:28px;width:36px;color:#fff}.tn-l-default-detting{display:none}::ng-deep .layout-menu-static-mobile-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{text-align:left}.topbar .topbar-right #topbar-menu-button{display:flex;align-items:center;width:36px;justify-content:center}.tn-l-top-bar-right-block-1{display:flex}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{padding-left:5px;padding-right:5px}.tn-l-top-bar-left,.tn-l-logo-title-block,.topbar-owner,.topbar-description{overflow:hidden}.topbar-owner,.topbar-description{text-overflow:ellipsis}.tn-l-top-bar-menu-item:empty{display:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{padding-left:0;padding-right:0}.topbar-title.topbar-title.topbar-title.topbar-title{margin:0}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:14px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:10px}.tn-l-top-bar-right{flex:1;position:relative}.topbar-menu-button span.topbar-badge{right:-4px}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{display:flex;padding:0 .5em;align-items:center;justify-content:flex-end}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right #topbar-menu-button{position:relative;margin-left:.5em;top:0;right:0}.app-switcher.layout-menu.layout-menu.layout-menu.layout-menu{width:270px}.profile-image-wrapper{order:0}.tn-l-user-name{width:220px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep app-topbar .tn-l-top-bar-menu-item .topbar-icon-left{display:flex;justify-content:center;align-items:center}.tn-l-topbar-item-role-wrapper{display:none}}\n"], dependencies: [{ kind: "directive", type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i12.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "tooltipZIndex", "escape", "tooltipDisabled", "pTooltip", "positionStyle", "tooltipStyleClass", "showDelay", "hideDelay", "life"] }, { kind: "directive", type: i13.ImgFallbackDirective, selector: "[src-fallback]", inputs: ["src-fallback"], outputs: ["loaded"] }, { kind: "component", type: i14.DefaultDataSettingsComponent, selector: "default-data-settings", inputs: ["settingKey"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i15.TnDialogComponent, selector: "tn-dialog", inputs: ["maskClass", "styleClass", "scrollBarStyleClass", "useDefaultScrollBar", "visible", "disabledButton", "modal", "header", "popupSize", "closeOnEscape", "showFooter", "positionTop", "minY", "hiddenSave", "maximizable"], outputs: ["onSave", "onCancel", "onShow", "onHide"] }, { kind: "component", type: i16.TnCustomScrollbarComponent, selector: "tn-custom-scrollbar", inputs: ["style", "useDefaultScrollBar", "autoMode", "class", "config", "whiteBackGround", "showScrollHorizontal"], outputs: ["scrollY", "scrollUp", "scrollDown", "scrollLeft", "scrollRight", "scrollYReachEnd", "scrollYReachStart", "scrollXReachEnd", "scrollXReachStart"] }, { kind: "component", type: i17.TnAppHelpComponent, selector: "li[tn-app-help]" }, { kind: "component", type: i18.TnAppNotificationComponent, selector: "li[tn-app-notification]", outputs: ["openMenu"] }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppTopBarV1Component, decorators: [{
             type: Component,
             args: [{ selector: 'app-topbar-v1', providers: [ComponentContextService], template: "<div class=\"topbar clearfix tn-l-top-bar\">\r\n    <div class=\"topbar-left tn-l-top-bar-left\" [ngClass]=\"{'beta-version': !config.isProduction }\">\r\n        <div class=\"tn-l-left-menu-toggle-block\">\r\n            <a tabindex=\"1\" id=\"menu-button\" class=\"tn-l-left-menu-toggle\" href=\"#\"\r\n                (click)=\"_commonService.onMenuButtonClick($event)\">\r\n                <i class=\"pi pi-chevron-left\"></i>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"topbar-logo tn-l-logo-wrapper\">\r\n            <a tabindex=\"2\" href=\"javascript:\" style=\"display: inline-block;\">\r\n                <img class=\"topbar-logo tn-l-logo\" [src]=\"config.logo\" (click)=\"goToHome()\" /></a>\r\n        </div>\r\n        <div class=\"topbar-title tn-l-logo-title-block\">\r\n            <div class=\"topbar-owner\">\r\n                {{config.owner}}\r\n            </div>\r\n            <div class=\"topbar-description\">\r\n                {{config.title}}\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"setting-default-container\">\r\n        <ng-container *ngIf=\"showDefaultSetting && currentUser\">\r\n            <a tabindex=\"3\" href=\"javascript:void(0)\" class=\"tn-l-m-default-setting pi pi-cog\"\r\n                (click)=\"showDefaultSettingForm()\">\r\n            </a>\r\n            <h3 class=\"tn-l-default-detting\" (click)=\"showDefaultSettingForm()\">\r\n                {{defaultSettingModel.data.text}} <i class=\"pi pi-pencil\" style=\"margin-left:10px\"></i></h3>\r\n        </ng-container>\r\n    </div>\r\n    <div #notify class=\"notify-message\">\r\n        <marquee (mouseover)=\"handleMouseOver($event)\" (mouseout)=\"handleMouseOut($event)\">{{message}}</marquee>\r\n    </div>\r\n    <div class=\"topbar-right tn-l-top-bar-right\" [ngClass]=\"{'beta-version': !config.isProduction}\"\r\n        oncontextmenu=\"return false\">\r\n        <div class=\"tn-l-top-bar-right-block-1\">\r\n            <a tabindex=\"4\" class=\"topbar-menu-button\" id=\"topbar-menu-button\" href=\"#\"\r\n                (click)=\"_commonService.onTopbarMenuButtonClick($event)\">\r\n                <svg focusable=\"false\" class=\"tn-m-topbar-menu-toggle\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                    viewBox=\"0 0 448 512\">\r\n                    <path fill=\"currentColor\"\r\n                        d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                    </path>\r\n                </svg>\r\n                <span *ngIf=\"messages && messages.totalUnRead > 0\" class=\"topbar-badge animated rubberBand\"\r\n                    [ngClass]=\"{'topbar-badge-bounce': messages.bounceNoti}\">{{messages.totalUnRead}}</span>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"tn-l-top-bar-right-block-2\">\r\n            <ul class=\"topbar-items fadeInDown\" [ngClass]=\"{'topbar-items-visible': _commonService.topbarMenuActive}\">\r\n                <li *ngIf=\"_commonService.profileMode==='top'||_commonService.isHorizontal()\" #profile\r\n                    class=\"profile-item tn-l-top-bar-menu-item\"\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === profile}\">\r\n\r\n                    <a href=\"#\" tabindex=\"10\" class=\"UserPane tn-l-top-bar-menu-item-inner\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,profile)\">\r\n                        <div class=\"profile-image-wrapper topbar-icon-left\">\r\n                            <img class=\"profile-image tn-l-profile-img\" [src-fallback]=\"defaultAvatar\"\r\n                                [src]=\"getCurrentUserAvatar()\" />\r\n                        </div>\r\n                        <div class=\"profile-info-wrapper\">\r\n                            <div class=\"topbar-item-name-wrapper\"\r\n                                [ngClass]=\"{'not-show-position': !getCurrentUserPosition()}\">\r\n                                <span class=\"topbar-item-name tn-l-user-name\">{{getCurrentUserFullName()}}</span>\r\n                            </div>\r\n                            <div class=\"topbar-item-role-wrapper tn-l-topbar-item-role-wrapper\"><span\r\n                                    class=\"topbar-item-role\">{{getCurrentUserPosition()}}</span></div>\r\n                        </div>\r\n                        <i class=\"pi pi-user\" style=\"opacity: 0; position: absolute;\"></i>\r\n                    </a>\r\n\r\n                    <ul class=\"layout-menu fadeInDown tn-l-switcher\">\r\n                        <ng-container *ngIf=\"currentUser\">\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"#\" (click)=\"onEditInfo($event)\">\r\n                                    <i class=\"pi pi-inbox\"></i>\r\n                                    <span>Th\u01B0 m\u1EE5c c\u00E1 nh\u00E2n</span>\r\n                                </a>\r\n                            </li>\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"#\" (click)=\"onEditInfo($event)\">\r\n                                    <i class=\"pi pi-user-edit\"></i>\r\n                                    <span>C\u1EADp nh\u1EADt th\u00F4ng tin</span>\r\n                                </a>\r\n                            </li>\r\n                            <li role=\"menuitem\">\r\n                                <a href=\"javascript:;\" (click)=\"onTopbarLogout()\">\r\n                                    <i class=\"pi pi-sign-out\"></i>\r\n                                    <span>\u0110\u0103ng xu\u1EA5t</span>\r\n                                </a>\r\n                            </li>\r\n                        </ng-container>\r\n                        <li *ngIf=\"!currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"login()\">\r\n                                <i class=\"pi pi-sign-in\"></i>\r\n                                <span>\u0110\u0103ng nh\u1EADp</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowHelp()\" #help class=\"menu-help tn-l-top-bar-menu-item\" tn-app-help>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowNotification()\" id=\"li-notifications\"\r\n                    class=\"tn-l-top-bar-menu-item\" #messages\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === messages || _commonService.activeTopbarItem === 0}\"\r\n                    tn-app-notification (openMenu)=\"_commonService.onTopbarItemClick($event,messages)\"></li>\r\n                <li id=\"li-app-switcher\" class=\"tn-l-top-bar-menu-item\" #modules\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === modules || _commonService.activeTopbarItem === 1}\">\r\n                    <a href=\"#\" tabindex=\"7\" class=\"tn-l-top-bar-menu-item-inner\" style=\"height: 30px;\"\r\n                        pTooltip=\"Danh s\u00E1ch ph\u00E2n h\u1EC7\" tooltipPosition=\"bottom\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,modules)\">\r\n                        <span class=\"topbar-icon-left tn-l-topbar-icon-left\">\r\n                            <svg focusable=\"false\" class=\"topbar-icon animated swing svgmodule\" role=\"img\"\r\n                                xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n                                <path fill=\"currentColor\"\r\n                                    d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                                </path>\r\n                            </svg>\r\n                            <!-- <i class=\"pi pi-microsoft\"></i> -->\r\n                        </span>\r\n                        <span class=\"topbar-item-name\">{{ 'Danh s\u00E1ch ph\u00E2n h\u1EC7' | translate}}</span>\r\n                    </a>\r\n                    <ul class=\"app-switcher layout-menu fadeInDown\">\r\n                        <tn-custom-scrollbar #scrollbar class=\"app-switcher-holder\">\r\n                            <li role=\"menuitem\" class=\"wrapper-appswitch\">\r\n                                <ng-container *ngFor=\"let item of appSwitcherItems; let ind = index;\">\r\n                                    <a class=\"switcher-item tn-l-switcher-item\" href=\"javascript:\"\r\n                                        (click)=\"switchApp(item, true)\">\r\n                                        <span class=\"tn-l-switcher-item-inner\">\r\n                                            <i class=\"{{item.icon}} app-switcher-item-icon tn-l-switcher-item-icon\"></i>\r\n                                            <div class=\"tn-l-switcher-item-label\">\r\n                                                {{ item.title | translate}}\r\n                                            </div>\r\n                                        </span>\r\n                                    </a>\r\n                                </ng-container>\r\n                            </li>\r\n                        </tn-custom-scrollbar>\r\n                    </ul>\r\n                </li>\r\n            </ul>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<tn-dialog *ngIf=\"defaultSettingModel.showEditForm\" [header]=\"defaultSettingModel.header | translate\"\r\n    [popupSize]=\"defaultSettingModel.popupSize\" (onHide)=\"defaultSettingModel.showEditForm = false\">\r\n    <default-data-settings #formBase (onHide)=\"defaultSettingModel.showEditForm = false;\"></default-data-settings>\r\n</tn-dialog>", styles: [".topBarSearchButton:disabled{opacity:1;background-color:#eee!important;border:1px solid #c8c8c8!important;border-right:none!important;color:#c1c1c1!important}::ng-deep app-topbar a{outline:none}input:disabled::placeholder{color:#b1b1b1}.UserPane.UserPane{display:flex}.profile-image-wrapper{order:1}.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name{margin-top:0;float:none}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{display:inline-flex;flex-direction:column;justify-content:center;order:0;text-align:right;float:none}.tn-l-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tn-l-default-detting{color:#fff;cursor:pointer;margin:0}.tn-l-left-menu-toggle-block{align-self:stretch;display:flex;align-items:center;box-shadow:0 0 5px #00000060}.tn-l-left-menu-toggle{color:#fff;padding:8px;transition:transform .25s ease-in-out}::ng-deep .layout-menu-static-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-left:0;margin-right:30px}.topbar-logo.topbar-logo.topbar-logo{float:none}.tn-l-logo.tn-l-logo.tn-l-logo.tn-l-logo{width:auto;height:40px;margin:0}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{margin:0;font-size:0;width:auto;height:auto;padding-left:8px;padding-right:8px}.tn-l-top-bar{display:flex}.topbar-owner,.topbar-description{white-space:nowrap}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:15px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:11px;text-transform:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{float:none;width:auto;display:flex}.tn-l-top-bar-left{align-items:center}.tn-m-topbar-menu-toggle{width:30px;height:28px;margin:auto;display:block}.tn-m-topbar-menu-toggle g{stroke:#fff}.tn-m-topbar-menu-toggle path{fill:#fff}.tn-l-m-default-setting{display:none}.setting-default-container{display:flex;align-items:center;justify-content:center;margin-left:30px}.notify-message{flex:1 1;overflow:hidden;margin-left:30px;display:flex;align-items:center}.notify-message>marquee{white-space:nowrap;color:#ff0;font-size:500}.search-item{margin-right:10px}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{background:#fff}.tn-l-switcher-item-label{text-shadow:none;color:#52abff;text-align:center}.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon{font-size:38px;margin:5px auto;text-shadow:none;color:#52abff}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{padding:8px}.tn-l-switcher.tn-l-switcher{margin-bottom:0}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item{width:unset;margin-top:0}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+0){border-left:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+1){border-right:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+2){border:none}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+1):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item:nth-child(3n+2):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a span{line-height:1.2}::ng-deep .layout-wrapper app-topbar-v1 .topbar .topbar-left{box-shadow:none}::ng-deep .layout-wrapper app-topbar-v1 .wrapper-appswitch{text-align:center;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}@media (max-width: 1024px){::ng-deep .layout-wrapper app-topbar-v1 .layout-menu li a.switcher-item{width:unset}}@media (min-width: 1025px){.tn-l-top-bar-right{display:flex;justify-content:space-between;align-items:center}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding:0 15px}.topbar-items.topbar-items.topbar-items{margin:0;display:flex;justify-content:flex-start;flex-direction:row-reverse;align-items:center}.topbar-items.topbar-items.topbar-items,.topbar-items.topbar-items.topbar-items>li{float:none}::ng-deep .topbar .topbar-items>li>a{margin-top:0}::ng-deep .topbar .topbar-items>li>a>span>i{color:#fff;font-size:24px}.topbar .topbar-items>li>a.UserPane{height:auto;line-height:inherit;top:0}a.UserPane .profile-image.profile-image.profile-image.profile-image{margin-top:0}}@media (min-width: 1025px) and (max-width: 1400px){.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-right:19px}.search-item{margin-right:0}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding-left:15px}.topbar-items>li.profile-item{margin-left:14px}}@media (max-width: 1024px){.tn-l-m-default-setting{display:flex;align-items:center;justify-content:center;height:36px;font-size:28px;width:36px;color:#fff}.tn-l-default-detting{display:none}::ng-deep .layout-menu-static-mobile-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{text-align:left}.topbar .topbar-right #topbar-menu-button{display:flex;align-items:center;width:36px;justify-content:center}.tn-l-top-bar-right-block-1{display:flex}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{padding-left:5px;padding-right:5px}.tn-l-top-bar-left,.tn-l-logo-title-block,.topbar-owner,.topbar-description{overflow:hidden}.topbar-owner,.topbar-description{text-overflow:ellipsis}.tn-l-top-bar-menu-item:empty{display:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{padding-left:0;padding-right:0}.topbar-title.topbar-title.topbar-title.topbar-title{margin:0}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:14px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:10px}.tn-l-top-bar-right{flex:1;position:relative}.topbar-menu-button span.topbar-badge{right:-4px}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{display:flex;padding:0 .5em;align-items:center;justify-content:flex-end}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right #topbar-menu-button{position:relative;margin-left:.5em;top:0;right:0}.app-switcher.layout-menu.layout-menu.layout-menu.layout-menu{width:270px}.profile-image-wrapper{order:0}.tn-l-user-name{width:220px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep app-topbar .tn-l-top-bar-menu-item .topbar-icon-left{display:flex;justify-content:center;align-items:center}.tn-l-topbar-item-role-wrapper{display:none}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.CustomRouterService }, { type: i2.Router }, { type: i3.CommonService }, { type: i4.AuthenService }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }, { type: i5.PermissionService }, { type: i6.EnvironmentService }, { type: i7.UserService }, { type: i8.NotifierService }, { type: i9.TranslateService }, { type: i10.CustomizeUiService }]; }, propDecorators: { input: [{

package/esm2020/components/common-app-component/app-topbar-v2/app-topbar-v2.component.mjs

@@ -13,12 +13,12 @@ import * as i7 from "../../../services/user.service";
 import * as i8 from "../../../services/notifier.service";
 import * as i9 from "@ngx-translate/core";
 import * as i10 from "../../../services/customize-ui.service";
-import * as i11 from "../../tn-app-help/tn-app-help.component";
-import * as i12 from "../../tn-app-notification/tn-app-notification.component";
-import * as i13 from "../../tn-custom-scrollbar/tn-custom-scrollbar.component";
-import * as i14 from "@angular/common";
-import * as i15 from "ngx-img-fallback";
-import * as i16 from "tn-custom-primeng/tooltip";
+import * as i11 from "@angular/common";
+import * as i12 from "tn-custom-primeng/tooltip";
+import * as i13 from "ngx-img-fallback";
+import * as i14 from "../../tn-custom-scrollbar/tn-custom-scrollbar.component";
+import * as i15 from "../../tn-app-help/tn-app-help.component";
+import * as i16 from "../../tn-app-notification/tn-app-notification.component";
 export class AppTopBarV2Component extends ComponentBase {
     constructor(
     // public app: AppComponent,
@@ -391,9 +391,9 @@ export class AppTopBarV2Component extends ComponentBase {
         top.location.reload();
     }
 }
-AppTopBarV2Component.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppTopBarV2Component, deps: [{ token: i1.CustomRouterService }, { token: i2.Router }, { token: i3.CommonService }, { token: i4.AuthenService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i5.PermissionService }, { token: i6.EnvironmentService }, { token: i7.UserService }, { token: i8.NotifierService }, { token: i9.TranslateService }, { token: i10.CustomizeUiService }], target: i0.ɵɵFactoryTarget.Component });
-AppTopBarV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: AppTopBarV2Component, selector: "app-topbar-v2", providers: [ComponentContextService], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "notify", first: true, predicate: ["notify"], descendants: true, static: true }, { propertyName: "messages", first: true, predicate: ["messages"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"topbar clearfix tn-l-top-bar\">\r\n    <div class=\"topbar-left tn-l-top-bar-left\" [ngClass]=\"{'beta-version': !config.isProduction }\">\r\n        <div class=\"tn-l-left-menu-toggle-block\">\r\n            <a tabindex=\"1\" id=\"menu-button\" class=\"tn-l-left-menu-toggle\" href=\"#\"\r\n                (click)=\"_commonService.onMenuButtonClick($event)\">\r\n                <i class=\"pi pi-chevron-left\"></i>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"topbar-logo tn-l-logo-wrapper\">\r\n            <a tabindex=\"2\" href=\"javascript:\" style=\"display: inline-block;\">\r\n                <img class=\"topbar-logo tn-l-logo\" [src]=\"config.logo\" (click)=\"goToHome()\" /></a>\r\n        </div>\r\n        <div class=\"topbar-title tn-l-logo-title-block\">\r\n            <div class=\"topbar-owner\">\r\n                {{config.owner}}\r\n            </div>\r\n            <div class=\"topbar-description\">\r\n                {{config.title}}\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"setting-default-container\">\r\n        <ng-container *ngIf=\"showDefaultSetting && currentUser\">\r\n            <a tabindex=\"3\" href=\"javascript:void(0)\" class=\"tn-l-m-default-setting pi pi-cog\"\r\n                (click)=\"settingDefault()\">\r\n            </a>\r\n            <h3 class=\"tn-l-default-detting\" (click)=\"settingDefault()\">\r\n                {{defaultDataSetting}} <i class=\"pi pi-pencil\" style=\"margin-left:10px\"></i></h3>\r\n        </ng-container>\r\n    </div>\r\n    <div #notify class=\"notify-message\">\r\n        <marquee (mouseover)=\"handleMouseOver($event)\" (mouseout)=\"handleMouseOut($event)\">{{message}}</marquee>\r\n    </div>\r\n    <div class=\"topbar-right tn-l-top-bar-right\" [ngClass]=\"{'beta-version': !config.isProduction}\"\r\n        oncontextmenu=\"return false\">\r\n        <div class=\"tn-l-top-bar-right-block-1\">\r\n            <a tabindex=\"4\" class=\"topbar-menu-button\" id=\"topbar-menu-button\" href=\"#\"\r\n                (click)=\"_commonService.onTopbarMenuButtonClick($event)\">\r\n                <svg focusable=\"false\" class=\"tn-m-topbar-menu-toggle\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                    viewBox=\"0 0 448 512\">\r\n                    <path fill=\"currentColor\"\r\n                        d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                    </path>\r\n                </svg>\r\n                <span *ngIf=\"messages && messages.totalUnRead > 0\" class=\"topbar-badge animated rubberBand\"\r\n                    [ngClass]=\"{'topbar-badge-bounce': messages.bounceNoti}\">{{messages.totalUnRead}}</span>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"tn-l-top-bar-right-block-2\">\r\n            <ul class=\"topbar-items fadeInDown\" [ngClass]=\"{'topbar-items-visible': _commonService.topbarMenuActive}\">\r\n                <li #profile class=\"profile-item tn-l-top-bar-menu-item\"\r\n                    *ngIf=\"_commonService.profileMode==='top'||_commonService.isHorizontal()\"\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === profile}\">\r\n\r\n                    <a href=\"#\" tabindex=\"10\" class=\"UserPane tn-l-top-bar-menu-item-inner\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,profile)\">\r\n                        <div class=\"profile-image-wrapper topbar-icon-left\">\r\n                            <img class=\"profile-image tn-l-profile-img\" [src-fallback]=\"defaultAvatar\"\r\n                                [src]=\"getCurrentUserAvatar()\" />\r\n                        </div>\r\n                        <div class=\"profile-info-wrapper\">\r\n                            <div class=\"topbar-item-name-wrapper\"\r\n                                [ngClass]=\"{'not-show-position': !getCurrentUserPosition()}\">\r\n                                <span class=\"topbar-item-name tn-l-user-name\">{{getCurrentUserFullName()}}</span>\r\n                            </div>\r\n                            <div class=\"topbar-item-role-wrapper tn-l-topbar-item-role-wrapper\"><span\r\n                                    class=\"topbar-item-role\">{{getCurrentUserPosition()}}</span></div>\r\n                        </div>\r\n                        <i class=\"pi pi-user\" style=\"opacity: 0; position: absolute;\"></i>\r\n                    </a>\r\n\r\n                    <ul class=\"layout-menu fadeInDown tn-l-switcher\">\r\n                        <li *ngIf=\"currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"onTopbarLogout()\">\r\n                                <i class=\"pi pi-sign-out\"></i>\r\n                                <span>\u0110\u0103ng xu\u1EA5t</span>\r\n                            </a>\r\n                        </li>\r\n                        <li *ngIf=\"!currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"login()\">\r\n                                <i class=\"pi pi-sign-in\"></i>\r\n                                <span>\u0110\u0103ng nh\u1EADp</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowHelp()\" #help class=\"menu-help tn-l-top-bar-menu-item\" tn-app-help>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowNotification()\" id=\"li-notifications\"\r\n                    class=\"tn-l-top-bar-menu-item\" #messages\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === messages || _commonService.activeTopbarItem === 0}\"\r\n                    tn-app-notification (openMenu)=\"_commonService.onTopbarItemClick($event,messages)\"></li>\r\n                <li id=\"li-app-switcher\" class=\"tn-l-top-bar-menu-item\" #modules\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === modules || _commonService.activeTopbarItem === 1}\">\r\n                    <a href=\"#\" tabindex=\"7\" class=\"tn-l-top-bar-menu-item-inner\" style=\"height: 30px;\"\r\n                        pTooltip=\"Danh s\u00E1ch ph\u00E2n h\u1EC7\" tooltipPosition=\"bottom\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,modules)\">\r\n                        <span class=\"topbar-icon-left tn-l-topbar-icon-left\">\r\n                            <svg focusable=\"false\" class=\"topbar-icon animated swing svgmodule\" role=\"img\"\r\n                                xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n                                <path fill=\"currentColor\"\r\n                                    d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                                </path>\r\n                            </svg>\r\n                            <!-- <i class=\"pi pi-microsoft\"></i> -->\r\n                        </span>\r\n                        <span class=\"topbar-item-name\">{{ 'Danh s\u00E1ch ph\u00E2n h\u1EC7' | translate}}</span>\r\n                    </a>\r\n                    <ul class=\"app-switcher layout-menu fadeInDown\">\r\n                        <tn-custom-scrollbar #scrollbar class=\"app-switcher-holder\">\r\n                            <li role=\"menuitem\" class=\"wrapper-appswitch\">\r\n                                <ng-container *ngFor=\"let item of appSwitcherItems; let ind = index;\">\r\n                                    <a class=\"switcher-item tn-l-switcher-item\" href=\"javascript:\"\r\n                                        (click)=\"switchApp(item, true)\">\r\n                                        <span class=\"tn-l-switcher-item-inner\">\r\n                                            <i class=\"{{item.icon}} app-switcher-item-icon tn-l-switcher-item-icon\"></i>\r\n                                            <div class=\"tn-l-switcher-item-label\">\r\n                                                {{ item.title | translate}}\r\n                                            </div>\r\n                                        </span>\r\n                                    </a>\r\n                                </ng-container>\r\n                            </li>\r\n                        </tn-custom-scrollbar>\r\n                    </ul>\r\n                </li>\r\n            </ul>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".topBarSearchButton:disabled{opacity:1;background-color:#eee!important;border:1px solid #c8c8c8!important;border-right:none!important;color:#c1c1c1!important}::ng-deep app-topbar a{outline:none}input:disabled::placeholder{color:#b1b1b1}.UserPane.UserPane{display:flex}.profile-image-wrapper{order:1}.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name{margin-top:0;float:none}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{display:inline-flex;flex-direction:column;justify-content:center;order:0;text-align:right;float:none}.tn-l-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tn-l-default-detting{color:#fff;cursor:pointer;margin:0}.tn-l-left-menu-toggle-block{align-self:stretch;display:flex;align-items:center;box-shadow:0 0 5px #00000060}.tn-l-left-menu-toggle{color:#fff;padding:8px;transition:transform .25s ease-in-out}::ng-deep .layout-menu-static-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-left:0;margin-right:30px}.topbar-logo.topbar-logo.topbar-logo{float:none}.tn-l-logo.tn-l-logo.tn-l-logo.tn-l-logo{width:auto;height:40px;margin:0}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{margin:0;font-size:0;width:auto;height:auto;padding-left:8px;padding-right:8px}.tn-l-top-bar{display:flex}.topbar-owner,.topbar-description{white-space:nowrap}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:15px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:11px;text-transform:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{float:none;width:auto;display:flex}.tn-l-top-bar-left{align-items:center}.tn-m-topbar-menu-toggle{width:30px;height:28px;margin:auto;display:block}.tn-m-topbar-menu-toggle g{stroke:#fff}.tn-m-topbar-menu-toggle path{fill:#fff}.tn-l-m-default-setting{display:none}.setting-default-container{display:flex;align-items:center;justify-content:center;margin-left:30px}.notify-message{flex:1 1;overflow:hidden;margin-left:30px;display:flex;align-items:center}.notify-message>marquee{white-space:nowrap;color:#ff0;font-size:500}.search-item{margin-right:10px}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{background:#fff}.tn-l-switcher-item-label{text-shadow:none;color:#52abff;text-align:center}.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon{font-size:38px;margin:5px auto;text-shadow:none;color:#52abff}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{padding:8px}.tn-l-switcher.tn-l-switcher{margin-bottom:0}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item{width:unset;margin-top:0}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+0){border-left:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+1){border-right:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+2){border:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+1):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+2):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a span{line-height:1.2}::ng-deep .layout-wrapper app-topbar-v2 .topbar .topbar-left{box-shadow:none}::ng-deep .layout-wrapper app-topbar-v2 .wrapper-appswitch{text-align:center;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}@media (max-width: 1024px){::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item{width:unset}}@media (min-width: 1025px){.tn-l-top-bar-right{display:flex;justify-content:space-between;align-items:center}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding:0 15px}.topbar-items.topbar-items.topbar-items{margin:0;display:flex;justify-content:flex-start;flex-direction:row-reverse;align-items:center}.topbar-items.topbar-items.topbar-items,.topbar-items.topbar-items.topbar-items>li{float:none}::ng-deep .topbar .topbar-items>li>a{margin-top:0}::ng-deep .topbar .topbar-items>li>a>span>i{color:#fff;font-size:24px}.topbar .topbar-items>li>a.UserPane{height:auto;line-height:inherit;top:0}a.UserPane .profile-image.profile-image.profile-image.profile-image{margin-top:0}}@media (min-width: 1025px) and (max-width: 1400px){.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-right:19px}.search-item{margin-right:0}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding-left:15px}.topbar-items>li.profile-item{margin-left:14px}}@media (max-width: 1024px){.tn-l-m-default-setting{display:flex;align-items:center;justify-content:center;height:36px;font-size:28px;width:36px;color:#fff}.tn-l-default-detting{display:none}::ng-deep .layout-menu-static-mobile-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{text-align:left}.topbar .topbar-right #topbar-menu-button{display:flex;align-items:center;width:36px;justify-content:center}.tn-l-top-bar-right-block-1{display:flex}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{padding-left:5px;padding-right:5px}.tn-l-top-bar-left,.tn-l-logo-title-block,.topbar-owner,.topbar-description{overflow:hidden}.topbar-owner,.topbar-description{text-overflow:ellipsis}.tn-l-top-bar-menu-item:empty{display:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{padding-left:0;padding-right:0}.topbar-title.topbar-title.topbar-title.topbar-title{margin:0}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:14px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:10px}.tn-l-top-bar-right{flex:1;position:relative}.topbar-menu-button span.topbar-badge{right:-4px}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{display:flex;padding:0 .5em;align-items:center;justify-content:flex-end}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right #topbar-menu-button{position:relative;margin-left:.5em;top:0;right:0}.app-switcher.layout-menu.layout-menu.layout-menu.layout-menu{width:270px}.profile-image-wrapper{order:0}.tn-l-user-name{width:220px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep app-topbar .tn-l-top-bar-menu-item .topbar-icon-left{display:flex;justify-content:center;align-items:center}.tn-l-topbar-item-role-wrapper{display:none}}\n"], components: [{ type: i11.TnAppHelpComponent, selector: "li[tn-app-help]" }, { type: i12.TnAppNotificationComponent, selector: "li[tn-app-notification]", outputs: ["openMenu"] }, { type: i13.TnCustomScrollbarComponent, selector: "tn-custom-scrollbar", inputs: ["style", "useDefaultScrollBar", "autoMode", "class", "config", "whiteBackGround", "showScrollHorizontal"], outputs: ["scrollY", "scrollUp", "scrollDown", "scrollLeft", "scrollRight", "scrollYReachEnd", "scrollYReachStart", "scrollXReachEnd", "scrollXReachStart"] }], directives: [{ type: i14.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i14.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i15.ImgFallbackDirective, selector: "[src-fallback]", inputs: ["src-fallback"], outputs: ["loaded"] }, { type: i16.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "tooltipZIndex", "escape", "tooltipDisabled", "pTooltip", "positionStyle", "tooltipStyleClass", "showDelay", "hideDelay", "life"] }, { type: i14.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i9.TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppTopBarV2Component, decorators: [{
+AppTopBarV2Component.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppTopBarV2Component, deps: [{ token: i1.CustomRouterService }, { token: i2.Router }, { token: i3.CommonService }, { token: i4.AuthenService }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }, { token: i5.PermissionService }, { token: i6.EnvironmentService }, { token: i7.UserService }, { token: i8.NotifierService }, { token: i9.TranslateService }, { token: i10.CustomizeUiService }], target: i0.ɵɵFactoryTarget.Component });
+AppTopBarV2Component.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: AppTopBarV2Component, selector: "app-topbar-v2", providers: [ComponentContextService], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "notify", first: true, predicate: ["notify"], descendants: true, static: true }, { propertyName: "messages", first: true, predicate: ["messages"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"topbar clearfix tn-l-top-bar\">\r\n    <div class=\"topbar-left tn-l-top-bar-left\" [ngClass]=\"{'beta-version': !config.isProduction }\">\r\n        <div class=\"tn-l-left-menu-toggle-block\">\r\n            <a tabindex=\"1\" id=\"menu-button\" class=\"tn-l-left-menu-toggle\" href=\"#\"\r\n                (click)=\"_commonService.onMenuButtonClick($event)\">\r\n                <i class=\"pi pi-chevron-left\"></i>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"topbar-logo tn-l-logo-wrapper\">\r\n            <a tabindex=\"2\" href=\"javascript:\" style=\"display: inline-block;\">\r\n                <img class=\"topbar-logo tn-l-logo\" [src]=\"config.logo\" (click)=\"goToHome()\" /></a>\r\n        </div>\r\n        <div class=\"topbar-title tn-l-logo-title-block\">\r\n            <div class=\"topbar-owner\">\r\n                {{config.owner}}\r\n            </div>\r\n            <div class=\"topbar-description\">\r\n                {{config.title}}\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"setting-default-container\">\r\n        <ng-container *ngIf=\"showDefaultSetting && currentUser\">\r\n            <a tabindex=\"3\" href=\"javascript:void(0)\" class=\"tn-l-m-default-setting pi pi-cog\"\r\n                (click)=\"settingDefault()\">\r\n            </a>\r\n            <h3 class=\"tn-l-default-detting\" (click)=\"settingDefault()\">\r\n                {{defaultDataSetting}} <i class=\"pi pi-pencil\" style=\"margin-left:10px\"></i></h3>\r\n        </ng-container>\r\n    </div>\r\n    <div #notify class=\"notify-message\">\r\n        <marquee (mouseover)=\"handleMouseOver($event)\" (mouseout)=\"handleMouseOut($event)\">{{message}}</marquee>\r\n    </div>\r\n    <div class=\"topbar-right tn-l-top-bar-right\" [ngClass]=\"{'beta-version': !config.isProduction}\"\r\n        oncontextmenu=\"return false\">\r\n        <div class=\"tn-l-top-bar-right-block-1\">\r\n            <a tabindex=\"4\" class=\"topbar-menu-button\" id=\"topbar-menu-button\" href=\"#\"\r\n                (click)=\"_commonService.onTopbarMenuButtonClick($event)\">\r\n                <svg focusable=\"false\" class=\"tn-m-topbar-menu-toggle\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                    viewBox=\"0 0 448 512\">\r\n                    <path fill=\"currentColor\"\r\n                        d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                    </path>\r\n                </svg>\r\n                <span *ngIf=\"messages && messages.totalUnRead > 0\" class=\"topbar-badge animated rubberBand\"\r\n                    [ngClass]=\"{'topbar-badge-bounce': messages.bounceNoti}\">{{messages.totalUnRead}}</span>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"tn-l-top-bar-right-block-2\">\r\n            <ul class=\"topbar-items fadeInDown\" [ngClass]=\"{'topbar-items-visible': _commonService.topbarMenuActive}\">\r\n                <li #profile class=\"profile-item tn-l-top-bar-menu-item\"\r\n                    *ngIf=\"_commonService.profileMode==='top'||_commonService.isHorizontal()\"\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === profile}\">\r\n\r\n                    <a href=\"#\" tabindex=\"10\" class=\"UserPane tn-l-top-bar-menu-item-inner\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,profile)\">\r\n                        <div class=\"profile-image-wrapper topbar-icon-left\">\r\n                            <img class=\"profile-image tn-l-profile-img\" [src-fallback]=\"defaultAvatar\"\r\n                                [src]=\"getCurrentUserAvatar()\" />\r\n                        </div>\r\n                        <div class=\"profile-info-wrapper\">\r\n                            <div class=\"topbar-item-name-wrapper\"\r\n                                [ngClass]=\"{'not-show-position': !getCurrentUserPosition()}\">\r\n                                <span class=\"topbar-item-name tn-l-user-name\">{{getCurrentUserFullName()}}</span>\r\n                            </div>\r\n                            <div class=\"topbar-item-role-wrapper tn-l-topbar-item-role-wrapper\"><span\r\n                                    class=\"topbar-item-role\">{{getCurrentUserPosition()}}</span></div>\r\n                        </div>\r\n                        <i class=\"pi pi-user\" style=\"opacity: 0; position: absolute;\"></i>\r\n                    </a>\r\n\r\n                    <ul class=\"layout-menu fadeInDown tn-l-switcher\">\r\n                        <li *ngIf=\"currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"onTopbarLogout()\">\r\n                                <i class=\"pi pi-sign-out\"></i>\r\n                                <span>\u0110\u0103ng xu\u1EA5t</span>\r\n                            </a>\r\n                        </li>\r\n                        <li *ngIf=\"!currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"login()\">\r\n                                <i class=\"pi pi-sign-in\"></i>\r\n                                <span>\u0110\u0103ng nh\u1EADp</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowHelp()\" #help class=\"menu-help tn-l-top-bar-menu-item\" tn-app-help>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowNotification()\" id=\"li-notifications\"\r\n                    class=\"tn-l-top-bar-menu-item\" #messages\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === messages || _commonService.activeTopbarItem === 0}\"\r\n                    tn-app-notification (openMenu)=\"_commonService.onTopbarItemClick($event,messages)\"></li>\r\n                <li id=\"li-app-switcher\" class=\"tn-l-top-bar-menu-item\" #modules\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === modules || _commonService.activeTopbarItem === 1}\">\r\n                    <a href=\"#\" tabindex=\"7\" class=\"tn-l-top-bar-menu-item-inner\" style=\"height: 30px;\"\r\n                        pTooltip=\"Danh s\u00E1ch ph\u00E2n h\u1EC7\" tooltipPosition=\"bottom\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,modules)\">\r\n                        <span class=\"topbar-icon-left tn-l-topbar-icon-left\">\r\n                            <svg focusable=\"false\" class=\"topbar-icon animated swing svgmodule\" role=\"img\"\r\n                                xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n                                <path fill=\"currentColor\"\r\n                                    d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                                </path>\r\n                            </svg>\r\n                            <!-- <i class=\"pi pi-microsoft\"></i> -->\r\n                        </span>\r\n                        <span class=\"topbar-item-name\">{{ 'Danh s\u00E1ch ph\u00E2n h\u1EC7' | translate}}</span>\r\n                    </a>\r\n                    <ul class=\"app-switcher layout-menu fadeInDown\">\r\n                        <tn-custom-scrollbar #scrollbar class=\"app-switcher-holder\">\r\n                            <li role=\"menuitem\" class=\"wrapper-appswitch\">\r\n                                <ng-container *ngFor=\"let item of appSwitcherItems; let ind = index;\">\r\n                                    <a class=\"switcher-item tn-l-switcher-item\" href=\"javascript:\"\r\n                                        (click)=\"switchApp(item, true)\">\r\n                                        <span class=\"tn-l-switcher-item-inner\">\r\n                                            <i class=\"{{item.icon}} app-switcher-item-icon tn-l-switcher-item-icon\"></i>\r\n                                            <div class=\"tn-l-switcher-item-label\">\r\n                                                {{ item.title | translate}}\r\n                                            </div>\r\n                                        </span>\r\n                                    </a>\r\n                                </ng-container>\r\n                            </li>\r\n                        </tn-custom-scrollbar>\r\n                    </ul>\r\n                </li>\r\n            </ul>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".topBarSearchButton:disabled{opacity:1;background-color:#eee!important;border:1px solid #c8c8c8!important;border-right:none!important;color:#c1c1c1!important}::ng-deep app-topbar a{outline:none}input:disabled::placeholder{color:#b1b1b1}.UserPane.UserPane{display:flex}.profile-image-wrapper{order:1}.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name{margin-top:0;float:none}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{display:inline-flex;flex-direction:column;justify-content:center;order:0;text-align:right;float:none}.tn-l-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tn-l-default-detting{color:#fff;cursor:pointer;margin:0}.tn-l-left-menu-toggle-block{align-self:stretch;display:flex;align-items:center;box-shadow:0 0 5px #00000060}.tn-l-left-menu-toggle{color:#fff;padding:8px;transition:transform .25s ease-in-out}::ng-deep .layout-menu-static-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-left:0;margin-right:30px}.topbar-logo.topbar-logo.topbar-logo{float:none}.tn-l-logo.tn-l-logo.tn-l-logo.tn-l-logo{width:auto;height:40px;margin:0}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{margin:0;font-size:0;width:auto;height:auto;padding-left:8px;padding-right:8px}.tn-l-top-bar{display:flex}.topbar-owner,.topbar-description{white-space:nowrap}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:15px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:11px;text-transform:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{float:none;width:auto;display:flex}.tn-l-top-bar-left{align-items:center}.tn-m-topbar-menu-toggle{width:30px;height:28px;margin:auto;display:block}.tn-m-topbar-menu-toggle g{stroke:#fff}.tn-m-topbar-menu-toggle path{fill:#fff}.tn-l-m-default-setting{display:none}.setting-default-container{display:flex;align-items:center;justify-content:center;margin-left:30px}.notify-message{flex:1 1;overflow:hidden;margin-left:30px;display:flex;align-items:center}.notify-message>marquee{white-space:nowrap;color:#ff0;font-size:500}.search-item{margin-right:10px}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{background:#fff}.tn-l-switcher-item-label{text-shadow:none;color:#52abff;text-align:center}.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon{font-size:38px;margin:5px auto;text-shadow:none;color:#52abff}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{padding:8px}.tn-l-switcher.tn-l-switcher{margin-bottom:0}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item{width:unset;margin-top:0}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+0){border-left:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+1){border-right:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+2){border:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+1):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+2):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a span{line-height:1.2}::ng-deep .layout-wrapper app-topbar-v2 .topbar .topbar-left{box-shadow:none}::ng-deep .layout-wrapper app-topbar-v2 .wrapper-appswitch{text-align:center;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}@media (max-width: 1024px){::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item{width:unset}}@media (min-width: 1025px){.tn-l-top-bar-right{display:flex;justify-content:space-between;align-items:center}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding:0 15px}.topbar-items.topbar-items.topbar-items{margin:0;display:flex;justify-content:flex-start;flex-direction:row-reverse;align-items:center}.topbar-items.topbar-items.topbar-items,.topbar-items.topbar-items.topbar-items>li{float:none}::ng-deep .topbar .topbar-items>li>a{margin-top:0}::ng-deep .topbar .topbar-items>li>a>span>i{color:#fff;font-size:24px}.topbar .topbar-items>li>a.UserPane{height:auto;line-height:inherit;top:0}a.UserPane .profile-image.profile-image.profile-image.profile-image{margin-top:0}}@media (min-width: 1025px) and (max-width: 1400px){.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-right:19px}.search-item{margin-right:0}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding-left:15px}.topbar-items>li.profile-item{margin-left:14px}}@media (max-width: 1024px){.tn-l-m-default-setting{display:flex;align-items:center;justify-content:center;height:36px;font-size:28px;width:36px;color:#fff}.tn-l-default-detting{display:none}::ng-deep .layout-menu-static-mobile-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{text-align:left}.topbar .topbar-right #topbar-menu-button{display:flex;align-items:center;width:36px;justify-content:center}.tn-l-top-bar-right-block-1{display:flex}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{padding-left:5px;padding-right:5px}.tn-l-top-bar-left,.tn-l-logo-title-block,.topbar-owner,.topbar-description{overflow:hidden}.topbar-owner,.topbar-description{text-overflow:ellipsis}.tn-l-top-bar-menu-item:empty{display:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{padding-left:0;padding-right:0}.topbar-title.topbar-title.topbar-title.topbar-title{margin:0}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:14px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:10px}.tn-l-top-bar-right{flex:1;position:relative}.topbar-menu-button span.topbar-badge{right:-4px}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{display:flex;padding:0 .5em;align-items:center;justify-content:flex-end}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right #topbar-menu-button{position:relative;margin-left:.5em;top:0;right:0}.app-switcher.layout-menu.layout-menu.layout-menu.layout-menu{width:270px}.profile-image-wrapper{order:0}.tn-l-user-name{width:220px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep app-topbar .tn-l-top-bar-menu-item .topbar-icon-left{display:flex;justify-content:center;align-items:center}.tn-l-topbar-item-role-wrapper{display:none}}\n"], dependencies: [{ kind: "directive", type: i11.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i12.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "tooltipZIndex", "escape", "tooltipDisabled", "pTooltip", "positionStyle", "tooltipStyleClass", "showDelay", "hideDelay", "life"] }, { kind: "directive", type: i13.ImgFallbackDirective, selector: "[src-fallback]", inputs: ["src-fallback"], outputs: ["loaded"] }, { kind: "component", type: i14.TnCustomScrollbarComponent, selector: "tn-custom-scrollbar", inputs: ["style", "useDefaultScrollBar", "autoMode", "class", "config", "whiteBackGround", "showScrollHorizontal"], outputs: ["scrollY", "scrollUp", "scrollDown", "scrollLeft", "scrollRight", "scrollYReachEnd", "scrollYReachStart", "scrollXReachEnd", "scrollXReachStart"] }, { kind: "component", type: i15.TnAppHelpComponent, selector: "li[tn-app-help]" }, { kind: "component", type: i16.TnAppNotificationComponent, selector: "li[tn-app-notification]", outputs: ["openMenu"] }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppTopBarV2Component, decorators: [{
             type: Component,
             args: [{ selector: 'app-topbar-v2', providers: [ComponentContextService], template: "<div class=\"topbar clearfix tn-l-top-bar\">\r\n    <div class=\"topbar-left tn-l-top-bar-left\" [ngClass]=\"{'beta-version': !config.isProduction }\">\r\n        <div class=\"tn-l-left-menu-toggle-block\">\r\n            <a tabindex=\"1\" id=\"menu-button\" class=\"tn-l-left-menu-toggle\" href=\"#\"\r\n                (click)=\"_commonService.onMenuButtonClick($event)\">\r\n                <i class=\"pi pi-chevron-left\"></i>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"topbar-logo tn-l-logo-wrapper\">\r\n            <a tabindex=\"2\" href=\"javascript:\" style=\"display: inline-block;\">\r\n                <img class=\"topbar-logo tn-l-logo\" [src]=\"config.logo\" (click)=\"goToHome()\" /></a>\r\n        </div>\r\n        <div class=\"topbar-title tn-l-logo-title-block\">\r\n            <div class=\"topbar-owner\">\r\n                {{config.owner}}\r\n            </div>\r\n            <div class=\"topbar-description\">\r\n                {{config.title}}\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"setting-default-container\">\r\n        <ng-container *ngIf=\"showDefaultSetting && currentUser\">\r\n            <a tabindex=\"3\" href=\"javascript:void(0)\" class=\"tn-l-m-default-setting pi pi-cog\"\r\n                (click)=\"settingDefault()\">\r\n            </a>\r\n            <h3 class=\"tn-l-default-detting\" (click)=\"settingDefault()\">\r\n                {{defaultDataSetting}} <i class=\"pi pi-pencil\" style=\"margin-left:10px\"></i></h3>\r\n        </ng-container>\r\n    </div>\r\n    <div #notify class=\"notify-message\">\r\n        <marquee (mouseover)=\"handleMouseOver($event)\" (mouseout)=\"handleMouseOut($event)\">{{message}}</marquee>\r\n    </div>\r\n    <div class=\"topbar-right tn-l-top-bar-right\" [ngClass]=\"{'beta-version': !config.isProduction}\"\r\n        oncontextmenu=\"return false\">\r\n        <div class=\"tn-l-top-bar-right-block-1\">\r\n            <a tabindex=\"4\" class=\"topbar-menu-button\" id=\"topbar-menu-button\" href=\"#\"\r\n                (click)=\"_commonService.onTopbarMenuButtonClick($event)\">\r\n                <svg focusable=\"false\" class=\"tn-m-topbar-menu-toggle\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                    viewBox=\"0 0 448 512\">\r\n                    <path fill=\"currentColor\"\r\n                        d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                    </path>\r\n                </svg>\r\n                <span *ngIf=\"messages && messages.totalUnRead > 0\" class=\"topbar-badge animated rubberBand\"\r\n                    [ngClass]=\"{'topbar-badge-bounce': messages.bounceNoti}\">{{messages.totalUnRead}}</span>\r\n            </a>\r\n        </div>\r\n\r\n        <div class=\"tn-l-top-bar-right-block-2\">\r\n            <ul class=\"topbar-items fadeInDown\" [ngClass]=\"{'topbar-items-visible': _commonService.topbarMenuActive}\">\r\n                <li #profile class=\"profile-item tn-l-top-bar-menu-item\"\r\n                    *ngIf=\"_commonService.profileMode==='top'||_commonService.isHorizontal()\"\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === profile}\">\r\n\r\n                    <a href=\"#\" tabindex=\"10\" class=\"UserPane tn-l-top-bar-menu-item-inner\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,profile)\">\r\n                        <div class=\"profile-image-wrapper topbar-icon-left\">\r\n                            <img class=\"profile-image tn-l-profile-img\" [src-fallback]=\"defaultAvatar\"\r\n                                [src]=\"getCurrentUserAvatar()\" />\r\n                        </div>\r\n                        <div class=\"profile-info-wrapper\">\r\n                            <div class=\"topbar-item-name-wrapper\"\r\n                                [ngClass]=\"{'not-show-position': !getCurrentUserPosition()}\">\r\n                                <span class=\"topbar-item-name tn-l-user-name\">{{getCurrentUserFullName()}}</span>\r\n                            </div>\r\n                            <div class=\"topbar-item-role-wrapper tn-l-topbar-item-role-wrapper\"><span\r\n                                    class=\"topbar-item-role\">{{getCurrentUserPosition()}}</span></div>\r\n                        </div>\r\n                        <i class=\"pi pi-user\" style=\"opacity: 0; position: absolute;\"></i>\r\n                    </a>\r\n\r\n                    <ul class=\"layout-menu fadeInDown tn-l-switcher\">\r\n                        <li *ngIf=\"currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"onTopbarLogout()\">\r\n                                <i class=\"pi pi-sign-out\"></i>\r\n                                <span>\u0110\u0103ng xu\u1EA5t</span>\r\n                            </a>\r\n                        </li>\r\n                        <li *ngIf=\"!currentUser\" role=\"menuitem\">\r\n                            <a href=\"javascript:;\" (click)=\"login()\">\r\n                                <i class=\"pi pi-sign-in\"></i>\r\n                                <span>\u0110\u0103ng nh\u1EADp</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowHelp()\" #help class=\"menu-help tn-l-top-bar-menu-item\" tn-app-help>\r\n                </li>\r\n                <li *ngIf=\"_customizeUiService.isShowNotification()\" id=\"li-notifications\"\r\n                    class=\"tn-l-top-bar-menu-item\" #messages\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === messages || _commonService.activeTopbarItem === 0}\"\r\n                    tn-app-notification (openMenu)=\"_commonService.onTopbarItemClick($event,messages)\"></li>\r\n                <li id=\"li-app-switcher\" class=\"tn-l-top-bar-menu-item\" #modules\r\n                    [ngClass]=\"{'active-top-menu':_commonService.activeTopbarItem === modules || _commonService.activeTopbarItem === 1}\">\r\n                    <a href=\"#\" tabindex=\"7\" class=\"tn-l-top-bar-menu-item-inner\" style=\"height: 30px;\"\r\n                        pTooltip=\"Danh s\u00E1ch ph\u00E2n h\u1EC7\" tooltipPosition=\"bottom\"\r\n                        (click)=\"_commonService.onTopbarItemClick($event,modules)\">\r\n                        <span class=\"topbar-icon-left tn-l-topbar-icon-left\">\r\n                            <svg focusable=\"false\" class=\"topbar-icon animated swing svgmodule\" role=\"img\"\r\n                                xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\">\r\n                                <path fill=\"currentColor\"\r\n                                    d=\"M0 224h192V32H0v192zm256-192v192h192V32H256zM0 480h192V288H0v192zm256-192v192h192V288H256z\">\r\n                                </path>\r\n                            </svg>\r\n                            <!-- <i class=\"pi pi-microsoft\"></i> -->\r\n                        </span>\r\n                        <span class=\"topbar-item-name\">{{ 'Danh s\u00E1ch ph\u00E2n h\u1EC7' | translate}}</span>\r\n                    </a>\r\n                    <ul class=\"app-switcher layout-menu fadeInDown\">\r\n                        <tn-custom-scrollbar #scrollbar class=\"app-switcher-holder\">\r\n                            <li role=\"menuitem\" class=\"wrapper-appswitch\">\r\n                                <ng-container *ngFor=\"let item of appSwitcherItems; let ind = index;\">\r\n                                    <a class=\"switcher-item tn-l-switcher-item\" href=\"javascript:\"\r\n                                        (click)=\"switchApp(item, true)\">\r\n                                        <span class=\"tn-l-switcher-item-inner\">\r\n                                            <i class=\"{{item.icon}} app-switcher-item-icon tn-l-switcher-item-icon\"></i>\r\n                                            <div class=\"tn-l-switcher-item-label\">\r\n                                                {{ item.title | translate}}\r\n                                            </div>\r\n                                        </span>\r\n                                    </a>\r\n                                </ng-container>\r\n                            </li>\r\n                        </tn-custom-scrollbar>\r\n                    </ul>\r\n                </li>\r\n            </ul>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".topBarSearchButton:disabled{opacity:1;background-color:#eee!important;border:1px solid #c8c8c8!important;border-right:none!important;color:#c1c1c1!important}::ng-deep app-topbar a{outline:none}input:disabled::placeholder{color:#b1b1b1}.UserPane.UserPane{display:flex}.profile-image-wrapper{order:1}.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name.tn-l-user-name{margin-top:0;float:none}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{display:inline-flex;flex-direction:column;justify-content:center;order:0;text-align:right;float:none}.tn-l-logo{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}.tn-l-default-detting{color:#fff;cursor:pointer;margin:0}.tn-l-left-menu-toggle-block{align-self:stretch;display:flex;align-items:center;box-shadow:0 0 5px #00000060}.tn-l-left-menu-toggle{color:#fff;padding:8px;transition:transform .25s ease-in-out}::ng-deep .layout-menu-static-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-left:0;margin-right:30px}.topbar-logo.topbar-logo.topbar-logo{float:none}.tn-l-logo.tn-l-logo.tn-l-logo.tn-l-logo{width:auto;height:40px;margin:0}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{margin:0;font-size:0;width:auto;height:auto;padding-left:8px;padding-right:8px}.tn-l-top-bar{display:flex}.topbar-owner,.topbar-description{white-space:nowrap}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:15px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:11px;text-transform:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{float:none;width:auto;display:flex}.tn-l-top-bar-left{align-items:center}.tn-m-topbar-menu-toggle{width:30px;height:28px;margin:auto;display:block}.tn-m-topbar-menu-toggle g{stroke:#fff}.tn-m-topbar-menu-toggle path{fill:#fff}.tn-l-m-default-setting{display:none}.setting-default-container{display:flex;align-items:center;justify-content:center;margin-left:30px}.notify-message{flex:1 1;overflow:hidden;margin-left:30px;display:flex;align-items:center}.notify-message>marquee{white-space:nowrap;color:#ff0;font-size:500}.search-item{margin-right:10px}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{background:#fff}.tn-l-switcher-item-label{text-shadow:none;color:#52abff;text-align:center}.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon.tn-l-switcher-item-icon{font-size:38px;margin:5px auto;text-shadow:none;color:#52abff}.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item.tn-l-switcher-item{padding:8px}.tn-l-switcher.tn-l-switcher{margin-bottom:0}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item{width:unset;margin-top:0}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+0){border-left:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+1){border-right:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+2){border:none}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+1):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item:nth-child(3n+2):last-child{width:unset}::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a span{line-height:1.2}::ng-deep .layout-wrapper app-topbar-v2 .topbar .topbar-left{box-shadow:none}::ng-deep .layout-wrapper app-topbar-v2 .wrapper-appswitch{text-align:center;display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}@media (max-width: 1024px){::ng-deep .layout-wrapper app-topbar-v2 .layout-menu li a.switcher-item{width:unset}}@media (min-width: 1025px){.tn-l-top-bar-right{display:flex;justify-content:space-between;align-items:center}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding:0 15px}.topbar-items.topbar-items.topbar-items{margin:0;display:flex;justify-content:flex-start;flex-direction:row-reverse;align-items:center}.topbar-items.topbar-items.topbar-items,.topbar-items.topbar-items.topbar-items>li{float:none}::ng-deep .topbar .topbar-items>li>a{margin-top:0}::ng-deep .topbar .topbar-items>li>a>span>i{color:#fff;font-size:24px}.topbar .topbar-items>li>a.UserPane{height:auto;line-height:inherit;top:0}a.UserPane .profile-image.profile-image.profile-image.profile-image{margin-top:0}}@media (min-width: 1025px) and (max-width: 1400px){.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block.tn-l-logo-title-block{margin-right:19px}.search-item{margin-right:0}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{padding-left:15px}.topbar-items>li.profile-item{margin-left:14px}}@media (max-width: 1024px){.tn-l-m-default-setting{display:flex;align-items:center;justify-content:center;height:36px;font-size:28px;width:36px;color:#fff}.tn-l-default-detting{display:none}::ng-deep .layout-menu-static-mobile-inactive app-topbar .tn-l-left-menu-toggle{transform:rotate(180deg)}.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper.profile-info-wrapper{text-align:left}.topbar .topbar-right #topbar-menu-button{display:flex;align-items:center;width:36px;justify-content:center}.tn-l-top-bar-right-block-1{display:flex}.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper.tn-l-logo-wrapper{padding-left:5px;padding-right:5px}.tn-l-top-bar-left,.tn-l-logo-title-block,.topbar-owner,.topbar-description{overflow:hidden}.topbar-owner,.topbar-description{text-overflow:ellipsis}.tn-l-top-bar-menu-item:empty{display:none}.tn-l-top-bar-left.tn-l-top-bar-left.tn-l-top-bar-left{padding-left:0;padding-right:0}.topbar-title.topbar-title.topbar-title.topbar-title{margin:0}.topbar-owner.topbar-owner.topbar-owner.topbar-owner.topbar-owner{font-size:14px}.topbar-description.topbar-description.topbar-description.topbar-description.topbar-description{font-size:10px}.tn-l-top-bar-right{flex:1;position:relative}.topbar-menu-button span.topbar-badge{right:-4px}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right{display:flex;padding:0 .5em;align-items:center;justify-content:flex-end}.tn-l-top-bar-right.tn-l-top-bar-right.tn-l-top-bar-right #topbar-menu-button{position:relative;margin-left:.5em;top:0;right:0}.app-switcher.layout-menu.layout-menu.layout-menu.layout-menu{width:270px}.profile-image-wrapper{order:0}.tn-l-user-name{width:220px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep app-topbar .tn-l-top-bar-menu-item .topbar-icon-left{display:flex;justify-content:center;align-items:center}.tn-l-topbar-item-role-wrapper{display:none}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.CustomRouterService }, { type: i2.Router }, { type: i3.CommonService }, { type: i4.AuthenService }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }, { type: i5.PermissionService }, { type: i6.EnvironmentService }, { type: i7.UserService }, { type: i8.NotifierService }, { type: i9.TranslateService }, { type: i10.CustomizeUiService }]; }, propDecorators: { input: [{

package/esm2020/components/common-app-component/app.footer.component.mjs

@@ -2,8 +2,8 @@ import { Component } from '@angular/core';
 import * as i0 from "@angular/core";
 export class AppFooterComponent {
 }
-AppFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AppFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: AppFooterComponent, selector: "app-footer", ngImport: i0, template: `
+AppFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AppFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: AppFooterComponent, selector: "app-footer", ngImport: i0, template: `
         <div class=layout-footer>
             <span class=footer-text-left>
                 <img src="assets/layout/images/logo-dark.png" />
@@ -15,7 +15,7 @@ AppFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
             </span>
         </div>
     `, isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: AppFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: AppFooterComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-footer',