codeaxion / nestifyx
NestifyX 包提供了管理应用中分类或嵌套元素的功能。
v1.0.0
2024-02-24 18:27 UTC
README
概述
NestifyX Laravel 包提供了使用递归方法管理分类和操作应用内嵌套元素的功能。
轻松组织您的分类。
特性
-
分类树管理:此模块包括分类管理,并具有使用拖放功能更改其位置的能力,您只需包含一个按钮组件即可。
-
递归方法:此模块包括各种递归方法,如生成树、获取子/父ID、生成面包屑、在下拉菜单中显示树视图等...
-
性能:将在单个查询中完成所有工作。
运行 Js Tree 弹出所需依赖项
AlpineJs、Jquery、Jstree
安装
要在您的应用程序中使用 NestifyX 包,请按照以下步骤操作
- 安装:通过 Composer 安装 NestifyX 包
composer require codeaxion/nestifyx
- 通过 CDN 添加您的必需依赖项(没有这些依赖项,jstree 将无法工作)
//only optional if you have already have alpine js and tailwindcss package installed <script src="//unpkg.com/alpinejs" defer></script> <script src="https://cdn.tailwindcss.com"></script> //jquery in header <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> //jstree scripts and css (add styles in header and scripts in body) <script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
- 运行必要的迁移
将在您的分类表中添加位置列以进行排序
php artisan migrate;
- 集成:包含 Nestify 门面
use CodeAxion\NestifyX\Facades\NestifyX;
这就完成了,您的设置已就绪
可选
- (可选)如果您有不同的表名,请发布配置文件
php artisan vendor:publish --provider="CodeAxion\NestifyX\NestifyXServiceProvider" --tag="config"
- (可选)如果您想,请发布迁移
php artisan vendor:publish --provider="CodeAxion\NestifyX\NestifyXServiceProvider" --tag="migrations"
使用方法
添加分类模块滑块
添加此 blade 组件后,单击名为“分类树”的按钮以打开分类模块滑块
<x-nestifyx::category-tree-alpine />
将普通 Eloquent 集合/数组转换为嵌套树
use CodeAxion\NestifyX\Facades\NestifyX; $categories = Category::orderByRaw('-position DESC')->get(); $categories = NestifyX::nestTree($categories);
不将其转换为树即可排序子项
use CodeAxion\NestifyX\Facades\NestifyX; $categories = Category::orderByRaw('-position DESC')->get(); //Sort by children with it's position (RECOMMENDED after sorting is done by jstree) //OR $categories = Category::get() //Sort by only children; //will return original database collection $categories = NestifyX::setIndent('|--')->sortChildren($categories); //fetch all categories and subcategories //OR $categories = NestifyX::setIndent('|--')->sortChildren($categories,5) //Pass different category id if you want their children of (refer to 2nd example) // In view @foreach($categories as $category) <div> {{$category->indent}} {{$category->name}} </div> @endforeach //Will result /** Electronics |-- Mobiles |-- |-- All Mobiles |-- Headphones |-- |-- All Headphones |-- Gaming |-- |-- Gaming Laptops |-- |-- Business Laptops |-- Laptops |-- |-- All Laptops |-- |-- Apple Laptops |-- |-- Microsoft Laptops */
平铺子项(对下拉菜单很有用)
use CodeAxion\NestifyX\Facades\NestifyX; $categories = \App\Models\Category::orderByRaw('-position DESC')->get(); //fetch all categories and subcategories (CASE 1) $categories = NestifyX::setIndent('|--')->listsFlattened($categories); //OR //pass different category id if you want their children of (CASE 2) $categories = NestifyX::setIndent('|--')->listsFlattened($categories,5); //OR ////if your column name is different (default will be name) $categories = NestifyX::setIndent('|--')->setColumn('title')->listsFlattened($categories); dd($categories); //Result (CASE 1): /** #items: array:7 [▼ 4 => "Electronics" 5 => "|--Laptops" 9 => "|--|--All Laptops" 7 => "|--Mobiles" 10 => "|--|--All Mobiles" 8 => "|--Headphones" 11 => "|--|--All Headphones" ] */ //Result (CASE 2): /** #items: array:7 [▼ 5 => "Laptops" 9 => "|-- All Laptops" ] */
<!-- In view --> <select class="border-gray-400" name="" id=""> @foreach ($categories as $id => $name) <option value="{{$id}}"> {{$name}} </option> @endforeach </select>
为所有分类生成面包屑
$categories = \App\Models\Category::orderByRaw('-position DESC')->get(); $categories = NestifyX::setIndent(' \ ')->generateBreadCrumbs($categories); //will return flattened Result: array:7 [▼ // routes\web.php:27 4 => "Electronics" 5 => "Electronics \ Laptops" 9 => "Electronics \ Laptops \ All Laptops" 7 => "Electronics \ Mobiles" 10 => "Electronics \ Mobiles \ All Mobiles" 8 => "Electronics \ Headphones" 11 => "Electronics \ Headphones \ All Headphones" ]
生成当前面包屑
$categories = Category::get(); $categories = NestifyX::generateCurrentBreadCrumbs($categories,5); //2nd param: child id array:2 [▼ 4 => array:2 [▼ "name" => "Electronics" "category" => array:8 [▼ "id" => 4 "name" => "Electronics" "parent_id" => null "created_at" => "2024-02-18T13:37:52.000000Z" "updated_at" => "2024-02-22T16:40:00.000000Z" ] ] 5 => array:2 [▼ "name" => "Laptops" "category" => array:8 [▼ "id" => 5 "name" => "Laptops" "parent_id" => 4 "created_at" => "2024-02-18T13:43:26.000000Z" "updated_at" => "2024-02-22T16:40:00.000000Z" ] ] ]
//in view <div class="flex gap-2"> <a href="/"> Home </a> @foreach ($categories as $category) <a href="{{route('shop-page',$category['category']['id'])}}"> \ {{$category['name']}} </a> @endforeach </div>
获取子分类的所有父 ID
$categories = Category::get(); $categories = NestifyX::collectParentIds($categories,11);
获取父分类的所有子 ID
$categories = Category::get(); $categories = NestifyX::collectChildIds($categories,4);
即将推出功能
- 在分类中添加 Nestable2 插件功能
- 移除 Alpine js 依赖项
- 添加对 Bootstrap 的支持
欢迎提出新功能建议
变更日志
有关最近更改的更多信息,请参阅变更日志。
贡献
有关详细信息,请参阅贡献指南。
鸣谢
许可证
MIT 许可证(MIT)。有关更多信息,请参阅许可证文件。