add quantity col

src/App.js

@@ -7,8 +7,7 @@ import Total from './components/total/total'
 class App extends Component {
   state = {
     items: [
-      {id:1, product:'Pen', price:2},
-      {id:2, product:'Book', price:10}
+
     ]
   }
 

src/components/addItem/addItem.js

@@ -3,7 +3,8 @@ import React, {Component} from 'react';
 class addItem extends Component {
     state = {
         product: '',
-        price: ''
+        price: '',
+        quantity:''
     }
 
     handleChange = (e) => {
@@ -18,7 +19,8 @@ class addItem extends Component {
         this.props.add(this.state)
         this.setState({
             product: '',
-            price: ''
+            price: '',
+            quantity:''
         })
     }
 
@@ -28,6 +30,8 @@ class addItem extends Component {
                 <form onSubmit={this.handleSubmit}>
                     <input type="text" value={this.state.product} placeholder="Enter Product" id="product" onChange={this.handleChange} required/>
                     <input type="number" value={this.state.price} placeholder="Enter Price" id="price" onChange={this.handleChange} required/>
+                    <input type="number" value={this.state.quantity} placeholder="Enter Quantity" id="quantity" onChange={this.handleChange} required/>
+
                     <input type="submit" value="Add"/>
                 </form>
             </div>

src/components/item/items.js

@@ -9,6 +9,7 @@ const Items = (props) => {
                 <div key={item.id} className="item">
                     <p>{item.product}</p>
                     <p>{item.price}</p>
+                    <p>{item.quantity}</p>
                     <p className="delete" onClick={() => del(item.id)}>&times;</p>
                 </div>
             )
@@ -21,6 +22,7 @@ const Items = (props) => {
             <div className="header item">
                 <p>Product</p>
                 <p>Price</p>
+                <p>Quantity</p>
                 <p>Edit</p>
             </div>
             {ListItem}

src/components/total/total.js

@@ -4,7 +4,7 @@ const Total = (props) => {
     const {items} = props;
     let total = 0
     for (let i = 0; i < items.length; i++) {
-        total += parseFloat(items[i].price)
+        total += parseFloat(items[i].price *items[i].quantity)
     }
     return (
         <div>