实现的效果:
左边显示当前页面,总页数和总条数。
当选择第一页或者首页时,自动隐藏首页和上一页按钮,下一页和尾页显示并可以点击,当前页数变为橙色且不可点击。
当选择中间的页数时,选择的页码不可点击,首页和上一页,以及下一页和尾页都可以点击并跳转。
当选择尾页或者到达最后一页时,首页和上一页显示并可以点击,自动隐藏下一页和尾页按钮,且页码不可点击。
提示:此页码样式需要layui.css,我在文章末尾提供了一个链接,可以直接引用。
因为要更改tp6默认的页码样式,所以我们首先新建CustomPaginate.php文件,放在app/admin目录下。然后将以下代码插入到CustomPaginate.php中。
主要的改动:
增加了首页和尾页以及总页码。
// 首页 protected function getfirst($text="首页"){ if ($this->currentPage() <= 1) { return null; } $url = $this->url(1); return $this->getPageLinkWrapper($url, $text); } // 尾页 protected function getlast($text="尾页"){ if ($this->currentPage() == $this->lastPage) { return null; } $url = $this->url($this->lastPage); return $this->getPageLinkWrapper($url, $text); } // 总页码 protected function getTotal(){ return '<span class="layui-btn layui-btn-primary" style="margin-right: 10px;">第'.$this->currentPage.'页,共'.$this->lastPage.'页/'.$this->total().'条数据</span>'; }
可点击按钮处的样式修改为
class="layui-btn"
激活按钮改为
<span class="layui-btn layui-btn-danger">' . $text . '</span>
为了美观