Dcat-Admin自定义列表样式

这边使用Dcat-Admin开发后端,需要自定义表格样式,但是这边又想使用框架自带的分页和筛选功能,这边查看框架的源码,然后按照下面的写法实现了需求

<?php

namespace App\Admin\Controllers;

use App\Admin\Repositories\Custom;
use App\Common\Enums\CategoryEnum;
use Dcat\Admin\Admin;
use Dcat\Admin\Grid;

class CustomController extends AdminController
{
    /**
     * Make a grid builder.
     * @return Grid
     */
    protected function grid() {

        return Grid::make(new Custom(), function (Grid $grid) {

            if (request()->get('_view_') !== 'list') {
                // 设置自定义视图
                $grid->view('admin.custom.index');
            }

            $grid->paginate(50);
            $grid->column('url', '图片')->image('', 100);
            $grid->column('title', '名称');
            $grid->column('link', '链接');
            $grid->column('num', '下载次数');

            $grid->selector(function (Grid\Tools\Selector $selector) {
                $selector->selectOne('cate', '分类', $cates);
                $selector->selectOne('type', '日期', [0 => '今天', 1 => '昨天', 7 => '近一周', 30 =>'近一月']);
            });

            // 禁掉筛选按钮
            $grid->disableFilterButton();

            // 禁用操作按钮
            $grid->disableActions();

            // 设置边线
            $grid->withBorder();

            // 设置复选框
            $grid->disableRowSelector();

            $grid->disableCreateButton();
            $grid->disableRefreshButton();
        });
    }

}

上述为控制器代码,如果使用了框架自带的字段属性,在视图页面会转义携带过去,如:$grid->column(‘url’, ‘图片’)->image(’’, 100);使用了image,那么在视图中url字段内容就是一个完整的<img>标签

{{-- 选择器 --}}
{!! $grid->renderSelector() !!}

{{-- 自定义表格 --}}
<ul class="mailbox-attachments clearfix table custom-data-table data-table p-0" id="grid-table">
    @foreach($grid->rows() as $row)
        <li>
            <div class="mailbox-attachment-img">
                <span class="mailbox-attachment-icon has-img">
                    {!! $row->url !!}
                </span>
            </div>
            <div class="mailbox-attachment-info">
                <div class="recharge-info">
                    下载次数:{{$row->num}}
                </div>
                <div class="recharge-button" data-url="{{$row->link}}">
                    查看作品信息
                </div>
            </span>
            </div>
        </li>
    @endforeach
</ul>

{{-- 分页 --}}
{!! $grid->renderPagination() !!}

如上所示:
$grid->rows() 为表格列表内容,可以自己再上述自定义表格注释下开发自已相要的样式效果
{!! $grid->renderSelector() !!} 为框架自带的筛选器
{!! $grid->renderPagination() !!} 为框架自带的分页

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值