building shopping cart

app/Cart.php

+<?php
+
+namespace App;
+
+//use Illuminate\Database\Eloquent\Model;
+
+class Cart /*extends Model*/
+{
+    public $items = null;
+    public $total_qty = 0;
+    public $total_price = 0;
+
+    public function __construct($old_cart)
+    {
+        if ($old_cart) {
+            $this->items = $old_cart->items;
+            $this->total_qty = $old_cart->total_qty;
+            $this->total_price = $old_cart->total_price;
+        }
+    }
+
+    public function addItemToCart($item, $id)
+    {
+        $stored_item = ['qty' => 0, 'price' => $item->price, 'item' => $item];
+        if ($this->items) {
+            if (array_key_exists($id, $this->items)) {
+                $stored_item = $this->items[$id];
+            }
+        }
+
+//        $stored_item = ($this->items && array_key_exists($id, $this->items)) ?
+//                        $stored_item = $this->items[$id] :
+//                        ['qty' => 0, 'price' => $item->price, 'item' => $item];
+
+        $stored_item['qty']++;
+        $stored_item['price'] = $item->price * $stored_item['qty'];
+
+        $this->items[$id] = $stored_item;
+        $this->total_qty++;
+        $this->total_price += $item->price;
+    }
+}

app/Http/Controllers/CartController.php

+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+
+class CartController extends Controller
+{
+    public function index()
+    {
+        return view('cart');
+    }
+}

app/Http/Controllers/ProductController.php

@@ -161,4 +161,9 @@ class ProductController extends Controller
             'type' => 'required'
         ]);
     }
+
+    public function addToCart(Request $request, Product $product)
+    {
+//        return $product;
+    }
 }

app/Product.php

@@ -18,4 +18,6 @@ class Product extends Model
     {
         return route('product.edit', $this);
     }
+
+
 }

public/css/welcome.css

@@ -40,6 +40,8 @@
 
 .product__short-text {
   text-align: center;
+  height: 50px;
+  overflow: hidden;
 }
 
 .product__price {

public/js/welcome.js

+document.querySelector('.products').addEventListener('click', function(e) {
+    if (!e.target.classList.contains('btn-add-to-basket')) return;
+    e.preventDefault();
+
+    const actionUrl = e.target.dataset.action;
+
+    axios.post(actionUrl, {
+        productId: e.target.dataset.product_id
+    })
+    .then(function (response) {
+        console.log(response);
+        const amountInCart = document.querySelector('.amount-in-cart');
+        amountInCart.textContent++;
+    })
+    .catch(function (error) {
+        console.log(error);
+    });
+});

resources/js/app.js

 require('./bootstrap');
+

resources/sass/welcome.scss

@@ -41,6 +41,8 @@
 
     &__short-text {
         text-align: center;
+        height: 50px;
+        overflow: hidden;
     }
 
     &__price {

resources/views/cart.blade.php

+@extends('layouts.app')
+
+@section('content')
+    <div class="container">
+        <div>OLOLO</div>
+    </div>
+@endsection

resources/views/layouts/app.blade.php

@@ -24,5 +24,7 @@
             @yield('content')
         </main>
     </div>
+
+    @yield('script')
 </body>
 </html>

resources/views/layouts/header.blade.php

@@ -12,11 +12,15 @@
 
             <div class="collapse navbar-collapse" id="navbarSupportedContent">
                 <!-- Left Side Of Navbar -->
-                <ul class="navbar-nav mr-auto">
+                <ul class="navbar-nav ml-auto">
+                    <li class="nav-item">
+                        <span class="amount-in-cart"></span>
+                        <a href="{{ route('cart.index') }}">Shopping cart</a>
+                    </li>
                 </ul>
 
                 <!-- Right Side Of Navbar -->
-                <ul class="navbar-nav ml-auto">
+                <ul class="navbar-nav ml-5">
                     <!-- Authentication Links -->
                     @guest
                         <li class="nav-item">

resources/views/welcome.blade.php

@@ -8,7 +8,7 @@
     <section class="products">
         <div class="container">
             <a href="/product/create">Create product</a>
-{{--            @if(isset($products))--}}
+
             <ul class="product-list">
                 @foreach($products as $product)
                     <li class="product-list__item">
@@ -16,23 +16,23 @@
 {{--                            <a href="/product/{{$product->id}}" class="product__image">--}}
                             <a href="{{ $product->path() }}" class="product__image">
                                 <img src="/img/{{$product->type}}.jpg" alt="{{$product->reference}}">
-{{--                                <img--}}
-{{--                                    @if ($product->type === 'Phone' || $product->type === 'Balalaika')--}}
-{{--                                        src="/img/{{$product->type}}.jpg"--}}
-{{--                                    @else--}}
-{{--                                        src="https://placehold.it/150x150"--}}
-{{--                                    @endif--}}
-{{--                                    alt="{{$product->reference}}">--}}
                             </a>
                             <a href="{{ $product->path() }}" class="product__name">{{$product->reference}}</a>
                             <p class="product__short-text">{{$product->description_short}}</p>
                             <p class="product__price">{{$product->price}} EUR</p>
-                            <button class="btn-add-to-basket">Add to basket</button>
+
+                            <button class="btn-add-to-basket btn btn-info"
+                                    data-product_id="{{ $product->id }}"
+                                    data-action="{{ route('product.addToCart', $product) }}"
+                            >Add to basket</button>
                         </div>
                     </li>
                 @endforeach
             </ul>
-{{--            @endif--}}
         </div>
     </section>
 @endsection
+
+@section('script')
+    <script src="js/welcome.js"></script>
+@endsection

routes/web.php

@@ -24,3 +24,8 @@ Route::delete('/product/{product}', 'ProductController@destroy');
 Auth::routes();
 
 Route::get('/home', 'HomeController@index')->name('home');
+
+
+Route::post('/add-to-cart/{product}', 'ProductController@addToCart')->name('product.addToCart');
+
+Route::get('/cart', 'CartController@index')->name('cart.index');