This commit is contained in:
Çetin 2022-08-29 10:51:04 +03:00
commit 2273349b87
3 changed files with 11 additions and 8 deletions

View File

@ -1,7 +1,6 @@
import { Component, OnDestroy, Renderer2, ViewChild } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router';
import { filter, Subscription } from 'rxjs';
import { MenuService } from './app.menu.service';
import { LayoutService } from "./service/app.layout.service";
import { AppSidebarComponent } from "./app.sidebar.component";
import { AppTopBarComponent } from './app.topbar.component';
@ -22,12 +21,12 @@ export class AppLayoutComponent implements OnDestroy {
@ViewChild(AppTopBarComponent) appTopbar!: AppTopBarComponent;
constructor(private menuService: MenuService, public layoutService: LayoutService, public renderer: Renderer2, public router: Router) {
constructor(public layoutService: LayoutService, public renderer: Renderer2, public router: Router) {
this.overlayMenuOpenSubscription = this.layoutService.overlayOpen$.subscribe(() => {
if (!this.menuOutsideClickListener) {
this.menuOutsideClickListener = this.renderer.listen('document', 'click', event => {
const isOutsideClicked = !(this.appSidebar.el.nativeElement.isSameNode(event.target) || this.appSidebar.el.nativeElement.contains(event.target)
|| event.target.classList.contains('p-trigger') || event.target.parentNode.classList.contains('p-trigger'));
|| this.appTopbar.menuButton.nativeElement.isSameNode(event.target) || this.appTopbar.menuButton.nativeElement.contains(event.target));
if (isOutsideClicked) {
this.hideMenu();
@ -38,7 +37,7 @@ export class AppLayoutComponent implements OnDestroy {
if (!this.profileMenuOutsideClickListener) {
this.profileMenuOutsideClickListener = this.renderer.listen('document', 'click', event => {
const isOutsideClicked = !(this.appTopbar.menu.nativeElement.isSameNode(event.target) || this.appTopbar.menu.nativeElement.contains(event.target)
|| event.target.classList.contains('p-trigger') || event.target.parentNode.classList.contains('p-trigger'));
|| this.appTopbar.topbarMenuButton.nativeElement.isSameNode(event.target) || this.appTopbar.topbarMenuButton.nativeElement.contains(event.target));
if (isOutsideClicked) {
this.hideProfileMenu();

View File

@ -4,15 +4,15 @@
<span>SAKAI</span>
</a>
<button class="p-link layout-menu-button layout-topbar-button p-trigger" (click)="layoutService.onMenuToggle()">
<button #menubutton class="p-link layout-menu-button layout-topbar-button" (click)="layoutService.onMenuToggle()">
<i class="pi pi-bars"></i>
</button>
<button class="p-link layout-topbar-menu-button layout-topbar-button p-trigger" (click)="layoutService.showProfileSidebar()">
<button #topbarmenubutton class="p-link layout-topbar-menu-button layout-topbar-button" (click)="layoutService.showProfileSidebar()">
<i class="pi pi-ellipsis-v"></i>
</button>
<div #menu class="layout-topbar-menu" [ngClass]="{'layout-topbar-menu-mobile-active': layoutService.state.profileSidebarVisible}">
<div #topbarmenu class="layout-topbar-menu" [ngClass]="{'layout-topbar-menu-mobile-active': layoutService.state.profileSidebarVisible}">
<button class="p-link layout-topbar-button">
<i class="pi pi-calendar"></i>
<span>Calendar</span>

View File

@ -10,7 +10,11 @@ export class AppTopBarComponent {
items!: MenuItem[];
@ViewChild('menu') menu!: ElementRef;
@ViewChild('menubutton') menuButton!: ElementRef;
@ViewChild('topbarmenubutton') topbarMenuButton!: ElementRef;
@ViewChild('topbarmenu') menu!: ElementRef;
constructor(public layoutService: LayoutService) { }
}