Skip to content

Commit acca071

Browse files
indigoram89claude
andcommitted
Удаление Livewire компонента и переход на Vue.js интерфейс
- Удалены все файлы связанные с Livewire компонентом - Обновлена документация с описанием Vue.js интерфейса - Перенесена документация веб-интерфейса из отдельного файла в README.md - Удалены устаревшие файлы (plan.md, docs/WEB_INTERFACE.md) - Обновлена конфигурация (удалены настройки Livewire) - Обновлен service provider (удалена регистрация Livewire) - Обновлен CLAUDE.md с актуальной архитектурой пакета 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
1 parent f8e9183 commit acca071

24 files changed

+2248
-950
lines changed

CLAUDE.md

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
44

55
## Package Overview
66

7-
This is a Laravel package for managing hierarchical data using the Nested Set pattern. It includes a Livewire 3 component with drag-and-drop support via Alpine.js Sort plugin.
7+
This is a Laravel package for managing hierarchical data using the Nested Set pattern. It includes a modern Vue.js 3 web interface with drag-and-drop support via Sortable.js.
88

99
## Development Commands
1010

@@ -66,14 +66,18 @@ Key invariants:
6666
- Abstract base model with trait pre-applied
6767
- Default configuration
6868

69-
3. **NestedSetManager** (`src/Http/Livewire/NestedSetManager.php`)
70-
- Livewire component for UI management
71-
- Handles drag-and-drop via Alpine.js Sort
72-
- CRUD operations with real-time updates
69+
3. **Web Interface** (`resources/js/nested-set-standalone.js`)
70+
- Vue.js 3 application for UI management
71+
- Handles drag-and-drop via Sortable.js
72+
- CRUD operations with REST API
7373

74-
4. **Service Provider** (`src/NestedSetServiceProvider.php`)
75-
- Registers Livewire component
76-
- Publishes config, migrations, and views
74+
4. **API Controller** (`src/Http/Controllers/NestedSetApiController.php`)
75+
- REST API endpoints for tree operations
76+
- Handles models, tree, CRUD, and reorder operations
77+
78+
5. **Service Provider** (`src/NestedSetServiceProvider.php`)
79+
- Publishes config, migrations, views, and assets
80+
- Loads API and web routes
7781

7882
### Critical Implementation Details
7983

@@ -94,7 +98,6 @@ Key invariants:
9498
## Testing Approach
9599

96100
- Unit tests cover all NestedSetTrait methods
97-
- Feature tests verify Livewire component functionality
98101
- Tests use SQLite in-memory database
99102
- Key test scenarios: node creation, movement, deletion, tree integrity
100103

README.md

Lines changed: 81 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,12 @@
44
[![GitHub Tests Action Status](https://img.shields.io/github/actions/workflow/status/indigoram89/laravel-nested-set/tests.yml?branch=main&label=tests&style=flat-square)](https://github.com/indigoram89/laravel-nested-set/actions?query=workflow%3Atests+branch%3Amain)
55
[![Total Downloads](https://img.shields.io/packagist/dt/indigoram89/laravel-nested-set.svg?style=flat-square)](https://packagist.org/packages/indigoram89/laravel-nested-set)
66

7-
Пакет для управления иерархическими данными в Laravel с использованием паттерна Nested Set. Включает веб-интерфейс на Livewire 3 с поддержкой drag-and-drop.
7+
Пакет для управления иерархическими данными в Laravel с использованием паттерна Nested Set. Включает современный веб-интерфейс на Vue.js 3 с поддержкой drag-and-drop и REST API.
88

99
## Требования
1010

1111
- PHP 8.4+
1212
- Laravel 12.x
13-
- Livewire 3.x
1413

1514
## Установка
1615

@@ -39,6 +38,12 @@ php artisan migrate
3938
php artisan vendor:publish --tag=nested-set-views
4039
```
4140

41+
### Публикация assets для веб-интерфейса
42+
43+
```bash
44+
php artisan vendor:publish --tag=nested-set-assets
45+
```
46+
4247
## Использование
4348

4449
### Создание модели
@@ -185,37 +190,86 @@ Category::query()->leaves()->get();
185190
Category::query()->withDepth(2)->get();
186191
```
187192

188-
### Livewire компонент
193+
### Веб-интерфейс на Vue.js
194+
195+
Пакет включает современный веб-интерфейс для управления деревьями с использованием Vue.js 3, Tailwind CSS и REST API.
196+
197+
#### Возможности
198+
199+
- 🎯 Выбор модели для управления
200+
- 🌳 Визуализация дерева с анимациями
201+
- 🔍 Поиск по дереву
202+
- ➕ Создание новых узлов
203+
- ✏️ Редактирование существующих узлов
204+
- 🗑️ Удаление узлов с подтверждением
205+
- 🔄 Drag & Drop для перемещения узлов
206+
- 📱 Адаптивный дизайн
207+
208+
#### Установка веб-интерфейса
209+
210+
1. Опубликуйте конфигурацию и assets:
211+
212+
```bash
213+
# Опубликовать всё
214+
php artisan vendor:publish --provider="Indigoram89\NestedSet\NestedSetServiceProvider"
215+
216+
# Или по отдельности:
217+
php artisan vendor:publish --tag=nested-set-config
218+
php artisan vendor:publish --tag=nested-set-assets
219+
```
220+
221+
2. Настройте модели в файле `config/nested-set.php`:
222+
223+
```php
224+
'models' => [
225+
[
226+
'name' => 'category',
227+
'class' => App\Models\Category::class,
228+
'label' => 'Категории',
229+
'description' => 'Управление категориями товаров',
230+
],
231+
[
232+
'name' => 'menu',
233+
'class' => App\Models\MenuItem::class,
234+
'label' => 'Меню',
235+
'description' => 'Управление пунктами меню',
236+
],
237+
],
238+
```
189239

190-
Для использования готового интерфейса управления деревом, добавьте компонент на страницу:
240+
3. Откройте в браузере:
191241

192-
```blade
193-
@livewire('nested-set-manager', ['model_class' => App\Models\Category::class])
242+
```
243+
http://your-app.test/nested-set
194244
```
195245

196-
Компонент включает:
197-
- Отображение древовидной структуры
198-
- Drag-and-drop для изменения порядка и вложенности
199-
- CRUD операции
200-
- Поиск по элементам
246+
#### API Endpoints
201247

202-
### Настройка Alpine.js Sort
248+
Интерфейс использует следующие API endpoints:
203249

204-
Для работы drag-and-drop функциональности необходимо подключить Alpine.js с плагином Sort:
250+
- `GET /api/nested-set/models` - получить список моделей
251+
- `GET /api/nested-set/{model}/tree` - получить дерево
252+
- `POST /api/nested-set/{model}/nodes` - создать узел
253+
- `PUT /api/nested-set/{model}/nodes/{id}` - обновить узел
254+
- `DELETE /api/nested-set/{model}/nodes/{id}` - удалить узел
255+
- `POST /api/nested-set/{model}/reorder` - переупорядочить узлы
205256

206-
```html
207-
<!-- Alpine.js -->
208-
<script defer src="https://unpkg.com/@alpinejs/sort@3.x.x/dist/cdn.min.js"></script>
209-
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
257+
#### Безопасность
210258

211-
<!-- Или через npm -->
212-
<script>
213-
import Alpine from 'alpinejs'
214-
import sort from '@alpinejs/sort'
259+
- Все запросы защищены CSRF токеном
260+
- Валидация на стороне сервера
261+
- Защита от циклических ссылок при перемещении узлов
215262

216-
Alpine.plugin(sort)
217-
Alpine.start()
218-
</script>
263+
#### Добавление аутентификации
264+
265+
Для защиты интерфейса добавьте middleware в маршруты:
266+
267+
```php
268+
Route::prefix('nested-set')
269+
->middleware(['web', 'auth', 'can:manage-trees'])
270+
->group(function () {
271+
Route::get('/', [NestedSetWebController::class, 'index']);
272+
});
219273
```
220274

221275
## Конфигурация
@@ -235,12 +289,9 @@ return [
235289
// Имя таблицы по умолчанию
236290
'table' => 'nested_sets',
237291

238-
// Настройки Livewire компонента
239-
'livewire' => [
240-
'component_name' => 'nested-set-manager',
241-
'enable_drag_drop' => true,
242-
'enable_lazy_loading' => true,
243-
'items_per_page' => 50,
292+
// Модели для веб-интерфейса
293+
'models' => [
294+
// Добавьте ваши модели здесь
244295
],
245296

246297
// Настройки производительности

config/nested-set.php

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -30,34 +30,43 @@
3030

3131
'table' => 'nested_sets',
3232

33+
3334
/*
3435
|--------------------------------------------------------------------------
35-
| Livewire Component Configuration
36+
| Performance Options
3637
|--------------------------------------------------------------------------
3738
|
38-
| Configuration options for the Livewire nested set manager component.
39+
| Options to optimize performance for large trees.
3940
|
4041
*/
4142

42-
'livewire' => [
43-
'component_name' => 'nested-set-manager',
44-
'enable_drag_drop' => true,
45-
'enable_lazy_loading' => true,
46-
'items_per_page' => 50,
43+
'cache' => [
44+
'enabled' => true,
45+
'ttl' => 3600, // 1 hour
46+
'prefix' => 'nested_set_',
4747
],
4848

4949
/*
5050
|--------------------------------------------------------------------------
51-
| Performance Options
51+
| Available Models
5252
|--------------------------------------------------------------------------
5353
|
54-
| Options to optimize performance for large trees.
54+
| List of models that can be managed through the web interface.
55+
| Each model should have a unique name and class reference.
5556
|
5657
*/
5758

58-
'cache' => [
59-
'enabled' => true,
60-
'ttl' => 3600, // 1 hour
61-
'prefix' => 'nested_set_',
59+
'models' => [
60+
// Пример конфигурации для модели Category:
61+
/*
62+
[
63+
'name' => 'category', // Уникальное имя для URL (латиницей)
64+
'class' => App\Models\Category::class, // Класс модели
65+
'label' => 'Категории', // Отображаемое название
66+
'description' => 'Управление категориями', // Описание (опционально)
67+
],
68+
*/
69+
70+
// Добавьте ваши модели здесь:
6271
],
6372
];

package.json

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"name": "laravel-nested-set",
3+
"version": "1.0.0",
4+
"private": true,
5+
"scripts": {
6+
"dev": "vite",
7+
"build": "vite build"
8+
},
9+
"devDependencies": {
10+
"@vitejs/plugin-vue": "^5.0.0",
11+
"axios": "^1.6.0",
12+
"laravel-vite-plugin": "^1.0.0",
13+
"vite": "^5.0.0",
14+
"vue": "^3.4.0"
15+
},
16+
"dependencies": {
17+
"vuedraggable": "^4.1.0"
18+
}
19+
}

0 commit comments

Comments
 (0)