From 3aacba30be444b20b23b23704734ef9a64c758d2 Mon Sep 17 00:00:00 2001 From: Sonja Happ Date: Tue, 26 Nov 2019 15:09:40 +0100 Subject: [PATCH] initial version of scenario frame (users not showing, no buttons tested) --- src/scenario/scenario.js | 189 ++++++++++++++++++++++++++++++--------- 1 file changed, 146 insertions(+), 43 deletions(-) diff --git a/src/scenario/scenario.js b/src/scenario/scenario.js index 7de6e7d..76fead2 100644 --- a/src/scenario/scenario.js +++ b/src/scenario/scenario.js @@ -27,83 +27,96 @@ import _ from 'lodash'; import ScenarioStore from './scenario-store'; import SimulatorStore from '../simulator/simulator-store'; +import DashboardStore from '../dashboard/dashboard-store'; import SimulationModelStore from '../simulationmodel/simulation-model-store'; import UserStore from '../user/user-store'; +import UsersStore from '../user/users-store'; import AppDispatcher from '../common/app-dispatcher'; import Icon from '../common/icon'; import Table from '../common/table'; import TableColumn from '../common/table-column'; import ImportSimulationModelDialog from '../simulationmodel/import-simulation-model'; +import ImportDashboardDialog from "../dashboard/import-dashboard"; +import NewDashboardDialog from "../dashboard/new-dashboard"; import SimulatorAction from '../simulator/simulator-action'; import DeleteDialog from '../common/dialogs/delete-dialog'; class Scenario extends React.Component { static getStores() { - return [ ScenarioStore, SimulatorStore, SimulationModelStore, UserStore ]; + return [ ScenarioStore, SimulationModelStore, UsersStore, DashboardStore, SimulatorStore]; } static calculateState(prevState, props) { // get selected scenario const sessionToken = UserStore.getState().token; - let scenario = ScenarioStore.getState().find(s => s.id === props.match.params.scenario); + const scenario = ScenarioStore.getState().find(s => s.id === parseInt(props.match.params.scenario, 10)); if (scenario == null) { AppDispatcher.dispatch({ type: 'scenarios/start-load', data: props.match.params.scenario, token: sessionToken }); - - scenario = {}; - console.log(scenario); - } - - // load models - let simulationModels = []; - if (scenario.simulationModels != null) { - simulationModels = SimulationModelStore.getState().filter(m => m != null && scenario.simulationModels.includes(m.id)); } return { - simulationModels, scenario, - - //simulators: SimulatorStore.getState(), sessionToken, + simulationModels: SimulationModelStore.getState(), + users: UsersStore.getState(), + dashboards: DashboardStore.getState(), + simulators: SimulatorStore.getState(), - deleteModal: false, - importModal: false, - modalData: {}, + deleteSimulationModelModal: false, + importSimulationModelModal: false, + modalSimulationModelData: {}, + selectedSimulationModels: [], - selectedSimulationModels: [] + newDashboardModal: false, + deleteDashboardModal: false, + importDashboardModal: false, + modalDashboardData: {}, } } componentWillMount() { + + //load selected scenario AppDispatcher.dispatch({ type: 'scenarios/start-load', + data: this.state.scenario.id, token: this.state.sessionToken }); + // load simulation models for selected scenario AppDispatcher.dispatch({ type: 'simulationModels/start-load', - token: this.state.sessionToken + token: this.state.sessionToken, + param: '?scenarioID='+this.state.scenario.id, }); + // load users of selected scenario + AppDispatcher.dispatch({ + type: 'scenarios/start-load', + token: this.state.sessionToken, + data: this.state.scenario.id, + param: '/users' + }); + + // load dashboards of selected scenario + AppDispatcher.dispatch({ + type: 'dashboards/start-load', + token: this.state.sessionToken, + param: '?scenarioID='+this.state.scenario.id, + }); + + // load simulators to enable that simulation models work with them AppDispatcher.dispatch({ type: 'simulators/start-load', - token: this.state.sessionToken + token: this.state.sessionToken, }); - - //TODO users - - //TODO dashboards - - - - } addSimulationModel = () => { @@ -132,8 +145,8 @@ class Scenario extends React.Component { }); } - closeDeleteModal = confirmDelete => { - this.setState({ deleteModal: false }); + closeDeleteSimulationModelModal = confirmDelete => { + this.setState({ deleteSimulationModelModal: false }); if (confirmDelete === false) { return; @@ -141,13 +154,13 @@ class Scenario extends React.Component { AppDispatcher.dispatch({ type: 'simulationModels/start-remove', - data: this.state.modalData, + data: this.state.modalSimulationModelData, token: this.state.sessionToken }); } importSimulationModel = simulationModel => { - this.setState({ importModal: false }); + this.setState({ importSimulationModelModal: false }); if (simulationModel == null) { return; @@ -155,8 +168,6 @@ class Scenario extends React.Component { simulationModel.scenario = this.state.scenario.id; - console.log(simulationModel); - AppDispatcher.dispatch({ type: 'simulationModels/start-add', data: simulationModel, @@ -172,6 +183,47 @@ class Scenario extends React.Component { }); } + closeNewDashboardModal(data) { + this.setState({ newDashboardModal : false }); + + if (data) { + AppDispatcher.dispatch({ + type: 'dashboards/start-add', + data, + token: this.state.sessionToken, + userid: this.state.sessionUserID + }); + } + } + + closeDeleteDashboardModal(confirmDelete){ + this.setState({ deleteDashboardModal: false }); + + if (confirmDelete === false) { + return; + } + + AppDispatcher.dispatch({ + type: 'dashboards/start-remove', + data: this.state.modalDashboardData, + token: this.state.sessionToken, + userid: this.state.sessionUserID + }); + } + + closeImportDashboardModal(data) { + this.setState({ importDashboardModal: false }); + + if (data) { + AppDispatcher.dispatch({ + type: 'dashboards/start-add', + data, + token: this.state.sessionToken, + userid: this.state.sessionUserID + }); + } + } + getSimulatorName(simulatorId) { for (let simulator of this.state.simulators) { if (simulator.id === simulatorId) { @@ -184,14 +236,26 @@ class Scenario extends React.Component { // filter properties const model = Object.assign({}, this.state.simulationModels[index]); - delete model.simulator; - delete model.scenario; + //delete model.simulator; + //delete model.scenario; + // TODO get elements recursively // show save dialog const blob = new Blob([JSON.stringify(model, null, 2)], { type: 'application/json' }); FileSaver.saveAs(blob, 'simulation model - ' + model.name + '.json'); } + exportDashboard(index) { + // filter properties + const dashboard = Object.assign({}, this.state.dashboards[index]); + + // TODO get elements recursively + + // show save dialog + const blob = new Blob([JSON.stringify(dashboard, null, 2)], { type: 'application/json' }); + FileSaver.saveAs(blob, 'dashboard - ' + dashboard.name + '.json'); + } + onSimulationModelChecked(index, event) { const selectedSimulationModels = Object.assign([], this.state.selectedSimulationModels); for (let key in selectedSimulationModels) { @@ -250,20 +314,22 @@ class Scenario extends React.Component { }; return
-

{this.state.simulation.name}

+

{this.state.scenario.name}

+ {/*Simulation Model table*/} +

Simulation Models

this.onSimulationModelChecked(index, event)} width='30' /> - + this.getSimulatorName(simulator)} /> this.setState({ deleteModal: true, modalData: this.state.simulationModels[index], modalIndex: index })} + onDelete={(index) => this.setState({ deleteSimulationModelModal: true, modalSimulationModelData: this.state.simulationModels[index], modalSimulationModelIndex: index })} onExport={index => this.exportModel(index)} />
@@ -282,14 +348,51 @@ class Scenario extends React.Component {
- +
- + + + + + {/*Dashboard table*/} +

Dashboards

+ + + + this.setState({ deleteDashboardModal: true, modalDashboardData: this.state.dashboards[index], modalDashboardIndex: index })} + onExport={index => this.exportDashboard(index)} + /> +
+ +
+ + +
+ +
+ + this.closeNewDashboardModal(data)}/> + this.closeImportDashboardModal(data)} /> + + this.closeDeleteDashboardModal(e)}/> + + {/*Users table*/} +

Users

+ + + + +
+ -
; } }