smarthut/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

fix

Browse source
This commit is contained in:
Claudio Maggioni (maggicl) 2020-04-28 11:56:34 +02:00
parent 835ac99a8e
commit b0b281263e
2 changed files with 534 additions and 558 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

58
smart-hut/src/components/dashboard/AutomationsPanel.js
View file

@ -65,9 +65,7 @@ const CreateTrigger = (props) => {
const onChange = (e, val) => { const onChange = (e, val) => {
props.inputChange(val); props.inputChange(val);
if ( if (
props.devices props.devices.filter((d) => d.id === val.value)[0].hasOwnProperty("on")
.filter((d) => d.id === val.value)[0]
.hasOwnProperty("on")
) { ) {
setActiveOperand(false); setActiveOperand(false);
} else { } else {
@ -94,9 +92,7 @@ const CreateTrigger = (props) => {
<React.Fragment> <React.Fragment>
<Form.Field inline width={2}> <Form.Field inline width={2}>
<Dropdown <Dropdown
onChange={(e, val) => onChange={(e, val) => props.inputChange(val)}
props.inputChange(val)
}
name="operand" name="operand"
compact compact
selection selection
@ -105,9 +101,7 @@ const CreateTrigger = (props) => {
</Form.Field> </Form.Field>
<Form.Field inline width={7}> <Form.Field inline width={7}>
<Input <Input
onChange={(e, val) => onChange={(e, val) => props.inputChange(val)}
props.inputChange(val)
}
name="value" name="value"
type="number" type="number"
placeholder="Value" placeholder="Value"
@ -117,9 +111,7 @@ const CreateTrigger = (props) => {
) : ( ) : (
<Form.Field inline width={7}> <Form.Field inline width={7}>
<Dropdown <Dropdown
onChange={(e, val) => onChange={(e, val) => props.inputChange(val)}
props.inputChange(val)
}
placeholder="State" placeholder="State"
name="value" name="value"
compact compact
@ -146,10 +138,7 @@ const SceneItem = (props) => {
<Checkbox <Checkbox
toggle toggle
onChange={(e, val) => onChange={(e, val) =>
props.orderScenes( props.orderScenes(props.scene.id, val.checked)
props.scene.id,
val.checked
)
} }
checked={position + 1 > 0} checked={position + 1 > 0}
/> />
@ -158,9 +147,7 @@ const SceneItem = (props) => {
<h3>{props.scene.name}</h3> <h3>{props.scene.name}</h3>
</Grid.Column> </Grid.Column>
<Grid.Column width={4}> <Grid.Column width={4}>
<h3> <h3>{position !== -1 ? "# " + (position + 1) : ""}</h3>
{position !== -1 ? "# " + (position + 1) : ""}
</h3>
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
</Grid> </Grid>
@ -207,9 +194,7 @@ export const CreateAutomation = (props) => {
}, [props]); }, [props]);
const _checkNewTrigger = (trigger) => { const _checkNewTrigger = (trigger) => {
const auxDevice = props.devices.filter( const auxDevice = props.devices.filter((d) => d.id === trigger.device)[0];
(d) => d.id === trigger.device
)[0];
if (auxDevice && auxDevice.hasOwnProperty("on")) { if (auxDevice && auxDevice.hasOwnProperty("on")) {
if (!trigger.device || !trigger.value == null) { if (!trigger.device || !trigger.value == null) {
return { return {
@ -425,7 +410,6 @@ const Automation = ({automation, devices, scenes, removeAutomation}) => {
const getOperator = (operand) => const getOperator = (operand) =>
operands.filter((o) => o.key == operand)[0].text; operands.filter((o) => o.key == operand)[0].text;
return ( return (
<React.Fragment> <React.Fragment>
<Header style={{ display: "inline", marginRight: "1rem" }}> <Header style={{ display: "inline", marginRight: "1rem" }}>
@ -462,9 +446,7 @@ const Automation = ({automation, devices, scenes, removeAutomation}) => {
<Menu.Item as="span"> <Menu.Item as="span">
{device.name}{" "} {device.name}{" "}
{trigger.operator {trigger.operator
? getOperator( ? getOperator(trigger.operator) +
trigger.operator
) +
" " + " " +
trigger.range trigger.range
: trigger.value : trigger.value
@ -486,9 +468,7 @@ const Automation = ({automation, devices, scenes, removeAutomation}) => {
)[0]; )[0];
return ( return (
<Menu key={sceneData.id} compact> <Menu key={sceneData.id} compact>
<Menu.Item as="span"> <Menu.Item as="span">{sceneData.name}</Menu.Item>
{sceneData.name}
</Menu.Item>
</Menu> </Menu>
); );
})} })}
@ -504,7 +484,7 @@ const Automation = ({automation, devices, scenes, removeAutomation}) => {
class AutomationsPanel extends Component { class AutomationsPanel extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {openModal: false} this.state = { openModal: false };
this.getDevices(); this.getDevices();
this.getScenes(); this.getScenes();
this.getAutomations(); this.getAutomations();
@ -526,20 +506,18 @@ class AutomationsPanel extends Component {
.catch((err) => console.error(`error fetching automations:`, err)); .catch((err) => console.error(`error fetching automations:`, err));
} }
removeAutomation = (id) => { removeAutomation = (id) => {
this.props this.props
.deleteAutomation(id) .deleteAutomation(id)
.catch((err) => console.error(`error removing automation ${id}:`, err)); .catch((err) => console.error(`error removing automation ${id}:`, err));
} };
render() { render() {
return ( return (
<Grid style={{ marginTop: "3rem" }}> <Grid style={{ marginTop: "3rem" }}>
<Grid.Row> <Grid.Row>
<Grid.Column textAlign="center" width={16}> <Grid.Column textAlign="center" width={16}>
{!this.state.openModal ? {!this.state.openModal ? (
(
<List> <List>
<CreateAutomation <CreateAutomation
save={this.props.saveAutomation} save={this.props.saveAutomation}
@ -547,21 +525,16 @@ class AutomationsPanel extends Component {
devices={this.props.devices} devices={this.props.devices}
/> />
</List> </List>
) : ) : (
(
<Button color="green">CREATE AUTOMATION</Button> <Button color="green">CREATE AUTOMATION</Button>
)} )}
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
<Grid.Row> <Grid.Row>
{this.props.automations.map((automation, i) => { {this.props.automations.map((automation, i) => {
console.log(23, automation, i, this.props.automations);
return ( return (
<Grid.Column <Grid.Column key={i} width={8} style={{ margin: "2rem 0" }}>
key={i}
width={8}
style={{margin: "2rem 0"}}
>
<Automation <Automation
removeAutomation={this.removeAutomation} removeAutomation={this.removeAutomation}
scenes={this.props.scenes} scenes={this.props.scenes}
@ -587,6 +560,7 @@ const mapStateToProps = (state, _) => ({
return Object.values(state.devices); return Object.values(state.devices);
}, },
get automations() { get automations() {
console.log(state.automations);
return Object.values(state.automations); return Object.values(state.automations);
}, },
}); });

16
smart-hut/src/store.js
View file

@ -256,8 +256,13 @@ function reducer(previousState, action) {
case "AUTOMATION_UPDATE": case "AUTOMATION_UPDATE":
newState = previousState; newState = previousState;
const automations = {};
for (const automation of action.automations) {
automations[automation.id] = automation;
}
change = { change = {
automations : {$set: action.automations} automations: { $set: automations },
}; };
newState = update(previousState, change); newState = update(previousState, change);
break; break;
@ -297,15 +302,13 @@ function reducer(previousState, action) {
case "AUTOMATION_SAVE": case "AUTOMATION_SAVE":
console.log("ID: ", action.automation.id); console.log("ID: ", action.automation.id);
change = { change = {
automations : {[action.automation.id] : {$set : action.automation}} automations: { [action.automation.id]: { $set: action.automation } },
}; };
newState = update(previousState, change); newState = update(previousState, change);
break; break;
case "STATE_SAVE": case "STATE_SAVE":
change = { change = {
sceneStates: { [action.sceneState.id]: { $set: action.sceneState } }, sceneStates: { [action.sceneState.id]: { $set: action.sceneState } },
@ -355,15 +358,14 @@ function reducer(previousState, action) {
break; break;
case "AUTOMATION_DELETE": case "AUTOMATION_DELETE":
change = { change = {
automations: { $unset: [action.id] }, automations: { $unset: [action.id] },
}; };
console.log("CHANGE ", change) console.log("CHANGE ", change);
console.log("Action id: ", action.id); console.log("Action id: ", action.id);
newState = update(previousState, change); newState = update(previousState, change);
console.log("NEW STATE ", newState) console.log("NEW STATE ", newState);
break; break;
case "SCENE_DELETE": case "SCENE_DELETE":
console.log("SCENE", action.sceneId); console.log("SCENE", action.sceneId);