appointments_frontend/ng-seed/src/app/layouts/admin/admin-layout.component.ts

import { Component, OnInit, OnDestroy, ViewChild, HostListener } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { MenuItems } from '../../shared/menu-items/menu-items';
import { HorizontalMenuItems } from '../../shared/menu-items/horizontal-menu-items';
import { Subscription } from 'rxjs';
import { filter } from 'rxjs/operators';
import {TranslateModule, TranslateLoader} from '@ngx-translate/core';
import {TranslateHttpLoader} from '@ngx-translate/http-loader';
import {TranslateService} from '@ngx-translate/core';
import PerfectScrollbar from 'perfect-scrollbar';
import { PerfectScrollbarConfigInterface,
PerfectScrollbarComponent, PerfectScrollbarDirective } from 'ngx-perfect-scrollbar';
import { RoleMenuItemsPipe } from '../role-menu-items.pipe';
import { ConsultantService } from 'app/appoinment/consultant-setting/consultant-service/consultant.service';
import { environment } from 'environments/environment';

@Component({
  selector: 'app-layout',
  templateUrl: './admin-layout.component.html',
  providers: [RoleMenuItemsPipe],
})
export class AdminLayoutComponent implements OnInit, OnDestroy {

  private _router: Subscription;

  today: number = Date.now();
  url: string;
  showSettings = false;
  dark: boolean;
  boxed: boolean;
  collapseSidebar: boolean;
  compactSidebar: boolean;
  horizontal: boolean = false;
  sidebarBg: boolean = true;
  currentLang = 'en';
  layoutDir = 'ltr';
  searchFocus : boolean = false;
  //08/02/2023
  user: any = 'superadmin@gmail.com' 
  //
  menuLayout           : any = 'vertical-menu';
  selectedSidebarImage : any = 'bg-1';
  // selectedSidebarColor : any = 'sidebar-default';
  selectedSidebarColor : any = 'sidebar-green';

  selectedHeaderColor  : any = 'header-default';
  collapsedClass       : any = 'side-panel-opened';

  @ViewChild('sidemenu', {static: true}) sidemenu;
  public config: PerfectScrollbarConfigInterface = {};
  getUser: any;
  // usersLogo: any;
  private apiUrl = environment.apiEndpoint;
  getUserData: any = [];
  userLength: any = [];
  roleName: any;
  constructor(public _con:ConsultantService,private router: Router, public menuItems: MenuItems, public horizontalMenuItems : HorizontalMenuItems, public translate: TranslateService ) {
    const browserLang: string = translate.getBrowserLang();
    translate.use(browserLang.match(/en|fr/) ? browserLang : 'en');
    this.getUser = localStorage.getItem('user_role')
    
  }

//08/02/2023
users() {
 let temp:any = JSON.parse(localStorage.getItem('email'))
 console.log(this.user,temp.email)
  return temp.email
}
//

  ngOnInit(): void {  
    this.getUserDetails()
    const elemSidebar = <HTMLElement>document.querySelector('.sidebar-container ');

    if (window.matchMedia(`(min-width: 960px)`).matches && !this.isMac() && !this.compactSidebar && this.layoutDir != 'rtl') {
      const ps = new PerfectScrollbar(elemSidebar, {
                              wheelSpeed: 2,
                              suppressScrollX: true
                            });
    }

    this._router = this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe((event: NavigationEnd) => {
      this.url = event.url;
      if (this.isOver()) {
        this.sidemenu.close();
      }

      if (window.matchMedia(`(min-width: 960px)`).matches && !this.isMac() && !this.compactSidebar && this.layoutDir != 'rtl') {
        // Ps.update(elemContent);
      }
    });

  
  }

  getUserDetails(){
    let userID = localStorage.getItem('user_id')
    console.log('in')
    this._con.getUsersListDetails(userID).subscribe(res => {
      if (res.status == 200) {
        this.userLength = res.data
        this.getUserData = res.data[0] 
        if(this.getUserData.role == 'PRACTITIONER'){
           this.roleName = 'Practitioner'
        }
        if(this.getUserData.role == 'FRONTDESK'){
          this.roleName = 'Frontdesk'
        }
        if(this.getUserData.role == 'BIZADMIN'){
          this.roleName = 'Business Admin'
        }

        // this.usersLogo = res.data[0].logo; 
        console.log(this.getUserData)
        let currency = this.getUserData.BusinessDetails[0].currency
        console.log(currency)
        localStorage.setItem('currency',currency)
      }
    })
  }
  image_view(image){    
    return this.apiUrl+'imageViewer?img_name='+image;
  }

  @HostListener('click', ['$event'])
  onClick(e: any) {
    const elemSidebar = <HTMLElement>document.querySelector('.sidebar-container ');
    setTimeout(() => {
      if (window.matchMedia(`(min-width: 960px)`).matches && !this.isMac() && !this.compactSidebar && this.layoutDir != 'rtl') {
        const ps = new PerfectScrollbar(elemSidebar, {
                              wheelSpeed: 2,
                              suppressScrollX: true
                            });
      }
    }, 350);
  }

  ngOnDestroy() {
    if (this._router) {
      this._router.unsubscribe();
    }
    
  }

  isOver(): boolean {
    if (this.url === '/apps/messages' || this.url === '/apps/calendar' || this.url === '/apps/media' || this.url === '/maps/leaflet') {
      return true;
    } else {
      return window.matchMedia(`(max-width: 960px)`).matches;
    }
  }

  isMac(): boolean {
    let bool = false;
    if (navigator.platform.toUpperCase().indexOf('MAC') >= 0 || navigator.platform.toUpperCase().indexOf('IPAD') >= 0) {
      bool = true;
    }
    return bool;
  }

  menuMouseOver(): void {
    if (window.matchMedia(`(min-width: 960px)`).matches && this.collapseSidebar) {
      this.sidemenu.mode = 'over';
    }
  }

  menuMouseOut(): void {
    if (window.matchMedia(`(min-width: 960px)`).matches && this.collapseSidebar) {
      this.sidemenu.mode = 'side';
    }
  }
  
  menuToggleFunc()
  {
    this.sidemenu.toggle();
    
    if(this.collapsedClass == 'side-panel-opened')
    {
        this.collapsedClass = 'side-panel-closed';
    }
    else
    {
        this.collapsedClass= 'side-panel-opened';
    }
  }

  changeMenuLayout(value)
  {
    console.log(value)
    if(value)
    {
      this.menuLayout = 'top-menu';
    }
    else
    {
      this.menuLayout = 'vertical-menu';
      this.menuToggleFunc();
    }
  }
  
  onSelectSidebarImage(selectedClass, event)
  {
    this.selectedSidebarImage = selectedClass;
  }
  
  onSelectedSidebarColor(selectedClass)
  {
    this.selectedSidebarColor = selectedClass;
  }
  
  onSelectedHeaderColor(selectedClass)
  {
    this.selectedHeaderColor = selectedClass;
  }

  isBgActive(value)
  {
    if(value == this.selectedSidebarImage)
    {
      return true;
    }
    else
    {
      return false;
    }
  }

  isSidebarActive(value)
  {
    if(value == this.selectedSidebarColor)
    {
      return true;
    }
    else
    {
      return false;
    }
  }

  isHeaderActive(value)
  {
    if(value == this.selectedHeaderColor)
    {
      return true;
    }
    else
    {
      return false;
    }
  }

  addMenuItem(): void {
    this.menuItems.add({
      state: 'menu',
      name: 'MENU',
      type: 'sub',
      icon: 'trending_flat',
      children: [
        {state: 'menu', name: 'MENU'},
        {state: 'timelmenuine', name: 'MENU'}
      ]
    });
  }
  logout() {
    localStorage.clear();
    this.router.navigate(['/authentication/login']);
  }
	
}