Laravel Home Services Project - Admin Show All Service Providers

In this video, we will learn about displaying all service providers in the admin panel.

Let's see how we can show all service providers in the admin panel.

First, let's create a new Livewire component.

So, switch to the command prompt and run the following command:


php artisan make:livewire admin/AdminServiceProvidersComponent

Now, let's switch to the project and create a route for this component.

So, go to the web.php file and inside the admin middleware route group, create a new route:


Route::get('admin/service-providers',AdminServiceProvidersComponent::class)->name('admin.service_providers');

Now, let's open the AdminServiceProvidersComponent.php class file and add the following code:


<?php

namespace App\Http\Livewire\Admin;

use App\Models\ServiceProvider;
use Livewire\Component;

class AdminServiceProvidersComponent extends Component
{
public function render()
{
$sproviders = ServiceProvider::paginate(12);
return view('livewire.admin.admin-service-providers-component',['sproviders'=>$sproviders])->layout('layouts.base');
}
}

Next, let's open the admin-service-providers-component.blade.php file and write 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 Providers</h1>
<div class="crumbs">
<ul>
<li><a href="/">Home</a></li>
<li>/</li>
<li>Service Providers</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 Providers
</div>
<div class="col-md-6">

</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>Email</th>
<th>Phone</th>
<th>City</th>
<th>Service Category</th>
<th>Service Locations</th>
</tr>
</thead>
<tbody>
@foreach($sproviders as $sprovider)
<tr>
<td>{{$sprovider->id}}</td>
<td><img src="{{asset('images/sproviders')}}/{{$sprovider->image}}" height="60" /> </td>
<td>{{$sprovider->user->name}}</td>
<td>{{$sprovider->user->email}}</td>
<td>{{$sprovider->user->phone}}</td>
<td>{{$sprovider->city}}</td>
<td>{{$sprovider->category->name}}</td>
<td>{{$sprovider->service_locations}}</td>
</tr>
@endforeach
</tbody>
</table>
{{$sproviders->links()}}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>

Now, let's open the ServiceProvider Model and create a function:


public function user()
{
return $this->belongsTo(User::class,'user_id');
}

Now, let's add a link to the admin menu for service providers.

So, go to the base.blade.php layout file and inside the admin menu, add the following code:


<li><a href="{{route('admin.service_providers')}}">All Service Providers</a></li>

Now, it's done. Let's check the result.

Switch to the browser and refresh the page.

Login with admin credentials and inside the admin menu, open the link.

Here, you can see the list of service providers.

If you create another service provider, you can see it added to the list.

So, in this way, you can display all service providers in the admin panel.