From 8e51c56fc6369c3eec11143d2e4724a820920621 Mon Sep 17 00:00:00 2001 From: irismarie Date: Thu, 15 Apr 2021 11:23:10 +0200 Subject: [PATCH] add locking button in scenarios table --- src/common/icon-toggle-button.js | 9 +-------- src/common/table.js | 25 ++++++++++++++++++++---- src/scenario/scenario-users-table.js | 29 ++++++++++------------------ src/scenario/scenarios.js | 11 ++++++----- 4 files changed, 38 insertions(+), 36 deletions(-) diff --git a/src/common/icon-toggle-button.js b/src/common/icon-toggle-button.js index 44613f6..cd421e0 100644 --- a/src/common/icon-toggle-button.js +++ b/src/common/icon-toggle-button.js @@ -26,12 +26,7 @@ class IconToggleButton extends React.Component { render() { const altButtonStyle = { - marginLeft: '20px', - } - - const iconStyle = { - height: '30px', - width: '30px' + marginLeft: '10px', } return : } diff --git a/src/common/table.js b/src/common/table.js index 09a9b4a..6d36367 100644 --- a/src/common/table.js +++ b/src/common/table.js @@ -20,6 +20,8 @@ import _ from 'lodash'; import { Table, Button, Form, Tooltip, OverlayTrigger } from 'react-bootstrap'; import { Link } from 'react-router-dom'; import Icon from './icon'; +import IconToggleButton from './icon-toggle-button'; + class CustomTable extends Component { constructor(props) { @@ -128,7 +130,7 @@ class CustomTable extends Component { let isLocked = child.props.locked || (child.props.isLocked != null && child.props.isLocked(index)); // add buttons - let showEditButton = child.props.showEditButton !== null && child.props.showEditButton !== undefined + let showEditButton = child.props.showEditButton !== null && child.props.showEditButton !== undefined ? child.props.showEditButton(index) : true; @@ -166,6 +168,21 @@ class CustomTable extends Component { ); } + if (child.props.lockButton) { + cell.push( + child.props.onChangeLock(index)} + checked={isLocked} + checkedIcon='lock' + uncheckedIcon='lock-open' + tooltipChecked='Scenario is locked, cannot be edited' + tooltipUnchecked='Scenario is unlocked, can be edited' + disabled={false} + /> + ); + } + if (child.props.exportButton) { cell.push( children[cellIndex].props.onInlineChange(event, rowIndex, cellIndex)} ref={ref => { this.activeInput = ref; }} /> - : + : { cell.map((element, elementIndex) => {element} ) } - } + } }) } diff --git a/src/scenario/scenario-users-table.js b/src/scenario/scenario-users-table.js index f6e7b7a..26eb06f 100644 --- a/src/scenario/scenario-users-table.js +++ b/src/scenario/scenario-users-table.js @@ -16,11 +16,11 @@ ******************************************************************************/ import React, {Component} from "react"; -import {Button, Form, InputGroup} from "react-bootstrap"; +import { Form, InputGroup} from "react-bootstrap"; import {Redirect} from "react-router-dom"; import Table from "../common/table"; import TableColumn from "../common/table-column"; -import Icon from "../common/icon"; +import IconButton from "../common/icon-button"; import DeleteDialog from "../common/dialogs/delete-dialog"; import AppDispatcher from "../common/app-dispatcher"; @@ -82,15 +82,6 @@ class ScenarioUsersTable extends Component { return (); } - const altButtonStyle = { - marginLeft: '10px', - } - - const iconStyle = { - height: '30px', - width: '30px' - } - return (
{/*Scenario Users table*/} @@ -142,14 +133,14 @@ class ScenarioUsersTable extends Component { /> - + this.addUser()} + icon='plus' + disabled={this.props.locked} + hidetooltip={this.props.locked} + /> diff --git a/src/scenario/scenarios.js b/src/scenario/scenarios.js index 1e9df38..7f9c45b 100644 --- a/src/scenario/scenarios.js +++ b/src/scenario/scenarios.js @@ -231,10 +231,10 @@ class Scenarios extends Component { return this.state.scenarios[index].isLocked; } - onLock(scenario) { + onLock(index) { let data = {}; - data.id = scenario.id; - data.isLocked = !scenario.isLocked; + data.id = this.state.scenarios[index].id; + data.isLocked = !this.state.scenarios[index].isLocked; AppDispatcher.dispatch({ type: 'scenarios/start-edit', @@ -279,9 +279,10 @@ class Scenarios extends Component { {this.state.currentUser.role === "Admin" ? this.onLock(index)} + onChangeLock={(index, event) => this.onLock(index)} + isLocked={index => this.isLocked(index)} /> : <> }