Merge branch '95-scene-has-no-customizable-icon' into 'dev'
Resolve "scene has no customizable icon" Closes #95 See merge request sa4-2020/the-sanmarinoes/frontend!117
This commit is contained in:
commit
da120b377e
5 changed files with 30 additions and 2 deletions
|
@ -8,6 +8,7 @@ import {
|
|||
Form,
|
||||
Input,
|
||||
} from "semantic-ui-react";
|
||||
import SelectIcons from "./SelectIcons";
|
||||
import { connect } from "react-redux";
|
||||
import { RemoteService } from "../remote";
|
||||
import { appActions } from "../storeActions";
|
||||
|
@ -20,12 +21,14 @@ class SceneModal extends Component {
|
|||
this.addSceneModal = this.addSceneModal.bind(this);
|
||||
this.modifySceneModal = this.modifySceneModal.bind(this);
|
||||
this.deleteScene = this.deleteScene.bind(this);
|
||||
this.updateIcon = this.updateIcon.bind(this);
|
||||
}
|
||||
|
||||
get initialState() {
|
||||
return {
|
||||
name: this.type === "new" ? "New Scene" : this.props.scene.name,
|
||||
openModal: false,
|
||||
selectedIcon: "home",
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -40,6 +43,7 @@ class SceneModal extends Component {
|
|||
addSceneModal = (e) => {
|
||||
let data = {
|
||||
name: this.state.name,
|
||||
icon: this.state.selectedIcon,
|
||||
};
|
||||
|
||||
this.props
|
||||
|
@ -54,6 +58,7 @@ class SceneModal extends Component {
|
|||
modifySceneModal = (e) => {
|
||||
let data = {
|
||||
name: this.state.name,
|
||||
icon: this.state.selectedIcon,
|
||||
};
|
||||
|
||||
this.props
|
||||
|
@ -86,7 +91,16 @@ class SceneModal extends Component {
|
|||
this.setState({ openModal: true });
|
||||
};
|
||||
|
||||
updateIcon(e) {
|
||||
this.setState({ selectedIcon: e });
|
||||
}
|
||||
|
||||
render() {
|
||||
const spaceDiv = {
|
||||
background: "#f4f4f4",
|
||||
padding: "10px 10px",
|
||||
margin: "10px 0px",
|
||||
};
|
||||
return (
|
||||
<div>
|
||||
{!this.props.nicolaStop ? (
|
||||
|
@ -149,6 +163,15 @@ class SceneModal extends Component {
|
|||
value={this.state.name}
|
||||
/>
|
||||
</Form.Field>
|
||||
<div style={spaceDiv}>
|
||||
<p>Select an icon:</p>
|
||||
<SelectIcons
|
||||
updateIcon={this.updateIcon}
|
||||
currentIcon={
|
||||
this.type === "new" ? "home" : this.props.scene.icon
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</Form>
|
||||
|
||||
{this.type === "modify" ? (
|
||||
|
|
|
@ -454,6 +454,7 @@ export const RemoteService = {
|
|||
return (dispatch) => {
|
||||
data = {
|
||||
name: data.name,
|
||||
icon: data.icon,
|
||||
};
|
||||
|
||||
return (sceneId
|
||||
|
|
|
@ -49,6 +49,7 @@ function reducer(previousState, action) {
|
|||
scenes: {
|
||||
[scene.id]: {
|
||||
name: { $set: scene.name },
|
||||
icon: { $set: scene.icon },
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
|
@ -103,7 +103,7 @@ class Navbar extends Component {
|
|||
<Grid.Column>
|
||||
<Icon name={e.icon} size="small" />
|
||||
</Grid.Column>
|
||||
<Grid.Column width={8}>{e.name}</Grid.Column>
|
||||
<Grid.Column width={11}>{e.name}</Grid.Column>
|
||||
<Grid.Column floated="right">
|
||||
{this.state.editMode ? (
|
||||
<RoomModal id={e.id} />
|
||||
|
|
|
@ -100,7 +100,10 @@ class ScenesNavbar extends Component {
|
|||
>
|
||||
<Grid>
|
||||
<Grid.Row>
|
||||
<Grid.Column width={12}>{e.name}</Grid.Column>
|
||||
<Grid.Column>
|
||||
<Icon name={e.icon} size="small" />
|
||||
</Grid.Column>
|
||||
<Grid.Column width={11}>{e.name}</Grid.Column>
|
||||
<Grid.Column floated="right">
|
||||
{this.state.editMode ? (
|
||||
<SceneModal id={e.id} />
|
||||
|
|
Loading…
Reference in a new issue