discovery send object

This commit is contained in:
snoop 2017-08-22 15:39:11 +09:00
parent dcb5e78c3d
commit ff2b542aff
3 changed files with 56 additions and 22 deletions

View File

@ -0,0 +1,20 @@
import { connect, Dispatch } from 'react-redux';
import {
DiscoveryTable,
StateProps as DiscoveryTableStateProps,
DispatchProps as DiscoveryTableDispatchProps,
} from './components/DiscoveryTable';
export function mapStateToProps(state: any, props: any): DiscoveryTableStateProps {
return {
onProbeChange: props.onProbeChange,
};
}
export function mapDispatchToProps(dispatch: Dispatch<any>): DiscoveryTableDispatchProps {
return {
};
}
export default connect(mapStateToProps, mapDispatchToProps)(DiscoveryTable);

View File

@ -7,7 +7,7 @@ import {
Container, Container,
} from 'semantic-ui-react'; } from 'semantic-ui-react';
import { DiscoveryProbe } from './DiscoveryProbe'; import { DiscoveryProbe } from './DiscoveryProbe';
import { DiscoveryTable } from './DiscoveryTable'; import DiscoveryTableContainer from '../DiscoveryTable';
import DiscoveryTreeContainer from '../DiscoveryTree'; import DiscoveryTreeContainer from '../DiscoveryTree';
export interface StateProps { export interface StateProps {
@ -81,7 +81,7 @@ export class Discovery extends React.Component<Props, State> {
<Header as='h3' dividing> Discovery Details</Header> <Header as='h3' dividing> Discovery Details</Header>
{/*<DiscoveryProbe probe={this.state.probeTemp}/>*/} {/*<DiscoveryProbe probe={this.state.probeTemp}/>*/}
<br /> <br />
<DiscoveryTable onProbeChange={this.handleProbeChange.bind(this)} /> <DiscoveryTableContainer onProbeChange={this.handleProbeChange.bind(this)} />
<Modal size='small' open={this.state.startPopup} onClose={this.handlePopupClose}> <Modal size='small' open={this.state.startPopup} onClose={this.handlePopupClose}>
<Modal.Header>Discovery</Modal.Header> <Modal.Header>Discovery</Modal.Header>

View File

@ -8,13 +8,20 @@ import {
Dropdown, Dropdown,
Container, Container,
Header, Header,
DropdownProps,
} from 'semantic-ui-react'; } from 'semantic-ui-react';
import * as _ from 'lodash';
export interface Props { export interface StateProps {
}
export interface DispatchProps {
onProbeChange?(state: object): void; onProbeChange?(state: object): void;
} }
export type Props = StateProps & DispatchProps;
export interface State { export interface State {
startIp: string; startIp: string;
endIP: string; endIP: string;
@ -26,6 +33,7 @@ export interface State {
export class DiscoveryTable extends React.Component<Props, State> { export class DiscoveryTable extends React.Component<Props, State> {
private serviceTemp: any; private serviceTemp: any;
private selectedServices: number | string | Array<number | string>;
constructor(props: Props, context: State) { constructor(props: Props, context: State) {
super(props, context); super(props, context);
@ -105,7 +113,14 @@ export class DiscoveryTable extends React.Component<Props, State> {
} }
public discoveryStartHandler(event: React.SyntheticEvent<HTMLButtonElement>, data: ButtonProps): void { public discoveryStartHandler(event: React.SyntheticEvent<HTMLButtonElement>, data: ButtonProps): void {
this.props.onProbeChange(this.state);
let discoveryStartInfo: any = {
...this.state,
services: this.selectedServices,
};
this.props.onProbeChange(discoveryStartInfo);
} }
public render(): JSX.Element { public render(): JSX.Element {
@ -136,13 +151,12 @@ export class DiscoveryTable extends React.Component<Props, State> {
<Table.Row> <Table.Row>
<Table.Cell><Header size='small'>Service</Header></Table.Cell> <Table.Cell><Header size='small'>Service</Header></Table.Cell>
<Table.Cell> <Table.Cell>
<Dropdown placeholder='Service' fluid multiple selection options={this.serviceTemp} /> <Dropdown placeholder='Service' fluid multiple selection options={this.serviceTemp}
onChange={(event: React.SyntheticEvent<HTMLElement>, data: DropdownProps) => {
this.selectedServices = data.value;
}} />
</Table.Cell> </Table.Cell>
</Table.Row> </Table.Row>
<Table.Row>
<Table.Cell><Header size='small'>End Port</Header></Table.Cell>
<Table.Cell><Input tabIndex='6' placeholder='End Port' onChange={this.handleInput.bind(this)} /></Table.Cell>
</Table.Row>
</Table.Body> </Table.Body>
<Table.Footer> <Table.Footer>
<Table.Row> <Table.Row>