In Laravel 8 pagination how to show less number of pages and also how to add "First Page" and "Last Page"
Now in Laravel when we have more data, it will show the pagination like this:
But I want my pagination to be like the images given below:
Or
To customizing the pagination view, run below command in console
php artisan vendor:publish --tag=laravel-pagination
in /resources/views/vendor/pagination/bootstrap-4.blade.php add bellow code.
<ul class="pagination">
#if ($paginator->onFirstPage())
<li class="page-item disabled" aria-disabled="true" aria-label="#lang('pagination.first')">
<span class="page-link" aria-hidden="true">«</span>
</li>
#else
<li class="page-item">
<a class="page-link" href="{{ \Request::url() }}" rel="prev" aria-label="#lang('pagination.first')">«</a>
</li>
#endif
...
#if ($paginator->hasMorePages())
<li class="page-item">
<a class="page-link" href="{{ \Request::url().'?page='.$paginator->lastPage() }}" rel="last" aria-label="#lang('pagination.last')">»</a>
</li>
#else
<li class="page-item disabled" aria-disabled="true" aria-label="#lang('pagination.last')">
<span class="page-link" aria-hidden="true">»</span>
</li>
#endif
</ul>
<?php
class MyPresenter extends Illuminate\Pagination\BootstrapPresenter {
public function render()
{
if ($this->currentPage == 1) {
$content = $this->getPageRange(1, $this->currentPage + 2);
}
else if ($this->currentPage >= $this->lastPage) {
$content = $this->getPageRange($this->currentPage - 2, $this->lastPage);
}
else {
$content = $this->getPageRange($this->currentPage - 1, $this->currentPage + 1);
}
return $this->getFirst().$this->getPrevious('‹').$content.$this->getNext('›').$this->getLast();
}
public function getFirst($text = '«')
{
if ($this->currentPage <= 1)
{
return $this->getDisabledTextWrapper($text);
}
else
{
$url = $this->paginator->getUrl(1);
return $this->getPageLinkWrapper($url, $text);
}
}
public function getLast($text = '»')
{
if ($this->currentPage >= $this->lastPage)
{
return $this->getDisabledTextWrapper($text);
}
else
{
$url = $this->paginator->getUrl($this->lastPage);
return $this->getPageLinkWrapper($url, $text);
}
}
}
Related
Route report.expAlert error
(View: /home/grocersa/edesimarket.com/resources/views/layout/main.blade.php
(i defined all place but not triggered plz help to find out)
This is my web.php file coding
Route::get('report/product_quantity_alert', 'ReportController#productQuantityAlert')->name('report.qtyAlert');
Route::get('report/product_expiry_alert', 'ReportController#productExpiryAlert')->name('report.expAlert');
Route::get('report/warehouse_stock', 'ReportController#warehouseStock')->name('report.warehouseStock');
This my main.blade.php coding
for sidebar (nav - menu )
#if($product_exp_alert_active)
<li id="expAlert-report-menu">
{{trans('file.Product Expiry Alert')}}
</li>
#endif
for user permission
#if($product_qty_alert_active || $product_exp_alert_active)
for database & roll permission
$product_qty_alert_active = DB::table('permissions')
->join('role_has_permissions', 'permissions.id', '=', 'role_has_permissions.permission_id')
->where([
['permissions.name', 'product-qty-alert'],
['role_id', $role->id] ])->first();
$product_exp_alert_active = DB::table('permissions')
->join('role_has_permissions', 'permissions.id', '=', 'role_has_permissions.permission_id')
->where([
['permissions.name', 'product-exp-alert'],
['role_id', $role->id] ])->first();
for define
#if($alert_product > 0)
<li class="nav-item">
<a rel="nofollow" data-target="#" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link dropdown-item"><i class="dripicons-bell"></i><span class="badge badge-danger">{{$alert_product}}</span>
</a>
<ul class="dropdown-menu edit-options dropdown-menu-right dropdown-default notifications" user="menu">
<li class="notifications">
{{$alert_product}} product exceeds alert quantity
</li>
<li class="notifications">
{{$alert_product}} product expiry alert
</li>
</ul>
</li>
#endif
This is my reportcontroller.php coding
class ReportController extends Controller
{
public function productQuantityAlert()
{
$role = Role::find(Auth::user()->role_id);
if($role->hasPermissionTo('product-qty-alert')){
$lims_product_data = Product::select('name','code', 'image', 'qty', 'alert_quantity')->where('is_active', true)->whereColumn('alert_quantity', '>', 'qty')->get();
return view('report.qty_alert_report', compact('lims_product_data'));
}
else
return redirect()->back()->with('not_permitted', 'Sorry! You are not allowed to access this module');
}
public function productExpiryAlert()
{
$role = Role::find(Auth::user()->role_id);
if($role->hasPermissionTo('product-exp-alert')){
$lims_product_data = Product::select('name','code', 'image', 'qty', 'alert_expiry')->where('is_active', true)->whereColumn('alert_expiry', '>', 'name')->get();
return view('report.exp_alert_report', compact('lims_product_data'));
}
else
return redirect()->back()->with('not_permitted', 'Sorry! You are not allowed to access this module');
}
I am working on getting messages history from ClickSend API, I am trying to message from it API as there documentation. But pagination doesn't work. It's only getting the first 15 recorded. Not getting page number as parameter what I send it. Anyone know how does it do? Can I know where I am wrong?
This is my controller Method.
public function index(Request $request)
{
$config = ClickSend\Configuration::getDefaultConfiguration()
->setUsername('user-name')
->setPassword('password');
$apiInstance = new ClickSend\Api\SMSApi(new GuzzleHttp\Client(),$config);
$page = $request->page ? $request->page: 1; // int | Page number
$limit = 10; // int | Number of records per page
try {
$result = $apiInstance->smsHistoryGet($page, $limit);
$dt = json_decode($result);
$current_page = $dt->data;
$current_page = $current_page->current_page;
$next_page = $current_page+1;
$prev_page = $current_page == 1 ? null : $current_page-1;
$allMessages = $dt->data->data;
return response()->json(['data' => view('staff.history.table', compact('allMessages', 'current_page', 'next_page', 'prev_page'))->render()]);
} catch (Exception $e) {
echo 'Exception when calling SMSApi->smsHistoryGet: ', $e->getMessage(), PHP_EOL;
}
}
This is my blade files
<table id="sms-table" class="table table-hover datatable-User">
<thead>
<th>Date</th>
<th>From</th>
<th>Message</th>
<th>Status</th>
</thead>
<tbody>
#foreach($allMessages as $item)
#if($item->status == "Received")
<tr>
#php $date = \Carbon\Carbon::createFromTimestamp($item->date ) #endphp
<td>{{$date->toDayDateTimeString()}}</td>
<td>{{$item->from}}</td>
<td>{{$item->body}}</td>
<td><span class="badge badge-success">{{$item->status}}</span> </td>
</tr>
#endif
#endforeach
</tbody>
</table>
<div class="mt-5">
<nav aria-label="Page navigation example">
<ul class="pagination justify-content-center">
<li class="page-item {{$prev_page == null ? 'disabled' : ''}}" data-page="{{$prev_page == null ? null : $prev_page }}">
<a class="page-link" {{$prev_page == null ? 'disabled' : ''}} href="" tabindex="-1">Previous</a>
</li>
{{-- <li class="page-item"><a class="page-link" >1</a></li>--}}
{{-- <li class="page-item"><a class="page-link">2</a></li>--}}
{{-- <li class="page-item"><a class="page-link">3</a></li>--}}
<li class="page-item" data-page="{{$next_page == null ? null : $next_page }}">
<a class="page-link" href="#">Next</a>
</li>
</ul>
</nav>
</div>
<script>
$('.page-item').on('click', function () {
var page = $(this).data('page')
$.ajax({
url: 'maindomain/api/all-inbound?page=' + page,
type: 'GET',
success: function (data) {
$('#sms-data').html(data.data);
},
});
})
</script>
im making a posts page and the thing in focus is pagination.
I've created a pagination component that looks like this:
<template>
<nav aria-label="Pagination">
<ul class="pagination justify-content-end">
<li class="page-item" v-if="currentPage !== 1">
<a #click="previous" class="page-link" href="javascript:void(0)" tabindex="-1">Previous</a>
</li>
<li v-for="page in getNumberOfPagesShow"
v-bind:class="{ disabled: page === currentPage }"
class="page-item">
<a #click="clickPage(page)" class="page-link" href="javascript:void(0)">
{{ page }}
</a>
</li>
<li class="page-item" v-if="currentPage !== totalPages">
<a #click="next" class="page-link" href="javascript:void(0)">Next</a>
</li>
</ul>
</nav>
</template>
<script>
export default {
name: "pagination",
props: ['app', 'onClickPage', 'totalPages', 'page'],
data()
{
return {
currentPage: this.page,
lastPage: 0
}
},
computed: {
getNumberOfPagesShow()
{
if (this.totalPages > 10)
{
return 10;
}
return this.totalPages;
}
},
methods: {
previous()
{
this.currentPage--;
this.clickPage(this.currentPage);
},
next()
{
this.currentPage++;
this.clickPage(this.currentPage);
},
clickPage(page)
{
this.currentPage = page;
this.onClickPage(page);
}
}
}
</script>
<style scoped>
</style>
and the component is called using
<!-- Pagination Top -->
<pagination :total-pages="thread.posts.last_page"
:page="app.$route.query.page"
style="margin-top: 20px;"
:on-click-page="clickPage">
</pagination>
Everything works, except the :page="app.$route.query.page" attribute, which sets the currentPage inside the pagination component.
Now, this code doesn't work:
<li class="page-item" v-if="currentPage !== 1">
<a #click="previous" class="page-link" href="javascript:void(0)" tabindex="-1">Previous</a>
</li>
It's supposed to hide the previous button if current page is 1. However, this doesn't work, suggesting that app.$route.query.page is not getting the value correctly.
When I debug inside the created() method, I write
console.log(this.app.$route.query.page)
it does return the correct value. So I don't know what the problem is.
Thank you in advance!
Great, the solution was to parse the prop page into int:
data()
{
return {
currentPage: parseInt(this.page),
lastPage: 0
}
},
I am trying to pass the page id through the url Here is my code,problem is i will not get the required page id to the page only get the path . Please help.
View Page
<li>
<i class="fa fa-table fa-fw"></i>Hotel 1
</li>
<li>
<i class="fa fa-table fa-fw"></i>Hotel 2
</li>
Controller Page
public function view()
{
echo $page_id =$this->uri->segment(1);
$this->load->helper('url');
$data['offers_name'] = $this->Login_set->get_offer($id);
$data['offers_description'] = $data['offers_name']['offers_description'];
$this->load->view('App_stay/pages/hotel1_offers.php');
}
public function view1()
{
echo $page_id =$this->uri->segment(2);
$this->load->helper('url');
$data['offers_name'] = $this->Login_set->get_offer($id);
$data['offers_description'] = $data['offers_name']['offers_description'];
$this->load->view('App_stay/pages/hotel2_offers.php');
}
Change this:
<li>
<i class="fa fa-table fa-fw"></i>Hotel 1
</li>
<li>
<i class="fa fa-table fa-fw"></i>Hotel 2
</li>
into this:
<li>
<i class="fa fa-table fa-fw"></i>Hotel 1
</li>
<li>
<i class="fa fa-table fa-fw"></i>Hotel 2
</li>
Add $this->uri->segment('segment_number') in your controller to get the value from url
public function view()
{
$page_id =$this->uri->segment(3);
$data['offers_name'] = $this->Login_set->get_offer($id);
$data['offers_description'] = $data['offers_name']['offers_description'];
$this->load->view('App_stay/pages/hotel1_offers.php');
//I put your codes here because you want Spoon Feed
}
public function view1()
{
$page_id =$this->uri->segment(3);
...//rest of your codes here
}
You can pass as url parameter
<li>
<i class="fa fa-table fa-fw"></i>Hotel 1
</li>
And can access like this in controller
public function view($page_id)
{
echo $page_id;
}
you can load helper in controller constructor
function __construct() {
$this->load->helper('url');
}
I want to make menu and submenu dynamic .I made menu with their link but unable to make submenu,please help me my database structure
table name:menu
id menu_name url timestamps
table:sub_menu
id submenu_name link menu_id timestamps
my query is like this
public function menu()
{
$sql=\DB::table('menu')->rightjoin('sub_menu','menu.id','=','sub_menu.menu_id')
->select('submenu_name','link','url','menu_id','menu_name','menu.id')->get();
return view('products.show.menu',compact('sql'));
}
view
<ul>
#foreach($sql as $key => $nav)
#if($key > 0)
<li>
{{$nav->menu_name}}
#if (count($nav->submenu_name) > 0 )
<ul>
#foreach($nav->submenu_name as $child)
<li>{{$child->submenu_name}}</li>
#endforeach
#endif
</ul>
</li>
#endif
#endforeach
</ul>
Have you set up models for these tables? Your query will return multiple rows for each menu/submenu combination, meaning you can't just iterate over it as you are. There's no need to use the query builder here.
Assuming your models are set up as follows (you will need to check the namespace used in the relationships):
class Menu extends Eloquent
{
protected $table = 'menu';
public function submenu()
{
return $this->hasMany('App\SubMenu');
}
}
class SubMenu extends Eloquent
{
protected $table = 'sub_menu';
public function menu()
{
return $this->belongsTo('App\Menu');
}
}
In your controller, you can do:
public function menu()
{
$menu = Menu::with('submenu')->get();
return view('products.show.menu', compact('menu'));
}
Then in your view:
<ul>
#foreach($menu as $menuItem)
<li>
{{ $menuItem->menu_name }}
#if( ! $menuItem->submenu->isEmpty())
<ul>
#foreach($menuItem->submenu as $subMenuItem)
<li>{{ $subMenuItem->submenu_name }}</li>
#endforeach
</ul>
#endif
</li>
#endforeach
</ul>
You can use it without controller
`#foreach(App\Menu::get() as $menuItem)
#if( ! $menuItem->submenu->isEmpty() )
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
{{ $menuItem->menu_name }}
</a>
#else
<li>
{{ $menuItem->menu_name }}
#endif
#if( ! $menuItem->submenu->isEmpty())
<ul class="dropdown-menu" role="menu">
#foreach($menuItem->submenu as $subMenuItem)
<li>{{ $subMenuItem->submenu_name }}</li>
#endforeach
</ul>
#endif
</li>
#endforeach`