diff --git a/src/components/dialog/edit-widget-table.js b/src/components/dialog/edit-widget-table.js new file mode 100644 index 0000000..81d24a8 --- /dev/null +++ b/src/components/dialog/edit-widget-table.js @@ -0,0 +1,55 @@ +/** + * File: edit-widget-table.js + * Author: Markus Grigull + * Date: 14.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + + import React, { Component } from 'react'; + import { FormGroup, FormControl, ControlLabel } from 'react-bootstrap'; + + class EditTableWidget extends Component { + constructor(props) { + super(props); + + this.state = { + widget: { + simulator: '' + } + }; + } + + componentWillReceiveProps(nextProps) { + this.setState({ widget: nextProps.widget }); + } + + render() { + // get selected simulation model + var simulationModel = {}; + + if (this.props.simulation) { + this.props.simulation.models.forEach((model) => { + if (model.simulation === this.state.widget.simulation) { + simulationModel = model; + } + }); + } + + return ( +
+ + Simulator + this.props.handleChange(e)}> + {this.props.simulation.models.map((model, index) => ( + + ))} + + +
+ ); + } + } + + export default EditTableWidget; diff --git a/src/components/dialog/edit-widget.js b/src/components/dialog/edit-widget.js index bd9dbc5..4f63349 100644 --- a/src/components/dialog/edit-widget.js +++ b/src/components/dialog/edit-widget.js @@ -14,6 +14,7 @@ import Dialog from './dialog'; import EditValueWidget from './edit-widget-value'; import EditPlotWidget from './edit-widget-plot'; +import EditTableWidget from './edit-widget-table'; class EditWidgetDialog extends Component { static propTypes = { @@ -78,6 +79,8 @@ class EditWidgetDialog extends Component { widgetDialog = this.validateForm(id)} simulation={this.props.simulation} handleChange={(e) => this.handleChange(e)} />; } else if (this.props.widget.type === 'Plot') { widgetDialog = this.validateForm(id)} simulation={this.props.simulation} handleChange={(e, index) => this.handleChange(e, index)} />; + } else if (this.props.widget.type === 'Table') { + widgetDialog = this.validateForm(id)} simulation={this.props.simulation} handleChange={(e, index) => this.handleChange(e, index)} />; } } diff --git a/src/components/widget-table.js b/src/components/widget-table.js new file mode 100644 index 0000000..071c084 --- /dev/null +++ b/src/components/widget-table.js @@ -0,0 +1,72 @@ +/** + * File: widget-table.js + * Author: Markus Grigull + * Date: 14.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import React, { Component } from 'react'; + +import Table from './table'; +import TableColumn from './table-column'; + +class WidgetTable extends Component { + constructor(props) { + super(props); + + this.state = { + rows: [], + sequence: null + }; + } + + componentWillReceiveProps(nextProps) { + // check data + const simulator = nextProps.widget.simulator; + + if (nextProps.simulation == null || nextProps.data == null || nextProps.data[simulator] == null || nextProps.data[simulator].length === 0 || nextProps.data[simulator].values[0].length === 0) { + // clear values + this.setState({ rows: [], sequence: null }); + return; + } + + // check if new data, otherwise skip + if (this.state.sequence >= nextProps.data[simulator].sequence) { + return; + } + + // get simulation model + const simulationModel = nextProps.simulation.models.find((model) => { + return (model.simulator === simulator); + }); + + // get rows + var rows = []; + + nextProps.data[simulator].values.forEach((signal, index) => { + rows.push({ + name: simulationModel.mapping[index].name, + value: signal[signal.length - 1].y + }) + }); + + this.setState({ rows: rows, sequence: nextProps.data[simulator].sequence }); + } + + render() { + return ( +
+

{this.props.widget.name}

+ + + + +
+
+ ); + } +} + +export default WidgetTable; diff --git a/src/containers/visualization.js b/src/containers/visualization.js index 827d57d..54c1ab0 100644 --- a/src/containers/visualization.js +++ b/src/containers/visualization.js @@ -121,6 +121,10 @@ class Visualization extends Component { widget.time = 300; widget.width = 400; widget.height = 200; + } else if (item.name === 'Table') { + widget.simulator = this.state.simulation.models[0].simulator; + widget.width = 400; + widget.height = 200; } var visualization = this.state.visualization; @@ -204,6 +208,7 @@ class Visualization extends Component {
+
} diff --git a/src/containers/widget.js b/src/containers/widget.js index 680cc6f..d7d615f 100644 --- a/src/containers/widget.js +++ b/src/containers/widget.js @@ -13,8 +13,10 @@ import { ContextMenuTrigger } from 'react-contextmenu'; import Rnd from 'react-rnd'; import SimulatorDataStore from '../stores/simulator-data-store'; + import WidgetValue from '../components/widget-value'; import WidgetPlot from '../components/widget-plot'; +import WidgetTable from '../components/widget-table'; import '../styles/widgets.css'; @@ -72,6 +74,8 @@ class Widget extends Component { element = } else if (widget.type === 'Plot') { element = + } else if (widget.type === 'Table') { + element = } if (this.props.editing) {