keevo-components 1.8.288 → 1.8.289
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -4994,6 +4994,12 @@ class KvLayoutComponent {
|
|
|
4994
4994
|
!this.expandMenu ? (this.expandMenu = !this.expandMenu) : '';
|
|
4995
4995
|
this.router.navigateByUrl(e);
|
|
4996
4996
|
}
|
|
4997
|
+
callRouteItem(menu, expand) {
|
|
4998
|
+
if (!expand)
|
|
4999
|
+
!this.expandMenu ? (this.expandMenu = !this.expandMenu) : '';
|
|
5000
|
+
sessionStorage.setItem('menuselecionado', menu.idmenu);
|
|
5001
|
+
this.router.navigateByUrl(menu.link);
|
|
5002
|
+
}
|
|
4997
5003
|
changeEmpresa(event) {
|
|
4998
5004
|
this.changeEmpresaEmit.emit(event);
|
|
4999
5005
|
}
|
|
@@ -5085,17 +5091,18 @@ class KvLayoutComponent {
|
|
|
5085
5091
|
this.cdr.detectChanges();
|
|
5086
5092
|
}
|
|
5087
5093
|
selecionarMenu() {
|
|
5088
|
-
const
|
|
5094
|
+
const idmenuselecionado = +sessionStorage.getItem('menuselecionado');
|
|
5089
5095
|
this.menus = this.menus.map((menu) => {
|
|
5090
5096
|
return {
|
|
5091
5097
|
...menu,
|
|
5092
|
-
bgColor: menu.
|
|
5093
|
-
textColor: menu.
|
|
5098
|
+
bgColor: menu.idmenu == idmenuselecionado ? 'bg-green-600' : '',
|
|
5099
|
+
textColor: menu.idmenu == idmenuselecionado ? 'text-white' : '',
|
|
5094
5100
|
};
|
|
5095
5101
|
});
|
|
5096
5102
|
this.menuSelecionado = this.menus.find((menu) => {
|
|
5097
|
-
return menu.
|
|
5103
|
+
return menu.idmenu == idmenuselecionado;
|
|
5098
5104
|
});
|
|
5105
|
+
// sessionStorage.setItem('menuselecionado', )
|
|
5099
5106
|
}
|
|
5100
5107
|
returnMenuChild(idmenu) {
|
|
5101
5108
|
return this.menus.filter((x) => x.idmenupai == idmenu);
|
|
@@ -5117,11 +5124,11 @@ class KvLayoutComponent {
|
|
|
5117
5124
|
return this.expandMenu ? 'expanded' : 'collapsed';
|
|
5118
5125
|
}
|
|
5119
5126
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2$1.FormBuilder }, { token: i3$1.Router }, { token: i3$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5120
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvLayoutComponent, selector: "kv-layout", inputs: { apps: "apps", breadCrumbItems: "breadCrumbItems", masters: "masters", menus: "menus", expandMenu: "expandMenu", logoMenuExpand: "logoMenuExpand", logoMenuHide: "logoMenuHide", selectedApp: "selectedApp", selectedEmpresa: "selectedEmpresa", selectedMaster: "selectedMaster", showButtonApps: "showButtonApps", showButtonUser: "showButtonUser", showExpandMenu: "showExpandMenu", showDropdownLicenca: "showDropdownLicenca", showMenu: "showMenu", showTrocaEmpresa: "showTrocaEmpresa", userName: "userName" }, outputs: { accessKeePassEmit: "accessKeePassEmit", changeEmpresaEmit: "changeEmpresaEmit", changeLicenseEmit: "changeLicenseEmit", expandMenuEmit: "expandMenuEmit", logoutEmit: "logoutEmit", selectAppEmit: "selectAppEmit", navigateToDefaultRouteEmit: "navigateToDefaultRouteEmit" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "meusDadosPanel", first: true, predicate: ["meusDadosPanel"], descendants: true }, { propertyName: "sidebarRef", first: true, predicate: ["sidebarRef"], descendants: true }, { propertyName: "sistemasPanel", first: true, predicate: ["sistemasPanel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n @if (showMenu) {\r\n <div [style]=\"{ minWidth: expandMenu ? '300px' : '60px' }\"></div>\r\n } @if(showMenu) {\r\n <p-sidebar\r\n #sidebarRef\r\n [visible]=\"true\"\r\n [showCloseIcon]=\"false\"\r\n [modal]=\"false\"\r\n [style]=\"{ width: expandMenu ? '300px' : '60px' }\"\r\n class=\"sidebar-animation\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"flex flex-column overflow-hidden\">\r\n <div\r\n class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n >\r\n <div\r\n class=\"flex {{\r\n expandMenu ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }} py-3\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n <img\r\n *ngIf=\"expandMenu && logoMenuExpand\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n width=\"150\"\r\n class=\"cursor-pointer\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Logo para o menu minimizado-->\r\n <img\r\n *ngIf=\"!expandMenu && logoMenuHide\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n width=\"50\"\r\n class=\"mb-2\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Toggle menu -->\r\n <button\r\n *ngIf=\"showExpandMenu\"\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"toggleMenu()\"\r\n [pTooltip]=\"expandMenu ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> menu </i>\r\n </button>\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }}\"\r\n >\r\n <div\r\n class=\"flex flex-column cursor-pointer\"\r\n *ngIf=\"expandMenu && selectedEmpresa\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n <span\r\n class=\"text-sm font-semibold mr-2\"\r\n [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n </span>\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n </div>\r\n\r\n <button\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"changeEmpresa($event)\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n </button>\r\n </div>\r\n <p-divider type=\"solid\"></p-divider>\r\n }\r\n </div>\r\n\r\n <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n <li *ngFor=\"let menu of menus; let i = index\" class=\"px-2\">\r\n <!-- menu que n\u00E3o tem filho -->\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n (click)=\"callRoute(menu.link)\"\r\n *ngIf=\"\r\n !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n \"\r\n pRipple\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n [tooltipPosition]=\"'right'\"\r\n class=\"{{\r\n menu.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [class.justify-content-center]=\"!expandMenu\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color {{ menu.textColor }}\"\r\n *ngIf=\"menu.icone\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium {{ menu.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </a>\r\n <!-- menu com filho -->\r\n <div *ngIf=\"menu.indmenupai\">\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n pRipple\r\n pStyleClass=\"@next\"\r\n enterClass=\"hidden\"\r\n enterActiveClass=\"slidedown\"\r\n leaveToClass=\"hidden\"\r\n leaveActiveClass=\"slideup\"\r\n class=\"menu-option flex align-items-center {{\r\n !expandMenu\r\n ? 'justify-content-center'\r\n : 'justify-content-between'\r\n }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [tooltipPosition]=\"'right'\"\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n (click)=\"!expandMenu ? (expandMenu = !expandMenu) : ''\"\r\n >\r\n <div class=\"flex flex-row align-items-center\">\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"menu.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </div>\r\n <i\r\n class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color\"\r\n *ngIf=\"expandMenu\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n ></i>\r\n </a>\r\n\r\n <!-- filhos -->\r\n <div\r\n class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n !(menuSelecionado?.idmenupai == menu.idmenu) && 'hidden'\r\n }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n >\r\n <li\r\n *ngFor=\"\r\n let filho of returnMenuChild(menu.idmenu);\r\n let iFilho = index\r\n \"\r\n >\r\n <a\r\n (mouseenter)=\"onMouseEnterChild(filho.idmenu)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{\r\n 'hover-color': mouseOverFilhoIndex === filho.idmenu\r\n }\"\r\n *ngIf=\"expandMenu\"\r\n (click)=\"callRoute(filho.link)\"\r\n pRipple\r\n class=\"{{\r\n filho.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"filho.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ filho.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 ml-4 {{ filho.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ filho.descricaomenu }}</span\r\n >\r\n </a>\r\n </li>\r\n </div>\r\n </div>\r\n </li>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-sidebar>\r\n }\r\n\r\n <!-- Topbar -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <div class=\"flex flex-row align-items-center justify-content-between m-3\">\r\n @if(!showMenu) {\r\n <!-- Logo home -->\r\n <div>\r\n <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n </div>\r\n } @else {\r\n <!-- Breadcrumbs -->\r\n <div>\r\n <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n </p>\r\n <p-breadcrumb\r\n *ngIf=\"widthCard > 400\"\r\n styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n [model]=\"breadCrumbItems\"\r\n [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n ></p-breadcrumb>\r\n </div>\r\n }\r\n\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-40rem\"\r\n formControlName=\"idmaster\"\r\n [formGroup]=\"formGroup\"\r\n [masters]=\"masters\"\r\n (onSelectionChange)=\"changeLicense($event)\"\r\n (onSelectionValue)=\"changeLicense($event)\"\r\n >\r\n </dropdown-master>\r\n\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n <p-button\r\n *ngIf=\"showButtonApps\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-th-large\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n (click)=\"sistemasPanel.toggle($event)\"\r\n [pTooltip]=\"'Sistemas'\"\r\n [tooltipPosition]=\"'left'\"\r\n ></p-button>\r\n\r\n <p-button\r\n *ngIf=\"showButtonUser\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-user\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"meusDadosPanel.toggle($event)\"\r\n ></p-button>\r\n </div>\r\n </div>\r\n\r\n <!-- Container -->\r\n <p-card\r\n styleClass=\"m-3 overflow-y-auto {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n >\r\n <div\r\n class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\"\r\n [style]=\"{ width: widthCard + 'px' }\"\r\n >\r\n <ng-content></ng-content>\r\n </div>\r\n </p-card>\r\n </div>\r\n\r\n <!-- Painel de aplicativos -->\r\n <p-overlayPanel\r\n #sistemasPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">Sistemas</p>\r\n <div\r\n class=\"flex flex-row flex-wrap gap-2 align-items-center justify-content-center mt-5 mb-3\"\r\n style=\"width: 250px; height: 100%\"\r\n >\r\n <button\r\n *ngFor=\"let aplicativo of apps\"\r\n pButton\r\n pRipple\r\n class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n >\r\n {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n </button>\r\n </div>\r\n </ng-template>\r\n </p-overlayPanel>\r\n\r\n <!-- Painel do usu\u00E1rio -->\r\n <p-overlayPanel\r\n #meusDadosPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">\r\n Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n </p>\r\n <div class=\"mt-5 mb-3\"></div>\r\n\r\n <p-button\r\n icon=\"pi pi-lock\"\r\n label=\"Acessar Keepass\"\r\n (onClick)=\"accessKeePass($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n\r\n <p-button\r\n icon=\"pi pi-sign-out\"\r\n label=\"Sair\"\r\n (onClick)=\"logout($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n </ng-template>\r\n </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}.btn-sistema{display:flex;align-items:center;justify-content:center;background-color:#0c3e66;font-size:20px}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 10%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$7.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "directive", type: i6.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i10.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i10$1.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i2.Ripple, selector: "[pRipple]" }, { kind: "component", type: i12.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i13$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DropdownMasterComponent, selector: "dropdown-master", inputs: ["formControlName", "masters"] }, { kind: "pipe", type: CpfCnpjPipe, name: "cpfCnpj" }] }); }
|
|
5127
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvLayoutComponent, selector: "kv-layout", inputs: { apps: "apps", breadCrumbItems: "breadCrumbItems", masters: "masters", menus: "menus", expandMenu: "expandMenu", logoMenuExpand: "logoMenuExpand", logoMenuHide: "logoMenuHide", selectedApp: "selectedApp", selectedEmpresa: "selectedEmpresa", selectedMaster: "selectedMaster", showButtonApps: "showButtonApps", showButtonUser: "showButtonUser", showExpandMenu: "showExpandMenu", showDropdownLicenca: "showDropdownLicenca", showMenu: "showMenu", showTrocaEmpresa: "showTrocaEmpresa", userName: "userName" }, outputs: { accessKeePassEmit: "accessKeePassEmit", changeEmpresaEmit: "changeEmpresaEmit", changeLicenseEmit: "changeLicenseEmit", expandMenuEmit: "expandMenuEmit", logoutEmit: "logoutEmit", selectAppEmit: "selectAppEmit", navigateToDefaultRouteEmit: "navigateToDefaultRouteEmit" }, host: { listeners: { "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "meusDadosPanel", first: true, predicate: ["meusDadosPanel"], descendants: true }, { propertyName: "sidebarRef", first: true, predicate: ["sidebarRef"], descendants: true }, { propertyName: "sistemasPanel", first: true, predicate: ["sistemasPanel"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n @if (showMenu) {\r\n <div [style]=\"{ minWidth: expandMenu ? '300px' : '60px' }\"></div>\r\n } @if(showMenu) {\r\n <p-sidebar\r\n #sidebarRef\r\n [visible]=\"true\"\r\n [showCloseIcon]=\"false\"\r\n [modal]=\"false\"\r\n [style]=\"{ width: expandMenu ? '300px' : '60px' }\"\r\n class=\"sidebar-animation\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"flex flex-column overflow-hidden\">\r\n <div\r\n class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n >\r\n <div\r\n class=\"flex {{\r\n expandMenu ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }} py-3\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n <img\r\n *ngIf=\"expandMenu && logoMenuExpand\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n width=\"150\"\r\n class=\"cursor-pointer\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Logo para o menu minimizado-->\r\n <img\r\n *ngIf=\"!expandMenu && logoMenuHide\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n width=\"50\"\r\n class=\"mb-2\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Toggle menu -->\r\n <button\r\n *ngIf=\"showExpandMenu\"\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"toggleMenu()\"\r\n [pTooltip]=\"expandMenu ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> menu </i>\r\n </button>\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }}\"\r\n >\r\n <div\r\n class=\"flex flex-column cursor-pointer\"\r\n *ngIf=\"expandMenu && selectedEmpresa\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n <span\r\n class=\"text-sm font-semibold mr-2\"\r\n [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n </span>\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n </div>\r\n\r\n <button\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"changeEmpresa($event)\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n </button>\r\n </div>\r\n <p-divider type=\"solid\"></p-divider>\r\n }\r\n </div>\r\n\r\n <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n <li *ngFor=\"let menu of menus; let i = index\" class=\"px-2\">\r\n <!-- menu que n\u00E3o tem filho -->\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n (click)=\"callRouteItem(menu)\"\r\n *ngIf=\"\r\n !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n \"\r\n pRipple\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n [tooltipPosition]=\"'right'\"\r\n class=\"{{\r\n menu.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [class.justify-content-center]=\"!expandMenu\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color {{ menu.textColor }}\"\r\n *ngIf=\"menu.icone\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium {{ menu.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </a>\r\n <!-- menu com filho -->\r\n <div *ngIf=\"menu.indmenupai\">\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n pRipple\r\n pStyleClass=\"@next\"\r\n enterClass=\"hidden\"\r\n enterActiveClass=\"slidedown\"\r\n leaveToClass=\"hidden\"\r\n leaveActiveClass=\"slideup\"\r\n class=\"menu-option flex align-items-center {{\r\n !expandMenu\r\n ? 'justify-content-center'\r\n : 'justify-content-between'\r\n }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [tooltipPosition]=\"'right'\"\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n (click)=\"!expandMenu ? (expandMenu = !expandMenu) : ''\"\r\n >\r\n <div class=\"flex flex-row align-items-center\">\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"menu.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </div>\r\n <i\r\n class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color\"\r\n *ngIf=\"expandMenu\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n ></i>\r\n </a>\r\n\r\n <!-- filhos -->\r\n <div\r\n class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n !(menuSelecionado?.idmenupai == menu.idmenu) && 'hidden'\r\n }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n >\r\n <li\r\n *ngFor=\"\r\n let filho of returnMenuChild(menu.idmenu);\r\n let iFilho = index\r\n \"\r\n >\r\n <a\r\n (mouseenter)=\"onMouseEnterChild(filho.idmenu)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{\r\n 'hover-color': mouseOverFilhoIndex === filho.idmenu\r\n }\"\r\n *ngIf=\"expandMenu\"\r\n (click)=\"callRouteItem(filho)\"\r\n pRipple\r\n class=\"{{\r\n filho.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"filho.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ filho.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 ml-4 {{ filho.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ filho.descricaomenu }}</span\r\n >\r\n </a>\r\n </li>\r\n </div>\r\n </div>\r\n </li>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-sidebar>\r\n }\r\n\r\n <!-- Topbar -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <div class=\"flex flex-row align-items-center justify-content-between m-3\">\r\n @if(!showMenu) {\r\n <!-- Logo home -->\r\n <div>\r\n <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n </div>\r\n } @else {\r\n <!-- Breadcrumbs -->\r\n <div>\r\n <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n </p>\r\n <p-breadcrumb\r\n *ngIf=\"widthCard > 400\"\r\n styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n [model]=\"breadCrumbItems\"\r\n [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n ></p-breadcrumb>\r\n </div>\r\n }\r\n\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-40rem\"\r\n formControlName=\"idmaster\"\r\n [formGroup]=\"formGroup\"\r\n [masters]=\"masters\"\r\n (onSelectionChange)=\"changeLicense($event)\"\r\n (onSelectionValue)=\"changeLicense($event)\"\r\n >\r\n </dropdown-master>\r\n\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n <p-button\r\n *ngIf=\"showButtonApps\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-th-large\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n (click)=\"sistemasPanel.toggle($event)\"\r\n [pTooltip]=\"'Sistemas'\"\r\n [tooltipPosition]=\"'left'\"\r\n ></p-button>\r\n\r\n <p-button\r\n *ngIf=\"showButtonUser\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-user\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"meusDadosPanel.toggle($event)\"\r\n ></p-button>\r\n </div>\r\n </div>\r\n\r\n <!-- Container -->\r\n <p-card\r\n styleClass=\"m-3 overflow-y-auto {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n >\r\n <div\r\n class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\"\r\n [style]=\"{ width: widthCard + 'px' }\"\r\n >\r\n <ng-content></ng-content>\r\n </div>\r\n </p-card>\r\n </div>\r\n\r\n <!-- Painel de aplicativos -->\r\n <p-overlayPanel\r\n #sistemasPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">Sistemas</p>\r\n <div\r\n class=\"flex flex-row flex-wrap gap-2 align-items-center justify-content-center mt-5 mb-3\"\r\n style=\"width: 250px; height: 100%\"\r\n >\r\n <button\r\n *ngFor=\"let aplicativo of apps\"\r\n pButton\r\n pRipple\r\n class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n >\r\n {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n </button>\r\n </div>\r\n </ng-template>\r\n </p-overlayPanel>\r\n\r\n <!-- Painel do usu\u00E1rio -->\r\n <p-overlayPanel\r\n #meusDadosPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">\r\n Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n </p>\r\n <div class=\"mt-5 mb-3\"></div>\r\n\r\n <p-button\r\n icon=\"pi pi-lock\"\r\n label=\"Acessar Keepass\"\r\n (onClick)=\"accessKeePass($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n\r\n <p-button\r\n icon=\"pi pi-sign-out\"\r\n label=\"Sair\"\r\n (onClick)=\"logout($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n </ng-template>\r\n </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}.btn-sistema{display:flex;align-items:center;justify-content:center;background-color:#0c3e66;font-size:20px}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 10%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5$7.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "directive", type: i6.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i10.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i10$1.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i2.Ripple, selector: "[pRipple]" }, { kind: "component", type: i12.Sidebar, selector: "p-sidebar", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "directive", type: i13$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DropdownMasterComponent, selector: "dropdown-master", inputs: ["formControlName", "masters"] }, { kind: "pipe", type: CpfCnpjPipe, name: "cpfCnpj" }] }); }
|
|
5121
5128
|
}
|
|
5122
5129
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, decorators: [{
|
|
5123
5130
|
type: Component,
|
|
5124
|
-
args: [{ selector: 'kv-layout', template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n @if (showMenu) {\r\n <div [style]=\"{ minWidth: expandMenu ? '300px' : '60px' }\"></div>\r\n } @if(showMenu) {\r\n <p-sidebar\r\n #sidebarRef\r\n [visible]=\"true\"\r\n [showCloseIcon]=\"false\"\r\n [modal]=\"false\"\r\n [style]=\"{ width: expandMenu ? '300px' : '60px' }\"\r\n class=\"sidebar-animation\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"flex flex-column overflow-hidden\">\r\n <div\r\n class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n >\r\n <div\r\n class=\"flex {{\r\n expandMenu ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }} py-3\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n <img\r\n *ngIf=\"expandMenu && logoMenuExpand\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n width=\"150\"\r\n class=\"cursor-pointer\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Logo para o menu minimizado-->\r\n <img\r\n *ngIf=\"!expandMenu && logoMenuHide\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n width=\"50\"\r\n class=\"mb-2\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Toggle menu -->\r\n <button\r\n *ngIf=\"showExpandMenu\"\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"toggleMenu()\"\r\n [pTooltip]=\"expandMenu ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> menu </i>\r\n </button>\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }}\"\r\n >\r\n <div\r\n class=\"flex flex-column cursor-pointer\"\r\n *ngIf=\"expandMenu && selectedEmpresa\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n <span\r\n class=\"text-sm font-semibold mr-2\"\r\n [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n </span>\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n </div>\r\n\r\n <button\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"changeEmpresa($event)\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n </button>\r\n </div>\r\n <p-divider type=\"solid\"></p-divider>\r\n }\r\n </div>\r\n\r\n <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n <li *ngFor=\"let menu of menus; let i = index\" class=\"px-2\">\r\n <!-- menu que n\u00E3o tem filho -->\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n (click)=\"callRoute(menu.link)\"\r\n *ngIf=\"\r\n !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n \"\r\n pRipple\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n [tooltipPosition]=\"'right'\"\r\n class=\"{{\r\n menu.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [class.justify-content-center]=\"!expandMenu\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color {{ menu.textColor }}\"\r\n *ngIf=\"menu.icone\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium {{ menu.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </a>\r\n <!-- menu com filho -->\r\n <div *ngIf=\"menu.indmenupai\">\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n pRipple\r\n pStyleClass=\"@next\"\r\n enterClass=\"hidden\"\r\n enterActiveClass=\"slidedown\"\r\n leaveToClass=\"hidden\"\r\n leaveActiveClass=\"slideup\"\r\n class=\"menu-option flex align-items-center {{\r\n !expandMenu\r\n ? 'justify-content-center'\r\n : 'justify-content-between'\r\n }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [tooltipPosition]=\"'right'\"\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n (click)=\"!expandMenu ? (expandMenu = !expandMenu) : ''\"\r\n >\r\n <div class=\"flex flex-row align-items-center\">\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"menu.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </div>\r\n <i\r\n class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color\"\r\n *ngIf=\"expandMenu\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n ></i>\r\n </a>\r\n\r\n <!-- filhos -->\r\n <div\r\n class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n !(menuSelecionado?.idmenupai == menu.idmenu) && 'hidden'\r\n }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n >\r\n <li\r\n *ngFor=\"\r\n let filho of returnMenuChild(menu.idmenu);\r\n let iFilho = index\r\n \"\r\n >\r\n <a\r\n (mouseenter)=\"onMouseEnterChild(filho.idmenu)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{\r\n 'hover-color': mouseOverFilhoIndex === filho.idmenu\r\n }\"\r\n *ngIf=\"expandMenu\"\r\n (click)=\"callRoute(filho.link)\"\r\n pRipple\r\n class=\"{{\r\n filho.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"filho.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ filho.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 ml-4 {{ filho.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ filho.descricaomenu }}</span\r\n >\r\n </a>\r\n </li>\r\n </div>\r\n </div>\r\n </li>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-sidebar>\r\n }\r\n\r\n <!-- Topbar -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <div class=\"flex flex-row align-items-center justify-content-between m-3\">\r\n @if(!showMenu) {\r\n <!-- Logo home -->\r\n <div>\r\n <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n </div>\r\n } @else {\r\n <!-- Breadcrumbs -->\r\n <div>\r\n <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n </p>\r\n <p-breadcrumb\r\n *ngIf=\"widthCard > 400\"\r\n styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n [model]=\"breadCrumbItems\"\r\n [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n ></p-breadcrumb>\r\n </div>\r\n }\r\n\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-40rem\"\r\n formControlName=\"idmaster\"\r\n [formGroup]=\"formGroup\"\r\n [masters]=\"masters\"\r\n (onSelectionChange)=\"changeLicense($event)\"\r\n (onSelectionValue)=\"changeLicense($event)\"\r\n >\r\n </dropdown-master>\r\n\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n <p-button\r\n *ngIf=\"showButtonApps\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-th-large\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n (click)=\"sistemasPanel.toggle($event)\"\r\n [pTooltip]=\"'Sistemas'\"\r\n [tooltipPosition]=\"'left'\"\r\n ></p-button>\r\n\r\n <p-button\r\n *ngIf=\"showButtonUser\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-user\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"meusDadosPanel.toggle($event)\"\r\n ></p-button>\r\n </div>\r\n </div>\r\n\r\n <!-- Container -->\r\n <p-card\r\n styleClass=\"m-3 overflow-y-auto {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n >\r\n <div\r\n class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\"\r\n [style]=\"{ width: widthCard + 'px' }\"\r\n >\r\n <ng-content></ng-content>\r\n </div>\r\n </p-card>\r\n </div>\r\n\r\n <!-- Painel de aplicativos -->\r\n <p-overlayPanel\r\n #sistemasPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">Sistemas</p>\r\n <div\r\n class=\"flex flex-row flex-wrap gap-2 align-items-center justify-content-center mt-5 mb-3\"\r\n style=\"width: 250px; height: 100%\"\r\n >\r\n <button\r\n *ngFor=\"let aplicativo of apps\"\r\n pButton\r\n pRipple\r\n class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n >\r\n {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n </button>\r\n </div>\r\n </ng-template>\r\n </p-overlayPanel>\r\n\r\n <!-- Painel do usu\u00E1rio -->\r\n <p-overlayPanel\r\n #meusDadosPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">\r\n Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n </p>\r\n <div class=\"mt-5 mb-3\"></div>\r\n\r\n <p-button\r\n icon=\"pi pi-lock\"\r\n label=\"Acessar Keepass\"\r\n (onClick)=\"accessKeePass($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n\r\n <p-button\r\n icon=\"pi pi-sign-out\"\r\n label=\"Sair\"\r\n (onClick)=\"logout($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n </ng-template>\r\n </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}.btn-sistema{display:flex;align-items:center;justify-content:center;background-color:#0c3e66;font-size:20px}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 10%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}\n"] }]
|
|
5131
|
+
args: [{ selector: 'kv-layout', template: "<div class=\"flex flex-row overflow-y-hidden w- full-container\">\r\n @if (showMenu) {\r\n <div [style]=\"{ minWidth: expandMenu ? '300px' : '60px' }\"></div>\r\n } @if(showMenu) {\r\n <p-sidebar\r\n #sidebarRef\r\n [visible]=\"true\"\r\n [showCloseIcon]=\"false\"\r\n [modal]=\"false\"\r\n [style]=\"{ width: expandMenu ? '300px' : '60px' }\"\r\n class=\"sidebar-animation\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"flex flex-column overflow-hidden\">\r\n <div\r\n class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2 overflow-hidden\"\r\n >\r\n <div\r\n class=\"flex {{\r\n expandMenu ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }} py-3\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n <img\r\n *ngIf=\"expandMenu && logoMenuExpand\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n width=\"150\"\r\n class=\"cursor-pointer\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Logo para o menu minimizado-->\r\n <img\r\n *ngIf=\"!expandMenu && logoMenuHide\"\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n width=\"50\"\r\n class=\"mb-2\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n\r\n <!-- Toggle menu -->\r\n <button\r\n *ngIf=\"showExpandMenu\"\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"toggleMenu()\"\r\n [pTooltip]=\"expandMenu ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> menu </i>\r\n </button>\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center {{\r\n expandMenu ? 'justify-content-between' : 'justify-content-center'\r\n }}\"\r\n >\r\n <div\r\n class=\"flex flex-column cursor-pointer\"\r\n *ngIf=\"expandMenu && selectedEmpresa\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n <span\r\n class=\"text-sm font-semibold mr-2\"\r\n [pTooltip]=\"this.selectedEmpresa.razaosocial\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n {{ nameEmpresa(this.selectedEmpresa.razaosocial) }}\r\n </span>\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n </div>\r\n\r\n <button\r\n pButton\r\n class=\"p-button-rounded p-button-text padding-style h-2rem w-2rem hover:bg-green-600 hover:text-white icon-menu\"\r\n (click)=\"changeEmpresa($event)\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n >\r\n <i class=\"material-symbols-outlined\"> sync_alt </i>\r\n </button>\r\n </div>\r\n <p-divider type=\"solid\"></p-divider>\r\n }\r\n </div>\r\n\r\n <div class=\"list-none m-0 card-container overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n <li *ngFor=\"let menu of menus; let i = index\" class=\"px-2\">\r\n <!-- menu que n\u00E3o tem filho -->\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n (click)=\"callRouteItem(menu)\"\r\n *ngIf=\"\r\n !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)\r\n \"\r\n pRipple\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n [tooltipPosition]=\"'right'\"\r\n class=\"{{\r\n menu.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [class.justify-content-center]=\"!expandMenu\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color {{ menu.textColor }}\"\r\n *ngIf=\"menu.icone\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium {{ menu.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </a>\r\n <!-- menu com filho -->\r\n <div *ngIf=\"menu.indmenupai\">\r\n <a\r\n (mouseenter)=\"onMouseEnter(i)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n pRipple\r\n pStyleClass=\"@next\"\r\n enterClass=\"hidden\"\r\n enterActiveClass=\"slidedown\"\r\n leaveToClass=\"hidden\"\r\n leaveActiveClass=\"slideup\"\r\n class=\"menu-option flex align-items-center {{\r\n !expandMenu\r\n ? 'justify-content-center'\r\n : 'justify-content-between'\r\n }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\r\n [tooltipPosition]=\"'right'\"\r\n [pTooltip]=\"!expandMenu ? menu.descricaomenu : ''\"\r\n (click)=\"!expandMenu ? (expandMenu = !expandMenu) : ''\"\r\n >\r\n <div class=\"flex flex-row align-items-center\">\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"menu.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ menu.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 font-medium\"\r\n *ngIf=\"expandMenu\"\r\n >{{ menu.descricaomenu }}</span\r\n >\r\n </div>\r\n <i\r\n class=\"pi pi-chevron-down text-blue-900 mr-1 icon-hover-color\"\r\n *ngIf=\"expandMenu\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n ></i>\r\n </a>\r\n\r\n <!-- filhos -->\r\n <div\r\n class=\"list-none py-0 pl-3 pr-0 m-0 {{\r\n !(menuSelecionado?.idmenupai == menu.idmenu) && 'hidden'\r\n }} overflow-y-hidden transition-all transition-duration-400 transition-ease-in-out\"\r\n >\r\n <li\r\n *ngFor=\"\r\n let filho of returnMenuChild(menu.idmenu);\r\n let iFilho = index\r\n \"\r\n >\r\n <a\r\n (mouseenter)=\"onMouseEnterChild(filho.idmenu)\"\r\n (mouseleave)=\"onMouseLeave()\"\r\n [ngClass]=\"{\r\n 'hover-color': mouseOverFilhoIndex === filho.idmenu\r\n }\"\r\n *ngIf=\"expandMenu\"\r\n (click)=\"callRouteItem(filho)\"\r\n pRipple\r\n class=\"{{\r\n filho.bgColor\r\n }} menu-option flex align-items-center no-underline cursor-pointer border-round text-700 hover:bg-green-600 transition-duration-150 transition-colors p-ripple p-2\"\r\n >\r\n <i\r\n class=\"material-symbols-outlined icon-menu {{\r\n expandMenu ? 'ml-1 mr-2' : ''\r\n }} icon-hover-color\"\r\n *ngIf=\"filho.icone\"\r\n [ngClass]=\"{ 'hover-color': mouseOverIndex === i }\"\r\n >\r\n {{ filho.icone }}\r\n </i>\r\n <span\r\n class=\"text-base text-blue-900 ml-4 {{ filho.textColor }}\"\r\n *ngIf=\"expandMenu\"\r\n >{{ filho.descricaomenu }}</span\r\n >\r\n </a>\r\n </li>\r\n </div>\r\n </div>\r\n </li>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-sidebar>\r\n }\r\n\r\n <!-- Topbar -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <div class=\"flex flex-row align-items-center justify-content-between m-3\">\r\n @if(!showMenu) {\r\n <!-- Logo home -->\r\n <div>\r\n <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n </div>\r\n } @else {\r\n <!-- Breadcrumbs -->\r\n <div>\r\n <p class=\"text-xl font-semibold text-blue-900 breadcrumb-title\">\r\n {{ breadCrumbItems[breadCrumbItems.length - 1]?.label }}\r\n </p>\r\n <p-breadcrumb\r\n *ngIf=\"widthCard > 400\"\r\n styleClass=\"border-none p-0 flex align-items-center h-2rem !important;\"\r\n [model]=\"breadCrumbItems\"\r\n [style]=\"{ backgroundColor: '#eaeaea' }\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n ></p-breadcrumb>\r\n </div>\r\n }\r\n\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-40rem\"\r\n formControlName=\"idmaster\"\r\n [formGroup]=\"formGroup\"\r\n [masters]=\"masters\"\r\n (onSelectionChange)=\"changeLicense($event)\"\r\n (onSelectionValue)=\"changeLicense($event)\"\r\n >\r\n </dropdown-master>\r\n\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <div class=\"w-auto flex flex-row align-items-center gap-2\">\r\n <p-button\r\n *ngIf=\"showButtonApps\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-th-large\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n (click)=\"sistemasPanel.toggle($event)\"\r\n [pTooltip]=\"'Sistemas'\"\r\n [tooltipPosition]=\"'left'\"\r\n ></p-button>\r\n\r\n <p-button\r\n *ngIf=\"showButtonUser\"\r\n styleClass=\"w-2rem h-2rem text-blue-900 hover:bg-green-600 hover:text-white\"\r\n icon=\"pi pi-user\"\r\n [rounded]=\"true\"\r\n [text]=\"true\"\r\n [pTooltip]=\"'Menu do Usu\u00E1rio'\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"meusDadosPanel.toggle($event)\"\r\n ></p-button>\r\n </div>\r\n </div>\r\n\r\n <!-- Container -->\r\n <p-card\r\n styleClass=\"m-3 overflow-y-auto {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n [style]=\"{ height: heightCard - adjustHeightCard() + 'px' }\"\r\n >\r\n <div\r\n class=\"{{ widthCard < 992 && 'card-container' }} w-full h-full\"\r\n [style]=\"{ width: widthCard + 'px' }\"\r\n >\r\n <ng-content></ng-content>\r\n </div>\r\n </p-card>\r\n </div>\r\n\r\n <!-- Painel de aplicativos -->\r\n <p-overlayPanel\r\n #sistemasPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">Sistemas</p>\r\n <div\r\n class=\"flex flex-row flex-wrap gap-2 align-items-center justify-content-center mt-5 mb-3\"\r\n style=\"width: 250px; height: 100%\"\r\n >\r\n <button\r\n *ngFor=\"let aplicativo of apps\"\r\n pButton\r\n pRipple\r\n class=\"btn-sistema-2 btn-sistema hover-btn-cor-padrao remove-focus h-4rem w-4rem\"\r\n [pTooltip]=\"aplicativo?.descricaoaplicativo\"\r\n [tooltipPosition]=\"'left'\"\r\n (click)=\"selectApp(aplicativo.idaplicativo)\"\r\n >\r\n {{ aplicativo.nomeaplicativo.charAt(0).toUpperCase() }}\r\n </button>\r\n </div>\r\n </ng-template>\r\n </p-overlayPanel>\r\n\r\n <!-- Painel do usu\u00E1rio -->\r\n <p-overlayPanel\r\n #meusDadosPanel\r\n [showTransitionOptions]=\"'350ms ease-out'\"\r\n [hideTransitionOptions]=\"'250ms ease-in'\"\r\n >\r\n <ng-template pTemplate=\"container\">\r\n <p class=\"title-style mt-3\">\r\n Ol\u00E1, {{ userName ? userName.split(\" \")[0] : \"Usu\u00E1rio\" }}!\r\n </p>\r\n <div class=\"mt-5 mb-3\"></div>\r\n\r\n <p-button\r\n icon=\"pi pi-lock\"\r\n label=\"Acessar Keepass\"\r\n (onClick)=\"accessKeePass($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n\r\n <p-button\r\n icon=\"pi pi-sign-out\"\r\n label=\"Sair\"\r\n (onClick)=\"logout($event)\"\r\n styleClass=\"border-noround w-full text-blue-900\"\r\n [text]=\"true\"\r\n >\r\n </p-button>\r\n </ng-template>\r\n </p-overlayPanel>\r\n</div>\r\n", styles: [".material-icons{font-family:Material Icons;font-weight:400;font-style:normal;font-size:1em;display:inline-block;width:1em;height:1em;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:\"liga\"}::ng-deep .p-button:focus{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none}::ng-deep .p-overlaypanel .p-overlaypanel-content{padding:0}::ng-deep .hover-btn-cor-padrao.p-button:enabled:hover{background:#0c3e66;border-color:#002542}.p-button.p-button-icon-only.p-button-rounded{background:#0c3e66;border-color:#002542}::ng-deep .remove-focus:focus{border:none}::ng-deep .p-sidebar .p-sidebar-content{padding:0}::ng-deep .sidebar-header-sistema.p-sidebar .p-sidebar-header{padding-top:.5rem;padding-right:0;padding-bottom:0;padding-left:0;display:block}.btn-sistema{display:flex;align-items:center;justify-content:center;background-color:#0c3e66;font-size:20px}::ng-deep .p-sidebar .p-sidebar-header{padding:0rem!important}::ng-deep body{margin:0!important}::ng-deep .p-breadcrumb ul li.p-breadcrumb-chevron{position:relative;top:3px;color:#0c3e66!important}.page-content{background:linear-gradient(to bottom,#eaeaea 10%,#fff 19%)}*{margin:0}p .item-menu{color:#0c3e66;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}span{font-size:.9rem!important}.breadcrumb-title{font-size:1rem!important;font-family:Inter var,Roboto,Arial,Helvetica,sans-serif!important}::ng-deep .home-style{background-color:#eaeaea;overflow:hidden}::ng-deep .page-style{overflow:auto!important}::ng-deep .card-container{overflow-x:hidden}::ng-deep .card-container::-webkit-scrollbar{width:6px}::ng-deep .card-container::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .card-container::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .card-container:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .card-container::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}.title-style{position:relative;top:10px;margin-left:20px;font-size:25px;color:#002542;border-bottom:2px solid green;font-weight:600;display:inline}::ng-deep p-sidebar .p-sidebar-content{overflow-y:hidden}::ng-deep p-dialog .p-dialog-content{overflow-y:unset}.icon-menu{color:#002542;display:flex;justify-content:center;align-items:center}::ng-deep .padding-style{padding:15px!important}::ng-deep .menu-option{padding:15px 5px!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text{color:#183462!important;opacity:.95;font-weight:500;font-size:.8rem!important}::ng-deep .p-breadcrumb .p-breadcrumb-list .p-menuitem-text:hover{opacity:.7}.pl-3{padding-left:0rem!important}::ng-deep svg.p-icon{width:.7rem;height:1rem}.hover-color .text-base,.hover-color .icon-hover-color{color:#fff!important}::ng-deep .p-card .p-card-body{padding:0rem!important}::ng-deep .p-card .p-card-content{padding:0rem!important}::ng-deep .p-sidebar-left{z-index:1100!important}\n"] }]
|
|
5125
5132
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2$1.FormBuilder }, { type: i3$1.Router }, { type: i3$1.ActivatedRoute }], propDecorators: { apps: [{
|
|
5126
5133
|
type: Input
|
|
5127
5134
|
}], breadCrumbItems: [{
|