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

@Component({
  selector: 'app-portal-banner-content-select',
  template: `
    <div class="text-danger">{{link}}</div>
    <nz-tabset>
      <nz-tab nzTitle="作品"><select-art [productId]="productId" (itemClick)="onItemClick('art', $event)"></select-art></nz-tab>
      <nz-tab nzTitle="专辑"><select-album [productId]="productId" (itemClick)="onItemClick('album', $event)"></select-album></nz-tab>
      <nz-tab nzTitle="收集"><select-collection [productId]="productId" (itemClick)="onItemClick('collection', $event)"></select-collection></nz-tab>
      <nz-tab nzTitle="栏目"><select-column [productId]="productId" (itemClick)="onItemClick('column', $event)"></select-column></nz-tab>
    </nz-tabset>
  `,
  styles: [`
  `
  ]
})
export class PortalBannerContentSelectComponent implements OnInit {

  @Input() productId: string;

  link: string = null;
  
  constructor() { }

  ngOnInit(): void {
    console.log(this.productId)
  }

  onItemClick(type, item) {
    if (!item) {
      this.link = null;
      return;
    }
    if (type == 'album') {
      this.link = `art://inapp?type=album&id=${item._id}`;
    } else if (type == 'collection') {
      this.link = `art://inapp?type=collection&id=${item._id}`;
    } else if (type == 'art') {
      this.link = `art://inapp?type=single&id=${item._id}`;
    } else if (type == 'column') {
      this.link = `art://inapp?type=column&id=${item.id}`;
    }
  }



}
