Commit 19a331da authored by Martin Fahl's avatar Martin Fahl

changes

parent ac96a63a
......@@ -2,7 +2,7 @@ import React, { Component, Fragment } from "react";
import PropTypes from "prop-types";
import { Filter } from "../../presentational/Filter/Filter";
import { Item } from "../Item/Item";
import { Table, Card, CardBody } from "mdbreact";
import { Card, CardBody, ListGroup } from "mdbreact";
export class InventoryList extends Component {
constructor(props) {
......@@ -25,21 +25,13 @@ export class InventoryList extends Component {
updateFilter={this.updateFilter}
filterTerm={this.state.filterTerm}
/>
<Table small striped>
<thead>
<tr>
<th>Name</th>
<th>Amount</th>
</tr>
</thead>
<tbody>
<ListGroup>
{this.state.items
.filter(items => items.includes(this.state.filterTerm))
.map((name, index) => (
<Item key={index} name={name} />
))}
</tbody>
</Table>
</ListGroup>
</CardBody>
</Card>
);
......
import React, { Component } from "react";
import PropTypes from "prop-types";
import { ListGroupItem, Badge, Fa } from "mdbreact";
export class Item extends Component {
constructor(props) {
......@@ -20,10 +21,24 @@ export class Item extends Component {
render() {
return (
<tr>
<td>{this.props.name}</td>
<td>{this.state.counter}</td>
</tr>
<ListGroupItem>
<div className="row">
<div className="col">
{this.props.name}
</div>
<div className="col">
<Badge color="secondary" className="ml-1 mr-1" onClick={this.increment}><Fa icon="plus-square" aria-hidden="true"/></Badge>
<Badge color="default" className="ml-1 mr-1" pill>{this.state.counter}</Badge>
<Badge color="secondary" className="ml-1 mr-1" onClick={this.decrement}><Fa icon="minus-square" aria-hidden="true"/></Badge>
<Badge color="danger" className="ml-1 mr-1"><Fa icon="trash" aria-hidden="true"/></Badge>
</div>
</div>
</ListGroupItem>
);
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment