基本使用

未匹配的标注
本文档最新版为 2.x,旧版本可能放弃维护,推荐阅读最新版!

模型树基本使用

这个功能可以实现一个树状组件,可以用拖拽的方式实现数据的层级、排序等操作,下面是基本的用法。

表结构和模型

要使用model-tree,要遵守约定的表结构:

parent_id字段一定要默认为0!!!

CREATE TABLE `demo_categories` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
  `parent_id` int(11) NOT NULL DEFAULT '0',
  `order` int(11) NOT NULL DEFAULT '0',
  `title` varchar(50) COLLATE utf8_unicode_ci NOT NULL,
  `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
  `updated_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci

上面的表格结构里面有三个必要的字段parent_idordertitle,其它字段没有要求。

对应的模型为app/Models/Category.php:

<?php

namespace App\Models\Demo;

use Dcat\Admin\Traits\ModelTree;
use Illuminate\Database\Eloquent\Model;

class Category extends Model
{
    use ModelTree;

    protected $table = 'demo_categories';
}

表结构中的三个字段parent_idordertitle的字段名也是可以修改的:

为了便于阅读,这里不再展示 Repository 代码。

<?php

namespace App\Models\Demo;

use Dcat\Admin\Traits\ModelTree;
use Illuminate\Database\Eloquent\Model;

class Category extends Model
{
    use ModelTree;

    protected $table = 'demo_categories';

    // 父级ID字段名称,默认值为 parent_id
    protected $parentColumn = 'pid';

    // 排序字段名称,默认值为 order
    protected $orderColumn = 'sort';

    // 标题字段名称,默认值为 title
    protected $titleColumn = 'name';
}

使用方法

然后就是在页面中使用model-tree了:

<?php

namespace App\Admin\Controllers\Demo;

use App\Models\Category;
use Dcat\Admin\Layout\Row;
use Dcat\Admin\Layout\Content;
use Dcat\Admin\Tree;
use Dcat\Admin\Controllers\AdminController;

class CategoryController extends AdminController
{
    public function index(Content $content)
    {
        return $content->header('树状模型')
            ->body(function (Row $row) {
                $tree = new Tree(new Category);

                $row->column(12, $tree);
            });
    }
}

可以通过下面的方式来修改行数据的显示:

$tree = new Tree(new Category);

$tree->branch(function ($branch) {
    $src = config('admin.upload.host') . '/' . $branch['logo'] ;
    $logo = "<img src='$src' style='max-width:30px;max-height:30px' class='img'/>";

    return "{$branch['id']} - {$branch['title']} $logo";
});

在回调函数中返回的字符串类型数据,就是在树状组件中的每一行的显示内容,$branch参数是当前行的数据数组。

如果要修改模型的查询,用下面的方式

$tree->query(function ($model) {
    return $model->where('type', 1);
});

自定义工具栏按钮

请参考文档模型树动作

本文章首发在 LearnKu.com 网站上。

上一篇 下一篇
《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
讨论数量: 10
发起讨论 只看当前版本


luxiaofeng
dcat admin 详情页如何做成选项卡的展示
4 个点赞 | 15 个回复 | 问答 | 课程版本 2.x
halweg
在form A的編輯页,提交后如和新增一条B的记录?
0 个点赞 | 7 个回复 | 问答 | 课程版本 2.x
luxiaofeng
dcat admin 表格怎么根据当前行数据的值隐藏或显示某个按钮
0 个点赞 | 4 个回复 | 问答 | 课程版本 2.x
蒙挚
Dcat Admin 新建和编辑怎么使用不同的页面和处理逻辑
0 个点赞 | 4 个回复 | 问答 | 课程版本 2.x
maxsky
为什么开发工具菜单在非 admin 用户下也能看见呢?
0 个点赞 | 1 个回复 | 问答 | 课程版本 2.x
Mutoulee
Dcat Admin 模型树depth字段疑问
0 个点赞 | 1 个回复 | 问答 | 课程版本 2.x
lezhl821125
Dcat2版本的代码生成器 在laravel 9的版本报错
0 个点赞 | 1 个回复 | 问答 | 课程版本 2.x
zhuameng
如果 MySQL 8 运行脚本出错,可以试试下面这个:
0 个点赞 | 0 个回复 | 分享 | 课程版本 2.x
esssd
小程序心跳
0 个点赞 | 0 个回复 | 代码速记 | 课程版本 2.x