import { Component, ViewChild, OnInit, Input, AfterContentInit, AfterViewInit } from '@angular/core';
import { MatPaginator, MatTableDataSource } from '@angular/material';
import { Router } from '@angular/router';

import { Sensor } from 'packages/sensor/model';

@Component({
  selector: 'of-target-detail',
  templateUrl: './detail.component.html',
  styleUrls: ['./detail.component.scss']
})
export class DetailComponent implements OnInit, AfterViewInit, AfterContentInit {

  displayedColumns = ['crawler', 'itemCnt', 'status'];
  sensors: MatTableDataSource<Sensor> = null;
  @ViewChild(MatPaginator) paginator: MatPaginator;

  basicInfo = [
    {
      key: 'IP',
      value: '192.168.1.105',
    },
    {
      key: 'Mac',
      value: 'aaaaaaaaaaaaa',
    },
    {
      key: 'OS',
      value: 'Ubuntu',
    },
    {
      key: 'Port',
      value: '80',
    },
  ];
  metaInfo = [
    {
      key: 'Meta1',
      value: 'value1',
    },
    {
      key: 'Meta2',
      value: 'value2',
    },
    {
      key: 'Meta3',
      value: 'value3',
    },
    {
      key: 'Meta4',
      value: 'value4',
    },
  ];

  constructor(private router: Router) { }

  ngOnInit() {
  }

  ngAfterViewInit() {
    this.sensors.paginator = this.paginator;
  }

  ngAfterContentInit() {
    const temporaryData: Sensor[] = [
      {
        id: 0,
        crawler: {
          id: 0,
          name: 'WMI',
        },
        status: {
          id: 0,
          name: 'UP'
        },
        itemCount: 5,
      },
      {
        id: 1,
        crawler: {
          id: 0,
          name: 'SSH',
        },
        status: {
          id: 0,
          name: 'UP'
        },
        itemCount: 5,
      },
    ];
    this.sensors = new MatTableDataSource<any>(temporaryData);
  }

  handleSensorClick(sensor: Sensor) {
    this.router.navigate(['sensor', sensor.id]);
  }

  handleCheckAlive() {
  }

  handleTraceroute() {
  }
}