.
This commit is contained in:
insanity
parent
924ce5846e
commit
7d80746c5b
@ -11,6 +11,7 @@ import AppBar from 'material-ui/AppBar';
|
||||
import Checkbox from 'material-ui/Checkbox';
|
||||
import TextField from 'material-ui/TextField';
|
||||
import { RadioButton, RadioButtonGroup } from 'material-ui/RadioButton';
|
||||
import Paper from 'material-ui/Paper';
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
@ -26,49 +27,75 @@ const customContentStyle = {
|
||||
};
|
||||
|
||||
export class SensorConfigPopup extends React.Component<any, any> {
|
||||
private tempList: any[];
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
this.state = {
|
||||
crawler: null,
|
||||
sensorItems: []
|
||||
sensorItems: [],
|
||||
selectedItems: [],
|
||||
startConfirm: false,
|
||||
};
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
this.tempList = [];
|
||||
}
|
||||
|
||||
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 ",
|
||||
},
|
||||
];
|
||||
|
||||
handleConfirmCancel = () => {
|
||||
this.setState({
|
||||
crawler: c,
|
||||
sensorItems: items,
|
||||
startConfirm: false,
|
||||
});
|
||||
}
|
||||
|
||||
handleCrawlerSelect = (c: any) => {
|
||||
//getting items by target&crawler type
|
||||
|
||||
let os: OFRest = new OFRest("SensorItem", "List", JSON.stringify(c));
|
||||
var that: any = this;
|
||||
os.Call().then(function (res) {
|
||||
return res.json();
|
||||
}).then(function (json) {
|
||||
let list = JSON.parse(json.resultStr);
|
||||
console.log(list);
|
||||
that.setState({
|
||||
crawler: c,
|
||||
sensorItems: list,
|
||||
});
|
||||
}).catch(function (err) {
|
||||
console.log(err);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
handleSensorItemsSelect = (items: any) => {
|
||||
console.log(items);
|
||||
let temp = [];
|
||||
if (items === 'all') {
|
||||
this.tempList = this.state.sensorItems;
|
||||
} else {
|
||||
if (items.length > 0) {
|
||||
for (var i = 0; i < items.length; i++) {
|
||||
temp[i] = this.state.sensorItems[items[i]];
|
||||
}
|
||||
}
|
||||
this.tempList = temp;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
handleSubmit = () => {
|
||||
if (this.tempList.length === 0) {
|
||||
alert("You should choose at least one sensor.");
|
||||
} else {
|
||||
this.setState({
|
||||
startConfirm: true,
|
||||
selectedItems: this.tempList
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -81,7 +108,7 @@ export class SensorConfigPopup extends React.Component<any, any> {
|
||||
<RaisedButton
|
||||
label="Submit"
|
||||
primary={true}
|
||||
onTouchTap={this.handleClose}
|
||||
onTouchTap={this.handleSubmit}
|
||||
/>,
|
||||
];
|
||||
|
||||
@ -103,13 +130,13 @@ export class SensorConfigPopup extends React.Component<any, any> {
|
||||
showExpandableButton={true}
|
||||
/>
|
||||
<CardText expandable={true}>
|
||||
<div>Discovered At : </div>
|
||||
<div>Target Type : </div>
|
||||
<div>Kind : </div>
|
||||
<div>Name : </div>
|
||||
<div>Version : </div>
|
||||
<div>Port : </div>
|
||||
<div>Port Type : </div>
|
||||
<div>Discovered At : {this.props.target.createDate}</div>
|
||||
<div>Target Type : {this.props.target.targetType}</div>
|
||||
<div>Kind : {this.props.target.kinds}</div>
|
||||
<div>Name : {this.props.target.vendorName}</div>
|
||||
<div>Version : {this.props.target.version}</div>
|
||||
<div>Port : {this.props.target.port}</div>
|
||||
<div>Port Type : {this.props.target.portType}</div>
|
||||
</CardText>
|
||||
</Card>
|
||||
|
||||
@ -120,6 +147,11 @@ export class SensorConfigPopup extends React.Component<any, any> {
|
||||
<SensorItemSelector items={this.state.sensorItems} onChange={this.handleSensorItemsSelect} />
|
||||
</Card>
|
||||
</Dialog>
|
||||
<ConfirmPopup open={this.state.startConfirm} onCancel={this.handleConfirmCancel}
|
||||
target={this.props.target}
|
||||
crawler={this.state.crawler}
|
||||
items={this.state.selectedItems} />
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -138,7 +170,6 @@ export class CrawlerSelector extends React.Component<any, any> {
|
||||
}
|
||||
|
||||
componentWillMount() {
|
||||
|
||||
let os: OFRest = new OFRest("Crawler", "List", null);
|
||||
var that: any = this;
|
||||
os.Call().then(function (res) {
|
||||
@ -151,8 +182,6 @@ export class CrawlerSelector extends React.Component<any, any> {
|
||||
}).catch(function (err) {
|
||||
console.log(err);
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
handleCrawlerChange = (event: any, index: any, v: number) => {
|
||||
@ -170,9 +199,8 @@ export class CrawlerSelector extends React.Component<any, any> {
|
||||
checkAuth = (c: any) => {
|
||||
//Todo. validate auth
|
||||
this.setState({
|
||||
authOpen: true,
|
||||
authOpen: false,
|
||||
});
|
||||
|
||||
let os: OFRest = new OFRest("Crawlerinputitemmapping", "List", c);
|
||||
var that: any = this;
|
||||
os.Call().then(function (res) {
|
||||
@ -207,6 +235,10 @@ export class CrawlerSelector extends React.Component<any, any> {
|
||||
}</div>;
|
||||
}
|
||||
|
||||
handleTestAuth = () => {
|
||||
|
||||
}
|
||||
|
||||
renderInputs = (data: any) => {
|
||||
let input = data.crawlerInputItem;
|
||||
if (input.dataType === "String") {
|
||||
@ -214,9 +246,10 @@ export class CrawlerSelector extends React.Component<any, any> {
|
||||
hintText={input.description}
|
||||
floatingLabelText={input.name}
|
||||
underlineShow={true}
|
||||
//value={this.state.email}
|
||||
// onChange={(e, newValue) => this.setState({ email: newValue })}
|
||||
/></div>;
|
||||
value={this.state.email}
|
||||
onChange={(e, newValue) => this.setState({ email: newValue })}
|
||||
/>
|
||||
</div>;
|
||||
}
|
||||
else if (input.dataType === "Select") {
|
||||
let values = input.description.split('||');
|
||||
@ -293,26 +326,106 @@ export class SensorItemSelector extends React.Component<any, any> {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Table onRowSelection={this.handleRowSelection} multiSelectable={true}>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHeaderColumn>Category</TableHeaderColumn>
|
||||
<TableHeaderColumn>Name</TableHeaderColumn>
|
||||
<TableHeaderColumn>Description</TableHeaderColumn>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
|
||||
{this.props.items.map((row: any, index: number) => (
|
||||
<TableRow key={index} selected={this.isSelected(index)}>
|
||||
<TableRowColumn>{row.category}</TableRowColumn>
|
||||
<TableRowColumn>{row.name}</TableRowColumn>
|
||||
<TableRowColumn>{row.description}</TableRowColumn>
|
||||
<div style={{ height: 320, overflow: 'auto' }}>
|
||||
<Table onRowSelection={this.handleRowSelection} multiSelectable={true}>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHeaderColumn>Category</TableHeaderColumn>
|
||||
<TableHeaderColumn>Name</TableHeaderColumn>
|
||||
<TableHeaderColumn>Description</TableHeaderColumn>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</TableHeader>
|
||||
<TableBody deselectOnClickaway={false}>
|
||||
|
||||
{this.props.items.map((row: any, index: number) => (
|
||||
<TableRow key={index} selected={this.isSelected(index)}>
|
||||
<TableRowColumn>{row.category}</TableRowColumn>
|
||||
<TableRowColumn>{row.name}</TableRowColumn>
|
||||
<TableRowColumn>{row.description}</TableRowColumn>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export class ConfirmPopup extends React.Component<any, any> {
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
this.state = {
|
||||
};
|
||||
}
|
||||
|
||||
handleClose = () => {
|
||||
this.props.onCancel();
|
||||
}
|
||||
|
||||
|
||||
handleConfirm = () => {
|
||||
if (this.props.target === null ||
|
||||
this.props.crawler === null) {
|
||||
alert("err");
|
||||
return;
|
||||
}
|
||||
// let os: OFRest = new OFRest("SensorItem", "List", JSON.stringify(c));
|
||||
// var that: any = this;
|
||||
// os.Call().then(function (res) {
|
||||
// return res.json();
|
||||
// }).then(function (json) {
|
||||
// let list = JSON.parse(json.resultStr);
|
||||
// console.log(list);
|
||||
// that.setState({
|
||||
// crawler: c,
|
||||
// sensorItems: list,
|
||||
// });
|
||||
// }).catch(function (err) {
|
||||
// console.log(err);
|
||||
// });
|
||||
}
|
||||
|
||||
showInfo = () => {
|
||||
if (this.props.target === null || this.props.crawler === null) {
|
||||
return <div></div>;
|
||||
}
|
||||
return <div>
|
||||
<div>TARGET : {this.props.target.vendorName}</div>
|
||||
<div>CRAWLER : {this.props.crawler.name}</div>
|
||||
<br />
|
||||
<div>Sensor Items</div>
|
||||
</div>;
|
||||
}
|
||||
|
||||
render() {
|
||||
const actions = [
|
||||
<FlatButton
|
||||
label="Cancel"
|
||||
primary={true}
|
||||
onTouchTap={this.handleClose}
|
||||
/>,
|
||||
<RaisedButton
|
||||
label="Confirm"
|
||||
primary={true}
|
||||
onTouchTap={this.handleConfirm}
|
||||
/>,
|
||||
];
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
title="Confirm sensor configuration"
|
||||
actions={actions}
|
||||
modal={true}
|
||||
open={this.props.open}
|
||||
>
|
||||
<div>
|
||||
{this.showInfo()}
|
||||
{this.props.items.map((data: any, index: number) => {
|
||||
return <Paper key={index}>{data.id}. {data.name}-{data.description}</Paper>;
|
||||
})}
|
||||
</div>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
}
|
||||
136
src/ts/containers/sensor/SensorList.tsx
Normal file
136
src/ts/containers/sensor/SensorList.tsx
Normal file
@ -0,0 +1,136 @@
|
||||
// import * as React from 'react';
|
||||
// import { List, ListItem, makeSelectable } from 'material-ui/List';
|
||||
// import Subheader from 'material-ui/Subheader';
|
||||
// import Paper from 'material-ui/Paper';
|
||||
// import { OFRest } from '../../components/Rest';
|
||||
// import * as Utils from '../../components/Utils';
|
||||
// import RaisedButton from 'material-ui/RaisedButton';
|
||||
// import {
|
||||
// Table,
|
||||
// TableBody,
|
||||
// TableHeader,
|
||||
// TableHeaderColumn,
|
||||
// TableFooter,
|
||||
// TableRow,
|
||||
// TableRowColumn,
|
||||
// } from 'material-ui/Table';
|
||||
// import { SensorConfigPopup } from '../../containers/config/SensorConfigPopup';
|
||||
|
||||
// export class SensorList extends React.Component<any, any> {
|
||||
// constructor(props: any, context: any) {
|
||||
// super(props, context);
|
||||
// this.state = {
|
||||
// };
|
||||
// }
|
||||
|
||||
// componentWillMount() {
|
||||
// this.getSensorList();
|
||||
// }
|
||||
|
||||
// getSensorList() {
|
||||
// // let obj: any;
|
||||
// // obj = {
|
||||
// // "id": "0",
|
||||
// // "member": {
|
||||
// // "id": "1"
|
||||
// // }
|
||||
// // };
|
||||
|
||||
// // let os: OFRest = new OFRest("Target", "List", obj);
|
||||
// // var that: any = this;
|
||||
// // os.Call().then(function (res) {
|
||||
// // return res.json();
|
||||
// // }).then(function (json) {
|
||||
// // let targetList = JSON.parse(json.resultStr);
|
||||
// // that.setState({
|
||||
// // targets: targetList,
|
||||
// // });
|
||||
// // }).catch(function (err) {
|
||||
// // console.log(err);
|
||||
// // });
|
||||
// }
|
||||
|
||||
|
||||
// handleRowSelection = (selectedRows: any) => {
|
||||
// this.setState({
|
||||
// selected: selectedRows,
|
||||
// });
|
||||
// }
|
||||
|
||||
// // handleNext = () => {
|
||||
// // if (this.state.selected.length === 0) {
|
||||
// // alert('Select a target to monitor');
|
||||
// // } else {
|
||||
// // this.setState({
|
||||
// // startConfig: true,
|
||||
// // });
|
||||
// // }
|
||||
// // }
|
||||
|
||||
// isSelected = (index: any) => {
|
||||
// if (this.state.selected.indexOf(index) === -1) {
|
||||
// return false;
|
||||
// } else {
|
||||
// return true;
|
||||
// }
|
||||
// }
|
||||
// handleConfigCancel = () => {
|
||||
// this.setState({
|
||||
// startConfig: false,
|
||||
// });
|
||||
// }
|
||||
// showSensorConfigPopup = () => {
|
||||
// if (this.state.startConfig) {
|
||||
// return <SensorConfigPopup open={this.state.startConfig} onCancel={this.handleConfigCancel} target={this.state.targets[this.state.selected[0]]} />;
|
||||
// }
|
||||
// return null;
|
||||
// }
|
||||
|
||||
// render() {
|
||||
// return (
|
||||
// <div >
|
||||
// {this.showSensorConfigPopup()}
|
||||
// <Table
|
||||
// selectable={true}
|
||||
// multiSelectable={false}
|
||||
// onRowSelection={this.handleRowSelection.bind(this)}
|
||||
// >
|
||||
// <TableHeader
|
||||
// adjustForCheckbox={false}
|
||||
// enableSelectAll={false}
|
||||
// displaySelectAll={true}>
|
||||
// <TableRow >
|
||||
// <TableHeaderColumn >Host</TableHeaderColumn>
|
||||
// <TableHeaderColumn >Port</TableHeaderColumn>
|
||||
// <TableHeaderColumn >Type</TableHeaderColumn>
|
||||
// <TableHeaderColumn >Kind</TableHeaderColumn>
|
||||
// <TableHeaderColumn >Name</TableHeaderColumn>
|
||||
// <TableHeaderColumn >Version</TableHeaderColumn>
|
||||
// </TableRow>
|
||||
// </TableHeader>
|
||||
// <TableBody
|
||||
// deselectOnClickaway={false}>
|
||||
// displayRowCheckbox={true}
|
||||
// >
|
||||
// {this.state.targets.map((row: any, index: number) => (
|
||||
// <TableRow key={index}
|
||||
// selected={this.isSelected(index)}
|
||||
// >
|
||||
// <TableRowColumn>{Utils.int2ip(row.ip)}</TableRowColumn>
|
||||
// <TableRowColumn>{row.port}</TableRowColumn>
|
||||
// <TableRowColumn>{row.targetType}</TableRowColumn>
|
||||
// <TableRowColumn>{row.kinds}</TableRowColumn>
|
||||
// <TableRowColumn>{row.vendorName}</TableRowColumn>
|
||||
// <TableRowColumn>{row.version}</TableRowColumn>
|
||||
// </TableRow>
|
||||
// ))};
|
||||
|
||||
// </TableBody>
|
||||
// </Table>
|
||||
|
||||
// <RaisedButton label="Next" primary={true} onClick={this.handleNext.bind(this)} style={{ margin: 20 }} />
|
||||
|
||||
// </div>
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
Loading…
x
Reference in New Issue
Block a user