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

addes switches creation and update

Browse source
This commit is contained in:
britea 2020-03-23 19:08:31 +01:00
parent 8b49bdfbb7
commit f579ea80fe
11 changed files with 92 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
smart-hut/src/client_server.js
View file

@ -63,13 +63,22 @@ export var call = {
return axios.post(config + 'room', data, { headers: { Authorization : "Bearer " + tkn } })
},
updateRoom: function(data, headers) {
return axios.put(config + 'room?name='+ data.name, data, { headers: { Authorization : "Bearer " + tkn } })
return axios.put(config + 'room/'+ data.id, data, { headers: { Authorization : "Bearer " + tkn } })
},
deleteRoom: function(data, headers) {
return axios.delete(config + 'room/'+data.id, { headers: { Authorization : "Bearer " + tkn } });
},
devicePost: function(data, headers) {
return axios.post(config + data.device, data.params, { headers: { Authorization : "Bearer " + tkn } })
.then(res => {
if (res.status === 200 && (data.device === "switch")) {
data.params.lights.forEach(e => {
let urlUp = config + data.device + '/' + res.data.id + '/lights?switchableId=' + e;
axios.post(urlUp, {}, { headers: { Authorization : "Bearer " + tkn } })
});
}
return res;
})
},
deviceUpdate: function(data, typeDevice) {
let url = 'device';
@ -79,7 +88,7 @@ export var call = {
return axios.put(config + url, data, { headers: { Authorization : "Bearer " + tkn } })
},
deviceDelete: function(data, headers) {
return axios.delete(config + data.device + '/' + data.id, {}, { headers: { Authorization : "Bearer " + tkn } })
return axios.delete(config + data.device + '/' + data.id, { headers: { Authorization : "Bearer " + tkn } })
},
deviceGetById: function(data, headers) {
return axios.get(config + data.device + '/' + data.id)

1
smart-hut/src/components/SelectIcons.js
View file

@ -13,7 +13,6 @@ export default class SelectIcons extends Component {
selectIcon = (e) => {
let el = e.target.name;
if (e.target.tagName === "I"){
console.log(e.target.parentNode);
el = e.target.parentNode.name;
}
this.props.updateIcon(el);

4
smart-hut/src/components/dashboard/DevicePanel.js
View file

@ -108,7 +108,6 @@ export default class DevicePanel extends Component {
removeDevice = () => {
const item = this.props.devices.filter(d => d.id === this.state.settingsDeviceId)[0];
console.log(item)
const data = {
device: item.kind,
id: this.state.settingsDeviceId
@ -116,9 +115,10 @@ export default class DevicePanel extends Component {
call.deviceDelete(data)
.then(res => {
console.log(res)
if (res.status === 200) {
this.openModal();
this.getDevices();
this.forceUpdate();
}
}).catch(err => {

4
smart-hut/src/components/dashboard/devices/DeviceTypeController.js
View file

@ -12,9 +12,9 @@ const DeviceType = (props) => {
return (<Light onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />)
case "sensor":
return <Sensor onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />
case "dimmer":
case "buttonDimmer":
return <DefaultDimmer onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />
case "smartplug":
case "smartPlug":
return <SmartPlug onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />
case "switch":
return <Switcher onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />

2
smart-hut/src/components/dashboard/devices/Light.js
View file

@ -99,7 +99,7 @@ export default class Light extends Component {
deviceId={this.props.device.id}
edit={this.props.edit}
onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
{this.props.device.intensity ? (intensityLightView) : (normalLightView)}
{this.props.device.intensity >= 0 ? (intensityLightView) : (normalLightView)}
</StyledDiv>
)
}

10
smart-hut/src/components/dashboard/devices/NewDevice.js
View file

@ -79,9 +79,17 @@ export default class NewDevice extends Component {
case "dimmableLight":
data.params["intensity"] = 1;
break;
case "sensor":
data.params["sensor"] = this.state.typeOfSensor;
data.params["value"] = 0;
break;
case "switch":
data.params["lights"] = this.state.lightsAttached;
break;
default:
break;
}
console.log(data)
this.props.addDevice(data);
this.resetState();
};
@ -122,7 +130,7 @@ export default class NewDevice extends Component {
{
key: 'dimmer',
text: 'Dimmer',
value: 'dimmer',
value: 'buttonDimmer',
image: {avatar: true, src: '/img/dimmer.svg'},
},
];

40
smart-hut/src/components/dashboard/devices/Sensor.js
View file

@ -6,9 +6,22 @@
* For this story, make the sensors return a constant value with some small random error.
*/
/*
OPTIONAL STATE
error: 2.4
<text style={errorStyle} x={100} y={100} textAnchor="middle" dy="0.6em" fontWeight="bold">
&#177;{this.state.error}
</text>
errorStyle,
*/
import React, {Component} from "react";
import {CircularInput, CircularProgress, CircularTrack} from "react-circular-input";
import {errorStyle, sensorText, style, valueStyle} from "./SensorStyle";
import { sensorText, style, valueStyle} from "./SensorStyle";
import Settings from "./DeviceSettings";
import {StyledDiv} from "./styleComponents";
@ -17,10 +30,9 @@ export default class Sensor extends Component {
super(props);
this.state = {
turnedOn: false,
value: 20,
error: 2.4
value: 0,
};
this.units = "ºC"
this.units = ""
}
setName = () => {
@ -31,6 +43,23 @@ export default class Sensor extends Component {
};
componentDidMount() {
switch(this.props.device.sensor) {
case "TEMPERATURE":
this.units = "ºC";
break;
case "HUMIDITY" :
this.units = "%";
break;
case "LIGHT":
this.units = "lm";
break;
default:
this.units = "";
}
this.setState({
value : this.props.device.value
});
}
@ -51,9 +80,6 @@ export default class Sensor extends Component {
<text style={valueStyle} x={100} y={80} textAnchor="middle" dy="0.3em" fontWeight="bold">
{Math.round(this.state.value)}{this.units}
</text>
<text style={errorStyle} x={100} y={100} textAnchor="middle" dy="0.6em" fontWeight="bold">
&#177;{this.state.error}
</text>
<text style={sensorText} x={100} y={150} textAnchor="middle" dy="0.3em" fontWeight="bold">
{this.setName()}
</text>

13
smart-hut/src/components/dashboard/devices/SmartPlug.js
View file

@ -9,6 +9,7 @@ import {StyledDiv} from "./styleComponents";
import Settings from "./DeviceSettings";
import {Image} from "semantic-ui-react";
import {energyConsumedStyle, imageStyle, nameStyle} from "./SmartPlugStyle";
import { call } from '../../../client_server';
export default class SmartPlug extends Component {
constructor(props){
@ -22,7 +23,13 @@ export default class SmartPlug extends Component {
}
onClickDevice = () => {
this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
this.props.device.on = !this.state.turnedOn;
call.deviceUpdate(this.props.device, 'smartPlug')
.then(res => {
if (res.status === 200 ){
this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
}
})
};
getIcon = () => {
@ -33,6 +40,10 @@ export default class SmartPlug extends Component {
};
componentDidMount() {
this.setState({
turnedOn : this.props.device.on,
energyConsumed : this.props.device.totalConsumption
})
}
render(){

23
smart-hut/src/components/dashboard/devices/Switch.js
View file

@ -10,6 +10,7 @@ import {StyledDiv} from "./styleComponents";
import Settings from "./DeviceSettings";
import {Image} from "semantic-ui-react";
import {imageStyle, nameStyle} from "./SwitchStyle";
import { call } from '../../../client_server';
export default class Switch extends Component {
constructor(props){
@ -23,7 +24,23 @@ export default class Switch extends Component {
}
onClickDevice = () => {
this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
this.props.device.on = !this.state.turnedOn;
let state = "";
if(this.props.device.on) {
state = "ON"
} else {
state = "OFF"
}
let data = {
"type" : state,
"id" : this.props.device.id
}
call.deviceUpdate(data, 'switch/operate')
.then(res => {
if (res.status === 200 ){
this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
}
})
};
getIcon = () => {
@ -34,7 +51,9 @@ export default class Switch extends Component {
};
componentDidMount() {
this.setState({
turnedOn: this.props.device.on
})
}
render(){

2
smart-hut/src/views/Dashboard.js
View file

@ -99,7 +99,7 @@ getRooms() {
}
updateRoom(data) {
console.log(data)
data.id = this.state.activeItem;
call.updateRoom(data)
.then(res => {
if (res.status === 200 && res.data) {

1
smart-hut/src/views/Navbar.js
View file

@ -17,7 +17,6 @@ class Navbar extends Component {
editModeController = (e) => this.setState((prevState) => ({ editMode: !prevState.editMode }));
handleClick = (e, {id, name}) => {
console.log(id);
let obj = undefined;
this.props.rooms.forEach((e) => {
if (e.id === id) {