b2in/packages/flux-cms/components/resources/views/partials/navigation-item.blade.php
2025-10-20 17:50:35 +02:00

92 lines
No EOL
4.9 KiB
PHP

<div class="flex items-center justify-between p-3 border border-gray-200 rounded-lg bg-white {{ $level > 0 ? 'ml-6' : '' }}"
style="margin-left: {{ $level * 1.5 }}rem;">
<div class="flex items-center space-x-3 flex-1">
{{-- Drag Handle --}}
<div wire:sortable.handle class="cursor-move text-gray-400 hover:text-gray-600">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4"></path>
</svg>
</div>
{{-- Item Content --}}
<div class="flex-1">
<div class="flex items-center space-x-2">
<span class="font-medium text-gray-900">
{{ $item->getTranslation('title', app()->getLocale()) }}
</span>
{{-- Status Badges --}}
@if(!$item->is_active)
<span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
Inactive
</span>
@endif
@if($item->hasChildren())
<span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
{{ $item->children->count() }} children
</span>
@endif
</div>
<div class="text-sm text-gray-500 mt-1">
@if($item->page_id && $item->page)
<span class="inline-flex items-center">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
</svg>
Page: {{ $item->page->title }}
</span>
@elseif($item->url)
<span class="inline-flex items-center">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.102m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"></path>
</svg>
URL: {{ $item->url }}
@if($item->target === '_blank')
<svg class="w-3 h-3 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
</svg>
@endif
</span>
@else
<span class="text-gray-400">No link</span>
@endif
</div>
</div>
</div>
{{-- Actions --}}
<div class="flex items-center space-x-2">
<button wire:click="editNavigationItem({{ $item->id }})"
class="text-gray-400 hover:text-blue-600 transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"></path>
</svg>
</button>
<button wire:click="addChildItem({{ $item->id }})"
class="text-gray-400 hover:text-green-600 transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
</svg>
</button>
<button wire:click="deleteNavigationItem({{ $item->id }})"
class="text-gray-400 hover:text-red-600 transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"></path>
</svg>
</button>
</div>
</div>
{{-- Render children recursively --}}
@if($item->children->isNotEmpty() && $level < 3)
<div class="mt-2 space-y-2">
@foreach($item->children as $child)
@include('flux-cms-components::partials.navigation-item', ['item' => $child, 'level' => $level + 1])
@endforeach
</div>
@endif