From e27824f8516c85842d00ae941b93cacd9fa41bd8 Mon Sep 17 00:00:00 2001 From: Markus Grigull Date: Wed, 5 Apr 2017 11:09:38 +0200 Subject: [PATCH] Add simulation import & export Simulation models are imported/exported with it's simulation --- src/containers/simulations.js | 63 +++++++++++++++++-- src/data-managers/simulations-data-manager.js | 2 +- 2 files changed, 60 insertions(+), 5 deletions(-) diff --git a/src/containers/simulations.js b/src/containers/simulations.js index af161b7..f5acf69 100644 --- a/src/containers/simulations.js +++ b/src/containers/simulations.js @@ -21,7 +21,8 @@ import React, { Component } from 'react'; import { Container } from 'flux/utils'; -import { Button, Modal, Glyphicon } from 'react-bootstrap'; +import { Button, Modal, Glyphicon, FormGroup, FormControl, Form } from 'react-bootstrap'; +import FileSaver from 'file-saver'; import AppDispatcher from '../app-dispatcher'; import SimulationStore from '../stores/simulation-store'; @@ -31,6 +32,7 @@ import Table from '../components/table'; import TableColumn from '../components/table-column'; import NewSimulationDialog from '../components/dialog/new-simulation'; import EditSimulationDialog from '../components/dialog/edit-simulation'; +import ImportSimulationDialog from '../components/dialog/import-simulation'; class Simulations extends Component { static getStores() { @@ -45,6 +47,7 @@ class Simulations extends Component { newModal: false, deleteModal: false, editModal: false, + importModal: false, modalSimulation: {} }; } @@ -123,6 +126,49 @@ class Simulations extends Component { this.confirmDeleteModal(); } } + + closeImportModal(data) { + this.setState({ importModal : false }); + + if (data) { + AppDispatcher.dispatch({ + type: 'simulations/start-add', + data: data + }); + } + } + + exportSimulation(data) { + // filter properties + var simulation = Object.assign({}, data); + delete simulation._id; + delete simulation.projects; + delete simulation.running; + + // show save dialog + const blob = new Blob([JSON.stringify(simulation, null, 2)], { type: 'application/json' }); + FileSaver.saveAs(blob, simulation.name + '.json'); + } + + loadFile(fileList) { + // get file + const file = fileList[0]; + if (!file.type.match('application/json')) { + return; + } + + // create file reader + var reader = new FileReader(); + var self = this; + + reader.onload = function(event) { + // read simulation + const simulation = JSON.parse(event.target.result); + self.setState({ importModal: true, modalSimulation: simulation }); + }; + + reader.readAsText(file); + } render() { return ( @@ -131,14 +177,23 @@ class Simulations extends Component { - this.setState({ editModal: true, modalSimulation: this.state.simulations[index] })} onDelete={index => this.setState({ deleteModal: true, modalSimulation: this.state.simulations[index] })} /> + this.setState({ editModal: true, modalSimulation: this.state.simulations[index] })} onDelete={index => this.setState({ deleteModal: true, modalSimulation: this.state.simulations[index] })} onExport={(index) => this.exportSimulation(this.state.simulations[index])} />
- +
+ + + + + + { this.fileInput = ref; }} type="file" style={{ display: 'none' }} onChange={(e) => this.loadFile(e.target.files)} /> + + +
this.closeNewModal(data)} /> - this.closeEditModal(data)} simulation={this.state.modalSimulation} /> + this.closeImportModal(data)} simulation={this.state.modalSimulation} /> this.setState({ deleteModal: false })} onKeyPress={this.onModalKeyPress}> diff --git a/src/data-managers/simulations-data-manager.js b/src/data-managers/simulations-data-manager.js index d5756cb..d5fdfde 100644 --- a/src/data-managers/simulations-data-manager.js +++ b/src/data-managers/simulations-data-manager.js @@ -21,4 +21,4 @@ import RestDataManager from './rest-data-manager'; -export default new RestDataManager('simulation', '/simulations'); +export default new RestDataManager('simulation', '/simulations', [ '_id', 'name', 'projects', 'models' ]);