Laravel 11 E-Commerce Project - Admin Create Coupons Page

Welcome back to the Laravel E-Commerce Project Tutorial. In this video, we will learn about creating an admin coupons page.

Step 1: Create a Function in the AdminController

First, let's create a new function in the AdminController:


public function coupons()
{
        $coupons = Coupon::orderBy(`expiry_date`,`DESC`)->paginate(12);
        return view(`admin.coupons`,compact(`coupons`));
}

Step 2: Create a Route for the Function

Next, create a route for this function:


Route::get('/admin/coupons',[AdminController::class,'coupons'])->name('admin.coupons');

Step 3: Create a View for the Coupons Page

Now, go to the resources directory and create a new view file called coupons.blade.php. In this file, extend the layout:


@extends('layouts.admin')
@section('content')
@endsection

Step 4: Add Content to the Coupons View

Now, go to the template directory and open the coupons.html file in a text editor. Copy the div with the class `main-content` and paste it inside the coupons.blade.php file, within the section:


@extends('layouts.admin')
@section('content')
<style>
    .table-striped  th:nth-child(1), .table-striped  td:nth-child(1) {
        width: 100px;   
    }
    .table-striped  th:nth-child(2), .table-striped  td:nth-child(2) {
        width: 250px;   
    }
</style>
<div class=`main-content-inner`>                            
    <div class=`main-content-wrap`>
        <div class=`flex items-center flex-wrap justify-between gap20 mb-27`>
            <h3>Coupons</h3>
            <ul class=`breadcrumbs flex items-center flex-wrap justify-start gap10`>
                <li>
                    <a href=`{{route('admin.index')}}`>
                        <div class=`text-tiny`>Dashboard</div>
                    </a>
                </li>                                                                           
                <li>
                    <i class=`icon-chevron-right`></i>
                </li>
                <li>
                    <div class=`text-tiny`>All Coupons</div>
                </li>
            </ul>
        </div>
        
        <div class=`wg-box`>
            <div class=`flex items-center justify-between gap10 flex-wrap`>
                <div class=`wg-filter flex-grow`>
                    <form class=`form-search`>
                        <fieldset class=`name`>
                            <input type=`text` placeholder=`Search here...` class=`` name=`name` tabindex=`2` value=`` aria-required=`true` required=``>
                        </fieldset>
                        <div class=`button-submit`>
                            <button class=`` type=`submit`><i class=`icon-search`></i></button>
                        </div>
                    </form>
                </div>
                <a class=`tf-button style-1 w208` href=`{{route('admin.coupon.add')}}`><i class=`icon-plus`></i>Add new</a>
            </div>
            <div class=`wg-table table-all-user`>                
                <div class=`table-responsive`>
                   @if(Session::has('status'))
                        <p class=`alert alert-success`>{{Session::get('status')}}</p>
                    @endif
                    <table class=`table table-striped table-bordered`>
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Code</th>
                                <th>Type</th>
                                <th>Value</th>
                                <th>Cart Value</th>
                                <th>Expiry Date</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($coupons as $coupon)
                            <tr>
                                <td>{{$coupon->id}}</td>
                                <td>{{$coupon->code}}</td>
                                <td>{{$coupon->type}}</td>
                                <td>{{$coupon->value}}</td>
                                <td>{{$coupon->cart_value}}</td>
                                <td>{{$coupon->expiry_date}}</td>
                                <td>
                                    <div class=`list-icon-function`>                                        
                                        <a href=`#`>
                                            <div class=`item edit`>
                                                <i class=`icon-edit-3`></i>
                                            </div>
                                        </a>
                                        <div class=`item text-danger delete`>
                                                <i class=`icon-trash-2`></i>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            @endforeach                                  
                        </tbody>
                    </table>                
            </div>
            </div>
            <div class=`divider`></div>
            <div class=`flex items-center justify-between flex-wrap gap10 wgp-pagination`>                
                {{$coupons->links('pagination::bootstrap-5')}}
            </div>
        </div>
    </div>
</div>
@endsection