Mirrors/VILLASweb
1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00
Code Issues Releases Wiki Activity

Delete (all) signal(s) with checkbox-button combination #269

Browse source
This commit is contained in:
Laura Fuentes Grau 2021-02-16 18:00:44 +01:00
parent 6a98a707ec
commit b90c34e0c9
1 changed files with 50 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

57
src/signal/edit-signal-mapping.js
View file

@ -17,7 +17,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import {Button, FormGroup, FormLabel, FormText} from 'react-bootstrap';
import {Button, FormGroup, FormLabel, FormText, OverlayTrigger, Tooltip} from 'react-bootstrap';
import {Collapse} from 'react-collapse';
import Table from '../common/table';
import TableColumn from '../common/table-column';
@ -64,6 +64,11 @@ class EditSignalMapping extends React.Component {
}
}
signals.forEach(signal => {
if(signal.checked == undefined) signal.checked = false
});
return {
signals: signals,
};
@ -136,6 +141,17 @@ class EditSignalMapping extends React.Component {
handleRemove = () => {
let checkedSignals = this.state.signals.filter(signal => signal.checked === true);
checkedSignals.forEach(signal => {
AppDispatcher.dispatch({
type: 'signals/start-remove',
data: signal,
token: this.props.sessionToken
});
})
}
handleAdd = (configID = null) => {
@ -177,8 +193,32 @@ class EditSignalMapping extends React.Component {
this.setState({signals: signals})
}
onSignalChecked(index, signal) {
console.log(index);
onSignalChecked(signal) {
let tempSignals = this.state.signals;
const index = tempSignals.indexOf(signal);
tempSignals[index].checked = !tempSignals[index].checked;
this.setState({signals: tempSignals});
}
checkAll(){
let tempSignals = this.state.signals;
let allChecked = true;
tempSignals.forEach(signal =>
{
if(signal.checked === false){
signal.checked = true;
allChecked = false;
}
});
if(allChecked){
tempSignals.forEach(signal => signal.checked = false);
}
this.setState({signals: tempSignals});
}
render() {
@ -202,8 +242,8 @@ class EditSignalMapping extends React.Component {
<FormGroup>
<FormLabel>{this.props.direction} Mapping</FormLabel>
<FormText>Click <i>Index</i>, <i>Name</i> or <i>Unit</i> cell to edit</FormText>
<Table checkbox onChecked={(index, event) => this.onSignalChecked(index, event)} data={this.state.signals}>
<TableColumn checkbox onChecked={(index, event) => this.onSignalChecked(index, event)} width='30' />
<Table checkbox onChecked={(signal) => this.onSignalChecked(signal)} data={this.state.signals}>
<TableColumn checkbox onChecked={(index, event) => this.onSignalChecked(index, event)} checkboxKey='checked' width='30' />
<TableColumn title='Index' dataKey='index' inlineEditable inputType='number' onInlineChange={(e, row, column) => this.handleMappingChange(e, row, column)} />
<TableColumn title='Name' dataKey='name' inlineEditable inputType='text' onInlineChange={(e, row, column) => this.handleMappingChange(e, row, column)} />
<TableColumn title='Unit' dataKey='unit' inlineEditable inputType='text' onInlineChange={(e, row, column) => this.handleMappingChange(e, row, column)} />
@ -212,8 +252,11 @@ class EditSignalMapping extends React.Component {
</Table>
<div >
<Button key={50} style={{ float: 'left' }} onClick={() => this.handleRemove()} style={buttonStyle}> Remove </Button>
<Button key={51} style={{ float: 'right' }} onClick={() => this.handleAdd()} style={buttonStyle}><Icon icon="plus" /> Signal </Button>
<OverlayTrigger key={0} placement={'left'} overlay={<Tooltip id={`tooltip-${"check"}`}> Check/Uncheck All </Tooltip>} >
<Button key={50} style={{ float: 'left' }} onClick={() => this.checkAll()} style={buttonStyle}> <Icon icon="check" /> </Button>
</OverlayTrigger>
<Button key={51} style={{ float: 'left' }} onClick={() => this.handleRemove()} style={buttonStyle}> Remove </Button>
<Button key={52} style={{ float: 'right' }} onClick={() => this.handleAdd()} style={buttonStyle}><Icon icon="plus" /> Signal </Button>
</div>
<div>
<Collapse isOpened={this.state.openCollapse}>