diff --git a/smart-hut/public/img/refresh.svg b/smart-hut/public/img/refresh.svg new file mode 100644 index 0000000..2901972 --- /dev/null +++ b/smart-hut/public/img/refresh.svg @@ -0,0 +1,42 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/smart-hut/src/client_server.js b/smart-hut/src/client_server.js index 46cc06f..2598b53 100644 --- a/smart-hut/src/client_server.js +++ b/smart-hut/src/client_server.js @@ -277,4 +277,9 @@ export var call = { deviceGetAll: function (data, headers) { return axios.get(config + data.device); }, + smartPlugReset: function (id) { + return axios.delete(config + "smartPlug/" + id + "/meter", { + headers: { Authorization: "Bearer " + tkn }, + }); + }, }; diff --git a/smart-hut/src/components/dashboard/devices/SmartPlug.js b/smart-hut/src/components/dashboard/devices/SmartPlug.js index 8b4d30d..41b9be5 100644 --- a/smart-hut/src/components/dashboard/devices/SmartPlug.js +++ b/smart-hut/src/components/dashboard/devices/SmartPlug.js @@ -5,9 +5,14 @@ The user can reset this value. **/ import React, { Component } from "react"; -import { BottomPanel, StyledDiv } from "./styleComponents"; +import { + BottomPanel, + StyledDiv, + editModeIconStyle, + editModeStyleLeft, +} from "./styleComponents"; import Settings from "./DeviceSettings"; -import { Image } from "semantic-ui-react"; +import { Image, Icon } from "semantic-ui-react"; import { energyConsumedStyle, imageStyle, @@ -50,6 +55,16 @@ export default class SmartPlug extends Component { }); }; + resetSmartPlug = () => { + call.smartPlugReset(this.props.device.id).then((res) => { + if (res.status === 200) { + this.setState({ + energyConsumed: (res.data.totalConsumption / 1000).toFixed(3), + }); + } + }); + }; + getIcon = () => { if (this.state.turnedOn) { return this.iconOn; @@ -74,6 +89,13 @@ export default class SmartPlug extends Component { this.props.onChangeData(id, newSettings) } /> + {this.props.edit.mode ? ( + + + + ) : ( + "" + )} {this.props.device.name} ({this.props.device.id}) diff --git a/smart-hut/src/components/dashboard/devices/styleComponents.js b/smart-hut/src/components/dashboard/devices/styleComponents.js index 1b6c788..9c052f7 100644 --- a/smart-hut/src/components/dashboard/devices/styleComponents.js +++ b/smart-hut/src/components/dashboard/devices/styleComponents.js @@ -37,6 +37,18 @@ export const editModeStyle = { cursor: "pointer", }; +export const editModeStyleLeft = { + position: "absolute", + top: "15%", + left: "0", + width: "1.5rem", + height: "1.5rem", + backgroundColor: "white", + borderRadius: "100%", + zIndex: "1000", + cursor: "pointer", +}; + export const editModeIconStyle = { position: "absolute", top: "50%",