import {Component, EventEmitter, Input, Output} from '@angular/core';

@Component({
  selector: 'pages-menu',
  templateUrl: 'pages-menu.component.html',
  styleUrls: ['pages-menu.component.scss']
})
export class PagesMenuComponent {
  @Input() items = <any>[];
  @Output() onSelected = new EventEmitter();
  public hover:boolean[]=[]

  private hiddenPages = ['/o-tsentre/protivodeistvie-korruptsii', '/o-tsentre/zashchita-personalnykh-dannykh', '/o-tsentre/okhrana-truda'];



  get visibleItems() {
    return this.items?.filter(item => {
      return this.hiddenPages.indexOf(item.link) === -1;
    });
  }

  itemSelect(event:any){
    this.onSelected.emit(event);
  }

  setHover(i:number,hover:boolean){
    this.hover=[];
    this.hover[i]=hover;
  }

  getDepth(item){
    if (item.hasOwnProperty('depth')) return item.depth
    if (!item.hasOwnProperty('depth')) item.depth=0;
    if (item.children?.data.length) {
      item.depth = 1;
      item.children.data.forEach(child => {
        let childDepth = this.getDepth(child)
        if (childDepth>=item.depth) item.depth=childDepth+1;
      });
    }
    return item.depth
  }
}