Carrito de Compra Laravel

Carrito de Compra o Shopping Cart en Laravel

VIDEO Carrito de Compra o Shopping Cart en Laravel

Instalación del Paquete DarrylCode para implementar un carrito de compra en Laravel

¿Cómo programar un carrito de compra o shopping cart en Laravel?

Bien, implementar un carrito de compra en una aplicación web sin usar Laravel  es necesario escribir código en PHP muy extenso. 

Laravel nos facilita este proceso con el uso de paquetes de terceros que tiene el desarrollo y la lógica implementandos y que podemos adecuar a nuestro desarrollo ya sea en un proyecto personal o profesional.

Luego, un carrito de compra nos permite ir acumulando en sesiones o cookies los productos que hayamos elegido para finalmente mostrar el detalle en una lista de productos con atributos como:

  • El numero u orden de Item
  • El nombre del producto
  • Una foto
  • Precio
  • Cantidad del producto

Finalmente  nos permite tener los cálculos  de los precios totales, Impuestos.

Bien ahora empecemos a implementar un carrito de compra en una aplicación Laravel

Contextualizando, debemos tener instalado Laravel con la configuración a una base de datos MYSQL. Además de haber implementando un modelo Productos con su correspodiente migración. Incluimos Bootstrap y la distribución de las plantillas Blade correspondientes.

Paso 1. Desde el perfil del Paquete en GitHub https://github.com/darryldecode/laravelshoppingcart podemos acceder a el proceso de configuración de dicho paquete.

En la terminal digitar el siguiente comando Artisan y presionar enter:

composer require "darryldecode/cart"

Luego realizar la configuración en el archivo config/app.php

  1. Abrimos config/app.php y agregamos la siguiente linea en provider.: Darryldecode\Cart\CartServiceProvider::class
  2. Agremos el siguiente alias: 'Cart' => Darryldecode\Cart\Facades\CartFacade::class
  3. Opcionalmente podemos configurar: php artisan vendor:publish --provider="Darryldecode\Cart\CartServiceProvider" --tag="config"

Finalmente pues ya tenemos instalado el paquete listo para usar.

MOSTRAR LOS PRODUCTOS 

CONTROLLER:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use App\Producto;

class FrontController extends Controller
{

    public function index(){

        $productos    =   Producto::all();
        return view('welcome',compact('productos'));

    }
}

VISTA:

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
       <div class="col-sm-3 bg-light">
           @if (count(Cart::getContent()))
               <a href="{{route('cart.checkout')}}"> VER CARRITO <span class="badge badge-danger">{{count(Cart::getContent())}}</span></a>
           @endif

       </div>
       <div class="col-sm-9">
            <div class="row  justify-content-center">
                @forelse ($productos as $item)
                <div class="col-4 border p-5 mt-5 text-center">
                    <h1>{{$item->nombre}}</h1>
                    <P>$ {{$item->precio}}</P>
                    <form action="{{route('cart.add')}}" method="post">
                        @csrf
                        <input type="hidden" name="producto_id" value="{{$item->id}}">
                        <input type="submit" name="btn"  class="btn btn-success" value="ADD TO CART">
                    </form>
                </div>
            @empty
                
            @endforelse
            </div>
       </div>
    </div>
</div>
@endsection

RUTA:

Route::get('/', 'FrontController@index' );

 

 

CARRITO DE COMPRA:

Nuestro Controller tiene el siguiente código:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Cart;
use App\Producto;


class CartController extends Controller
{
    
    public function add(Request $request){
       
        $producto = Producto::find($request->producto_id);

        Cart::add(
            $producto->id, 
            $producto->nombre, 
            $producto->precio, 
            1,
            array("urlfoto"=>$producto->urlfoto)
           
        );
        return back()->with('success',"$producto->nombre ¡se ha agregado con éxito al carrito!");
   
    }

    public function cart(){
        
        return view('checkout');
    }

    public function removeitem(Request $request) {
        //$producto = Producto::where('id', $request->id)->firstOrFail();
        Cart::remove([
        'id' => $request->id,
        ]);
        return back()->with('success',"Producto eliminado con éxito de su carrito.");
    }

    public function clear(){
        Cart::clear();
        return back()->with('success',"The shopping cart has successfully beed added to the shopping cart!");
    }

}

Definimos nuestras rutas en route/web.php


Route::post('/cart-add',    'CartController@add')->name('cart.add');

Route::get('/cart-checkout','CartController@cart')->name('cart.checkout');

Route::post('/cart-clear',  'CartController@clear')->name('cart.clear');

Route::post('/cart-removeitem',  'CartController@removeitem')->name('cart.removeitem');

Las vistas tienen el siguiente código:

Vista  checkout

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
       <div class="col-sm-12 bg-light">
           @if (count(Cart::getContent()))
            <table class="table table-striped">
                <thead>
                    <th>ID</th>
                    <th>NOMBRE</th>
                    <th>PRECIO</th>
                    <th>CANTIDAD</th>
                </thead>
                <tbody>
                    @foreach (Cart::getContent() as $item)
                        <tr>
                            <td>{{$item->id}}</td>
                            <td>{{$item->name}}</td>
                            <td>{{$item->price}}</td>
                            <td>{{$item->quantity}}</td>
                            <td>
                                <form action="{{route('cart.removeitem')}}" method="POST">
                                    @csrf
                                    <input type="hidden" name="id" value="{{$item->id}}">
                                    <button type="submit" class="btn btn-link btn-sm text-danger">x</button>
                                </form>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>

            @else
                <p>Carrito vacio</p>
           @endif

       </div>
       
    </div>
</div>
@endsection

 

Compártelo...talvez alguién lo necesite!

Whatsapp Messenger Facebook Twitter

Visitado 822 veces | Publicado hace 2 meses

Curso Laravel 8 Página Web 100% Administrable

Mira el temario del curso en el siguiente link

VER MÁS DETALLES DEL CURSO

Logo Codea App

Develop your code

Perú, México, Colombia, España, Venezuela, Argentina, Bolivia

© Todos los derechos reservados CODEA APP | Cursos de programación avanzados con proyectos reales | 2020