line.component.ts

import {Component, OnInit} from '@angular/core';
import {TopologyService} from '../../topology.service';
import {LocalStorageService} from 'ngx-webstorage';
import {NzMessageService} from 'ng-zorro-antd';

declare let editor: any;
@Component({
    selector: 'smart-line',
    templateUrl: './line.component.html',
    styles: []
})
export class LineComponent implements OnInit {

    isLine = false;
    hostIds = [];
    itemId = [];  //第一个进口流量，第二个出口流量

    inPageNum = 1;
    outPageNum = 1;
    inPageCount = 10;
    outPageCount = 10;

    totalNum;

    inList;
    inSelect;
    inSearchName;

    outList;
    outSelect;
    outSearchName;

    constructor(private topologySer: TopologyService, private message: NzMessageService, private localStorage: LocalStorageService,) {
    }

    //in
    incurrentPageDataChange($event: Array<{ kchecked: boolean }>): void {
        this.inList = $event;
    }

    inselectItem(item,e){
        if(e){
            const arr = this.inList.map(data=>{
                return data.itemId;
            });
            const old = this.inSelect;
           if(old){
               const index = arr.indexOf(old.itemId);
               this.inList[index].checked = false;
           }
            this.inSelect = item;
        }else{
            this.inSelect = null;
        }
    }

    indeleteSelect(index){
        this.inSelect = null;
    }

    changePageIn(e){
        this.inPageNum = e;
        this.getInList();
    }

    //out

    outcurrentPageDataChange($event: Array<{ key1: string; key2: number; key3: string; key4: string; checked: boolean }>): void {
        this.outList = $event;
    }

    outselectItem(item,e){
        if(e){
            const arr = this.outList.map(data=>{
                return data.itemId;
            });
            const old = this.outSelect;
            if(old){
                const index = arr.indexOf(old.itemId);
                this.outList[index].checked = false;
            }
            this.outSelect = item;
        }else{
            this.outSelect = null;
        }
    }

    outdeleteSelect(index){
        this.outSelect = null;
    }

    changePageOut(e){
        this.outPageNum = e;
        this.getOutList();
    }

    ngOnInit() {

    }

    showModal(linkObj) {
        this.hostIds = linkObj.hostIds;  //线条上的主机id；
        if(linkObj.itemId && linkObj.itemId.length > 0){
            this.itemId = linkObj.itemId.split(',');   //线条上的监测点id；
        }
        this.isLine = true;
        this.getInList();
        this.getOutList();
    }

    //查询进口流量
    getInList(){
        const data = {
            hostIds:this.hostIds,
            search:this.inSearchName,
            type:"in",
            pageNum:this.inPageNum,
            pageCount:this.inPageCount
        }
        this.topologySer.findFlowItemByHost(data).subscribe(
            (res)=>{
                this.totalNum = res.data.totalNum;
                this.inList = res.data.data;
                this.inList.forEach(e=>{   //进口流量回显
                    if(e.itemId == this.itemId[0]){
                        e.checked = true;
                        this.inSelect = e;
                    }else{
                        e.checked = false;
                    }
                })
            }
        )

    }

    //查询出口流量
    getOutList(){
        const data = {
            hostIds:this.hostIds,
            search:this.outSearchName,
            type:"out",
            pageNum:this.outPageNum,
            pageCount:this.outPageCount
        }
        this.topologySer.findFlowItemByHost(data).subscribe(
            (res)=>{
                this.totalNum = res.data.totalNum;
                this.outList = res.data.data;
                this.outList.forEach(e=>{
                    if(e.itemId == this.itemId[1]){  //出口流量回显
                        e.checked = true;
                        this.outSelect = e;
                    }else{
                        e.checked = false;
                    }
                })
            }
        )

    }

    //进出口流量
    handleLineCancel() {
        this.initForm();
        localStorage.setItem("line",'false');
    }

    handleLineOk() {
        if(this.inSelect && !this.outSelect){
            this.message.warning("必须选择一组！");
            return false;
        }
        if(!this.inSelect && this.outSelect){
            this.message.warning("必须选择一组！");
            return false;
        }
        editor.utils.setLink(this.inSelect,this.outSelect);
        localStorage.setItem("line",'false');
        this.initForm();
    }

    initForm(){
        this.inList = [];
        this.outList = [];
        this.itemId = [];
        this.inSelect = null;
        this.outSelect = null;
        this.inSearchName = null;
        this.outSearchName = null;
        this.isLine = false;
    }

}