keevo-components 1.8.509 → 1.8.511
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/components/kv-layout/layout/kv-layout.component.mjs +2 -2
- package/fesm2022/keevo-components.mjs +2 -2
- package/fesm2022/keevo-components.mjs.map +1 -1
- package/lib/components/kv-button/kv-button.component.d.ts +2 -2
- package/lib/components/kv-table/kv-table.component.d.ts +1 -1
- package/lib/components/kv-table-expandable/kv-table-expandable.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -282,11 +282,11 @@ export class KvLayoutComponent {
|
|
|
282
282
|
}
|
|
283
283
|
}
|
|
284
284
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.FormBuilder }, { token: i2.Router }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
285
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvLayoutComponent, selector: "kv-layout", inputs: { apps: { classPropertyName: "apps", publicName: "apps", isSignal: false, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: false, isRequired: false, transformFunction: null }, topMenusVisible: { classPropertyName: "topMenusVisible", publicName: "topMenusVisible", isSignal: true, isRequired: false, transformFunction: null }, profileImage: { classPropertyName: "profileImage", publicName: "profileImage", isSignal: true, isRequired: false, transformFunction: null }, breadCrumbItems: { classPropertyName: "breadCrumbItems", publicName: "breadCrumbItems", isSignal: false, isRequired: false, transformFunction: null }, masters: { classPropertyName: "masters", publicName: "masters", isSignal: false, isRequired: false, transformFunction: null }, menus: { classPropertyName: "menus", publicName: "menus", isSignal: true, isRequired: false, transformFunction: null }, expandMenu: { classPropertyName: "expandMenu", publicName: "expandMenu", isSignal: true, isRequired: false, transformFunction: null }, logoMenuExpand: { classPropertyName: "logoMenuExpand", publicName: "logoMenuExpand", isSignal: false, isRequired: false, transformFunction: null }, logoMenuHide: { classPropertyName: "logoMenuHide", publicName: "logoMenuHide", isSignal: false, isRequired: false, transformFunction: null }, selectedApp: { classPropertyName: "selectedApp", publicName: "selectedApp", isSignal: false, isRequired: false, transformFunction: null }, selectedEmpresa: { classPropertyName: "selectedEmpresa", publicName: "selectedEmpresa", isSignal: false, isRequired: false, transformFunction: null }, selectedMaster: { classPropertyName: "selectedMaster", publicName: "selectedMaster", isSignal: false, isRequired: false, transformFunction: null }, showButtonApps: { classPropertyName: "showButtonApps", publicName: "showButtonApps", isSignal: false, isRequired: false, transformFunction: null }, showButtonUser: { classPropertyName: "showButtonUser", publicName: "showButtonUser", isSignal: false, isRequired: false, transformFunction: null }, showExpandMenu: { classPropertyName: "showExpandMenu", publicName: "showExpandMenu", isSignal: false, isRequired: false, transformFunction: null }, showDropdownLicenca: { classPropertyName: "showDropdownLicenca", publicName: "showDropdownLicenca", isSignal: false, isRequired: false, transformFunction: null }, showMenu: { classPropertyName: "showMenu", publicName: "showMenu", isSignal: false, isRequired: false, transformFunction: null }, showTrocaEmpresa: { classPropertyName: "showTrocaEmpresa", publicName: "showTrocaEmpresa", isSignal: false, isRequired: false, transformFunction: null }, showBreadcrumb: { classPropertyName: "showBreadcrumb", publicName: "showBreadcrumb", isSignal: false, isRequired: false, transformFunction: null }, userName: { classPropertyName: "userName", publicName: "userName", isSignal: false, isRequired: false, transformFunction: null }, masterName: { classPropertyName: "masterName", publicName: "masterName", isSignal: false, isRequired: false, transformFunction: null }, empresaName: { classPropertyName: "empresaName", publicName: "empresaName", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { menus: "menusChange", expandMenu: "expandMenuChange", 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 }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-row full-container\">\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() ? '17rem' : '3.65rem' }\"\r\n styleClass=\"transition-all\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"h-full flex flex-column overflow-hidden p-2\">\r\n \r\n <!-- LOGO -->\r\n <div class=\"flex-none flex flex-column gap-1 justify-content-between flex-shrink-0 overflow-hidden\">\r\n <div\r\n class=\"flex {{\r\n expandMenu() ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu()\r\n ? 'justify-content-between'\r\n : 'justify-content-center'\r\n }} p-2\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n @if(expandMenu() && logoMenuExpand){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-0\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Logo para o menu minimizado-->\r\n @if(!expandMenu() && logoMenuHide){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-1\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Toggle menu -->\r\n @if(showExpandMenu){\r\n <kv-icon\r\n icon=\"menu-2\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"toggleMenu()\"\r\n />\r\n }\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu()? 'between px-2': 'center'}}\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(expandMenu() && selectedEmpresa){\r\n <div\r\n class=\"flex flex-column \"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(this.selectedEmpresa.razaosocial){\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 }\r\n @if(this.selectedEmpresa.cpfcnpj){\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n }\r\n </div>\r\n \r\n }\r\n <kv-icon\r\n icon=\"transfer\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"changeEmpresa($event)\"\r\n class=\" side-menu-item py-1\"\r\n />\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- <p-divider type=\"solid\"></p-divider> -->\r\n\r\n <!-- MENUS -->\r\n <div class=\"flex-1 list-none m-0 overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n @for (menu of menus(); track $index) {\r\n <li>\r\n <!-- menu que n\u00E3o tem filho -->\r\n @if( !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n (click)=\"callRoute(menu.link)\"\r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n }\r\n </div>\r\n }\r\n <!-- menu com filho -->\r\n @if(menu.indmenupai){\r\n <div class=\"menu-parent\" id=\"menu-parent-{{$index}}\" (mouseenter)=\"exibirMenuChild($event, $index)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\" flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item\" style=\"padding-top: 0.75rem; padding-bottom:0.75rem;\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n \r\n \r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-child-{{$index}}\" [style.opacity]=\"menuVisivel()===$index?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===$index?'auto':'none'\">\r\n <div class=\"h-2rem flex align-items-center\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">\r\n {{menu.descricaomenu}}\r\n </p>\r\n </div>\r\n @for (item of returnMenuChild(menu.idmenu); track $index) {\r\n\r\n <div \r\n class=\" side-menu-item py-2 pl-3 pr-1 text-sm\"\r\n (click)=\"callRoute(item.link)\"\r\n >\r\n {{item.descricaomenu}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </li>\r\n }\r\n </div>\r\n\r\n <p-divider type=\"solid\"></p-divider>\r\n \r\n <!-- APPS E SAIR -->\r\n <div class=\"flex-none list-none m-0 overflow-y-auto max-h-full\">\r\n <li>\r\n <div class=\"menu-parent\" id=\"menu-sistemas-parent\" (mouseenter)=\"exibirMenuChild($event, -1)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sistemas' : ''\"\r\n >\r\n <kv-icon\r\n [icon]=\"'apps'\"\r\n />\r\n @if(expandMenu()){\r\n <label>Sistemas</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-sistemas-child\" [style.opacity]=\"menuVisivel()===-1?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===-1?'auto':'none'\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">Sistemas</p>\r\n @for (item of apps; track $index) {\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 pl-3 pr-1\" (click)=\"callRoute(item.rotapadrao)\">\r\n <img\r\n [src]=\"item.urlicone\"\r\n class=\"h-2rem w-2rem border-round-lg\"\r\n />\r\n <div class=\"text-sm\">\r\n {{item.nomeaplicativo}}\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n \r\n </div>\r\n </li>\r\n <li>\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sair' : ''\"\r\n [style.color]=\"'red'\"\r\n [style.opacity]=\"0.5\"\r\n (click)=\"logout($event)\"\r\n >\r\n <kv-icon\r\n [icon]=\"'logout'\"\r\n \r\n />\r\n @if(expandMenu()){\r\n <label>Sair</label>\r\n }\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 <!-- SE\u00C7\u00C3O CONTE\u00DADO -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden flex flex-column\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <!-- TOPO -->\r\n <div\r\n class=\"flex flex-row flex-wrap align-items-center justify-content-between my-2 mx-2 lg:mx-3 mb-0 gap-1\"\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 @else {\r\n <!-- Breadcrumbs -->\r\n @if(showBreadcrumb) {\r\n <div class=\"h-full\">\r\n <!-- <p class=\"text-base font-semibold system-color breadcrumb-title m-0 p-0 mt-1\">\r\n {{\r\n breadCrumbItems[breadCrumbItems.length - 1] &&\r\n breadCrumbItems[breadCrumbItems.length - 1].label\r\n ? breadCrumbItems[breadCrumbItems.length - 1].label\r\n : \"\"\r\n }}\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 bg-transparent\"\r\n [model]=\"breadCrumbItems\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n >\r\n <ng-template pTemplate=\"item\" let-item let-i=\"index\">\r\n @if(breadCrumbItems.indexOf(item) < breadCrumbItems.length - 1){\r\n <span class=\"font-normal\">{{ item.label }}</span>\r\n }\r\n @else {\r\n <span class=\"font-bold\">{{ item.label }}</span>\r\n }\r\n </ng-template>\r\n </p-breadcrumb>\r\n </div>\r\n }\r\n @else {\r\n <!-- GHOST DIV PARA OCPUAR ESPA\u00C7O NO SPACE BETWEEN -->\r\n <div></div>\r\n }\r\n } \r\n @if (exibirNomes) { \r\n @if(widthCard >= 517) {\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"font-semibold system-color\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\"\r\n >Organiza\u00E7\u00E3o: {{ empresaName }}</span\r\n >\r\n }\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n } \r\n @else {\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"master-name\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\">{{ empresaName }}</span> }\r\n </div>\r\n } \r\n } \r\n @else { \r\n @if(widthPage() > 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"max-w-25rem flex-1\"\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\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 <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n @if(widthPage() <= 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-full\"\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 }\r\n </div>\r\n\r\n <!-- Container -->\r\n <div class=\"overflow-hidden flex-1 p-0 m-0 mb-2\">\r\n <p-card\r\n styleClass=\"overflow-y-auto h-full max-h-full {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n >\r\n <ng-content></ng-content>\r\n \r\n </p-card>\r\n </div>\r\n </div>\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=\"system-color font-medium text-lg px-2 py-3 m-0\">\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 <!-- Cont\u00EAiner com dire\u00E7\u00E3o em coluna para empilhar os bot\u00F5es -->\r\n <div class=\"flex flex-column\">\r\n <!-- Bot\u00F5es adicionais din\u00E2micos -->\r\n @for (action of actions; track $index) {\r\n <ng-container>\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"action.action()\"\r\n >\r\n <kv-icon\r\n [icon]=\"action.icon\"\r\n />\r\n <span>{{action.label}}</span>\r\n </div>\r\n </ng-container>\r\n }\r\n\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"accessKeePass($event)\"\r\n >\r\n <kv-icon\r\n icon=\"lock\"\r\n />\r\n <span>Acessar KeePass</span>\r\n </div>\r\n \r\n </div>\r\n </ng-template>\r\n \r\n </p-overlayPanel>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/dist/tabler-icons.min.css\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";::ng-deep :root{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255;--kv-primary-color: 41, 185, 45;--kv-secondary-color: 0, 37, 66;--kv-tertiary-color: 165, 165, 165}::ng-deep .padrao{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-keevocenter{--kv-color-system: 88,25,153;--kv-color-system-cta: 0, 116, 217;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-holos{--kv-color-system: 241,90,36;--kv-color-system-cta: 224, 168, 35;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 240,240,240;--kv-background-card: 2255,255,255}.system-color{color:rgb(var(--kv-color-system),1)}.bg-system-100{background:rgb(var(--kv-color-system),1)}.bg-system-75{background:rgb(var(--kv-color-system),.75)}.bg-system-50{background:rgb(var(--kv-color-system),.5)}.bg-system-25{background:rgb(var(--kv-color-system),.25)}.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter,Inter var,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter,Inter var,sans-serif!important}:host ::ng-deep .inputs{height:1.875rem}:host ::ng-deep .inputs,.p-inputtext,.p-inputtextarea{font-size:.875rem}::ng-deep .p-dialog .p-dialog-header{color:rgb(var(--kv-color-text))!important;background:rgb(var(--kv-background-card))!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word;border-bottom:1px solid rgb(var(--kv-color-text),.15)}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}::ng-deep .p-tooltip{font-size:.825rem!important}::ng-deep body{margin:0!important}.full-container{background:rgb(var(--kv-kc-background-system),1);width:100vw;height:100vh;overflow-x:hidden;overflow-y:hidden}::ng-deep p-sidebar .p-sidebar{position:relative!important;background:rgb(var(--kv-background-card),1);box-shadow:0 0 .8rem #0000001a;border:1px solid rgb(var(--kv-color-system),.1);margin-left:.5rem;margin-top:.5rem;border-radius:.5rem;height:calc(100vh - 1rem);z-index:1100!important}.page-content{background:none}::ng-deep .card-container{background:rgb(var(--kv-kc-background-system),1);border:none;box-shadow:none;overflow-x:hidden}::ng-deep .card-container .p-card-body{padding:1rem;margin:0}::ng-deep .card-container .p-card-content{margin:0;padding:0}::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}.side-menu-item{transition:all .2s ease-in-out;cursor:pointer;border-radius:.5rem;padding-left:.5rem;padding-right:.5rem}.side-menu-item:hover{background:rgb(var(--kv-color-system),.1);color:rgb(var(--kv-color-system),1)}.side-menu-item label{width:100%;cursor:pointer}::ng-deep .p-divider{margin:0;padding:0;margin-top:.5rem;margin-bottom:.5rem}::ng-deep .p-overlaypanel-content{padding:0}.menu-parent{display:inline-block;width:100%}.menu-childs{position:absolute;left:-500px;width:12rem;min-width:max-content;background:rgb(var(--kv-background-card),1);border:1px solid rgb(var(--kv-color-system),.1);border-radius:.5rem;z-index:9999;box-shadow:0 0 .8rem #0000001a}.menu-childs p{color:rgb(var(--kv-color-system),1)!important;opacity:.7}::ng-deep .p-breadcrumb .p-breadcrumb-list span{color:rgba(var(--kv-color-text),.75)!important;font-size:.75rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator{color:rgba(var(--kv-color-text),.7)!important;margin:0;margin-left:.1rem;margin-right:.1rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator svg{height:.5rem}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.KvIconComponent, selector: "kv-icon", inputs: ["icon", "size", "numNotifications", "img", "clickable"], outputs: ["onClick"] }, { kind: "directive", type: i5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i9.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i10.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i11.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: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i12.TopIconsComponent, selector: "kv-top-icons", inputs: ["topActions"] }, { kind: "component", type: i13.DropdownMasterComponent, selector: "dropdown-master", inputs: ["formControlName", "masters"] }, { kind: "pipe", type: i14.CpfCnpjPipe, name: "cpfCnpj" }] }); }
|
|
285
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.8", type: KvLayoutComponent, selector: "kv-layout", inputs: { apps: { classPropertyName: "apps", publicName: "apps", isSignal: false, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: false, isRequired: false, transformFunction: null }, topMenusVisible: { classPropertyName: "topMenusVisible", publicName: "topMenusVisible", isSignal: true, isRequired: false, transformFunction: null }, profileImage: { classPropertyName: "profileImage", publicName: "profileImage", isSignal: true, isRequired: false, transformFunction: null }, breadCrumbItems: { classPropertyName: "breadCrumbItems", publicName: "breadCrumbItems", isSignal: false, isRequired: false, transformFunction: null }, masters: { classPropertyName: "masters", publicName: "masters", isSignal: false, isRequired: false, transformFunction: null }, menus: { classPropertyName: "menus", publicName: "menus", isSignal: true, isRequired: false, transformFunction: null }, expandMenu: { classPropertyName: "expandMenu", publicName: "expandMenu", isSignal: true, isRequired: false, transformFunction: null }, logoMenuExpand: { classPropertyName: "logoMenuExpand", publicName: "logoMenuExpand", isSignal: false, isRequired: false, transformFunction: null }, logoMenuHide: { classPropertyName: "logoMenuHide", publicName: "logoMenuHide", isSignal: false, isRequired: false, transformFunction: null }, selectedApp: { classPropertyName: "selectedApp", publicName: "selectedApp", isSignal: false, isRequired: false, transformFunction: null }, selectedEmpresa: { classPropertyName: "selectedEmpresa", publicName: "selectedEmpresa", isSignal: false, isRequired: false, transformFunction: null }, selectedMaster: { classPropertyName: "selectedMaster", publicName: "selectedMaster", isSignal: false, isRequired: false, transformFunction: null }, showButtonApps: { classPropertyName: "showButtonApps", publicName: "showButtonApps", isSignal: false, isRequired: false, transformFunction: null }, showButtonUser: { classPropertyName: "showButtonUser", publicName: "showButtonUser", isSignal: false, isRequired: false, transformFunction: null }, showExpandMenu: { classPropertyName: "showExpandMenu", publicName: "showExpandMenu", isSignal: false, isRequired: false, transformFunction: null }, showDropdownLicenca: { classPropertyName: "showDropdownLicenca", publicName: "showDropdownLicenca", isSignal: false, isRequired: false, transformFunction: null }, showMenu: { classPropertyName: "showMenu", publicName: "showMenu", isSignal: false, isRequired: false, transformFunction: null }, showTrocaEmpresa: { classPropertyName: "showTrocaEmpresa", publicName: "showTrocaEmpresa", isSignal: false, isRequired: false, transformFunction: null }, showBreadcrumb: { classPropertyName: "showBreadcrumb", publicName: "showBreadcrumb", isSignal: false, isRequired: false, transformFunction: null }, userName: { classPropertyName: "userName", publicName: "userName", isSignal: false, isRequired: false, transformFunction: null }, masterName: { classPropertyName: "masterName", publicName: "masterName", isSignal: false, isRequired: false, transformFunction: null }, empresaName: { classPropertyName: "empresaName", publicName: "empresaName", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { menus: "menusChange", expandMenu: "expandMenuChange", 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 }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-row full-container\">\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() ? '17rem' : '3.65rem' }\"\r\n styleClass=\"transition-all\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"h-full flex flex-column overflow-hidden p-2\">\r\n \r\n <!-- LOGO -->\r\n <div class=\"flex-none flex flex-column gap-1 justify-content-between flex-shrink-0 overflow-hidden\">\r\n <div\r\n class=\"flex {{\r\n expandMenu() ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu()\r\n ? 'justify-content-between'\r\n : 'justify-content-center'\r\n }} p-2\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n @if(expandMenu() && logoMenuExpand){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-0\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Logo para o menu minimizado-->\r\n @if(!expandMenu() && logoMenuHide){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-1\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Toggle menu -->\r\n @if(showExpandMenu){\r\n <kv-icon\r\n icon=\"menu-2\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"toggleMenu()\"\r\n />\r\n }\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu()? 'between px-2': 'center'}}\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(expandMenu() && selectedEmpresa){\r\n <div\r\n class=\"flex flex-column \"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(this.selectedEmpresa.razaosocial){\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 }\r\n @if(this.selectedEmpresa.cpfcnpj){\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n }\r\n </div>\r\n \r\n }\r\n <kv-icon\r\n icon=\"transfer\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"changeEmpresa($event)\"\r\n class=\" side-menu-item py-1\"\r\n />\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- <p-divider type=\"solid\"></p-divider> -->\r\n\r\n <!-- MENUS -->\r\n <div class=\"flex-1 list-none m-0 overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n @for (menu of menus(); track $index) {\r\n <li>\r\n <!-- menu que n\u00E3o tem filho -->\r\n @if( !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n (click)=\"callRoute(menu.link)\"\r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n }\r\n </div>\r\n }\r\n <!-- menu com filho -->\r\n @if(menu.indmenupai){\r\n <div class=\"menu-parent\" id=\"menu-parent-{{$index}}\" (mouseenter)=\"exibirMenuChild($event, $index)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\" flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item\" style=\"padding-top: 0.75rem; padding-bottom:0.75rem;\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n \r\n \r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-child-{{$index}}\" [style.opacity]=\"menuVisivel()===$index?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===$index?'auto':'none'\">\r\n <div class=\"h-2rem flex align-items-center\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">\r\n {{menu.descricaomenu}}\r\n </p>\r\n </div>\r\n @for (item of returnMenuChild(menu.idmenu); track $index) {\r\n\r\n <div \r\n class=\" side-menu-item py-2 pl-3 pr-1 text-sm\"\r\n (click)=\"callRoute(item.link)\"\r\n >\r\n {{item.descricaomenu}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </li>\r\n }\r\n </div>\r\n\r\n <p-divider type=\"solid\"></p-divider>\r\n \r\n <!-- APPS E SAIR -->\r\n <div class=\"flex-none list-none m-0 overflow-y-auto max-h-full\">\r\n <li>\r\n <div class=\"menu-parent\" id=\"menu-sistemas-parent\" (mouseenter)=\"exibirMenuChild($event, -1)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sistemas' : ''\"\r\n >\r\n <kv-icon\r\n [icon]=\"'apps'\"\r\n />\r\n @if(expandMenu()){\r\n <label>Sistemas</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-sistemas-child\" [style.opacity]=\"menuVisivel()===-1?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===-1?'auto':'none'\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">Sistemas</p>\r\n @for (item of apps; track $index) {\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 pl-3 pr-1\" (click)=\"callRoute(item.rotapadrao)\">\r\n <img\r\n [src]=\"item.urlicone\"\r\n class=\"h-2rem w-2rem border-round-lg\"\r\n />\r\n <div class=\"text-sm\">\r\n {{item.nomeaplicativo}}\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n \r\n </div>\r\n </li>\r\n <li>\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sair' : ''\"\r\n [style.color]=\"'red'\"\r\n [style.opacity]=\"0.5\"\r\n (click)=\"logout($event)\"\r\n >\r\n <kv-icon\r\n [icon]=\"'logout'\"\r\n \r\n />\r\n @if(expandMenu()){\r\n <label>Sair</label>\r\n }\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 <!-- SE\u00C7\u00C3O CONTE\u00DADO -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden flex flex-column\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <!-- TOPO -->\r\n <div\r\n class=\"flex flex-row flex-wrap align-items-center justify-content-between my-2 mx-2 lg:mx-3 mb-0 gap-1\"\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 @else {\r\n <!-- Breadcrumbs -->\r\n @if(showBreadcrumb) {\r\n <div class=\"h-full\">\r\n <!-- <p class=\"text-base font-semibold system-color breadcrumb-title m-0 p-0 mt-1\">\r\n {{\r\n breadCrumbItems[breadCrumbItems.length - 1] &&\r\n breadCrumbItems[breadCrumbItems.length - 1].label\r\n ? breadCrumbItems[breadCrumbItems.length - 1].label\r\n : \"\"\r\n }}\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 bg-transparent\"\r\n [model]=\"breadCrumbItems\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n >\r\n <ng-template pTemplate=\"item\" let-item let-i=\"index\">\r\n @if(breadCrumbItems.indexOf(item) < breadCrumbItems.length - 1){\r\n <span class=\"font-normal\">{{ item.label }}</span>\r\n }\r\n @else {\r\n <span class=\"font-bold\">{{ item.label }}</span>\r\n }\r\n </ng-template>\r\n </p-breadcrumb>\r\n </div>\r\n }\r\n @else {\r\n <!-- GHOST DIV PARA OCPUAR ESPA\u00C7O NO SPACE BETWEEN -->\r\n <div></div>\r\n }\r\n } \r\n @if (exibirNomes) { \r\n @if(widthCard >= 517) {\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"font-semibold system-color\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\"\r\n >Organiza\u00E7\u00E3o: {{ empresaName }}</span\r\n >\r\n }\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n } \r\n @else {\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"master-name\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\">{{ empresaName }}</span> }\r\n </div>\r\n } \r\n } \r\n @else { \r\n @if(widthPage() > 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"max-w-25rem flex-1\"\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\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 <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n @if(widthPage() <= 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-full\"\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 }\r\n </div>\r\n\r\n <!-- Container -->\r\n <div class=\"overflow-hidden flex-1 p-0 m-0 mb-2\">\r\n <p-card\r\n styleClass=\"overflow-y-auto h-full max-h-full {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n >\r\n <ng-content></ng-content>\r\n \r\n </p-card>\r\n </div>\r\n </div>\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=\"system-color font-medium text-lg px-2 py-3 m-0\">\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 <!-- Cont\u00EAiner com dire\u00E7\u00E3o em coluna para empilhar os bot\u00F5es -->\r\n <div class=\"flex flex-column\">\r\n <!-- Bot\u00F5es adicionais din\u00E2micos -->\r\n @for (action of actions; track $index) {\r\n <ng-container>\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"action.action()\"\r\n >\r\n <kv-icon\r\n [icon]=\"action.icon\"\r\n />\r\n <span>{{action.label}}</span>\r\n </div>\r\n </ng-container>\r\n }\r\n\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"accessKeePass($event)\"\r\n >\r\n <kv-icon\r\n icon=\"lock\"\r\n />\r\n <span>Acessar KeePass</span>\r\n </div>\r\n \r\n </div>\r\n </ng-template>\r\n \r\n </p-overlayPanel>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/dist/tabler-icons.min.css\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";::ng-deep :root{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255;--kv-primary-color: 41, 185, 45;--kv-secondary-color: 0, 37, 66;--kv-tertiary-color: 165, 165, 165}::ng-deep .padrao{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-keevocenter{--kv-color-system: 88,25,153;--kv-color-system-cta: 0, 116, 217;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-holos{--kv-color-system: 241,90,36;--kv-color-system-cta: 224, 168, 35;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 240,240,240;--kv-background-card: 2255,255,255}.system-color{color:rgb(var(--kv-color-system),1)}.bg-system-100{background:rgb(var(--kv-color-system),1)}.bg-system-75{background:rgb(var(--kv-color-system),.75)}.bg-system-50{background:rgb(var(--kv-color-system),.5)}.bg-system-25{background:rgb(var(--kv-color-system),.25)}.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter,Inter var,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter,Inter var,sans-serif!important}:host ::ng-deep .inputs{height:1.875rem}:host ::ng-deep .inputs,.p-inputtext,.p-inputtextarea{font-size:.875rem}::ng-deep .p-dialog .p-dialog-header{color:rgb(var(--kv-color-text))!important;background:rgb(var(--kv-background-card))!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word;border-bottom:1px solid rgb(var(--kv-color-text),.15)}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}::ng-deep .p-tooltip{font-size:.825rem!important}::ng-deep body{margin:0!important}.full-container{background:rgb(var(--kv-kc-background-system),1);width:100vw;height:100vh;overflow-x:hidden;overflow-y:hidden}::ng-deep p-sidebar .p-sidebar{position:relative!important;background:rgb(var(--kv-background-card),1);box-shadow:0 0 .8rem #0000001a;border:1px solid rgb(var(--kv-color-system),.1);margin-left:.5rem;margin-top:.5rem;border-radius:.5rem;height:calc(100vh - 1rem);z-index:1100!important}.page-content{background:none}::ng-deep .card-container{background:rgb(var(--kv-kc-background-system),1);border:none;box-shadow:none;overflow-x:hidden}::ng-deep .card-container .p-card-body{padding:.5rem 1rem 0;margin:0}::ng-deep .card-container .p-card-content{margin:0;padding:0}::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}.side-menu-item{transition:all .2s ease-in-out;cursor:pointer;border-radius:.5rem;padding-left:.5rem;padding-right:.5rem}.side-menu-item:hover{background:rgb(var(--kv-color-system),.1);color:rgb(var(--kv-color-system),1)}.side-menu-item label{width:100%;cursor:pointer}::ng-deep .p-divider{margin:0;padding:0;margin-top:.5rem;margin-bottom:.5rem}::ng-deep .p-overlaypanel-content{padding:0}.menu-parent{display:inline-block;width:100%}.menu-childs{position:absolute;left:-500px;width:12rem;min-width:max-content;background:rgb(var(--kv-background-card),1);border:1px solid rgb(var(--kv-color-system),.1);border-radius:.5rem;z-index:9999;box-shadow:0 0 .8rem #0000001a}.menu-childs p{color:rgb(var(--kv-color-system),1)!important;opacity:.7}::ng-deep .p-breadcrumb .p-breadcrumb-list span{color:rgba(var(--kv-color-text),.75)!important;font-size:.75rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator{color:rgba(var(--kv-color-text),.7)!important;margin:0;margin-left:.1rem;margin-right:.1rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator svg{height:.5rem}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.KvIconComponent, selector: "kv-icon", inputs: ["icon", "size", "numNotifications", "img", "clickable"], outputs: ["onClick"] }, { kind: "directive", type: i5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6.Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "directive", type: i7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: i9.Divider, selector: "p-divider", inputs: ["style", "styleClass", "layout", "type", "align"] }, { kind: "component", type: i10.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i11.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: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i12.TopIconsComponent, selector: "kv-top-icons", inputs: ["topActions"] }, { kind: "component", type: i13.DropdownMasterComponent, selector: "dropdown-master", inputs: ["formControlName", "masters"] }, { kind: "pipe", type: i14.CpfCnpjPipe, name: "cpfCnpj" }] }); }
|
|
286
286
|
}
|
|
287
287
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.8", ngImport: i0, type: KvLayoutComponent, decorators: [{
|
|
288
288
|
type: Component,
|
|
289
|
-
args: [{ selector: 'kv-layout', template: "<div class=\"flex flex-row full-container\">\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() ? '17rem' : '3.65rem' }\"\r\n styleClass=\"transition-all\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"h-full flex flex-column overflow-hidden p-2\">\r\n \r\n <!-- LOGO -->\r\n <div class=\"flex-none flex flex-column gap-1 justify-content-between flex-shrink-0 overflow-hidden\">\r\n <div\r\n class=\"flex {{\r\n expandMenu() ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu()\r\n ? 'justify-content-between'\r\n : 'justify-content-center'\r\n }} p-2\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n @if(expandMenu() && logoMenuExpand){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-0\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Logo para o menu minimizado-->\r\n @if(!expandMenu() && logoMenuHide){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-1\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Toggle menu -->\r\n @if(showExpandMenu){\r\n <kv-icon\r\n icon=\"menu-2\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"toggleMenu()\"\r\n />\r\n }\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu()? 'between px-2': 'center'}}\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(expandMenu() && selectedEmpresa){\r\n <div\r\n class=\"flex flex-column \"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(this.selectedEmpresa.razaosocial){\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 }\r\n @if(this.selectedEmpresa.cpfcnpj){\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n }\r\n </div>\r\n \r\n }\r\n <kv-icon\r\n icon=\"transfer\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"changeEmpresa($event)\"\r\n class=\" side-menu-item py-1\"\r\n />\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- <p-divider type=\"solid\"></p-divider> -->\r\n\r\n <!-- MENUS -->\r\n <div class=\"flex-1 list-none m-0 overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n @for (menu of menus(); track $index) {\r\n <li>\r\n <!-- menu que n\u00E3o tem filho -->\r\n @if( !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n (click)=\"callRoute(menu.link)\"\r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n }\r\n </div>\r\n }\r\n <!-- menu com filho -->\r\n @if(menu.indmenupai){\r\n <div class=\"menu-parent\" id=\"menu-parent-{{$index}}\" (mouseenter)=\"exibirMenuChild($event, $index)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\" flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item\" style=\"padding-top: 0.75rem; padding-bottom:0.75rem;\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n \r\n \r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-child-{{$index}}\" [style.opacity]=\"menuVisivel()===$index?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===$index?'auto':'none'\">\r\n <div class=\"h-2rem flex align-items-center\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">\r\n {{menu.descricaomenu}}\r\n </p>\r\n </div>\r\n @for (item of returnMenuChild(menu.idmenu); track $index) {\r\n\r\n <div \r\n class=\" side-menu-item py-2 pl-3 pr-1 text-sm\"\r\n (click)=\"callRoute(item.link)\"\r\n >\r\n {{item.descricaomenu}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </li>\r\n }\r\n </div>\r\n\r\n <p-divider type=\"solid\"></p-divider>\r\n \r\n <!-- APPS E SAIR -->\r\n <div class=\"flex-none list-none m-0 overflow-y-auto max-h-full\">\r\n <li>\r\n <div class=\"menu-parent\" id=\"menu-sistemas-parent\" (mouseenter)=\"exibirMenuChild($event, -1)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sistemas' : ''\"\r\n >\r\n <kv-icon\r\n [icon]=\"'apps'\"\r\n />\r\n @if(expandMenu()){\r\n <label>Sistemas</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-sistemas-child\" [style.opacity]=\"menuVisivel()===-1?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===-1?'auto':'none'\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">Sistemas</p>\r\n @for (item of apps; track $index) {\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 pl-3 pr-1\" (click)=\"callRoute(item.rotapadrao)\">\r\n <img\r\n [src]=\"item.urlicone\"\r\n class=\"h-2rem w-2rem border-round-lg\"\r\n />\r\n <div class=\"text-sm\">\r\n {{item.nomeaplicativo}}\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n \r\n </div>\r\n </li>\r\n <li>\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sair' : ''\"\r\n [style.color]=\"'red'\"\r\n [style.opacity]=\"0.5\"\r\n (click)=\"logout($event)\"\r\n >\r\n <kv-icon\r\n [icon]=\"'logout'\"\r\n \r\n />\r\n @if(expandMenu()){\r\n <label>Sair</label>\r\n }\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 <!-- SE\u00C7\u00C3O CONTE\u00DADO -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden flex flex-column\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <!-- TOPO -->\r\n <div\r\n class=\"flex flex-row flex-wrap align-items-center justify-content-between my-2 mx-2 lg:mx-3 mb-0 gap-1\"\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 @else {\r\n <!-- Breadcrumbs -->\r\n @if(showBreadcrumb) {\r\n <div class=\"h-full\">\r\n <!-- <p class=\"text-base font-semibold system-color breadcrumb-title m-0 p-0 mt-1\">\r\n {{\r\n breadCrumbItems[breadCrumbItems.length - 1] &&\r\n breadCrumbItems[breadCrumbItems.length - 1].label\r\n ? breadCrumbItems[breadCrumbItems.length - 1].label\r\n : \"\"\r\n }}\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 bg-transparent\"\r\n [model]=\"breadCrumbItems\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n >\r\n <ng-template pTemplate=\"item\" let-item let-i=\"index\">\r\n @if(breadCrumbItems.indexOf(item) < breadCrumbItems.length - 1){\r\n <span class=\"font-normal\">{{ item.label }}</span>\r\n }\r\n @else {\r\n <span class=\"font-bold\">{{ item.label }}</span>\r\n }\r\n </ng-template>\r\n </p-breadcrumb>\r\n </div>\r\n }\r\n @else {\r\n <!-- GHOST DIV PARA OCPUAR ESPA\u00C7O NO SPACE BETWEEN -->\r\n <div></div>\r\n }\r\n } \r\n @if (exibirNomes) { \r\n @if(widthCard >= 517) {\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"font-semibold system-color\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\"\r\n >Organiza\u00E7\u00E3o: {{ empresaName }}</span\r\n >\r\n }\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n } \r\n @else {\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"master-name\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\">{{ empresaName }}</span> }\r\n </div>\r\n } \r\n } \r\n @else { \r\n @if(widthPage() > 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"max-w-25rem flex-1\"\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\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 <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n @if(widthPage() <= 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-full\"\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 }\r\n </div>\r\n\r\n <!-- Container -->\r\n <div class=\"overflow-hidden flex-1 p-0 m-0 mb-2\">\r\n <p-card\r\n styleClass=\"overflow-y-auto h-full max-h-full {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n >\r\n <ng-content></ng-content>\r\n \r\n </p-card>\r\n </div>\r\n </div>\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=\"system-color font-medium text-lg px-2 py-3 m-0\">\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 <!-- Cont\u00EAiner com dire\u00E7\u00E3o em coluna para empilhar os bot\u00F5es -->\r\n <div class=\"flex flex-column\">\r\n <!-- Bot\u00F5es adicionais din\u00E2micos -->\r\n @for (action of actions; track $index) {\r\n <ng-container>\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"action.action()\"\r\n >\r\n <kv-icon\r\n [icon]=\"action.icon\"\r\n />\r\n <span>{{action.label}}</span>\r\n </div>\r\n </ng-container>\r\n }\r\n\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"accessKeePass($event)\"\r\n >\r\n <kv-icon\r\n icon=\"lock\"\r\n />\r\n <span>Acessar KeePass</span>\r\n </div>\r\n \r\n </div>\r\n </ng-template>\r\n \r\n </p-overlayPanel>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/dist/tabler-icons.min.css\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";::ng-deep :root{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255;--kv-primary-color: 41, 185, 45;--kv-secondary-color: 0, 37, 66;--kv-tertiary-color: 165, 165, 165}::ng-deep .padrao{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-keevocenter{--kv-color-system: 88,25,153;--kv-color-system-cta: 0, 116, 217;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-holos{--kv-color-system: 241,90,36;--kv-color-system-cta: 224, 168, 35;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 240,240,240;--kv-background-card: 2255,255,255}.system-color{color:rgb(var(--kv-color-system),1)}.bg-system-100{background:rgb(var(--kv-color-system),1)}.bg-system-75{background:rgb(var(--kv-color-system),.75)}.bg-system-50{background:rgb(var(--kv-color-system),.5)}.bg-system-25{background:rgb(var(--kv-color-system),.25)}.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter,Inter var,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter,Inter var,sans-serif!important}:host ::ng-deep .inputs{height:1.875rem}:host ::ng-deep .inputs,.p-inputtext,.p-inputtextarea{font-size:.875rem}::ng-deep .p-dialog .p-dialog-header{color:rgb(var(--kv-color-text))!important;background:rgb(var(--kv-background-card))!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word;border-bottom:1px solid rgb(var(--kv-color-text),.15)}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}::ng-deep .p-tooltip{font-size:.825rem!important}::ng-deep body{margin:0!important}.full-container{background:rgb(var(--kv-kc-background-system),1);width:100vw;height:100vh;overflow-x:hidden;overflow-y:hidden}::ng-deep p-sidebar .p-sidebar{position:relative!important;background:rgb(var(--kv-background-card),1);box-shadow:0 0 .8rem #0000001a;border:1px solid rgb(var(--kv-color-system),.1);margin-left:.5rem;margin-top:.5rem;border-radius:.5rem;height:calc(100vh - 1rem);z-index:1100!important}.page-content{background:none}::ng-deep .card-container{background:rgb(var(--kv-kc-background-system),1);border:none;box-shadow:none;overflow-x:hidden}::ng-deep .card-container .p-card-body{padding:1rem;margin:0}::ng-deep .card-container .p-card-content{margin:0;padding:0}::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}.side-menu-item{transition:all .2s ease-in-out;cursor:pointer;border-radius:.5rem;padding-left:.5rem;padding-right:.5rem}.side-menu-item:hover{background:rgb(var(--kv-color-system),.1);color:rgb(var(--kv-color-system),1)}.side-menu-item label{width:100%;cursor:pointer}::ng-deep .p-divider{margin:0;padding:0;margin-top:.5rem;margin-bottom:.5rem}::ng-deep .p-overlaypanel-content{padding:0}.menu-parent{display:inline-block;width:100%}.menu-childs{position:absolute;left:-500px;width:12rem;min-width:max-content;background:rgb(var(--kv-background-card),1);border:1px solid rgb(var(--kv-color-system),.1);border-radius:.5rem;z-index:9999;box-shadow:0 0 .8rem #0000001a}.menu-childs p{color:rgb(var(--kv-color-system),1)!important;opacity:.7}::ng-deep .p-breadcrumb .p-breadcrumb-list span{color:rgba(var(--kv-color-text),.75)!important;font-size:.75rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator{color:rgba(var(--kv-color-text),.7)!important;margin:0;margin-left:.1rem;margin-right:.1rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator svg{height:.5rem}\n"] }]
|
|
289
|
+
args: [{ selector: 'kv-layout', template: "<div class=\"flex flex-row full-container\">\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() ? '17rem' : '3.65rem' }\"\r\n styleClass=\"transition-all\"\r\n >\r\n <ng-template pTemplate=\"headless\">\r\n <div class=\"h-full flex flex-column overflow-hidden p-2\">\r\n \r\n <!-- LOGO -->\r\n <div class=\"flex-none flex flex-column gap-1 justify-content-between flex-shrink-0 overflow-hidden\">\r\n <div\r\n class=\"flex {{\r\n expandMenu() ? 'flex-row' : 'flex-column'\r\n }} align-items-center {{\r\n expandMenu()\r\n ? 'justify-content-between'\r\n : 'justify-content-center'\r\n }} p-2\"\r\n >\r\n <!-- Logo para o menu expandido -->\r\n @if(expandMenu() && logoMenuExpand){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuExpand\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-0\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Logo para o menu minimizado-->\r\n @if(!expandMenu() && logoMenuHide){\r\n <img\r\n alt=\"Card\"\r\n [src]=\"logoMenuHide\"\r\n [style.height]=\"'2.4rem'\"\r\n width=\"auto\"\r\n class=\"cursor-pointer p-1\"\r\n (click)=\"navigateToDefaultRoute()\"\r\n />\r\n }\r\n\r\n <!-- Toggle menu -->\r\n @if(showExpandMenu){\r\n <kv-icon\r\n icon=\"menu-2\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"expandMenu() ? 'Ocultar Menu' : 'Expandir Menu'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"toggleMenu()\"\r\n />\r\n }\r\n </div>\r\n\r\n @if(showTrocaEmpresa){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu()? 'between px-2': 'center'}}\"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(expandMenu() && selectedEmpresa){\r\n <div\r\n class=\"flex flex-column \"\r\n (click)=\"changeEmpresa($event)\"\r\n >\r\n @if(this.selectedEmpresa.razaosocial){\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 }\r\n @if(this.selectedEmpresa.cpfcnpj){\r\n <span class=\"text-sm mt-1\">{{\r\n this.selectedEmpresa.cpfcnpj | cpfCnpj\r\n }}</span>\r\n }\r\n </div>\r\n \r\n }\r\n <kv-icon\r\n icon=\"transfer\"\r\n [clickable]=\"true\"\r\n [pTooltip]=\"'Trocar de empresa'\"\r\n [tooltipPosition]=\"'right'\"\r\n (onClick)=\"changeEmpresa($event)\"\r\n class=\" side-menu-item py-1\"\r\n />\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- <p-divider type=\"solid\"></p-divider> -->\r\n\r\n <!-- MENUS -->\r\n <div class=\"flex-1 list-none m-0 overflow-y-auto max-h-full\">\r\n <!-- menus -->\r\n @for (menu of menus(); track $index) {\r\n <li>\r\n <!-- menu que n\u00E3o tem filho -->\r\n @if( !menu.indmenupai && (!menu.idmenupai || menu.idmenupai == 0)){\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n (click)=\"callRoute(menu.link)\"\r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n }\r\n </div>\r\n }\r\n <!-- menu com filho -->\r\n @if(menu.indmenupai){\r\n <div class=\"menu-parent\" id=\"menu-parent-{{$index}}\" (mouseenter)=\"exibirMenuChild($event, $index)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\" flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item\" style=\"padding-top: 0.75rem; padding-bottom:0.75rem;\"\r\n [pTooltip]=\"!expandMenu() ? menu.descricaomenu : ''\"\r\n \r\n \r\n >\r\n <kv-icon\r\n [icon]=\"menu.icone|| 'circle-dotted'\"\r\n />\r\n @if(expandMenu()){\r\n <label>{{menu.descricaomenu}}</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-child-{{$index}}\" [style.opacity]=\"menuVisivel()===$index?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===$index?'auto':'none'\">\r\n <div class=\"h-2rem flex align-items-center\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">\r\n {{menu.descricaomenu}}\r\n </p>\r\n </div>\r\n @for (item of returnMenuChild(menu.idmenu); track $index) {\r\n\r\n <div \r\n class=\" side-menu-item py-2 pl-3 pr-1 text-sm\"\r\n (click)=\"callRoute(item.link)\"\r\n >\r\n {{item.descricaomenu}}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </li>\r\n }\r\n </div>\r\n\r\n <p-divider type=\"solid\"></p-divider>\r\n \r\n <!-- APPS E SAIR -->\r\n <div class=\"flex-none list-none m-0 overflow-y-auto max-h-full\">\r\n <li>\r\n <div class=\"menu-parent\" id=\"menu-sistemas-parent\" (mouseenter)=\"exibirMenuChild($event, -1)\" (mouseleave)=\"menuVisivel.set(undefined)\" >\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sistemas' : ''\"\r\n >\r\n <kv-icon\r\n [icon]=\"'apps'\"\r\n />\r\n @if(expandMenu()){\r\n <label>Sistemas</label>\r\n <kv-icon\r\n #chevronIcon\r\n icon=\"chevron-right\"\r\n [clickable]=\"true\"\r\n />\r\n }\r\n </div>\r\n\r\n <div class=\"menu-childs\" id=\"menu-sistemas-child\" [style.opacity]=\"menuVisivel()===-1?'1':'0'\" [style.pointerEvents]=\"menuVisivel()===-1?'auto':'none'\">\r\n <p class=\"p-0 m-0 font-bold pt-2 pl-3 text-xs\">Sistemas</p>\r\n @for (item of apps; track $index) {\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 pl-3 pr-1\" (click)=\"callRoute(item.rotapadrao)\">\r\n <img\r\n [src]=\"item.urlicone\"\r\n class=\"h-2rem w-2rem border-round-lg\"\r\n />\r\n <div class=\"text-sm\">\r\n {{item.nomeaplicativo}}\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n \r\n </div>\r\n </li>\r\n <li>\r\n <div\r\n class=\"flex flex-row align-items-center justify-content-{{expandMenu() ?'between':'center'}} gap-2 side-menu-item py-2\"\r\n [pTooltip]=\"!expandMenu() ? 'Sair' : ''\"\r\n [style.color]=\"'red'\"\r\n [style.opacity]=\"0.5\"\r\n (click)=\"logout($event)\"\r\n >\r\n <kv-icon\r\n [icon]=\"'logout'\"\r\n \r\n />\r\n @if(expandMenu()){\r\n <label>Sair</label>\r\n }\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 <!-- SE\u00C7\u00C3O CONTE\u00DADO -->\r\n <div\r\n class=\"w-auto h-screen page-content overflow-y-hidden flex flex-column\"\r\n id=\"page-content\"\r\n style=\"width: 100vw !important\"\r\n >\r\n <!-- TOPO -->\r\n <div\r\n class=\"flex flex-row flex-wrap align-items-center justify-content-between my-2 mx-2 lg:mx-3 mb-0 gap-1\"\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 @else {\r\n <!-- Breadcrumbs -->\r\n @if(showBreadcrumb) {\r\n <div class=\"h-full\">\r\n <!-- <p class=\"text-base font-semibold system-color breadcrumb-title m-0 p-0 mt-1\">\r\n {{\r\n breadCrumbItems[breadCrumbItems.length - 1] &&\r\n breadCrumbItems[breadCrumbItems.length - 1].label\r\n ? breadCrumbItems[breadCrumbItems.length - 1].label\r\n : \"\"\r\n }}\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 bg-transparent\"\r\n [model]=\"breadCrumbItems\"\r\n (onItemClick)=\"callRoute($event.item.routerLink, true)\"\r\n >\r\n <ng-template pTemplate=\"item\" let-item let-i=\"index\">\r\n @if(breadCrumbItems.indexOf(item) < breadCrumbItems.length - 1){\r\n <span class=\"font-normal\">{{ item.label }}</span>\r\n }\r\n @else {\r\n <span class=\"font-bold\">{{ item.label }}</span>\r\n }\r\n </ng-template>\r\n </p-breadcrumb>\r\n </div>\r\n }\r\n @else {\r\n <!-- GHOST DIV PARA OCPUAR ESPA\u00C7O NO SPACE BETWEEN -->\r\n <div></div>\r\n }\r\n } \r\n @if (exibirNomes) { \r\n @if(widthCard >= 517) {\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"font-semibold system-color\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\"\r\n >Organiza\u00E7\u00E3o: {{ empresaName }}</span\r\n >\r\n }\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n } \r\n @else {\r\n <div\r\n class=\"w-auto flex flex-row justify-content-center align-items-center gap-2\"\r\n >\r\n <!-- Navega\u00E7\u00E3o de sistemas e usu\u00E1rios -->\r\n <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n <div\r\n class=\"w-auto flex flex-column justify-content-center align-items-center gap-2\"\r\n >\r\n @if (masterName) { <span class=\"master-name\">{{ masterName }}</span> }\r\n @if (empresaName) {<span class=\"empresa-name\">{{ empresaName }}</span> }\r\n </div>\r\n } \r\n } \r\n @else { \r\n @if(widthPage() > 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"max-w-25rem flex-1\"\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\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 <!-- @for (topAction of topMenuActions(); track $index) {\r\n <ng-container *ngTemplateOutlet=\"topAction\" />\r\n } -->\r\n <kv-top-icons\r\n [topActions]=\"topMenuOptions\"\r\n />\r\n\r\n </div>\r\n\r\n @if(widthPage() <= 992){\r\n <!-- dropdown para sele\u00E7\u00E3o de empresa/licenca -->\r\n <dropdown-master\r\n *ngIf=\"showLicencas()\"\r\n class=\"w-full\"\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 }\r\n </div>\r\n\r\n <!-- Container -->\r\n <div class=\"overflow-hidden flex-1 p-0 m-0 mb-2\">\r\n <p-card\r\n styleClass=\"overflow-y-auto h-full max-h-full {{\r\n !showMenu && 'sm:overflow-y-hidden'\r\n }} card-container\"\r\n >\r\n <ng-content></ng-content>\r\n \r\n </p-card>\r\n </div>\r\n </div>\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=\"system-color font-medium text-lg px-2 py-3 m-0\">\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 <!-- Cont\u00EAiner com dire\u00E7\u00E3o em coluna para empilhar os bot\u00F5es -->\r\n <div class=\"flex flex-column\">\r\n <!-- Bot\u00F5es adicionais din\u00E2micos -->\r\n @for (action of actions; track $index) {\r\n <ng-container>\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"action.action()\"\r\n >\r\n <kv-icon\r\n [icon]=\"action.icon\"\r\n />\r\n <span>{{action.label}}</span>\r\n </div>\r\n </ng-container>\r\n }\r\n\r\n <div class=\"flex flex-row align-items-center gap-2 side-menu-item py-2 px-2\"\r\n (click)=\"accessKeePass($event)\"\r\n >\r\n <kv-icon\r\n icon=\"lock\"\r\n />\r\n <span>Acessar KeePass</span>\r\n </div>\r\n \r\n </div>\r\n </ng-template>\r\n \r\n </p-overlayPanel>\r\n</div>\r\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap\";@import\"https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap\";@import\"https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/dist/tabler-icons.min.css\";@import\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\";::ng-deep :root{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255;--kv-primary-color: 41, 185, 45;--kv-secondary-color: 0, 37, 66;--kv-tertiary-color: 165, 165, 165}::ng-deep .padrao{--kv-color-system: 10,58,120;--kv-color-system-cta: 76, 175, 80;--kv-color-text: 0, 0, 0;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-keevocenter{--kv-color-system: 88,25,153;--kv-color-system-cta: 0, 116, 217;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 248,250,253;--kv-background-card: 255,255,255}::ng-deep .theme-holos{--kv-color-system: 241,90,36;--kv-color-system-cta: 224, 168, 35;--kv-color-text: 0, 0, 0;--kv-color-text-inv: 255, 255, 165;--kv-background-system: 240,240,240;--kv-background-card: 2255,255,255}.system-color{color:rgb(var(--kv-color-system),1)}.bg-system-100{background:rgb(var(--kv-color-system),1)}.bg-system-75{background:rgb(var(--kv-color-system),.75)}.bg-system-50{background:rgb(var(--kv-color-system),.5)}.bg-system-25{background:rgb(var(--kv-color-system),.25)}.material-symbols-outlined{font-family:Material Symbols Outlined!important}*{font-family:Inter,Inter var,sans-serif!important}::ng-deep .p-accordion,::ng-deep .p-accordion-header,::ng-deep .p-accordion-content,::ng-deep .p-badge,::ng-deep .p-overlay-badge,::ng-deep .p-breadcrumb,::ng-deep .p-breadcrumb-item,::ng-deep .p-breadcrumb-link,::ng-deep .p-button,::ng-deep .p-calendar,::ng-deep .p-card,::ng-deep .p-card-title,::ng-deep .p-card-subtitle,::ng-deep .p-card-content,::ng-deep .p-checkbox,::ng-deep .p-chip,::ng-deep .p-confirm-dialog,::ng-deep .p-confirm-dialog-message,::ng-deep .p-contextmenu,::ng-deep .p-contextmenu-item,::ng-deep .p-dataview,::ng-deep .p-dataview-content,::ng-deep .p-dialog,::ng-deep .p-dialog-title,::ng-deep .p-dialog-content,::ng-deep .p-dropdown,::ng-deep .p-dropdown-label,::ng-deep .p-dropdown-item,::ng-deep .p-dynamic-dialog,::ng-deep .p-dynamic-dialog-title,::ng-deep .p-dynamic-dialog-content,::ng-deep .p-editor,::ng-deep .p-fieldset,::ng-deep .p-fieldset-legend,::ng-deep .p-fieldset-content,::ng-deep .p-fileupload,::ng-deep .p-inputmask,::ng-deep .p-inputnumber,::ng-deep .p-inputtextarea,::ng-deep .p-inputtext,::ng-deep .p-menu,::ng-deep .p-menuitem,::ng-deep .p-menuitem-text,::ng-deep .p-message,::ng-deep .p-messages,::ng-deep .p-multiselect,::ng-deep .p-multiselect-label,::ng-deep .p-multiselect-item,::ng-deep .p-panelmenu,::ng-deep .p-panelmenu-header,::ng-deep .p-panelmenu-content,::ng-deep .p-panel,::ng-deep .p-panel-header,::ng-deep .p-panel-content,::ng-deep .p-password,::ng-deep .p-picklist,::ng-deep .p-progressbar,::ng-deep .p-radiobutton,::ng-deep .p-rating,::ng-deep .p-sidebar,::ng-deep .p-splitbutton,::ng-deep .p-steps,::ng-deep .p-step,::ng-deep .p-table,::ng-deep .p-datatable,::ng-deep .p-tabview,::ng-deep .p-tabpanel,::ng-deep .p-tag,::ng-deep .p-toast,::ng-deep .p-toolbar,::ng-deep .p-tooltip,::ng-deep .p-tree,::ng-deep .p-treetable,::ng-deep .p-selectbutton,::ng-deep .p-stepper,::ng-deep .p-inputgroup,::ng-deep .p-inputgroup-addon,::ng-deep .p-text{font-family:Inter,Inter var,sans-serif!important}:host ::ng-deep .inputs{height:1.875rem}:host ::ng-deep .inputs,.p-inputtext,.p-inputtextarea{font-size:.875rem}::ng-deep .p-dialog .p-dialog-header{color:rgb(var(--kv-color-text))!important;background:rgb(var(--kv-background-card))!important;display:flex!important;flex-wrap:wrap;word-wrap:break-word;border-bottom:1px solid rgb(var(--kv-color-text),.15)}::ng-deep .p-dialog .p-dialog-content{padding-top:1rem}::ng-deep .p-dialog{min-width:320px}::ng-deep .p-dialog-content{overflow-x:hidden}::ng-deep .p-dialog-content::-webkit-scrollbar{width:8px}::ng-deep .p-dialog-content::-webkit-scrollbar:hover{background-color:#dededebf}::ng-deep .p-dialog-content::-webkit-scrollbar-thumb{border-radius:4px;background-color:transparent}::ng-deep .p-dialog-content:hover::-webkit-scrollbar-thumb{border-left:2px solid white;background-color:#00000080}::ng-deep .p-dialog-content::-webkit-scrollbar-track{border-left:2px solid white;background-color:#dededebf}::ng-deep .p-dialog-footer{display:flex;justify-content:flex-end;padding:10px;gap:10px}::ng-deep .p-dialog .p-dialog-header .p-dialog-header-icon{display:none}::ng-deep .p-tooltip{font-size:.825rem!important}::ng-deep body{margin:0!important}.full-container{background:rgb(var(--kv-kc-background-system),1);width:100vw;height:100vh;overflow-x:hidden;overflow-y:hidden}::ng-deep p-sidebar .p-sidebar{position:relative!important;background:rgb(var(--kv-background-card),1);box-shadow:0 0 .8rem #0000001a;border:1px solid rgb(var(--kv-color-system),.1);margin-left:.5rem;margin-top:.5rem;border-radius:.5rem;height:calc(100vh - 1rem);z-index:1100!important}.page-content{background:none}::ng-deep .card-container{background:rgb(var(--kv-kc-background-system),1);border:none;box-shadow:none;overflow-x:hidden}::ng-deep .card-container .p-card-body{padding:.5rem 1rem 0;margin:0}::ng-deep .card-container .p-card-content{margin:0;padding:0}::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}.side-menu-item{transition:all .2s ease-in-out;cursor:pointer;border-radius:.5rem;padding-left:.5rem;padding-right:.5rem}.side-menu-item:hover{background:rgb(var(--kv-color-system),.1);color:rgb(var(--kv-color-system),1)}.side-menu-item label{width:100%;cursor:pointer}::ng-deep .p-divider{margin:0;padding:0;margin-top:.5rem;margin-bottom:.5rem}::ng-deep .p-overlaypanel-content{padding:0}.menu-parent{display:inline-block;width:100%}.menu-childs{position:absolute;left:-500px;width:12rem;min-width:max-content;background:rgb(var(--kv-background-card),1);border:1px solid rgb(var(--kv-color-system),.1);border-radius:.5rem;z-index:9999;box-shadow:0 0 .8rem #0000001a}.menu-childs p{color:rgb(var(--kv-color-system),1)!important;opacity:.7}::ng-deep .p-breadcrumb .p-breadcrumb-list span{color:rgba(var(--kv-color-text),.75)!important;font-size:.75rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator{color:rgba(var(--kv-color-text),.7)!important;margin:0;margin-left:.1rem;margin-right:.1rem}::ng-deep .p-breadcrumb .p-breadcrumb-list li.p-menuitem-separator svg{height:.5rem}\n"] }]
|
|
290
290
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.FormBuilder }, { type: i2.Router }, { type: i2.ActivatedRoute }], propDecorators: { apps: [{
|
|
291
291
|
type: Input
|
|
292
292
|
}], actions: [{
|