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

Merge branch 'fix-mobile' into 'dev'

Browse source 
fixed mobile

See merge request sa4-2020/the-sanmarinoes/frontend!77
This commit is contained in:
Claudio Maggioni 2020-03-26 10:31:02 +01:00
commit 49ba4283bf
2 changed files with 76 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
smart-hut/src/components/modalform.js
View file

@ -104,29 +104,48 @@ export default class ModalWindow extends Component {
};
return (
<div>
<Responsive minWidth={768}>
{this.props.type === "new" ? (
<Button icon labelPosition="left" inverted onClick={this.openModal}>
<Icon name="plus" size="small" />
ADD ROOM
</Button>
) : (
<Icon name="pencil" size="small" onClick={this.openModal} />
)}
</Responsive>
<Responsive maxWidth={768}>
{this.props.type === "new" ? (
<Button icon fluid labelPosition="left" onClick={this.openModal}>
<Icon name="plus" size="small" />
ADD ROOM
</Button>
) : (
<Button icon fluid labelPosition="left" onClick={this.openModal}>
<Icon name="pencil" size="small" />
EDIT ROOM
</Button>
)}
</Responsive>
{!this.props.nicolaStop ? (
<div>
<Responsive minWidth={768}>
{this.props.type === "new" ? (
<Button
icon
labelPosition="left"
inverted
onClick={this.openModal}
>
<Icon name="plus" size="small" />
ADD ROOM
</Button>
) : (
<Icon name="pencil" size="small" onClick={this.openModal} />
)}
</Responsive>
<Responsive maxWidth={768}>
{this.props.type === "new" ? (
<Button
icon
fluid
labelPosition="left"
onClick={this.openModal}
>
<Icon name="plus" size="small" />
ADD ROOM
</Button>
) : (
<Button
icon
fluid
labelPosition="left"
onClick={this.openModal}
>
<Icon name="pencil" size="small" />
EDIT ROOM
</Button>
)}
</Responsive>
</div>
) : null}
<Modal onClose={this.closeModal} open={this.state.openModal}>
<Header>

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

@ -1,5 +1,12 @@
import React, { Component } from "react";
import { Menu, Grid, Icon, Responsive, Dropdown } from "semantic-ui-react";
import {
Menu,
Button,
Grid,
Icon,
Responsive,
Dropdown,
} from "semantic-ui-react";
import { editButtonStyle } from "../components/dashboard/devices/styleComponents";
import ModalWindow from "../components/modalform";
@ -13,6 +20,11 @@ class Navbar extends Component {
editMode: false,
room: "",
};
this.roomRefs = {};
this.props.rooms.forEach((e) => {
this.roomRefs[e.id] = React.createRef();
});
}
componentDidMount() {
@ -137,6 +149,8 @@ class Navbar extends Component {
{this.props.rooms
? this.props.rooms.map((e, i) => {
if (!this.roomRefs[e.id])
this.roomRefs[e.id] = React.createRef();
return (
<Dropdown.Item
id={e.id}
@ -153,6 +167,14 @@ class Navbar extends Component {
<Grid.Column>{e.name}</Grid.Column>
</Grid.Row>
</Grid>
<ModalWindow
ref={this.roomRefs[e.id]}
type="modify"
nicolaStop={true}
idRoom={e}
updateRoom={this.props.updateRoom}
deleteRoom={this.props.deleteRoom}
/>
</Dropdown.Item>
);
})
@ -167,15 +189,17 @@ class Navbar extends Component {
</Grid.Column>
{this.state.activeItem !== -1 ? (
<Grid.Column width={8}>
<ModalWindow
type="modify"
idRoom={() => {
console.log("MALUSA", this.activeRoom);
return this.activeRoom;
}}
updateRoom={this.props.updateRoom}
deleteRoom={this.props.deleteRoom}
/>
<Button
icon
fluid
labelPosition="left"
onClick={() =>
this.roomRefs[this.state.activeItem].current.openModal()
}
>
<Icon name="pencil" size="small" />
EDIT ROOM
</Button>
</Grid.Column>
) : null}
</Grid.Row>