.

src/ts/components/Utils.tsx

@@ -13,4 +13,13 @@ export function ip2int(ip: string) {
 export function sec2date(ms: number) {
     var dateTime = new Date(ms);
     return dateTime.toLocaleString();
+}
+
+export function mac2str(from: string) {
+    var hexValue = parseInt(from).toString(16);
+    var macaddress = [];
+    for (var i = 0; i < hexValue.length; i = i + 2) {
+        macaddress.push(hexValue.substr(i, 2));
+    }
+    return macaddress.join(':');
 }

src/ts/containers/discovery/DiscoveryResult.tsx

@@ -14,22 +14,19 @@ const styles = {
 
 
 export class DiscoveryResult extends React.Component<any, any> {
-  targets : any;
+  list: any;
 
   constructor(props: any, context: any) {
     super(props, context);
     this.state = {
       result: [],
-      selected: [],
-      selectedHost: [],
-      selectedService: [],
     };
   }
 
   componentWillMount() {
     let data = '{"startDate":1496812121000,"endDate":1496812155000,"result":true,"zone":{"ip":3232235985,"mask":24,"iface":"enp0s3","mac":8796753988883,"firstScanRange":3232235777,"lastScanRange":3232236030,"hosts":[{"firstScanRange":1,"lastScanRange":10000,"name":"","ip":3232235985,"mac":8796753988883,"ports":null,"createDate":1496812124000,"updateDate":1496812124000},{"firstScanRange":1,"lastScanRange":10000,"name":"","ip":3232235881,"mac":23084201235582,"ports":[{"createDate":-62135596800000,"updateDate":-62135596800000,"services":[{"createDate":-62135596800000,"updateDate":-62135596800000,"portType":"TCP","serviceName":"SMTP"}],"portType":"TCP","portNumber":25},{"createDate":-62135596800000,"updateDate":-62135596800000,"services":[{"createDate":-62135596800000,"updateDate":-62135596800000,"portType":"TCP","serviceName":"HTTP"}],"portType":"TCP","portNumber":3000},{"createDate":-62135596800000,"updateDate":-62135596800000,"services":[{"createDate":-62135596800000,"updateDate":-62135596800000,"portType":"TCP","serviceName":"HTTP"}],"portType":"TCP","portNumber":80}],"createDate":1496812124000,"updateDate":1496812124000}]}}';
     let obj = JSON.parse(data);
-    this.targets = new Array();
+    this.list = Array();
     this.setState({
       result: obj,
     });
@@ -59,18 +56,19 @@ export class DiscoveryResult extends React.Component<any, any> {
   }
 
   handleNext = () => {
-    for (var i = 0; i < this.targets.length; i++) {
+    for (var i = 0; i < this.list.length; i++) {
-      var target = this.targets[i];
+      var target = this.list[i];
       console.log(target);
     }
 
 
   }
 
-  handleTargetCheck = (type: string, checked: boolean, host: any, port: any) => {
+  handleTargetCheck = (id: number, type: string, checked: boolean, host: any, port: any) => {
     let obj: any;
     if (type === "host") {
       obj = {
+        "id": id,
         "ip": host.ip,
         "port": 0,
         "portType": "",
@@ -78,6 +76,7 @@ export class DiscoveryResult extends React.Component<any, any> {
       };
     } else {
       obj = {
+        "id": id,
         "ip": host.ip,
         "port": port.portNumber,
         "portType": port.portType,
@@ -86,10 +85,15 @@ export class DiscoveryResult extends React.Component<any, any> {
     }
 
     if (checked) {
-      this.targets.push(obj);
+      this.list.push(obj);
     } else {
-      this.targets.pop(obj);
+      for (var i = 0; i < this.list.length; i++) {
+        if (this.list[i].id === id) {
+          this.list.splice(i, 1);
+        }
+      }
     }
+    console.log(this.list);
   }
 
 
@@ -159,7 +163,7 @@ export class Row extends React.Component<any, any> {
   }
 
   handleCheck(ev: any, checked: boolean) {
-    this.props.onCheck(this.props.type, checked, this.props.host, this.props.port);
+    this.props.onCheck(this.props.id, this.props.type, checked, this.props.host, this.props.port);
   }
 
   render() {