php框架dcat-admin速查笔记

多才多多

已于 2023-12-18 10:39:43 修改

阅读量1.2k

点赞数

分类专栏： laravel 文章标签： php laravel

于 2023-11-29 11:03:05 首次发布

本文链接：https://blog.csdn.net/u010456602/article/details/134679082

版权

laravel 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

要想灵活的使用dcat-admin框架开发,必须知道框架有哪些类提供给我们使用.
每一个自定义的按钮,弹框,信息展示,小组件都用到特定的类和接口.

常用核心类

Dcat\Admin\Http\Controllers\AdminController 需要继承的公共控制器
Dcat\Admin\Layout\Content 布局核心
Dcat\Admin\Grid 表格列表页面
Dcat\Admin\Form 表单页面
Dcat\Admin\Show 详情页面
Dcat\Admin\Grid\RowAction 扩展行操作
其中Dcat\Admin\Form和Dcat\Admin\Show实现了Illuminate\Contracts\Support\Renderable 接口

laravel 常用类

Illuminate\Http\Request 接收请求参数$request,定义此类
Illuminate\Support\Facades\DB

布局常用类

布局用的行row 和列column
用php代码构建多行多列的布局就需要用到
Dcat\Admin\Layout\Column
Dcat\Admin\Layout\Row

$content->row(function (Row $row) {
 
    $row->column(4, 'foo');
 
    $row->column(8, function (Column $column) {
 
        $column->row('111');
 
        $column->row('222');
 
        $column->row('333');
 
    });
 
});

常用方法

view() 模板调用
Admin:script() 控制器里加载js代码

控制器

index

public function index(Content $content)
{
    $content->header('填写页面头标题');
    $content->description('填写页面描述小标题');
    // 添加面包屑导航
    $content->breadcrumb(
        ['text' => '首页', 'url' => '/admin'],
        ['text' => '用户管理', 'url' => '/admin/users'],
        ['text' => '编辑用户']
    );
    // 填充页面body部分，这里可以填入任何可被渲染的对象
    $content->body('hello world');
    $content->body('hello world2');
}

form

            $form->saving(function(Form $form){
                dump($form->model()->status);//数据库的原值
                dd($form->status);//要修改为
            });

数据表格的各个按钮控制

$grid->disableActions(); 禁用操作按钮
$grid->disableEditButton(); 禁用编辑操作
$grid->disableDeleteButton(); 禁用删除操作
$grid->disableBatchActions(); 禁用批量操作
$grid->disableBatchDelete(); 禁用批量删除操作
$grid->disableToolbar(); 禁用工具栏
$grid->disableRefreshButton(); 禁用刷新按钮
$grid->disablePagination(); 禁用分页
$grid->paginate(15); 设置分页大小

自定义行操作:
定义一个数据表格行操作类,继承 Dcat\Admin\Grid\RowAction

如果想在行操作里, 点击一个按钮,弹出表单,进行数据修改:
实现 render()方法,在render 方法里可以调用modal,modal里调用一个自定义的工具表单.
https://learnku.com/docs/dcat-admin/2.x/tools-form/8125#d0e67b

普通组件

都用make生成组件实例.

Dcat\Admin\Widgets\Card 卡片
Dcat\Admin\Widgets\Box Box
Dcat\Admin\Widgets\Dropdown 下拉菜单
Dcat\Admin\Widgets\Radio 单选框
Dcat\Admin\Widgets\Checkbox 复选框
Dcat\Admin\Widgets\Tab 选项卡
Dcat\Admin\Widgets\Alert 警告框
Dcat\Admin\Widgets\Table 表格
$alert = Alert::make(‘内容’, ‘标题’);
$alert->success();
Dcat\Admin\Widgets\Tooltip 提示框
Dcat\Admin\Widgets\Markdown 渲染markdown

以上是简单的展示信息组件.无过多的交互

Dcat\Admin\Widgets\Modal 模态窗,弹窗
模态窗口内可以渲染文字,模板,普通组件,异步组件,非异步组件, 工具表单,动作组件等等内容
开发交换功能.

图表和数据统计卡片

Dcat Admin 引入了 apexcharts 图表功能，
Dcat\Admin\Widgets\ApexCharts\Chart 这个类可以帮助开发者快速渲染图表。
Dcat\Admin\Widgets\Metrics\Card 数据统计卡片

特殊组件

Dcat\Admin\Widgets\Form 工具表单组件
例如: 行操作上,点击修改用户密码,弹出表单填写新密码.
Dcat\Admin\Contracts\LazyRenderable 异步加载接口
传递自定义参数
Dcat\Admin\Traits\LazyWidget 异步组件的traits,含有payload()方法 ,
可在传入payload数据,工具表单的各个方法里调用payload数据

<?php

namespace App\Admin\Forms;

use Dcat\Admin\Contracts\LazyRenderable;
use Dcat\Admin\Traits\LazyWidget;
use Dcat\Admin\Widgets\Form;

class UserProfile extends Form implements LazyRenderable
{
    use LazyWidget;

    public function handle(array $input)
    {
        // 获取外部传递的参数
        $key1 = $this->payload['key1'] ?? null;
        $key2 = $this->payload['key1'] ?? null;

        return $this->success('保存成功');
    }

    public function form()
    {
        // 获取外部传递的参数
        $key1 = $this->payload['key1'] ?? null;
        $key2 = $this->payload['key1'] ?? null;

        $this->text('name', trans('admin.name'))->required()->help('用户昵称');
        $this->image('avatar', trans('admin.avatar'))->autoUpload();

        $this->password('old_password', trans('admin.old_password'));

        $this->password('password', trans('admin.password'))
            ->minLength(5)
            ->maxLength(20)
            ->customFormat(function ($v) {
                if ($v == $this->password) {
                    return;
                }

                return $v;
            })
            ->help('请输入5-20个字符');
        $this->password('password_confirmation', trans('admin.password_confirmation'))
            ->same('password')
            ->help('请输入确认密码');
    }

    public function default()
    {
        // 获取外部传递的参数
        $key1 = $this->payload['key1'] ?? null;
        $key2 = $this->payload['key1'] ?? null;

        return [
            'name' => '...',
        ];
    }
}

异步加载
Dcat\Admin\Support\LazyRenderable 异步渲染接口
异步加载功能支持静态资源按需加载的特性，
目前内置的所有组件都支持使用异步渲染功能，
并且支持在页面的任意位置中使用
通过异步加载功能可以让页面中的整体或局部组件使用 ajax 异步渲染，
从而提高页面加载效率（例如弹窗异步加载表单）。

步骤: 见文档的页面组件->异步加载
1.先定义一个异步渲染类，继承 Dcat\Admin\Support\LazyRenderable
2.然后需要把渲染类实例传入 Dcat\Admin\Widgets\Lazy 对象中，才能最终实现异步渲染的效果

namespace App\Admin\Renderable;

use App\Admin\Widgets\Charts\Bar;
use Dcat\Admin\Support\LazyRenderable;

class PostChart extends LazyRenderable
{
    public function render()
    {
        // 获取外部传递的参数
        $id = $this->id;

        // 查询数据逻辑
        $data = [...];

        // 这里可以返回内置组件，也可以返回视图文件或HTML字符串
        return Bar::make($data);
    }
}

控制器里$chart = PostChart::make(['id' => ...]); return $content->body(Lazy::make($chart));
或者模板里调用

$chart = Lazy::make(PostChart::make(['id' => ...]));
return $content->body(view('admin.xxx', ['chart' => $chart]));

如果是 Dcat\Admin\Widgets\Card、Dcat\Admin\Widgets\Box、Dcat\Admin\Widgets\Modal、Dcat\Admin\Widgets\Tab 等组件，则可以略过 Dcat\Admin\Widgets\Lazy 组件，直接传递渲染类实例

$chart = PostChart::make(['id' => ...]);
$modal = Modal::make()
    ->lg()
    ->title('标题')
    ->delay(300) // 如果是异步渲染图表则需要设置一个延迟时间，否则可能导致图表渲染异常
    ->body($chart);

异步加载数据表格

弹窗,异步展示数据表格

如果需要异步加载数据表格，则定义渲染类时需要继承 Dcat\Admin\Grid\LazyRenderable
Dcat\Admin\Grid\LazyRenderable 用于异步渲染数据表格，是 Dcat\Admin\Support\LazyRenderable 的子类

简化模式 - 去除简化一些数据表格默认开启的功能，默认不启用
$table = UserTable::make()->simple(); return $content->body(LazyTable::make($table));

注意，如果把渲染类实例直接注入到 Dcat\Admin\Widgets\Card、Dcat\Admin\Widgets\Box、Dcat\Admin\Widgets\Tab 和 Dcat\Admin\Widgets\Modal 等组件时，则会自动启用 simple 模式

//监听异步加载完成事件
Dcat\Admin\Widgets\Lazy
Dcat\Admin\Widgets\LazyTable
参考工具表单

传递自定义参数
Dcat\Admin\Traits\LazyWidget 异步组件的traits,含有payload()方法 ,
可在传入payload数据,工具表单的各个方法里调用payload数据

//调用异步组件传递参数
$form = UserProfile::make()->payload(['key1' => '...', 'key2' => '...']);


//组件内使用传入的参数
namespace App\Admin\Forms;

use Dcat\Admin\Contracts\LazyRenderable;
use Dcat\Admin\Traits\LazyWidget;
use Dcat\Admin\Widgets\Form;

class UserProfile extends Form implements LazyRenderable
{
    use LazyWidget;

    public function handle(array $input)
    {
        // 获取外部传递的参数
        $key1 = $this->payload['key1'] ?? null;
        $key2 = $this->payload['key1'] ?? null;

        return $this->success('保存成功');
    }
}

异步工具表单

定义工具表单类，实现 Dcat\Admin\Contracts\LazyRenderable，

可以用 payload 方法往表单里面传递自定义参数, 需要加载 Dcat\Admin\Traits\LazyWidget 这个 trait

动作 Action

开发者通过 Action 动作类可以非常方便的开发出一个含有特定功能的操作，可以非常方便的让用户与服务器产生交互。

显示一个按钮,点击按钮可以有一些操作,例如弹出页面,显示列表,打开链接,下载文件,刷新页面,删除数据,执行js代码,确认弹窗,增加库存,修改一个数据的状态 ,等等操作.

动作的种类:
1.修改信息的动作,
一般结合modal和工具表单使用
2.展示信息的动作,
例如弹窗展示列表 ,一般是结合modal和 Dcat\Admin\Grid\LazyRenderable
3.行操作的动作.
4.其他动作

php artisan admin:action 创建action类
动作分为了好几种, 数据表格动作,数据表单动作,数据详情动作,树状模型动作, 其他通用动作.

Dcat\Admin\Actions\Action 动作基类
Dcat\Admin\Grid\GridAction 数据表格动作基类,在数据表格页面调用.
Dcat\Admin\Grid\Tools\BatchAction 批量操作按钮基类
Dcat\Admin\Grid\Tools\RowAction 行操作按钮基类
Dcat\Admin\Form\AbstractTool 数据表单动作基类,在数据表单页面调用
Dcat\Admin\Show\AbstractTool 数据详情动作基类,在数据详情页面调用
Dcat\Admin\Tree\RowAction 模型树动作基类,在树状模型页调用
不同类是在不同地方使用的.

动作响应:
$this->response()->success(‘Processed successfully.’)->refresh();

数据表格相关的动作类，包括工具栏按钮 (AbstractTool)、
行操作 (RowAction)、批量操作 (BatchAction) 等操作按钮的基类
都继承自 Dcat\Admin\Grid\GridAction 类，而 GridAction 则继承自动作类基类 (Action)。

动作类,可以有执行权限的判断.

protected function authorize($user): bool
{
    return $user->can('do-action');
}

注意:超级管理员账号 $user->can()都是返回true,请用其他账号测试.

文档里的展示个人信息的动作的案例,
是在动作类里,自己用代码写了一个html和js去显示弹窗和展示数据.

我们开发的时候可以用系统提供的modal::make() 去实现弹窗.

render接口

action 一般需要实现render接口
里面再去生成modal模态弹窗.或者按钮 ,去实现功能
模态框里面去生成工具表单. 一环套一环.

form数据表格弹窗,可放大全屏

Form::dialog(‘编辑角色’)
->click(‘.edit-form’)
->success(‘Dcat.reload()’); // 编辑成功后刷新页面

模板里

js

<script>
// 用 Dcat.ready() 代替 $()
// 此方法会在所有 js 脚本加载完成后执行
Dcat.ready(function () {
    // 写入你的 js 代码
    console.log('所有 js 脚本加载完毕啦~~');
});
</script>

bootstrap

颜色

.text-primary
.text-secondary
.text-success
.text-danger
.text-warning
.text-info
.text-light
.text-dark
.text-body
.text-muted
.text-white
.text-black-50
.text-white-50
更多bootstrap文档资料
https://getbootstrap.net/docs/utilities/borders/

AdminLTE还带了一些dcat-admin没有写的其他组件,可以照着案例复制
https://3vshej.cn/AdminLTE/AdminLTE-3.x/pages/UI/timeline.html

表单验证

Dcat Admin 集成了 bootstrap-validator 组件用于表单前端验证的功能，
Dcat Admin 集成了 sweetalert2 弹窗插件
Dcat Admin 集成了 Toastr 提示框插件

权限

Admin::user(); 当前用户对象
Admin::user()->id 当前用户id
Admin::user()->roles; 用户角色
Admin::user()->permissions; 用户的权限
Admin::user()->isRole('developer');用户是否有某个角色
Admin::user()->can('create-post');是否有某个权限
Admin::user()->cannot('delete-post'); 是否没有某个权限
Admin::user()->isAdministrator();
Admin::user()->inRoles(['editor', 'developer']);


// use Dcat\Admin\Http\Auth\Permission;
// 检查权限，有create-post权限的用户或者角色可以访问创建文章页面
Permission::check('create-post');