mirror of
https://git.rwth-aachen.de/acs/public/villas/web/
synced 2025-03-09 00:00:01 +01:00
improve disabling of checkboxes for non-external ICs
This commit is contained in:
parent
dcc1530151
commit
60b8e63350
4 changed files with 56 additions and 16 deletions
|
@ -35,6 +35,7 @@ class TableColumn extends Component {
|
|||
labelKey: null,
|
||||
checkbox: false,
|
||||
checkboxKey: '',
|
||||
checkboxDisabled: null,
|
||||
labelStyle: null,
|
||||
labelModifier: null
|
||||
|
||||
|
|
|
@ -116,12 +116,15 @@ class CustomTable extends Component {
|
|||
|
||||
if (child.props.checkbox) {
|
||||
const checkboxKey = child.props.checkboxKey;
|
||||
|
||||
let isDisabled = false;
|
||||
if (child.props.checkboxDisabled != null){
|
||||
isDisabled = !child.props.checkboxDisabled(index)
|
||||
}
|
||||
cell.push(
|
||||
<FormCheck
|
||||
className="table-control-checkbox"
|
||||
inline
|
||||
disabled = {!data.managedexternally}
|
||||
disabled = {isDisabled}
|
||||
checked={checkboxKey ? data[checkboxKey] : null}
|
||||
onChange={e => child.props.onChecked(index, e)}
|
||||
/>);
|
||||
|
|
|
@ -372,6 +372,11 @@ class InfrastructureComponents extends Component {
|
|||
|
||||
}
|
||||
|
||||
isExternalIC(index){
|
||||
let ic = this.state.ics[index]
|
||||
return ic.managedexternally
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
const buttonStyle = {
|
||||
|
@ -395,6 +400,7 @@ class InfrastructureComponents extends Component {
|
|||
<Table data={this.state.ics}>
|
||||
<TableColumn
|
||||
checkbox
|
||||
checkboxDisabled={(index) => this.isExternalIC(index)}
|
||||
onChecked={(index, event) => this.onICChecked(index, event)}
|
||||
width='30'
|
||||
/>
|
||||
|
|
|
@ -103,6 +103,7 @@ class Scenario extends React.Component {
|
|||
files: FileStore.getState().filter(file => file.scenarioID === parseInt(props.match.params.scenario, 10)),
|
||||
|
||||
ics: ICStore.getState(),
|
||||
ExternalICInUse: false,
|
||||
|
||||
deleteConfigModal: false,
|
||||
importConfigModal: false,
|
||||
|
@ -361,6 +362,29 @@ class Scenario extends React.Component {
|
|||
this.setState({ selectedConfigs: selectedConfigs });
|
||||
}
|
||||
|
||||
usesExternalIC(index){
|
||||
let icID = this.state.configs[index].icID;
|
||||
|
||||
let ic = null;
|
||||
for (let component of this.state.ics) {
|
||||
if (component.id === this.state.configs[index].icID) {
|
||||
ic = component;
|
||||
}
|
||||
}
|
||||
|
||||
if (ic == null) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (ic.managedexternally === true){
|
||||
this.setState({ExternalICInUse: true})
|
||||
return true
|
||||
}
|
||||
|
||||
return false
|
||||
|
||||
}
|
||||
|
||||
runAction(action, delay) {
|
||||
// delay in seconds
|
||||
|
||||
|
@ -780,7 +804,11 @@ class Scenario extends React.Component {
|
|||
<Button onClick={() => this.setState({ importConfigModal: true })} style={buttonStyle}><Icon icon="upload" /></Button>
|
||||
</h2>
|
||||
<Table data={this.state.configs}>
|
||||
<TableColumn checkbox onChecked={(index, event) => this.onConfigChecked(index, event)} width='30' />
|
||||
<TableColumn
|
||||
checkbox
|
||||
checkboxDisabled={(index) => this.usesExternalIC(index)}
|
||||
onChecked={(index, event) => this.onConfigChecked(index, event)}
|
||||
width='30' />
|
||||
<TableColumn title='Name' dataKey='name' />
|
||||
<TableColumn title='Configuration file(s)' dataKey='fileIDs' modifier={(fileIDs) => this.getListOfFiles(fileIDs, ['json', 'JSON'])} />
|
||||
<TableColumn
|
||||
|
@ -822,19 +850,21 @@ class Scenario extends React.Component {
|
|||
/>
|
||||
</Table>
|
||||
|
||||
<div style={{ float: 'left' }}>
|
||||
<ICAction
|
||||
runDisabled={this.state.selectedConfigs.length === 0}
|
||||
runAction={(action, delay) => this.runAction(action, delay)}
|
||||
actions={[
|
||||
{ id: '-1', title: 'Select command', data: { action: 'none' } },
|
||||
{ id: '0', title: 'Start', data: { action: 'start' } },
|
||||
{ id: '1', title: 'Stop', data: { action: 'stop' } },
|
||||
{ id: '2', title: 'Pause', data: { action: 'pause' } },
|
||||
{ id: '3', title: 'Resume', data: { action: 'resume' } }
|
||||
]} />
|
||||
</div>
|
||||
|
||||
{ this.state.ExternalICInUse ? (
|
||||
<div style={{float: 'left'}}>
|
||||
<ICAction
|
||||
runDisabled={this.state.selectedConfigs.length === 0}
|
||||
runAction={(action, delay) => this.runAction(action, delay)}
|
||||
actions={[
|
||||
{id: '-1', title: 'Select command', data: {action: 'none'}},
|
||||
{id: '0', title: 'Start', data: {action: 'start'}},
|
||||
{id: '1', title: 'Stop', data: {action: 'stop'}},
|
||||
{id: '2', title: 'Pause', data: {action: 'pause'}},
|
||||
{id: '3', title: 'Resume', data: {action: 'resume'}}
|
||||
]}/>
|
||||
</div>
|
||||
) : (<div/>)
|
||||
}
|
||||
<div style={{ clear: 'both' }} />
|
||||
|
||||
<EditConfigDialog
|
||||
|
|
Loading…
Add table
Reference in a new issue