Merge branch '28-implementation-frontend-rooms' into 'dev'

added pre implementation navbar

Closes #28

See merge request sa4-2020/the-sanmarinoes/frontend!18

smart-hut/src/App.js

@@ -1,7 +1,7 @@
-import React from "react";
+import React, {Component} from "react";
 import {BrowserRouter, Switch, Route, Redirect } from "react-router-dom";
 import Home from "./views/Home";
-import Dashboard from "./views/DashboardTest";
+import Dashboard from "./views/Dashboard";
 import Signup from "./views/Signup";
 import Login from "./views/Login";
 import FourOhFour from "./views/FourOhFour";
@@ -11,18 +11,26 @@ import queryString from 'query-string';
 
 import { call } from './client_server';
 
-class App extends React.Component {
+/*let userJsonString = JSON.parse(localStorage.getItem("token"));
+      let date = new Date().getTime().toString();
+      let delta = date - userJsonString.timestamp;
+			if (delta < 5*60*60*1000) {
+				loggedIn = true;
+      }*/
+
+class App extends Component {
   constructor(props) {
     super(props);
 
     let loggedIn = false;
     
 		try {
-			let userJsonString = localStorage.getItem("token");
-			if (userJsonString) {
-				loggedIn = true;
-			}
-		} catch (exception) {
+      let userJsonString = localStorage.getItem("token");
+      if (userJsonString) {
+        loggedIn = true;
+      }
+		}catch(exception) {
+
 		}
 
 		this.state = {
@@ -47,6 +55,7 @@ class App extends React.Component {
       .then(res => {
         console.log(res);
         if (res.data && res.status === 200) {
+          localStorage.setItem("token", res.data.jwttoken);
           this.setState(
             {
               user: data.params.user,
@@ -54,9 +63,7 @@ class App extends React.Component {
               loggedIn: true,
             }
           );
-          localStorage.setItem("token", JSON.stringify(res.data.jwttoken));
-          this.props.history.push("/dashboard");
-
+          //this.props.history.push("/dashboard");
         } else {
           this.setState({
             error: res.data.message
@@ -84,7 +91,7 @@ class App extends React.Component {
         <Switch>
           <Route path="/" exact component={Home} />
           <Route path="/login" >
-            { this.state.loggedIn ? <Redirect to="/dashboard" /> : <Login auth={this.auth} /> } 
+            { this.state.loggedIn ? <Redirect tkn={this.state.token} to="/dashboard" /> : <Login auth={this.auth} /> } 
           </Route>
           <Route path="/signup" exact component={Signup} />
           <Route path="/dashboard" >

smart-hut/src/client_server.js

@@ -1,6 +1,18 @@
 import axios from 'axios';
 
 let config = 'http://localhost:8080/';
+const tkn = localStorage.getItem("token");
+
+// requests data devices
+/*
+
+    {
+        params : data,
+        device: 'tipoDiDevice',
+        id: se serve
+    }
+
+*/
 
 export var call  = {
     login: function(data, headers) {
@@ -36,4 +48,76 @@ export var call  = {
                 return {status : "Errore"};
             });
     },
+    getAllRooms: function(token) {
+        return axios.get(config + 'room', { headers: { Authorization : "Bearer " + tkn } }) 
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    createRoom: function(data, headers) {
+        return axios.post(config + 'room', data, { headers: { Authorization : "Bearer " + tkn } }) 
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    updateRoom: function(data, headers) {
+        return axios.put(config + 'room/'+data.id)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    deleteRoom: function(data, headers) {
+        return axios.delete(config + 'room/'+data.id)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    }, 
+    devicePost: function(data, headers) {
+        return axios.post(config + data.device, data.params)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    deviceUpdate: function(data, headers) {
+        return axios.put(config + data.device, data.params)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    deviceDelete: function(data, headers) {
+        return axios.delete(config + data.device + '/' + data.id, data.params)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    deviceGetById: function(data, headers) {
+        return axios.get(config + data.device + '/' + data.id)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    },
+    deviceGetAll: function(data, headers) {
+        return axios.get(config + data.device)
+            .then(res => {
+                return res;
+            }).catch(err => {
+                return err;
+            });
+    }
 };

smart-hut/src/views/Dashboard.js

@@ -1,10 +1,81 @@
-import React from 'react';
+import React, {Component} from 'react';
 import DevicePanel from "../components/dashboard/DevicePanel";
 
-export default function Dashboard(props){
-  return(
-    <div style={{height : "110vh"}}>
-      <DevicePanel />
-    </div>
-  )
+import { call } from '../client_server';
+import {Button} from 'semantic-ui-react';
+import { Menu } from 'semantic-ui-react'
+import { Grid, Image, Icon } from 'semantic-ui-react'
+import NavbarTest from './NavbarTest'
+
+export default class Dashboard extends Component{
+  constructor(props) {
+    super(props);
+    this.state = {
+      rooms: [],
+      activeItem: "Home"
+    };
+
+    this.addRoom = this.addRoom.bind(this);
+    this.handleItemClick = this.handleItemClick.bind(this);
+  }
+
+  UNSAFE_componentWillMount() {
+    call.getAllRooms(this.props.token)
+      .then(res => {
+        res.data.forEach((e) => {
+          this.setState(state => ({
+            rooms: state.rooms.concat([e])
+          }));
+        });
+        console.log(res, this.state.rooms)
+      }).catch(err => {
+        console.log(err);
+      });
+  }
+
+  addRoom(e) {
+    e.preventDefault();
+    const params = {
+      "icon": "ciao",
+      "image": "ciao",
+      "name": "kitchen"
+    }
+    call.createRoom(params)
+      .then(res => {
+        console.log(res);
+        if (res.status === 200 && res.data) {
+          this.setState(state => ({
+            rooms: state.rooms.concat([res.data])
+          }));
+        }
+        console.log(this.state.rooms);
+      }).catch(err => {
+        console.log(err);
+      });
+  };
+
+  handleItemClick(el) {
+    //da fare richiesta get della room e settare activeItem
+  }
+ 
+  render () {
+    return(
+      <div style={{height : "110vh"}}>
+        <Button  color='blue' fluid size='large' onClick={this.addRoom}>
+            Add Room
+        </Button>
+        <Grid>
+        <Grid.Row>
+            <Grid.Column width={3}>
+              <NavbarTest rooms={this.state.rooms} handleItemClick={this.handleItemClick}/>
+            </Grid.Column>
+      
+            <Grid.Column width={13}>
+              <DevicePanel />
+              </Grid.Column>
+          </Grid.Row>
+        </Grid>
+      </div>
+    )
+  }
 }

smart-hut/src/views/NavbarTest.js

@@ -0,0 +1,12 @@
+import React, {Component} from 'react';
+import {Button } from 'semantic-ui-react';
+
+
+export default class NavbarTest extends Component {
+
+    render() {
+        return (
+            <h1>Ciao</h1>
+        )
+    }
+}