Laravel Voyager：如何对带有子元素的元素进行浮点排序？

使用 Laravel Voyager 对带有子元素的元素进行浮点排序

简介

在 Laravel Voyager 中对带有子元素的元素进行排序是一个常见的挑战。本文将引导你完成对元素实现浮点排序的步骤，从而允许你更灵活地管理具有层次结构的数据。

模型准备

第一步是创建一个模型，其中包含 order 浮点数字段和 parent_id 整数字段，用于表示父元素的 ID。

关系定义

接下来，定义一个 belongsTo 关系，将元素与其父元素连接起来。

数据表格自定义

在 Voyager 数据表格中，自定义 order 字段以启用数字输入，允许用户输入元素的排序值。

排序控制器

覆盖 Voyager 的 order 控制器方法，以支持浮点排序并允许更新元素的排序。

Voyager 页面自定义

最后，自定义 Voyager 页面以显示浮点排序字段，允许用户输入浮点值。

步骤分解

1. 模型准备

标题 -> VARCHAR(255)
 -> TEXT
顺序 -> FLOAT
父级 ID -> INTEGER

2. 关系定义

public function parent()
{
    return $this->belongsTo(self::class, 'parent_id');
}

3. 数据表格自定义

[
    'name' => 'order',
    'title' => '排序',
    'type' => 'number',
    'orderable' => true,
    'searchable' => false,
    'width' => '10%',
],

4. 排序控制器

public function order(Request $request)
{
    // 浮点排序
    if ($request->has('order')) {
        $query->orderBy('order', 'asc');
    }

    // 更新元素的排序
    foreach ($data as $d) {
        $d->order = $request->input($d->id);
        $d->save();
    }
}

5. Voyager 页面自定义

[
    'name' => 'order',
    'type' => 'number',
    'step' => '0.1',
],

结论

通过遵循这些步骤，你将能够在 Laravel Voyager 中对带有子元素的元素进行浮点排序。这将允许你在管理具有层次结构的数据时拥有更大的灵活性。

常见问题解答

• 为什么要使用浮点排序？
  浮点排序允许你对带有子元素的元素进行更细粒度的排序，反映它们的层次结构。

• 如何更新元素的排序？
  通过在 Voyager 管理面板中输入浮点值并单击“保存”按钮来更新元素的排序。

• 数据表格中的数字输入字段是如何实现的？
  数字输入字段是通过在数据表格自定义中添加 type 选项 number 来实现的。

• 覆盖排序控制器方法有什么好处？
  覆盖排序控制器方法允许你支持浮点排序并更新元素的排序。

• 浮点排序在管理树形结构数据时有什么帮助？
  浮点排序允许你对树形结构数据中的元素进行排序，反映它们的父元素和子元素关系。