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

Resize dashboard buttons now work as expected if the dashboard is empty, decrease button disabled if min dashboard height has been reached #230

Browse source
This commit is contained in:
Laura Fuentes Grau 2020-07-15 16:07:12 +02:00
parent 708482ec1f
commit 57e38089b0
2 changed files with 24 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/dashboard/dashboard.js
View file

@ -73,7 +73,10 @@ class Dashboard extends Component {
return thisWidgetHeight > maxHeightSoFar? thisWidgetHeight : maxHeightSoFar;
}, 0);
if(dashboard.height === 0 || maxHeight + 80 > dashboard.height)
if(dashboard.height === 0){
dashboard.height = 400;
}
else if(maxHeight + 80 > dashboard.height)
{
dashboard.height = maxHeight + 80;
}
@ -367,11 +370,12 @@ class Dashboard extends Component {
return absolutHeight > currentHeight ? absolutHeight : currentHeight;
}, 0);
let dashboard = this.state.dashboard;
if(value === -1){
let tempHeight = this.state.dashboard.height - 50;
if(tempHeight > (maxHeight + 80)){
if(tempHeight >= 400 && tempHeight >= (maxHeight + 80)){
dashboard.height = tempHeight;
this.setState({dashboard});
}
@ -420,7 +424,7 @@ class Dashboard extends Component {
<div className="box box-content" onContextMenu={ (e) => e.preventDefault() }>
{this.state.editing &&
<WidgetToolbox grid={grid} onGridChange={this.setGrid.bind(this)} onDashboardSizeChange={this.setDashboardSize.bind(this)} widgets={this.state.widgets} />
<WidgetToolbox grid={grid} onGridChange={this.setGrid.bind(this)} dashboard={this.state.dashboard} onDashboardSizeChange={this.setDashboardSize.bind(this)} widgets={this.state.widgets} />
}
{!draggable?(
<WidgetArea widgets={this.state.widgets} dropZoneHeight = {dropZoneHeight} editing={this.state.editing} grid={grid} onWidgetAdded={this.handleDrop.bind(this)}>

18
src/widget/widget-toolbox.js
View file

@ -35,7 +35,23 @@ class WidgetToolbox extends React.Component {
}
};
disableDecrease(){
const maxHeight = Object.values(this.props.widgets).reduce((currentHeight, widget) => {
const absolutHeight = widget.y + widget.height;
return absolutHeight > currentHeight ? absolutHeight : currentHeight;
}, 0);
if(this.props.dashboard.height <= 400 || this.props.dashboard.height <= maxHeight + 80){
return true;
}
return false;
}
render() {
const disableDecrease = this.disableDecrease();
// Only one topology widget at the time is supported
const iconStyle = {
color: '#007bff',
@ -82,7 +98,7 @@ class WidgetToolbox extends React.Component {
</Button>
</OverlayTrigger>
<OverlayTrigger key={1} placement={'bottom'} overlay={<Tooltip id={`tooltip-${"decrease"}`}> Decrease dashboard height </Tooltip>} >
<Button variant="light" key={1} style={{marginRight: '3px', height: '40px'}} onClick={() => this.props.onDashboardSizeChange(-1)} >
<Button variant="light" key={1} disabled={disableDecrease} style={{marginRight: '3px', height: '40px'}} onClick={() => this.props.onDashboardSizeChange(-1)} >
<Icon icon="minus" style={iconStyle}/>
</Button>
</OverlayTrigger>