app/src/commons/component/scanner-setting-dropdown.component.ts

import { Component, Input, OnInit, ViewChild } from '@angular/core';
import { DropdownPanelComponent } from '@overflow/commons/ui/component/primeng';

@Component({
  selector: 'app-scanner-setting-dropdown',
  templateUrl: './scanner-setting-dropdown.component.html',
  styleUrls: ['./scanner-setting-dropdown.component.scss'],
})

export class ScannerSettingDropdownComponent implements OnInit {

  @Input() blockTarget: any;
  @ViewChild('panel') panel: DropdownPanelComponent;

  valid: boolean;
  ipSummary: string;
  portSummary: string;

  ipType: string;
  firstIP: string;
  lastIP: string;
  includePortType: string[];
  firstPort: string;
  lastPort: string;

  ipErrMsg: string;
  portErrMsg: string;

  constructor(
  ) {
  }

  ngOnInit(): void {
    this.setDefault();
  }

  setDefault(): void {
    this.ipType = "V4";

    this.firstIP = '192.168.1.1'
    this.lastIP = '192.168.1.254'
    this.includePortType = ['TCP', 'UDP']
    this.firstPort = '1'
    this.lastPort = '65535'
    this.ipErrMsg = '';
    this.portErrMsg = '';

    this.setSummary();
  }

  validateIP(value: string, idx: number) {
    this.ipErrMsg = '';
    switch (this.ipType) {
      case 'V4':
        if (!(/^(?=\d+\.\d+\.\d+\.\d+$)(?:(?:25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]|[0-9])\.?){4}$/.test(value))) {
          this.ipErrMsg = 'INVALID_IP_FORMAT';
          return;
        }
        let from = idx === 0 ? value : this.firstIP;
        let to = idx === 1 ? value : this.lastIP;
        if (this.ipToNum(from) > this.ipToNum(to)) {
          this.ipErrMsg = 'INVALID_IP_RANGE';
          return;
        }
        break;
      case 'V6':
        break;
      default:
        break;
    }
  }

  ipPressed(evt: any) {
    if (!Number.isInteger(Number(evt.key)) && evt.key !== '.') {
      return false;
    }
  }

  ipToNum(ip: string): number {
    return ip.split('.').reduce(function (ipInt, octet) { return (ipInt << 8) + parseInt(octet, 10) }, 0) >>> 0;
  }

  validatePort(value: string, idx: number) {
    this.portErrMsg = '';
    let fromStr = idx === 0 ? value : this.firstPort;
    let toStr = idx === 1 ? value : this.lastPort;
    let from = Number(fromStr);
    let to = Number(toStr)
    if (from === NaN || to === NaN) {
      this.portErrMsg = 'INVALID_PORT_TYPE';
      return;
    }
    if (from <= 0) {
      this.firstPort = '1';
      return;
    }
    if (to > 65535) {
      this.lastPort = '65535';
      return;
    }
    if (from > to) {
      this.portErrMsg = 'INVALID_PORT_RANGE';
      return;
    }
  }

  validateTCP(checked: boolean) {
    if (!checked && this.includePortType.indexOf('UDP') === -1) {
      this.includePortType = ['TCP'];
    }
  }
  validateUDP(checked: boolean) {
    if (!checked && this.includePortType.indexOf('TCP') === -1) {
      this.includePortType = ['UDP'];
    }
  }

  done() {
    // TODO: re-validation
    this.setSummary();
  }

  setSummary(): void {
    this.ipSummary = this.ipType + ' (' + this.firstIP + ' - ' + this.lastIP + ')';
    this.portSummary = this.includePortType.join(',');
    this.portSummary += ' (' + this.firstPort + ' - ' + this.lastPort + ')';
    this.panel.hide();
  }
}