keevo-components 1.8.267 → 1.8.269
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/api/base-components/base-component-crud.mjs +2 -2
- package/esm2022/lib/components/kv-layout/layout/kv-layout.component.mjs +18 -9
- package/fesm2022/keevo-components.mjs +18 -9
- package/fesm2022/keevo-components.mjs.map +1 -1
- package/lib/components/kv-layout/layout/kv-layout.component.d.ts +6 -2
- package/package.json +1 -1
|
@@ -603,7 +603,7 @@ class BaseComponentCrud {
|
|
|
603
603
|
// paramsDialog);
|
|
604
604
|
const dialogRef = FormService.openDialog(this.dialogService, componentType, callBackFunction, paramsDialog);
|
|
605
605
|
// Garante que o estado atual seja mantido no histórico
|
|
606
|
-
window.history.pushState(null, '', window.location.href);
|
|
606
|
+
// window.history.pushState(null, '', window.location.href);
|
|
607
607
|
// Configura a ação para quando o botão de voltar do navegador é pressionado
|
|
608
608
|
window.onpopstate = function () {
|
|
609
609
|
// Verifica se o dialog está aberto antes de fechá-lo
|
|
@@ -5173,6 +5173,9 @@ class KvLayoutComponent {
|
|
|
5173
5173
|
if (latestRequest?.currentValue) {
|
|
5174
5174
|
this.menusPerApp();
|
|
5175
5175
|
}
|
|
5176
|
+
if (changes['breadCrumbItems']) {
|
|
5177
|
+
this.selecionarMenu();
|
|
5178
|
+
}
|
|
5176
5179
|
}
|
|
5177
5180
|
ngOnInit() {
|
|
5178
5181
|
this.formGroup = this.fb.group({
|
|
@@ -5195,6 +5198,18 @@ class KvLayoutComponent {
|
|
|
5195
5198
|
this.adjustWidthCard();
|
|
5196
5199
|
this.cdr.detectChanges();
|
|
5197
5200
|
}
|
|
5201
|
+
selecionarMenu() {
|
|
5202
|
+
this.menus = this.menus.map((menu) => {
|
|
5203
|
+
return {
|
|
5204
|
+
...menu,
|
|
5205
|
+
bgColor: `/${menu.link}` == this.breadCrumbItems[0]?.routerLink ? 'bg-green-600' : '',
|
|
5206
|
+
textColor: `/${menu.link}` == this.breadCrumbItems[0]?.routerLink ? 'text-white' : '',
|
|
5207
|
+
};
|
|
5208
|
+
});
|
|
5209
|
+
this.menuSelecionado = this.menus.find((menu) => {
|
|
5210
|
+
return `/${menu.link}` == this.breadCrumbItems[0]?.routerLink;
|
|
5211
|
+
});
|
|
5212
|
+
}
|
|
5198
5213
|
returnMenuChild(idmenu) {
|
|
5199
5214
|
return this.menus.filter((x) => x.idmenupai == idmenu);
|
|
5200
5215
|
}
|
|
@@ -5208,12 +5223,6 @@ class KvLayoutComponent {
|
|
|
5208
5223
|
this.expandMenu = !this.expandMenu;
|
|
5209
5224
|
this.expandMenuEvent();
|
|
5210
5225
|
}
|
|
5211
|
-
verifySelectedPage(link, pai) {
|
|
5212
|
-
let item = this.breadCrumbItems.filter((item) => `/${item.routerLink}` == link);
|
|
5213
|
-
if (item?.length > 0)
|
|
5214
|
-
this.menuSelecionado = pai?.idmenu;
|
|
5215
|
-
return item?.length > 0;
|
|
5216
|
-
}
|
|
5217
5226
|
navigateToDefaultRoute() {
|
|
5218
5227
|
this.navigateToDefaultRouteEmit.emit();
|
|
5219
5228
|
}
|
|
@@ -5221,11 +5230,11 @@ class KvLayoutComponent {
|
|
|
5221
5230
|
return this.expandMenu ? 'expanded' : 'collapsed';
|
|
5222
5231
|
}
|
|
5223
5232
|
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 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5224
|
-
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 mx-1\">\r\n <div\r\n class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2\"\r\n >\r\n <div\r\n class=\"flex {{expandMenu ? 'flex-row' : 'flex-column'}} 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\r\n class=\"list-none m-0 card-container {{ expandMenu ? 'mx-1' : '' }}\"\r\n [style.max-height]=\"heightCard - 220 + 'px'\"\r\n style=\"overflow-y: auto\"\r\n >\r\n <!-- menus -->\r\n <li *ngFor=\"let menu of menus; let i = index\">\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 verifySelectedPage(menu.link) ? 'bg-green-600' : ''\r\n }} menu-option flex align-items-center no-underline {{\r\n !expandMenu ? 'justify-content-center' : ''\r\n }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\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 verifySelectedPage(menu.link) ? 'text-white' : ''\r\n }}\"\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 {{\r\n verifySelectedPage(menu.link) ? 'text-white' : ''\r\n }}\"\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 {{ !(menuSelecionado == menu.idmenu) && 'hidden'}} 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 verifySelectedPage(filho.link, menu) ? 'bg-green-600' : ''\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 {{\r\n verifySelectedPage(filho.link, menu) ? 'text-white' : ''\r\n }}\"\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\r\n @if(!showMenu) {\r\n <!-- Logo home -->\r\n <div>\r\n <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n </div>\r\n } \r\n \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:auto!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" }] }); }
|
|
5233
|
+
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" }] }); }
|
|
5225
5234
|
}
|
|
5226
5235
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, decorators: [{
|
|
5227
5236
|
type: Component,
|
|
5228
|
-
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 mx-1\">\r\n <div\r\n class=\"flex flex-column gap-2 justify-content-between flex-shrink-0 mx-2\"\r\n >\r\n <div\r\n class=\"flex {{expandMenu ? 'flex-row' : 'flex-column'}} 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\r\n class=\"list-none m-0 card-container {{ expandMenu ? 'mx-1' : '' }}\"\r\n [style.max-height]=\"heightCard - 220 + 'px'\"\r\n style=\"overflow-y: auto\"\r\n >\r\n <!-- menus -->\r\n <li *ngFor=\"let menu of menus; let i = index\">\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 verifySelectedPage(menu.link) ? 'bg-green-600' : ''\r\n }} menu-option flex align-items-center no-underline {{\r\n !expandMenu ? 'justify-content-center' : ''\r\n }} cursor-pointer border-round text-700 hover:bg-green-600 hover:text-white transition-duration-150 transition-colors p-ripple\"\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 verifySelectedPage(menu.link) ? 'text-white' : ''\r\n }}\"\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 {{\r\n verifySelectedPage(menu.link) ? 'text-white' : ''\r\n }}\"\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 {{ !(menuSelecionado == menu.idmenu) && 'hidden'}} 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 verifySelectedPage(filho.link, menu) ? 'bg-green-600' : ''\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 {{\r\n verifySelectedPage(filho.link, menu) ? 'text-white' : ''\r\n }}\"\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\r\n @if(!showMenu) {\r\n <!-- Logo home -->\r\n <div>\r\n <img [src]=\"logoMenuExpand\" width=\"150\" />\r\n </div>\r\n } \r\n \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:auto!important}\n"] }]
|
|
5237
|
+
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"] }]
|
|
5229
5238
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2$1.FormBuilder }, { type: i3$1.Router }], propDecorators: { apps: [{
|
|
5230
5239
|
type: Input
|
|
5231
5240
|
}], breadCrumbItems: [{
|