import { Component, ViewChild, TemplateRef, OnInit } from '@angular/core';
import { FarrisSidebarComponent } from '../../../../../projects/sidebar/src/public-api';
import { FarrisSidebarService } from '../../../../../projects/sidebar/src/public-api';

@Component({
  selector: 'app-sidebar-test',
  template: `<farris-sidebar
  [showPos]="'right'"
  [title]="'ssss'"
  #farrissidebar
  [resizeable]="true"
  [mainCls]="'main-tsCls'"
  [showHeader]="true"
  [showFooter]="true"
  [maskable]="true"
  [maskClosable]="false"
  [width]="500"
  [showEntry]="true"
>
  <!-- <ng-template farrisSidebarHeader [headerCls]="'f-sidebar-header-test'">
  111111
</ng-template> -->
  <ng-template farrisSidebarTitle [titleCls]="'f-sidebar-title-test'">
      22222222
  </ng-template>
  <!-- <ng-template farrisSidebarHcontent [hcontentCls]="'f-sidebar-hcontent-test'">
  预留区域
</ng-template> -->
  <!-- <ng-template farrisSidebarToolbar [toolbarCls]="'f-sidebar-toolbar-test'">
  <span (click)="farrissidebar.closeSideBar()">按钮区域</span>
  <span>dsfsdsdasdsadasdasd</span>
</ng-template> -->
  <ng-template farrisSidebarIcon [iconCls]="'f-sidebar-icon-test'">
  动态入口2222222222222
</ng-template>
  <ng-template farrisSidebarContent [contentCls]="'f-sidebar-content-test'">
      fsfds
      <app-form></app-form>
  </ng-template>
  <ng-template farrisSidebarFooter [footerCls]="'f-sidebar-footer-test'">
      <button type="button" class="btn f-btn-mr btn-primary">保存</button>
      <button type="button" class="btn f-btn-mr btn-secondary">取消</button>
  </ng-template>
</farris-sidebar>`,
  styleUrls: []
})
export class SidebarTestComponent implements OnInit {
  title = 'farris-sidebar'

  @ViewChild('buttonRef') buttonRef: TemplateRef<any>

  @ViewChild('farrissidebar') farrissidebar: FarrisSidebarComponent

  openSidebar() {
      this.farrissidebar.isOpen = true
  }

  constructor(
    private sidebarService: FarrisSidebarService
  ) {}

  ngOnInit() {}
  onClick(event) {
      this.sidebarService.sendIsOpen(event)
  }


}