Merge branch 'master' of https://git.loafle.net/overflow/Test_Web_Router
This commit is contained in:
commit
3cb82c50fd
@ -1,32 +1,53 @@
|
||||
import * as React from 'react';
|
||||
import { Button } from 'semantic-ui-react';
|
||||
import { DiscoveryProbe } from './DiscoveryProbe';
|
||||
import { DiscoveryTable } from './DiscoveryTable';
|
||||
|
||||
export class DiscoveryDetails extends React.Component<any, any> {
|
||||
|
||||
private probeTemp: any;
|
||||
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
this.state = {};
|
||||
}
|
||||
|
||||
discoveryStartHandler = (event: any, data: object) => {
|
||||
console.log(event);
|
||||
};
|
||||
componentWillMount() {
|
||||
this.probeTemp =
|
||||
{
|
||||
"id": "11",
|
||||
"metaProbeStatus": {
|
||||
"name": "STARTED"
|
||||
},
|
||||
"domain": {
|
||||
"name": "overFlow's domain111"
|
||||
},
|
||||
"host": {
|
||||
"ip": "192.168.1.103",
|
||||
"mac": "44:8a:5b:44:8c:e8",
|
||||
"os": "Ubuntu 17.04"
|
||||
},
|
||||
"createAt": "2017-07-12",
|
||||
"probeKey": "AGBLKDFJ2452ASDGFL2KWJLKSDJ",
|
||||
"description": "description1111111111",
|
||||
"lastPollingAt": "2017-07-12 14:20",
|
||||
"nextPollingAt": "2017-07-12 14:30"
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
handleProbeChange(obj: any) {
|
||||
console.log(obj)
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div style={{ margin: '20px' }}>
|
||||
<DiscoveryProbe />
|
||||
<DiscoveryProbe probe={this.probeTemp}/>
|
||||
</div>
|
||||
<div style={{ margin: '20px' }}>
|
||||
<DiscoveryTable />
|
||||
<DiscoveryTable onProbeChange={this.handleProbeChange} />
|
||||
</div>
|
||||
<div style={{ margin: '20px' }}>
|
||||
<Button floated='right' onClick={this.discoveryStartHandler}> Start </Button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
);
|
||||
|
@ -10,7 +10,11 @@ export class DiscoveryProbe extends React.Component<any, any> {
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
console.log(this.props.probe);
|
||||
}
|
||||
|
||||
handle() {
|
||||
this.props.onProbeChange();
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -22,19 +26,19 @@ export class DiscoveryProbe extends React.Component<any, any> {
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon>Domain</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>overFlow's domain111</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.domain.name}</Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon>Status</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>STARTED</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.metaProbeStatus.name}</Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon >Host IP</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>192.168.1.103</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.host.ip}</Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell collapsing>
|
||||
@ -46,13 +50,25 @@ export class DiscoveryProbe extends React.Component<any, any> {
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon>Authorized at</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>2017-07-13</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.createAt}</Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon>Description</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>description1111111111</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.description}</Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon>Last polling at</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.lastPollingAt}</Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell collapsing>
|
||||
<Label ribbon>Next polling at</Label>
|
||||
</Table.Cell>
|
||||
<Table.Cell>{this.props.probe.nextPollingAt}</Table.Cell>
|
||||
</Table.Row>
|
||||
</Table.Body>
|
||||
</Table>
|
||||
|
@ -1,11 +1,25 @@
|
||||
import * as React from 'react';
|
||||
import { Table, Label, Input } from 'semantic-ui-react';
|
||||
import { Table, Button, Input } from 'semantic-ui-react';
|
||||
|
||||
export class DiscoveryTable extends React.Component<any, any> {
|
||||
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
this.state = {};
|
||||
this.state = {
|
||||
endIP: null,
|
||||
};
|
||||
}
|
||||
|
||||
handleEndIpInput(event: React.SyntheticEvent<HTMLAnchorElement>, data: any) {
|
||||
console.log(data.value);
|
||||
this.setState({
|
||||
endIP: data.value,
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
discoveryStartHandler(event: React.SyntheticEvent<HTMLAnchorElement>, data: any) {
|
||||
this.props.onProbeChange(data);
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -19,7 +33,7 @@ export class DiscoveryTable extends React.Component<any, any> {
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell>End IP</Table.Cell>
|
||||
<Table.Cell><Input size='large' placeholder='End IP' /></Table.Cell>
|
||||
<Table.Cell><Input size='large' placeholder='End IP' onChange={this.handleEndIpInput.bind(this)} /></Table.Cell>
|
||||
</Table.Row>
|
||||
<Table.Row>
|
||||
<Table.Cell>Exclude IP</Table.Cell>
|
||||
@ -35,6 +49,7 @@ export class DiscoveryTable extends React.Component<any, any> {
|
||||
</Table.Row>
|
||||
</Table.Body>
|
||||
</Table>
|
||||
<Button floated='right' onClick={this.discoveryStartHandler.bind(this)}> Start </Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user