target detail child bug fix

src/ts/@overflow/app/config/index.ts

@@ -44,7 +44,7 @@ export interface RPCConfig {
   url: string;
 }
 const rpcConfig: RPCConfig = {
-  url: 'ws://192.168.1.209:18081/rpc',
+  url: 'ws://127.0.0.1:18081/rpc',
 };
 
 // Redux Configuration

src/ts/@overflow/target/react/components/TargetChild.tsx

@@ -14,6 +14,7 @@ import InfraService from '@overflow/infra/api/model/InfraService';
 import * as Utils from '@overflow/commons/util/Utils';
 
 export interface StateProps {
+  infraId?: number;
   infra: Infra;
   machine?: InfraMachine;
   host?: InfraHost;
@@ -46,11 +47,14 @@ export class TargetChild extends React.Component<Props, State> {
     super(props, context);
     this.state = {
     };
+    if (this.props.infra !== undefined && this.props.infra.id === this.props.infraId) {
+      console.log('initninitnitni');
+      this.getChild(this.props.infra);
+    }
   }
 
-  public componentWillMount(): void {
+  // public componentWillMount(): void {
-    this.getChild();
+  // }
-  }
 
   // public shouldComponentUpdate?(nextProps: any, nextContext: any): boolean {
   //   if(nextProps.infra.id === this.props.infra.id) {
@@ -59,9 +63,23 @@ export class TargetChild extends React.Component<Props, State> {
   //   return true;
   // }
 
-  public getChild(): void {
+  public componentWillReceiveProps(nextProps: Readonly<Props>, nextContext: Readonly<State>): void {
-    let infraType = this.props.infra.infraType.id;
+
-    let id = String(this.props.infra.childId);
+    // if(this.props.infra === undefined) {
+    //   this.getChild(nextProps.infra);
+    //   return;
+    // }
+
+    if (nextProps.infra.id !== this.props.infra.id) {
+      this.getChild(nextProps.infra);
+    }
+    // console.log(nextProps);
+    // console.log(nextContext);
+  }
+
+  public getChild(infra: Infra): void {
+    let infraType = infra.infraType.id;
+    let id = String(infra.childId);
     console.log('getting infra child of ' + this.props.infra.id);
     switch (infraType) {
       case 1: {
@@ -124,13 +142,13 @@ export class TargetChild extends React.Component<Props, State> {
     let infraType = this.props.infra.infraType.id;
     switch (infraType) {
       case 1: {
-        return <InfraTable tableDatas={this.ConvertTableDataForMachine(this.props.machine)} />;
+        return this.props.machine ? <InfraTable tableDatas={this.ConvertTableDataForMachine(this.props.machine)} /> : null;
       }
       case 2: {
-        return <InfraTable tableDatas={this.ConvertTableDataForHost(this.props.host)} />;
+        return this.props.host ? <InfraTable tableDatas={this.ConvertTableDataForHost(this.props.host)} /> : null;
       }
       case 3: {
-        return <InfraTable tableDatas={this.ConvertTableDataForOS(this.props.os)} />;
+        return this.props.os ? <InfraTable tableDatas={this.ConvertTableDataForOS(this.props.os)} /> : null;
       }
       case 4: {
         return <InfraTable tableDatas={this.ConvertTableDataForApplication(this.props.osApplication)} />;
@@ -142,7 +160,7 @@ export class TargetChild extends React.Component<Props, State> {
         return <InfraTable tableDatas={this.ConvertTableDataForPort(this.props.osPort)} />;
       }
       case 7: {
-        return <InfraTable tableDatas={this.ConvertTableDataForOS(this.props.os)} />;
+        return this.props.service ? <InfraTable tableDatas={this.ConvertTableDataForService(this.props.service)} /> : null;
       }
       default: {
         break;

src/ts/@overflow/target/react/components/TargetDetail.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Button, Table, Header, Container } from 'semantic-ui-react';
 import { DetailContainer } from '@overflow/commons/react/component/DetailContainer';
 import { TargetDetailInfra } from './TargetDetailInfra';
-import  TargetChildContainer from '../TargetChild';
+import TargetChildContainer from '../TargetChild';
 import Infra from '@overflow/infra/api/model/Infra';
 import InfraHost from '@overflow/infra/api/model/InfraHost';
 import InfraMachine from '@overflow/infra/api/model/InfraMachine';
@@ -39,9 +39,15 @@ export class TargetDetail extends React.Component<Props, State> {
   }
 
   public componentWillMount(): void {
-    this.props.onRead(this.props.id);
+    if(this.props.infra === undefined) {
-  }
+      this.props.onRead(this.props.id);
+    }
 
+    if (this.props.infra !== undefined && this.props.infra.id !== Number(this.props.id)) {
+      this.props.onRead(this.props.id);
+    }
+
+  }
 
   public handleRemoveTarget(): void {
     alert('remove');
@@ -59,7 +65,7 @@ export class TargetDetail extends React.Component<Props, State> {
       <Container fluid>
         <TargetBasicInfo infra={this.props.infra} />
         <br />
-        <TargetChildContainer infra={this.props.infra}/>
+        <TargetChildContainer infra={this.props.infra} infraId={Number(this.props.id)}/>
         <br />
         <Button primary floated={'right'} negative onClick={this.handleRemoveTarget}>Remove</Button>
       </Container>