import { Component, OnInit, Input, ElementRef, ViewEncapsulation, ViewChild, TemplateRef } from '@angular/core';

@Component({
  selector: 'mat-panel',
  encapsulation: ViewEncapsulation.None,
  templateUrl: './mat-panel-header.component.html',
  styleUrls: ['./mat-panel-header.component.less']
})
export class MatPanelHeaderComponent {
  _isShow = true;
  _el: HTMLElement;

  @Input() name: string;
  @Input() mtaPanelHeader: string | TemplateRef<any>;

  @ViewChild('content') content: ElementRef;

  constructor(private _elementRef: ElementRef) {
    this._el = this._elementRef.nativeElement;
  }

  toggleShow() {
    this._isShow = !this._isShow;
    this.content.nativeElement.style.display = this._isShow === true ? '' : 'none';
    // this._el.nextElementSibling['style'].display = this._isShow === true ? '' : 'none';
  }
}