Uron/laravelEcomm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Laravel Shopping Cart Tutorial| Add to Cart

Browse Source
This commit is contained in:
UronShrestha 2024-07-04 17:52:47 +05:45
parent f14a8026b5
commit 080094d2dd
5 changed files with 254 additions and 187 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/Http/Controllers/MainController.php
View File

@ -3,6 +3,7 @@
namespace App\Http\Controllers;
use App\Models\User;
use App\Models\Cart;
use App\Models\Products;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;
@ -138,9 +139,19 @@ class MainController extends Controller
return view('blogDetails');
}
public function cart()
public function addToCart(Request $data)
{
return view('cart');
if (session()->has('id')) {
$item = new Cart();
$item->quantity = $data->input('quantity');
$item->productId = $data->input('id');
$item->customerId = session()->get('id');
$item->save();
return redirect()->back()->with('success', 'Item added to cart successfully!');
} else {
return redirect('/login')->with('error', 'Please login to add item to cart!');
}
}
public function checkout()

11
app/Models/Cart.php Normal file
View File

@ -0,0 +1,11 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Cart extends Model
{
use HasFactory;
}

31
database/migrations/2024_07_04_080725_create_carts_table.php Normal file
View File

@ -0,0 +1,31 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('carts', function (Blueprint $table) {
$table->id();
$table->integer('productId')->default(0);
$table->integer('customerId')->default(0);
$table->integer('quantity')->default(0);
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('carts');
}
};

380
resources/views/singleProduct.blade.php
View File

@ -61,12 +61,12 @@
</div>
<div class="tab-pane" id="tabs-3" role="tabpanel">
<div class="product__details__pic__item">
<img src="img/shop-details/product-big.png" alt="">
<img src="{{ URL::asset('uploads/products/' . $products->picture) }}" alt="">
</div>
</div>
<div class="tab-pane" id="tabs-4" role="tabpanel">
<div class="product__details__pic__item">
<img src="img/shop-details/product-big-4.png" alt="">
<img src="{{ URL::asset('uploads/products/' . $products->picture) }}" alt="">
<a href="https://www.youtube.com/watch?v=8PJ3_p7VqHw&list=RD8PJ3_p7VqHw&start_radio=1"
class="video-popup"><i class="fa fa-play"></i></a>
</div>
@ -76,194 +76,203 @@
</div>
</div>
</div>
<div class="product__details__content">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="col-lg-8">
<div class="product__details__text">
<h4>{{ $products->name }}</h4>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star-o"></i>
<span> - 5 Reviews</span>
</div>
<h3>NRs. {{ $products->price }} <span>4000.00</span></h3>
<p>{{ $products->description }}</p>
<div class="product__details__option">
<div class="product__details__option__size">
<span>Size:</span>
<label for="xxl">xxl
<input type="radio" id="xxl">
</label>
<label class="active" for="xl">xl
<input type="radio" id="xl">
</label>
<label for="l">l
<input type="radio" id="l">
</label>
<label for="sm">s
<input type="radio" id="sm">
</label>
<form action="{{ url::to('addToCart') }}" method="post">
@csrf
<div class="product__details__content">
<div class="container">
<div class="row d-flex justify-content-center">
<div class="col-lg-8">
<div class="product__details__text">
<h4>{{ $products->name }}</h4>
<div class="rating">
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star"></i>
<i class="fa fa-star-o"></i>
<span> - 5 Reviews</span>
</div>
<div class="product__details__option__color">
<span>Color:</span>
<label class="c-1" for="sp-1">
<input type="radio" id="sp-1">
</label>
<label class="c-2" for="sp-2">
<input type="radio" id="sp-2">
</label>
<label class="c-3" for="sp-3">
<input type="radio" id="sp-3">
</label>
<label class="c-4" for="sp-4">
<input type="radio" id="sp-4">
</label>
<label class="c-9" for="sp-9">
<input type="radio" id="sp-9">
</label>
</div>
</div>
<div class="product__details__cart__option">
<div class="quantity">
<div class="pro-qty">
<input type="text" value="1">
<h3>NRs. {{ $products->price }} <span>4000.00</span></h3>
<p>{{ $products->description }}</p>
<div class="product__details__option">
<div class="product__details__option__size">
<span>Size:</span>
<label for="xxl">xxl
<input type="radio" id="xxl">
</label>
<label class="active" for="xl">xl
<input type="radio" id="xl">
</label>
<label for="l">l
<input type="radio" id="l">
</label>
<label for="sm">s
<input type="radio" id="sm">
</label>
</div>
<div class="product__details__option__color">
<span>Color:</span>
<label class="c-1" for="sp-1">
<input type="radio" id="sp-1">
</label>
<label class="c-2" for="sp-2">
<input type="radio" id="sp-2">
</label>
<label class="c-3" for="sp-3">
<input type="radio" id="sp-3">
</label>
<label class="c-4" for="sp-4">
<input type="radio" id="sp-4">
</label>
<label class="c-9" for="sp-9">
<input type="radio" id="sp-9">
</label>
</div>
</div>
<a href="#" class="primary-btn">add to cart</a>
</div>
<div class="product__details__btns__option">
<a href="#"><i class="fa fa-heart"></i> add to wishlist</a>
<a href="#"><i class="fa fa-exchange"></i> Add To Compare</a>
</div>
<div class="product__details__last__option">
<h5><span>Guaranteed Safe Checkout</span></h5>
<img src="img/shop-details/details-payment.png" alt="">
<ul>
<li><span>SKU:</span> 3812912</li>
<li><span>Categories:</span> Clothes</li>
<li><span>Tag:</span> Clothes, Skin, Body</li>
</ul>
<div class="product__details__cart__option">
<div class="quantity">
<input type="number" name="quantity" class="form-control" min="1"
max="{{ $products->quantity }}" value="1">
<input type="hidden" name="id" value="{{ $products->id }}">
</div>
<button type="submit" name="addToCart" class="primary-btn">Add to Cart</button>
</div>
<div class="product__details__btns__option">
<a href="#"><i class="fa fa-heart"></i> add to wishlist
</a>
<a href="#"><i class="fa fa-exchange"></i> Add To Compare</a>
</div>
<div class="product__details__last__option">
<h5><span>Guaranteed Safe Checkout</span></h5>
<img src="{{ url::asset('img/shop-details/details-payment.png') }}" alt="">
<ul>
<li><span>SKU:</span> 3812912</li>
<li><span>Categories:</span> Clothes</li>
<li><span>Tag:</span> Clothes, Skin, Body</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="product__details__tab">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#tabs-5"
role="tab">Description</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tabs-6" role="tab">Customer
Previews(5)</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tabs-7" role="tab">Additional
information</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tabs-5" role="tabpanel">
<div class="product__details__tab__content">
<p class="note">Nam tempus turpis at metus scelerisque placerat nulla deumantos
solicitud felis. Pellentesque diam dolor, elementum etos lobortis des mollis
ut risus. Sedcus faucibus an sullamcorper mattis drostique des commodo
pharetras loremos.</p>
<div class="product__details__tab__content__item">
<h5>Products Infomation</h5>
<p>A Pocket PC is a handheld computer, which features many of the same
capabilities as a modern PC. These handy little devices allow
individuals to retrieve and store e-mail messages, create a contact
file, coordinate appointments, surf the internet, exchange text messages
and more. Every product that is labeled as a Pocket PC must be
accompanied with specific software to operate the unit and must feature
a touchscreen and touchpad.</p>
<p>As is the case with any new technology product, the cost of a Pocket PC
was substantial during it’s early release. For approximately $700.00,
consumers could purchase one of top-of-the-line Pocket PCs in 2003.
These days, customers are finding that prices have become much more
reasonable now that the newness is wearing off. For approximately
$350.00, a new Pocket PC can now be purchased.</p>
</div>
<div class="product__details__tab__content__item">
<h5>Material used</h5>
<p>Polyester is deemed lower quality due to its none natural quality’s. Made
from synthetic materials, not natural like wool. Polyester suits become
creased easily and are known for not being breathable. Polyester suits
tend to have a shine to them compared to wool and cotton suits, this can
make the suit look cheap. The texture of velvet is luxurious and
breathable. Velvet is a great choice for dinner party jacket and can be
worn all year round.</p>
<div class="row">
<div class="col-lg-12">
<div class="product__details__tab">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#tabs-5"
role="tab">Description</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tabs-6" role="tab">Customer
Previews(5)</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tabs-7" role="tab">Additional
information</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tabs-5" role="tabpanel">
<div class="product__details__tab__content">
<p class="note">Nam tempus turpis at metus scelerisque placerat nulla
deumantos
solicitud felis. Pellentesque diam dolor, elementum etos lobortis des mollis
ut risus. Sedcus faucibus an sullamcorper mattis drostique des commodo
pharetras loremos.</p>
<div class="product__details__tab__content__item">
<h5>Products Infomation</h5>
<p>A Pocket PC is a handheld computer, which features many of the same
capabilities as a modern PC. These handy little devices allow
individuals to retrieve and store e-mail messages, create a contact
file, coordinate appointments, surf the internet, exchange text messages
and more. Every product that is labeled as a Pocket PC must be
accompanied with specific software to operate the unit and must feature
a touchscreen and touchpad.</p>
<p>As is the case with any new technology product, the cost of a Pocket PC
was substantial during it’s early release. For approximately $700.00,
consumers could purchase one of top-of-the-line Pocket PCs in 2003.
These days, customers are finding that prices have become much more
reasonable now that the newness is wearing off. For approximately
$350.00, a new Pocket PC can now be purchased.</p>
</div>
<div class="product__details__tab__content__item">
<h5>Material used</h5>
<p>Polyester is deemed lower quality due to its none natural quality’s. Made
from synthetic materials, not natural like wool. Polyester suits become
creased easily and are known for not being breathable. Polyester suits
tend to have a shine to them compared to wool and cotton suits, this can
make the suit look cheap. The texture of velvet is luxurious and
breathable. Velvet is a great choice for dinner party jacket and can be
worn all year round.</p>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tabs-6" role="tabpanel">
<div class="product__details__tab__content">
<div class="product__details__tab__content__item">
<h5>Products Infomation</h5>
<p>A Pocket PC is a handheld computer, which features many of the same
capabilities as a modern PC. These handy little devices allow
individuals to retrieve and store e-mail messages, create a contact
file, coordinate appointments, surf the internet, exchange text messages
and more. Every product that is labeled as a Pocket PC must be
accompanied with specific software to operate the unit and must feature
a touchscreen and touchpad.</p>
<p>As is the case with any new technology product, the cost of a Pocket PC
was substantial during it’s early release. For approximately $700.00,
consumers could purchase one of top-of-the-line Pocket PCs in 2003.
These days, customers are finding that prices have become much more
reasonable now that the newness is wearing off. For approximately
$350.00, a new Pocket PC can now be purchased.</p>
</div>
<div class="product__details__tab__content__item">
<h5>Material used</h5>
<p>Polyester is deemed lower quality due to its none natural quality’s. Made
from synthetic materials, not natural like wool. Polyester suits become
creased easily and are known for not being breathable. Polyester suits
tend to have a shine to them compared to wool and cotton suits, this can
make the suit look cheap. The texture of velvet is luxurious and
breathable. Velvet is a great choice for dinner party jacket and can be
worn all year round.</p>
<div class="tab-pane" id="tabs-6" role="tabpanel">
<div class="product__details__tab__content">
<div class="product__details__tab__content__item">
<h5>Products Infomation</h5>
<p>A Pocket PC is a handheld computer, which features many of the same
capabilities as a modern PC. These handy little devices allow
individuals to retrieve and store e-mail messages, create a contact
file, coordinate appointments, surf the internet, exchange text messages
and more. Every product that is labeled as a Pocket PC must be
accompanied with specific software to operate the unit and must feature
a touchscreen and touchpad.</p>
<p>As is the case with any new technology product, the cost of a Pocket PC
was substantial during it’s early release. For approximately $700.00,
consumers could purchase one of top-of-the-line Pocket PCs in 2003.
These days, customers are finding that prices have become much more
reasonable now that the newness is wearing off. For approximately
$350.00, a new Pocket PC can now be purchased.</p>
</div>
<div class="product__details__tab__content__item">
<h5>Material used</h5>
<p>Polyester is deemed lower quality due to its none natural quality’s. Made
from synthetic materials, not natural like wool. Polyester suits become
creased easily and are known for not being breathable. Polyester suits
tend to have a shine to them compared to wool and cotton suits, this can
make the suit look cheap. The texture of velvet is luxurious and
breathable. Velvet is a great choice for dinner party jacket and can be
worn all year round.</p>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tabs-7" role="tabpanel">
<div class="product__details__tab__content">
<p class="note">Nam tempus turpis at metus scelerisque placerat nulla deumantos
solicitud felis. Pellentesque diam dolor, elementum etos lobortis des mollis
ut risus. Sedcus faucibus an sullamcorper mattis drostique des commodo
pharetras loremos.</p>
<div class="product__details__tab__content__item">
<h5>Products Infomation</h5>
<p>A Pocket PC is a handheld computer, which features many of the same
capabilities as a modern PC. These handy little devices allow
individuals to retrieve and store e-mail messages, create a contact
file, coordinate appointments, surf the internet, exchange text messages
and more. Every product that is labeled as a Pocket PC must be
accompanied with specific software to operate the unit and must feature
a touchscreen and touchpad.</p>
<p>As is the case with any new technology product, the cost of a Pocket PC
was substantial during it’s early release. For approximately $700.00,
consumers could purchase one of top-of-the-line Pocket PCs in 2003.
These days, customers are finding that prices have become much more
reasonable now that the newness is wearing off. For approximately
$350.00, a new Pocket PC can now be purchased.</p>
</div>
<div class="product__details__tab__content__item">
<h5>Material used</h5>
<p>Polyester is deemed lower quality due to its none natural quality’s. Made
from synthetic materials, not natural like wool. Polyester suits become
creased easily and are known for not being breathable. Polyester suits
tend to have a shine to them compared to wool and cotton suits, this can
make the suit look cheap. The texture of velvet is luxurious and
breathable. Velvet is a great choice for dinner party jacket and can be
worn all year round.</p>
<div class="tab-pane" id="tabs-7" role="tabpanel">
<div class="product__details__tab__content">
<p class="note">Nam tempus turpis at metus scelerisque placerat nulla
deumantos
solicitud felis. Pellentesque diam dolor, elementum etos lobortis des mollis
ut risus. Sedcus faucibus an sullamcorper mattis drostique des commodo
pharetras loremos.</p>
<div class="product__details__tab__content__item">
<h5>Products Infomation</h5>
<p>A Pocket PC is a handheld computer, which features many of the same
capabilities as a modern PC. These handy little devices allow
individuals to retrieve and store e-mail messages, create a contact
file, coordinate appointments, surf the internet, exchange text messages
and more. Every product that is labeled as a Pocket PC must be
accompanied with specific software to operate the unit and must feature
a touchscreen and touchpad.</p>
<p>As is the case with any new technology product, the cost of a Pocket PC
was substantial during it’s early release. For approximately $700.00,
consumers could purchase one of top-of-the-line Pocket PCs in 2003.
These days, customers are finding that prices have become much more
reasonable now that the newness is wearing off. For approximately
$350.00, a new Pocket PC can now be purchased.</p>
</div>
<div class="product__details__tab__content__item">
<h5>Material used</h5>
<p>Polyester is deemed lower quality due to its none natural quality’s. Made
from synthetic materials, not natural like wool. Polyester suits become
creased easily and are known for not being breathable. Polyester suits
tend to have a shine to them compared to wool and cotton suits, this can
make the suit look cheap. The texture of velvet is luxurious and
breathable. Velvet is a great choice for dinner party jacket and can be
worn all year round.</p>
</div>
</div>
</div>
</div>
@ -272,7 +281,7 @@
</div>
</div>
</div>
</div>
</form>
</section>
<!-- Shop Details Section End -->
@ -287,7 +296,8 @@
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 col-sm-6">
<div class="product__item">
<div class="product__item__pic set-bg" data-setbg="{{ url::asset('img/product/product-1.jpg') }}">
<div class="product__item__pic set-bg"
data-setbg="{{ url::asset('img/product/product-1.jpg') }}">
<span class="label">New</span>
<ul class="product__hover">
<li><a href="#"><img src="{{ url::asset('img/icon/heart.png') }}"
@ -326,7 +336,8 @@
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col-sm-6">
<div class="product__item">
<div class="product__item__pic set-bg" data-setbg="{{url::asset('img/product/product-2.jpg')}}">
<div class="product__item__pic set-bg"
data-setbg="{{ url::asset('img/product/product-2.jpg') }}">
<ul class="product__hover">
<li><a href="#"><img src="{{ url::asset('img/icon/heart.png') }}"
alt=""></a></li>
@ -364,7 +375,8 @@
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col-sm-6">
<div class="product__item sale">
<div class="product__item__pic set-bg" data-setbg="{{url::asset('img/product/product-3.jpg')}}">
<div class="product__item__pic set-bg"
data-setbg="{{ url::asset('img/product/product-3.jpg') }}">
<span class="label">Sale</span>
<ul class="product__hover">
<li><a href="#"><img src="{{ url::asset('img/icon/heart.png') }}"

4
routes/web.php
View File

@ -8,7 +8,9 @@ Route::get('/', [MainController::class, 'index']);
Route::get('/about', [MainController::class, 'about']);
Route::get('/blog', [MainController::class, 'blog']);
Route::get('/blogDetails', [MainController::class, 'blogDetails']);
Route::get('/cart', [MainController::class, 'cart']);
Route::post('/addToCart', [MainController::class, 'addToCart']);
Route::get('/checkout', [MainController::class, 'checkout']);
Route::get('/main', [MainController::class, 'main']);