1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00

fixes for color control, selected color is now checked

This commit is contained in:
Sonja Happ 2020-06-19 15:13:33 +02:00
parent b07a804bf3
commit 622a5d3f22
3 changed files with 28 additions and 8 deletions

View file

@ -75,7 +75,16 @@ class EditWidgetColorControl extends Component {
'checked': idx === (isCustomProperty ? this.state.widget[parts[0]][parts[1]] : this.state.widget[this.props.controlId])
});
return (<FormCheck type='radio' key={idx} name={this.props.label} style={colorStyle} className={checkedClass} value={idx} inline onChange={(e) => this.props.handleChange({target: { id: this.props.controlId, value: idx}})} />)
return (<FormCheck
type='radio'
key={idx}
name={this.props.label}
style={colorStyle}
className={checkedClass}
value={idx}
inline
defaultChecked={isCustomProperty ? this.state.widget[parts[0]][parts[1]] ===idx: this.state.widget[this.props.controlId] === idx}
onChange={(e) => this.props.handleChange({target: { id: this.props.controlId, value: idx}})} />)
}
)
}

View file

@ -122,7 +122,7 @@ export default function CreateControls(widgetType = null, widget = null, session
DialogControls.push(
<EditWidgetColorControl key={0} widget={widget} controlId={'customProperties.border_color'} label={'Border color'} handleChange={(e) => handleChange(e)} />,
<EditWidgetColorControl key={1} widget={widget} controlId={'customProperties.background_color'} label={'Background color'} handleChange={e => handleChange(e)} />,
<EditWidgetNumberControl key={2} widget={widget} controlId={'customProperties.background_color_opacity'} label={'Background opacity'} defaultValue={0.5} handleChange={(e) => handleChange(e)} />
<EditWidgetNumberControl key={2} widget={widget} controlId={'customProperties.background_color_opacity'} label={'Background opacity (0.0 - 1.0)'} defaultValue={0.5} handleChange={(e) => handleChange(e)} />
);
break;
case 'Label':

View file

@ -25,25 +25,36 @@ class EditWidgetNumberControl extends Component {
this.state = {
widget: {
customProperties:{}
}
}
};
}
static getDerivedStateFromProps(props, state){
return{
widget: props.widget
widget: props.widget
};
}
}
render() {
let step = 1;
if(this.props.controlId ==='customProperties.background_color_opacity'){
step = 0.1;
}
}
let parts = this.props.controlId.split('.');
let isCustomProperty = true;
if (parts.length === 1){
isCustomProperty = false;
}
return (
<FormGroup controlId={this.props.controlId}>
<FormLabel>{this.props.label}</FormLabel>
<FormControl type="number" step={step} value={this.state.widget[this.props.controlId]} onChange={e => this.props.handleChange(e)} />
<FormControl
type="number"
step={step}
value={isCustomProperty ? this.state.widget[parts[0]][parts[1]] : this.state.widget[this.props.controlId]}
onChange={e => this.props.handleChange(e)} />
</FormGroup>
);
}