overflow-webapp/src/packages/infra/component/map/map.component.ts

import { Component, OnInit, AfterContentInit } from '@angular/core';
import { Infra, InfraHost, InfraOSApplication, InfraService } from '../../model';
import { Store, select } from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import { AuthSelector } from 'packages/member/store';
import * as ListStore from '../../store/list';
import { ListSelector } from '../../store';
import { Page, PageParams } from 'app/commons/model';
import { Domain } from '../../../domain/model';
import { MatDialog } from '@angular/material';
import { SettingComponent } from '../../../sensor/component/setting/setting.component';
import { Target } from 'packages/target/model';

interface HostData {
  target?: Target;
  host: InfraHost;
  services: InfraService[];
}

@Component({
  selector: 'of-infra-map',
  templateUrl: './map.component.html',
  styleUrls: ['./map.component.scss']
})
export class MapComponent implements OnInit, AfterContentInit {

  infras$ = this.listStore.pipe(select(ListSelector.select('page')));
  hostDataList: HostData[] = new Array();

  totalList: Infra[];
  loading = false;

  constructor(
    private listStore: Store<ListStore.State>,
    public dialog: MatDialog
  ) { }

  ngOnInit() {
    this.infras$.subscribe(
      (page: Page) => {
        if (page !== null) {
          // this.totalList = page.content;
          // this.generateInfraHostData();
        }
      },
      (error: RPCClientError) => {
        console.log(error.response.message);
      }
    );

    // Test
    const list = new Array();
    for (let i = 0; i < 10; i++) {
      const host: InfraHost = {
        target: {
          id: 1
        },
        infraType: {
          name: 'HOST'
        },
        ip: i,
      };
      list.push(host);

      for (let j = 0; j < 3; j++) {
        const service: InfraService = {
          target: {
            id: 1
          },
          infraType: {
            name: 'OS_SERVICE'
          },
          host: {
            ip: i,
          },
          portType: 'TCP',
          port: i,
          vendor: {
            name: String('vendor' + i)
          }
        };
        list.push(service);
      }
    }
    this.totalList = list;
    this.generateInfraHostData();
  }

  ngAfterContentInit() {
    this.getInfraList();
  }

  generateInfraHostData(filterStr?: string) {
    this.loading = true;
    for (const infra of this.totalList) {
      const infraType = infra.infraType.name;
      if (infraType === 'HOST') {
        const infraHost: InfraHost = infra;
        if (filterStr && String(infraHost.ip).indexOf(filterStr) < 0) {
          continue;
        }
        const data: HostData = {
          target: infra.target,
          host: infra,
          services: new Array(),
        };
        this.hostDataList.push(data);
      } else if (infraType === 'OS_SERVICE') {
        const infraService: InfraService = infra;
        if (filterStr && infraService.vendor.name.indexOf(filterStr) < 0) {
          continue;
        }
        const existHost = this.getExistHost(infraService.host);
        if (existHost !== null) {
          existHost.services.push(infraService);
        } else {
          const host: HostData = {
            target: infra.target,
            host: infraService.host,
            services: new Array()
          };
          host.services.push(infraService);
          this.hostDataList.push(host);
        }
      }
    }
    this.loading = false;
  }

  getExistHost(infraHost: InfraHost): HostData {
    let node = null;
    for (const data of this.hostDataList) {
      if (data.host.ip === infraHost.ip) {
        node = data;
      }
    }
    return node;
  }

  getInfraList() {
    this.listStore.select(AuthSelector.select('domain')).subscribe(
      (domain: Domain) => {
        const pageParams: PageParams = {
          pageNo: '0',
          countPerPage: '9999999',
          sortCol: 'id',
          sortDirection: 'descending'
        };
        this.listStore.dispatch(new ListStore.ReadAllByDomain({ domain, pageParams }));
      },
      (error) => {
        console.log(error);
      }
    );
  }

  addSensor(infra: Infra) {
    const targetId = infra.target.id;

    const dialogRef = this.dialog.open(SettingComponent, {
      width: '80%',
      data: {
        'infra': infra
      }
    });

    dialogRef.afterClosed().subscribe(result => {
      console.log('The dialog was closed');
    });
  }

  showHostInfo(infraHost: InfraHost) {
    return 'Meta';
  }

  showServiceInfo(infraService: InfraService) {
    return 'Meta';
  }

  handleSearch(filterStr: string) {
    this.hostDataList.length = 0;
    this.generateInfraHostData(filterStr);
  }
}