In this video we are going to learn about how to create Admin Service Categories Page.
So let see how can we create services Categories page for the Admin.
Now lets create a new livewire component for categories
Switch to the command prompt
And for creating the livewire component
Type the following command and press enter
Alright component created now switch to the project And lets create the route for the category component
So go inside the routes directory then open web.php file
Inside the admin middleware group
Lets create the route
Now open the base layout file
So go inside the resources directory then views -> layouts
from here open base.blade.php
Inside this layout file lets find the admin menu
and before the logout link lets create link for the Service category
Now lets open the Categories Component Class file and add set the layout
Now import the WithPagination and use inside the class as following
Alright now open admin-category-component view file add the following code
Now its done lets check it
So first of all run the application
Switch to the command prompt and type the command
Now switch to the browser and refresh the page
Inside the admin menu you can see here the category link now click on it
Now you see here the categories
So in this way you can create Admin Service Category Page.
So let see how can we create services Categories page for the Admin.
Now lets create a new livewire component for categories
Switch to the command prompt
And for creating the livewire component
Type the following command and press enter
php artisan make:livewire admin/AdminServiceCategoryComponent
Alright component created now switch to the project And lets create the route for the category component
So go inside the routes directory then open web.php file
Inside the admin middleware group
Lets create the route
Route::get('/admin/service-categories',AdminServiceCategoryComponent::class)->name('admin.service_categories');
Now open the base layout file
So go inside the resources directory then views -> layouts
from here open base.blade.php
Inside this layout file lets find the admin menu
and before the logout link lets create link for the Service category
<li><a href=\"{{route('admin.service_categories')}}\">Service Categories</a></li>
Now lets open the Categories Component Class file and add set the layout
return view('livewire.admin.admin-service-category-component’)->layout('layouts.base');
Now import the WithPagination and use inside the class as following
<?php
namespace App\\Http\\Livewire\\Admin;
use App\\Models\\ServiceCategory;
use Livewire\\Component;
use Livewire\\WithPagination;
class AdminServiceCategoryComponent extends Component
{
use WithPagination;
public function render()
{
$scategories = ServiceCategory::paginate(10);
return view('livewire.admin.admin-service-category-component',['scategories'=>$scategories])->layout('layouts.base');
}
}
Alright now open admin-category-component view file add the following code
<div>
<style>
nav svg{
height: 20px;
}
nav .hidden{
display: block !important;
}
</style>
<div class=\"section-title-01 honmob\">
<div class=\"bg_parallax image_02_parallax\"></div>
<div class=\"opacy_bg_02\">
<div class=\"container\">
<h1>Service Categories</h1>
<div class=\"crumbs\">
<ul>
<li><a href=\"/\">Home</a></li>
<li>/</li>
<li>Service Categories</li>
</ul>
</div>
</div>
</div>
</div>
<section class=\"content-central\">
<div class=\"content_info\">
<div class=\"paddings-mini\">
<div class=\"container\">
<div class=\"row portfolioContainer\">
<div class=\"col-md-12 profile1\">
<div class=\"panel panel-default\">
<div class=\"panel-heading\">
<div class=\"row\">
<div class=\"col-md-6\">
All Service Categories
</div>
<div class=\"col-md-6\">
<a href=\"{{route('admin.add_service_category')}}\" class=\"btn btn-info pull-right\">Add New</a>
</div>
</div>
</div>
<div class=\"panel-body\">
@if(Session::has('message'))
<div class=\"alert alert-success\" role=\"alert\">{{Session::get('message')}}</div>
@endif
<table class=\"table table-striped\">
<thead>
<tr>
<th>#</th>
<th>Image</th>
<th>Name</th>
<th>Slug</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@foreach($scategories as $scategory)
<tr>
<td>{{$scategory->id}}</td>
<td><img src=\"{{asset('images/categories')}}/{{$scategory->image}}\" height=\"60\" /> </td>
<td>{{$scategory->name}}</td>
<td>{{$scategory->slug}}</td>
<td>
<a href=\"{{route('admin.services_by_category',['category_slug'=>$scategory->slug])}}\" style=\"margin-right: 10px;\"><i class=\"fa fa-list fa-2x text-info\"></i></a>
<a href=\"{{route('admin.edit_service_category',['category_id'=>$scategory->id])}}\"><i class=\"fa fa-edit fa-2x text-info\"></i></a>
<a href=\"#\" onclick=\"confirm('Are you sure, you want to delete this service category!') || event.stopImmediatePropagation()\" wire:click.prevent=\"deleteServiceCategory({{$scategory->id}})\" style=\"margin-left:10px;\"><i class=\"fa fa-times fa-2x text-danger\"></i></a>
</td>
</tr>
@endforeach
</tbody>
</table>
{{$scategories->links()}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
Now its done lets check it
So first of all run the application
Switch to the command prompt and type the command
Php artisan serve
Now switch to the browser and refresh the page
Inside the admin menu you can see here the category link now click on it
Now you see here the categories
So in this way you can create Admin Service Category Page.
