12-05-2026 admin, Panel Displays

This commit is contained in:
Kevin Adametz 2026-05-12 18:28:38 +02:00
parent 0762e3beac
commit 6a65354f4c
43 changed files with 3273 additions and 410 deletions

View file

@ -2,7 +2,7 @@
{{-- Header --}}
<div class="flex items-center justify-between mb-6">
<div class="flex items-center gap-4">
<flux:button :href="route('admin.cms.display-versions')" wire:navigate variant="ghost" icon="arrow-left" size="sm">
<flux:button :href="route('admin.cms.display-modules')" wire:navigate variant="ghost" icon="arrow-left" size="sm">
{{ __('Zurück') }}
</flux:button>
<div>
@ -16,7 +16,7 @@
{{ $version->type->label() }}
</flux:badge>
</div>
<flux:subheading>{{ __('Version bearbeiten') }}</flux:subheading>
<flux:subheading>{{ __('Modul bearbeiten') }}</flux:subheading>
</div>
</div>
<div class="flex items-center gap-3">
@ -44,12 +44,37 @@
<flux:card class="mb-6">
<form wire:submit.prevent="saveName" class="flex items-end gap-4">
<div class="flex-1">
<flux:input wire:model="versionName" label="Versionsname" />
<flux:input wire:model="versionName" label="Modulname" />
</div>
<flux:button type="submit" variant="primary" size="sm">{{ __('Speichern') }}</flux:button>
</form>
</flux:card>
{{-- Modul-Vorschau --}}
<flux:card class="mb-6">
<div class="mb-4 flex items-center justify-between gap-3">
<div>
<flux:heading size="lg">{{ __('Modul-Vorschau') }}</flux:heading>
<flux:subheading>{{ __('Live gerenderte Einzelmodul-Vorschau im Display-Player') }}</flux:subheading>
</div>
<a href="{{ $this->modulePreviewUrl() }}"
target="_blank"
class="inline-flex items-center gap-1 text-xs text-blue-600 hover:underline dark:text-blue-400">
<flux:icon.arrow-top-right-on-square class="w-3 h-3" />
{{ __('Vollbild-Vorschau') }}
</a>
</div>
<div class="mx-auto aspect-[9/16] w-full max-w-[320px] overflow-hidden rounded-xl border border-zinc-200 bg-black shadow-sm dark:border-zinc-700">
<iframe
wire:key="module-preview-{{ $previewFrameRefreshCounter }}"
src="{{ $this->modulePreviewUrl() }}"
class="h-full w-full border-0"
title="{{ __('Modul-Vorschau') }}"
></iframe>
</div>
</flux:card>
{{-- Type-specific content sections --}}
@if($version->type->value === 'video-display')
@include('livewire.admin.cms.partials.version-editor-video', ['items' => $items])
@ -59,8 +84,28 @@
@include('livewire.admin.cms.partials.version-editor-offers', ['items' => $items])
@endif
{{-- Module-level metadata --}}
<flux:card class="mt-8 mb-6">
<form wire:submit.prevent="saveSettings">
<div class="space-y-6">
<div>
<flux:heading size="lg">{{ __('Meta-Einstellungen für dieses Modul') }}</flux:heading>
<flux:subheading>{{ __('Diese Werte gelten für die gesamte Media-Playlist bzw. alle Slides dieses Moduls.') }}</flux:subheading>
</div>
@include('livewire.admin.cms.partials.version-editor-settings', ['context' => 'inline'])
<div class="flex justify-end">
<flux:button type="submit" variant="primary" size="sm">
{{ __('Meta-Einstellungen speichern') }}
</flux:button>
</div>
</div>
</form>
</flux:card>
{{-- Item Modal --}}
<flux:modal :open="$showItemModal" wire:model="showItemModal">
<flux:modal :open="$showItemModal" wire:model="showItemModal" class="w-full max-w-5xl">
<form wire:submit.prevent="saveItem">
<div class="space-y-6">
<div>
@ -194,12 +239,38 @@
<flux:checkbox wire:model="slideIsActive" label="Aktiv" />
@endif
<div class="flex justify-end gap-3 pt-4">
<div class="space-y-3 border-t border-zinc-200 pt-6 dark:border-zinc-700">
<div>
<flux:heading size="sm">{{ __('Einzel-Vorschau im Bearbeiten-Dialog') }}</flux:heading>
<flux:subheading>{{ __('Zeigt nur den aktuell bearbeiteten Inhalt im Display-Player') }}</flux:subheading>
</div>
<div class="mx-auto aspect-[9/16] w-full max-w-[320px] overflow-hidden rounded-xl border border-zinc-200 bg-black shadow-sm dark:border-zinc-700">
<iframe
wire:key="item-modal-module-preview-{{ $previewFrameRefreshCounter }}"
src="{{ $this->itemPreviewUrl() }}"
class="h-full w-full border-0"
title="{{ __('Einzel-Vorschau im Bearbeiten-Dialog') }}"
></iframe>
</div>
<a href="{{ $this->itemPreviewUrl() }}"
target="_blank"
class="mx-auto flex max-w-[320px] items-center justify-center gap-1 text-xs text-blue-600 hover:underline dark:text-blue-400">
<flux:icon.arrow-top-right-on-square class="w-3 h-3" />
{{ __('Vollbild öffnen') }}
</a>
</div>
<div class="flex flex-wrap justify-end gap-3 border-t border-zinc-200 pt-4 dark:border-zinc-700">
<flux:button type="submit" variant="primary">
{{ $itemId ? __('Aktualisieren') : __('Hinzufügen') }}
</flux:button>
<flux:button type="button" wire:click="closeItemModal" variant="ghost">
{{ __('Abbrechen') }}
</flux:button>
<flux:button type="submit" variant="primary">
{{ $itemId ? __('Aktualisieren') : __('Hinzufügen') }}
<flux:button type="button" wire:click="closeItemModal">
{{ __('Schließen') }}
</flux:button>
</div>
</div>
@ -215,31 +286,7 @@
<flux:subheading>{{ $version->type->label() }}</flux:subheading>
</div>
@if($version->type->value === 'b2in')
<flux:select wire:model="settings.theme" label="Theme">
<option value="dark">Dark</option>
<option value="light">Light</option>
</flux:select>
<flux:input wire:model="settings.footer_name" label="Footer Name" placeholder="z.B. Marcel Scheibe" />
<flux:input wire:model="settings.footer_url" label="Footer URL" placeholder="z.B. b2in.de" />
<flux:select wire:model="settings.transition.type" label="Transition">
<option value="crossfade">Crossfade</option>
<option value="fade">Fade</option>
<option value="slide">Slide</option>
</flux:select>
<flux:input wire:model="settings.transition.duration_ms" type="number" label="Transition-Dauer (ms)" />
<flux:input wire:model="settings.default_image_duration" type="number" label="Standard-Bilddauer (Sek.)" />
<flux:checkbox wire:model="settings.display_active" label="Display aktiv" />
@elseif($version->type->value === 'offers')
<flux:checkbox wire:model="settings.loop" label="Endlosschleife" />
<flux:select wire:model="settings.transition.type" label="Transition">
<option value="fade">Fade</option>
<option value="slide">Slide</option>
</flux:select>
<flux:input wire:model="settings.transition.duration" type="number" label="Transition-Dauer (ms)" />
@elseif($version->type->value === 'video-display')
<p class="text-sm text-zinc-500 dark:text-zinc-400">{{ __('Keine speziellen Einstellungen für diesen Typ.') }}</p>
@endif
@include('livewire.admin.cms.partials.version-editor-settings', ['context' => 'modal'])
<div class="flex justify-end gap-3 pt-4">
<flux:button type="button" wire:click="$set('showSettingsModal', false)" variant="ghost">