tvolkmann/smart_garden_server
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

restored submit functionality

Browse Source
This commit is contained in:
Max 2020-07-06 10:54:41 +02:00
parent 5b429e9769
commit f765ba3f63
3 changed files with 39 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
imports/ui/AddPlant.jsx
View File

@ -22,8 +22,8 @@ class AddPlant extends React.Component{
// search for arrow function for further syntax knowledge
handleSubmit = (e) => {
e.preventDefault();
console.log(this.state)
//this.props.addPlant
//console.log(this.state)
this.props.addPlant(this.state)
}

34
imports/ui/Plants.jsx Normal file
View File

@ -0,0 +1,34 @@
import React from 'react'
import { Table } from 'react-bootstrap';
const Plants = ({plants}) => {
return (
<>
{
plants.length !== 0 ?
<Table striped bordered hover>
<thead>
<tr>
<th>Plant name</th>
<th>Plant type</th>
</tr>
</thead>
<tbody>
{
plants.map((plant, index) => {
return <tr key={index}>
<td>{plant.name}</td>
<td>{plant.type}</td>
</tr>
})
}
</tbody>
</Table> : null
}
</>
);
}
export default Plants

30
imports/ui/Settings.jsx
View File

@ -1,5 +1,6 @@
import React from 'react'
import AddPlant from './AddPlant'
import Plants from './Plants'
import { Button, Form, Container, Row, Col, Table } from 'react-bootstrap';
class Settings extends React.Component{
@ -14,7 +15,7 @@ class Settings extends React.Component{
// pass this function to the addplant comp as a prop
addPlant = (plant) => {
plant.id = Math.random(); // rework
plant.id = Math.random(); // TODO rework
let plants = [...this.state.plants, plant]; // create a copy of the array and add the new plant to it
@ -47,32 +48,7 @@ class Settings extends React.Component{
<br></br>
{
this.state.plants.length !== 0?
<Table striped bordered hover>
<thead>
<tr>
<th>Plant name</th>
<th>Plant type</th>
<th>Dirt type</th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
{
this.state.plants.map((plant, index) => {
return <tr key={index}>
<td>{plant[0]}</td>
<td>{plant[1]}</td>
<td>{plant[2]}</td>
</tr>
})
}
</tbody>
</Table>
: null
}
<Plants plants={this.state.plants}></Plants>
</Container>