116 lines
5.7 KiB
PHP
116 lines
5.7 KiB
PHP
<div>
|
|
<flux:header class="mb-6">
|
|
<flux:heading size="xl">{{ __('Display-Versionen') }}</flux:heading>
|
|
<flux:subheading>{{ __('Erstellen und verwalten Sie Inhalts-Versionen für Ihre Displays') }}</flux:subheading>
|
|
</flux:header>
|
|
|
|
@if (session()->has('success'))
|
|
<x-success-alert>
|
|
{{ session('success') }}
|
|
</x-success-alert>
|
|
@endif
|
|
|
|
<flux:card>
|
|
<div class="flex items-center justify-between mb-6">
|
|
<div>
|
|
<flux:heading size="lg">{{ __('Versionen') }}</flux:heading>
|
|
<flux:subheading>{{ __('Jede Version enthält Inhalte eines bestimmten Typs') }}</flux:subheading>
|
|
</div>
|
|
<flux:button wire:click="openCreateModal" icon="plus" variant="primary">
|
|
{{ __('Version erstellen') }}
|
|
</flux:button>
|
|
</div>
|
|
|
|
@if($versions->isEmpty())
|
|
<div class="text-center py-12 text-zinc-500 dark:text-zinc-400">
|
|
<flux:icon.rectangle-group class="w-16 h-16 mx-auto mb-4 opacity-50" />
|
|
<p>{{ __('Noch keine Versionen vorhanden. Erstellen Sie Ihre erste Version!') }}</p>
|
|
</div>
|
|
@else
|
|
<div class="space-y-3">
|
|
@foreach($versions as $version)
|
|
<div wire:key="version-{{ $version->id }}"
|
|
class="flex items-center gap-4 p-4 bg-zinc-50 dark:bg-zinc-800 rounded-lg border border-zinc-200 dark:border-zinc-700 hover:border-zinc-300 dark:hover:border-zinc-600 transition">
|
|
|
|
<div class="flex-1 min-w-0">
|
|
<div class="flex items-center gap-3 mb-1">
|
|
<flux:badge :color="$version->is_active ? 'green' : 'zinc'" size="sm">
|
|
{{ $version->is_active ? __('Aktiv') : __('Inaktiv') }}
|
|
</flux:badge>
|
|
<a href="{{ route('admin.cms.display-version-edit', $version) }}"
|
|
wire:navigate
|
|
class="font-semibold text-sm hover:underline">
|
|
{{ $version->name }}
|
|
</a>
|
|
<flux:badge color="{{ match($version->type->value) {
|
|
'video-display' => 'purple',
|
|
'b2in' => 'blue',
|
|
'offers' => 'amber',
|
|
} }}" size="sm">
|
|
{{ $version->type->label() }}
|
|
</flux:badge>
|
|
</div>
|
|
<div class="text-xs text-zinc-600 dark:text-zinc-400 space-x-4">
|
|
<span>{{ $version->items_count }} {{ __('Inhalte') }}</span>
|
|
<span>{{ $version->displays_count }} {{ __('Displays') }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex items-center gap-2">
|
|
<flux:button wire:click="toggleActive({{ $version->id }})"
|
|
size="sm"
|
|
variant="ghost"
|
|
:icon="$version->is_active ? 'eye-slash' : 'eye'">
|
|
</flux:button>
|
|
|
|
<flux:button :href="route('admin.cms.display-version-edit', $version)"
|
|
wire:navigate
|
|
size="sm"
|
|
variant="ghost"
|
|
icon="pencil">
|
|
</flux:button>
|
|
|
|
<flux:button wire:click="deleteVersion({{ $version->id }})"
|
|
wire:confirm="Möchten Sie diese Version wirklich löschen? Alle zugehörigen Inhalte werden ebenfalls gelöscht."
|
|
size="sm"
|
|
variant="ghost"
|
|
icon="trash"
|
|
class="text-red-600 hover:text-red-700">
|
|
</flux:button>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
@endif
|
|
</flux:card>
|
|
|
|
{{-- Create Modal --}}
|
|
<flux:modal :open="$showCreateModal" wire:model="showCreateModal">
|
|
<form wire:submit.prevent="createVersion">
|
|
<div class="space-y-6">
|
|
<div>
|
|
<flux:heading size="lg">{{ __('Neue Version erstellen') }}</flux:heading>
|
|
</div>
|
|
|
|
<flux:input wire:model="newName" label="Name" placeholder="z.B. Herbst 2025 Video" />
|
|
@error('newName') <span class="text-red-600 text-sm">{{ $message }}</span> @enderror
|
|
|
|
<flux:select wire:model="newType" label="Typ" placeholder="Typ auswählen...">
|
|
@foreach($types as $type)
|
|
<option value="{{ $type->value }}">{{ $type->label() }}</option>
|
|
@endforeach
|
|
</flux:select>
|
|
@error('newType') <span class="text-red-600 text-sm">{{ $message }}</span> @enderror
|
|
|
|
<div class="flex justify-end gap-3 pt-4">
|
|
<flux:button type="button" wire:click="$set('showCreateModal', false)" variant="ghost">
|
|
{{ __('Abbrechen') }}
|
|
</flux:button>
|
|
<flux:button type="submit" variant="primary">
|
|
{{ __('Erstellen & Bearbeiten') }}
|
|
</flux:button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</flux:modal>
|
|
</div>
|