diff --git a/src/ts/containers/config/SensorConfigPopup.tsx b/src/ts/containers/config/SensorConfigPopup.tsx new file mode 100644 index 0000000..56aa815 --- /dev/null +++ b/src/ts/containers/config/SensorConfigPopup.tsx @@ -0,0 +1,261 @@ +import * as React from 'react'; +import Dialog from 'material-ui/Dialog'; +import FlatButton from 'material-ui/FlatButton'; +import RaisedButton from 'material-ui/RaisedButton'; +import { Card, CardActions, CardHeader, CardText } from 'material-ui/Card'; +import * as Utils from '../../components/Utils'; +import DropDownMenu from 'material-ui/DropDownMenu'; +import MenuItem from 'material-ui/MenuItem'; +import AppBar from 'material-ui/AppBar'; +import Checkbox from 'material-ui/Checkbox'; +import { + Table, + TableBody, + TableHeader, + TableHeaderColumn, + TableRow, + TableRowColumn, +} from 'material-ui/Table'; + +const customContentStyle = { + width: '90%', + maxWidth: 'none', +}; + +export class SensorConfigPopup extends React.Component { + constructor(props: any, context: any) { + super(props, context); + this.state = { + crawler: null, + sensorItems: [] + }; + } + + handleClose = () => { + this.props.onCancel(); + } + + handleCrawlerSelect = (c: any) => { + //getting items by target&crawler type + var items = [ + { + "id": 0, + "category": "cpu", + "name": "cpu.usage", + "description": "cpu usage ", + }, + { + "id": 1, + "category": "cpu", + "name": "cpu.free", + "description": "cpu free ", + }, + { + "id": 2, + "category": "mem", + "name": "mem.free", + "description": "mem free ", + }, + ]; + this.setState({ + crawler: c, + sensorItems: items, + }); + } + + handleSensorItemsSelect = (items: any) => { + console.log(items); + } + + render() { + const actions = [ + , + , + ]; + + return ( +
+ + + + + +
Discovered At :
+
Target Type :
+
Kind :
+
Name :
+
Version :
+
Port :
+
Port Type :
+
+
+
+ + + + + + +
+
+ ); + } +} + +const styles = { + title: { + cursor: 'pointer', + }, +}; + +export class CrawlerSelector extends React.Component { + constructor(props: any, context: any) { + super(props, context); + this.state = { + value: 0, + crawlers: [], + }; + } + + componentWillMount() { + var crawlers = [ + { + "id": 0, + "name": "Protocol", + "description": "Alive check only using protocol.", + "type": "Protocol", + }, + { + "id": 1, + "name": "SQL", + "description": "Query based sensors", + "type": "SQL", + }, + { + "id": 2, + "name": "WMI", + "description": "Windows Management Instrumentation", + "type": "WMI", + }, + ]; + this.setState({ + crawlers: crawlers, + }); + } + + handleCrawlerChange = (event: any, index: any, v: number) => { + this.setState({ + value: v, + }); + if (v === 0) { + return; + } + this.props.onChange(this.state.crawlers[v]); + } + + + getCrawlerTitle() { + if (this.state.value === 0) { + return ""; + } + return this.state.crawlers[this.state.value].description; + } + + + render() { + return ( +
+ + + {this.state.crawlers.map((crawler: any, index: number) => { + return (); + })} + + + + + + Crawler manual blahblahblah... + + + +
+ ); + } +} + + +export class SensorItemSelector extends React.Component { + + constructor(props: any, context: any) { + super(props, context); + this.state = { + selected:[] + }; + } + + + isSelected = (index: any) => { + return this.state.selected.indexOf(index) !== -1; + } + + handleRowSelection = (selectedRows: any) => { + this.setState({ + selected : selectedRows, + }); + this.props.onChange(selectedRows); + } + + render() { + return ( + + + + Category + Name + Description + + + + + {this.props.items.map((row: any, index: number) => ( + + {row.category} + {row.name} + {row.description} + + ))} + +
+ ); + } +} + diff --git a/src/ts/containers/target/TargetList.tsx b/src/ts/containers/target/TargetList.tsx index 2c9abb0..17278cb 100644 --- a/src/ts/containers/target/TargetList.tsx +++ b/src/ts/containers/target/TargetList.tsx @@ -14,7 +14,7 @@ import { TableRow, TableRowColumn, } from 'material-ui/Table'; - +import { SensorConfigPopup } from '../../containers/config/SensorConfigPopup'; export class TargetList extends React.Component { constructor(props: any, context: any) { @@ -22,6 +22,7 @@ export class TargetList extends React.Component { this.state = { selected: [], targets: [], + startConfig: false, }; } @@ -62,8 +63,10 @@ export class TargetList extends React.Component { handleNext = () => { if (this.state.selected.length === 0) { alert('Select a target to monitor'); - }else { - alert("ID: "+ this.state.targets[this.state.selected[0]].id); + } else { + this.setState({ + startConfig: true, + }); } } @@ -75,12 +78,22 @@ export class TargetList extends React.Component { return true; } } - + handleConfigCancel = () => { + this.setState({ + startConfig: false, + }); + } + showSensorConfigPopup = () => { + if (this.state.startConfig) { + return ; + } + return null; + } render() { return (
- + {this.showSensorConfigPopup()} { Version - displayRowCheckbox={true} >