CMS-Widget für Reisekategorien auf der Startseite hinzufügen.

Ermöglicht die gezielte Auswahl von Länder-Übersichtsseiten im Sidebar-Widget,
statt die Kategorien fest im Code der Startseite zu pflegen.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Kevin Adametz 2026-06-18 10:46:24 +00:00
parent c39d86f80b
commit 43a3748f5b
3 changed files with 210 additions and 33 deletions

View file

@ -70,7 +70,11 @@ class CMSSidebarController extends Controller
$component = isset($data['component']) ? $data['component'] : null;
if (in_array($component, [SidebarWidget::HOMEPAGE_PLANNABLE_TRIPS, SidebarWidget::HOMEPAGE_POPULAR_TRIPS])) {
if (in_array($component, [
SidebarWidget::HOMEPAGE_PLANNABLE_TRIPS,
SidebarWidget::HOMEPAGE_POPULAR_TRIPS,
SidebarWidget::HOMEPAGE_TRAVEL_CATEGORIES,
])) {
$pageIds = isset($data['homepage_page_ids']) ? array_values(array_filter($data['homepage_page_ids'])) : [];
$newPageIds = isset($data['homepage_new_page_ids']) ? array_values(array_filter($data['homepage_new_page_ids'])) : [];

View file

@ -34,6 +34,7 @@ class SidebarWidget extends Model
{
const HOMEPAGE_PLANNABLE_TRIPS = 'homepagePlannableTrips';
const HOMEPAGE_POPULAR_TRIPS = 'homepagePopularTrips';
const HOMEPAGE_TRAVEL_CATEGORIES = 'homepageTravelCategories';
const NEWS_SIDEBAR_WIDGET = 'newsSidebarWidget';
@ -61,6 +62,7 @@ class SidebarWidget extends Model
self::NEWS_SIDEBAR_WIDGET => 'News',
self::HOMEPAGE_PLANNABLE_TRIPS => 'Startseite: Aktuell planbare Reisen',
self::HOMEPAGE_POPULAR_TRIPS => 'Startseite: Beliebte Kulturreisen',
self::HOMEPAGE_TRAVEL_CATEGORIES => 'Startseite: Reisekategorien',
];
@ -125,6 +127,16 @@ class SidebarWidget extends Model
return in_array($this->component, [self::HOMEPAGE_PLANNABLE_TRIPS, self::HOMEPAGE_POPULAR_TRIPS]);
}
public function isHomepageTravelCategoriesComponent()
{
return $this->component === self::HOMEPAGE_TRAVEL_CATEGORIES;
}
public function isHomepagePagePickerComponent()
{
return $this->isHomepageTripsComponent() || $this->isHomepageTravelCategoriesComponent();
}
public function isNewsComponent()
{
return $this->component === self::NEWS_SIDEBAR_WIDGET;
@ -132,7 +144,7 @@ class SidebarWidget extends Model
public function isStructuredConfigComponent()
{
return $this->isHomepageTripsComponent() || $this->isNewsComponent();
return $this->isHomepagePagePickerComponent() || $this->isNewsComponent();
}
public function getConfig()
@ -254,6 +266,99 @@ class SidebarWidget extends Model
return $items;
}
public static function getHomepageCountryPageOptions($selectedIds = [])
{
$selectedIds = array_map('intval', (array) $selectedIds);
$items = self::getHomepageCountryPageItems($selectedIds);
$ret = '';
foreach ($items as $item) {
$attr = $item['selected'] ? 'selected="selected"' : '';
$label = e($item['label']);
$ret .= '<option value="'.$item['id'].'" data-label="'.$label.'" '.$attr.'>'.$label.'</option>'."\n";
}
return $ret;
}
public static function getHomepageCountryPageItems($selectedIds = [])
{
$selectedIds = array_map('intval', (array) $selectedIds);
$pages = Page::with('travel_country')
->where('status', '>', 0)
->where('template', 'overview')
->where('lvl', 0)
->whereNotNull('country_id')
->orderBy('lft')
->orderBy('title')
->get();
$items = [];
foreach ($pages as $page) {
$items[] = [
'id' => (int) $page->id,
'label' => self::getHomepageCountryPageLabel($page),
'selected' => in_array((int) $page->id, $selectedIds),
];
}
return $items;
}
public function getHomepageSelectedCountryPageItems()
{
$selectedIds = array_map('intval', $this->getHomepagePageIds());
if (empty($selectedIds)) {
return [];
}
$pages = Page::with('travel_country')
->whereIn('id', $selectedIds)
->where('status', '>', 0)
->where('template', 'overview')
->where('lvl', 0)
->whereNotNull('country_id')
->get()
->keyBy('id');
$items = [];
foreach ($selectedIds as $pageId) {
if (!$pages->has($pageId)) {
continue;
}
$page = $pages->get($pageId);
$items[] = [
'id' => (int) $page->id,
'label' => self::getHomepageCountryPageLabel($page),
'is_new' => false,
];
}
return $items;
}
public function getHomepageSelectedPagePickerItems()
{
return $this->isHomepageTravelCategoriesComponent()
? $this->getHomepageSelectedCountryPageItems()
: $this->getHomepageSelectedTravelPageItems();
}
protected static function getHomepageCountryPageLabel(Page $page)
{
$country = $page->travel_country && $page->travel_country->name
? $page->travel_country->name
: null;
if ($country) {
return $page->title.' | '.$country.' (#'.$page->id.')';
}
return $page->title.' (#'.$page->id.')';
}
public function getHomepageSelectedTravelPageItems()
{
$selectedIds = array_map('intval', $this->getHomepagePageIds());

View file

@ -52,7 +52,32 @@
</small>
</div>
</div>
<div data-config-panel="homepage-trips" style="{{ $widget->isHomepageTripsComponent() ? '' : 'display:none;' }}">
<div data-config-panel="homepage-page-picker" style="{{ $widget->isHomepagePagePickerComponent() ? '' : 'display:none;' }}">
<div data-homepage-picker-type="categories" style="{{ $widget->isHomepageTravelCategoriesComponent() ? '' : 'display:none;' }}">
<div class="alert alert-info">
Diese Auswahl steuert den Startseiten-Bereich „Alle Reisekategorien auf einen Blick".
Die Reihenfolge entspricht der Reihenfolge der ausgewählten Einträge.
</div>
<div class="form-row">
<div class="form-group col-sm-12">
<label class="form-label" for="homepage_country_page_picker">{{ __('Reisekategorie hinzufügen') }}</label>
<div class="input-group">
<select class="selectpicker form-control" data-style="btn-default" name="homepage_country_page_picker" id="homepage_country_page_picker" data-live-search="true">
<option value="">{{ __('Bitte Reisekategorie wählen') }}</option>
{!! \App\Models\SidebarWidget::getHomepageCountryPageOptions($widget->isHomepageTravelCategoriesComponent() ? $widget->getHomepagePageIds() : []) !!}
</select>
<span class="input-group-append">
<button class="btn btn-primary" type="button" id="homepage_add_country_page">{{ __('hinzufügen') }}</button>
</span>
</div>
<small class="form-text text-muted">
Es werden Länder-Übersichtsseiten angezeigt (wie zuvor automatisch auf der Startseite).
Wenn keine Kategorien ausgewählt sind, nutzt die Startseite die automatische Länderliste.
</small>
</div>
</div>
</div>
<div data-homepage-picker-type="trips" style="{{ $widget->isHomepageTripsComponent() ? '' : 'display:none;' }}">
<div class="alert alert-info">
Diese Auswahl steuert die Startseiten-Bereiche „Aktuell planbare Reisen" und „Beliebte Kulturreisen".
Die Reihenfolge entspricht der Reihenfolge der ausgewählten Einträge.
@ -63,22 +88,23 @@
<div class="input-group">
<select class="selectpicker form-control" data-style="btn-default" name="homepage_page_picker" id="homepage_page_picker" data-live-search="true">
<option value="">{{ __('Bitte Reise wählen') }}</option>
{!! \App\Models\SidebarWidget::getHomepageTravelPageOptions($widget->getHomepagePageIds()) !!}
{!! \App\Models\SidebarWidget::getHomepageTravelPageOptions($widget->isHomepageTripsComponent() ? $widget->getHomepagePageIds() : []) !!}
</select>
<span class="input-group-append">
<button class="btn btn-primary" type="button" id="homepage_add_page">{{ __('hinzufügen') }}</button>
<button class="btn btn-primary" type="button" id="homepage_add_travel_page">{{ __('hinzufügen') }}</button>
</span>
</div>
<small class="form-text text-muted">
Wenn keine Reisen hinzugefügt sind, nutzt die DEV-Startseite die automatische Prioritätslogik.
Wenn keine Reisen hinzugefügt sind, nutzt die Startseite die automatische Prioritätslogik.
</small>
</div>
</div>
</div>
<div class="form-row">
<div class="form-group col-sm-12">
<label class="form-label">{{ __('Ausgewählte Reisen') }}</label>
<label class="form-label" id="homepage_selected_pages_label">{{ $widget->isHomepageTravelCategoriesComponent() ? __('Ausgewählte Reisekategorien') : __('Ausgewählte Reisen') }}</label>
<div class="list-group" id="homepage_selected_pages">
@foreach($widget->getHomepageSelectedTravelPageItems() as $selectedPage)
@foreach($widget->getHomepageSelectedPagePickerItems() as $selectedPage)
<div class="list-group-item d-flex align-items-center justify-content-between" data-page-id="{{ $selectedPage['id'] }}">
<input type="hidden" name="homepage_page_ids[]" value="{{ $selectedPage['id'] }}">
<span class="mr-3">
@ -86,12 +112,14 @@
{{ $selectedPage['label'] }}
</span>
<span class="d-flex align-items-center">
@if($widget->isHomepageTripsComponent())
<label class="custom-control custom-checkbox mb-0 mr-3">
<input type="checkbox" class="custom-control-input" name="homepage_new_page_ids[]" value="{{ $selectedPage['id'] }}" {{ $selectedPage['is_new'] ? 'checked' : '' }}>
<span class="custom-control-label">
<span class="badge badge-warning">{{ __('Neu') }}</span>
</span>
</label>
@endif
<span class="btn-group btn-group-sm mr-2" role="group" aria-label="{{ __('Reihenfolge ändern') }}">
<button class="btn btn-outline-secondary" type="button" data-move-page="up">{{ __('hoch') }}</button>
<button class="btn btn-outline-secondary" type="button" data-move-page="down">{{ __('runter') }}</button>
@ -138,17 +166,28 @@
$(function () {
var componentSelect = $('#component');
var panels = $('[data-config-panel]');
var homepageTripComponents = ['homepagePlannableTrips', 'homepagePopularTrips'];
var pagePicker = $('#homepage_page_picker');
var homepagePagePickerComponents = ['homepagePlannableTrips', 'homepagePopularTrips', 'homepageTravelCategories'];
var selectedPages = $('#homepage_selected_pages');
function updateHomepagePickerType(component) {
var isCategories = component === 'homepageTravelCategories';
var isTrips = ['homepagePlannableTrips', 'homepagePopularTrips'].indexOf(component) !== -1;
$('[data-homepage-picker-type="categories"]').toggle(isCategories);
$('[data-homepage-picker-type="trips"]').toggle(isTrips);
$('#homepage_selected_pages_label').text(
isCategories ? '{{ __('Ausgewählte Reisekategorien') }}' : '{{ __('Ausgewählte Reisen') }}'
);
}
function updateConfigPanels() {
var component = componentSelect.val();
panels.hide();
if (homepageTripComponents.indexOf(component) !== -1) {
$('[data-config-panel="homepage-trips"]').show();
if (homepagePagePickerComponents.indexOf(component) !== -1) {
$('[data-config-panel="homepage-page-picker"]').show();
updateHomepagePickerType(component);
} else if (component === 'newsSidebarWidget') {
$('[data-config-panel="news"]').show();
} else {
@ -163,6 +202,8 @@
return;
}
var showNewBadge = homepagePagePickerComponents.indexOf(componentSelect.val()) !== -1
&& ['homepagePlannableTrips', 'homepagePopularTrips'].indexOf(componentSelect.val()) !== -1;
var item = $('<div class="list-group-item d-flex align-items-center justify-content-between"></div>');
var title = $('<span class="mr-3"></span>');
var controls = $('<span class="d-flex align-items-center"></span>');
@ -182,9 +223,11 @@
item.append($('<input type="hidden" name="homepage_page_ids[]">').val(pageId));
title.append($('<span class="badge badge-secondary mr-2" data-page-number></span>'));
title.append(document.createTextNode(label));
if (showNewBadge) {
newLabel.append(newCheckbox);
newLabel.append($('<span class="custom-control-label"><span class="badge badge-warning">{{ __('Neu') }}</span></span>'));
controls.append(newLabel);
}
moveButtons.append($('<button class="btn btn-outline-secondary" type="button" data-move-page="up">{{ __('hoch') }}</button>'));
moveButtons.append($('<button class="btn btn-outline-secondary" type="button" data-move-page="down">{{ __('runter') }}</button>'));
controls.append(moveButtons);
@ -201,9 +244,34 @@
});
}
componentSelect.on('changed.bs.select change', updateConfigPanels);
$('#homepage_add_page').on('click', function () {
var selectedOption = pagePicker.find('option:selected');
componentSelect.on('changed.bs.select change', function () {
var previousComponent = componentSelect.data('previous-component') || '';
var component = componentSelect.val();
var switchedPickerType = (
(previousComponent === 'homepageTravelCategories' && component !== 'homepageTravelCategories') ||
(previousComponent !== 'homepageTravelCategories' && component === 'homepageTravelCategories')
);
if (switchedPickerType && selectedPages.find('[data-page-id]').length) {
if (window.confirm('Beim Wechsel der Komponente werden die aktuell ausgewählten Einträge geleert. Fortfahren?')) {
selectedPages.empty();
} else {
componentSelect.selectpicker('val', previousComponent);
$('.selectpicker').selectpicker('refresh');
return;
}
}
componentSelect.data('previous-component', component);
updateConfigPanels();
});
componentSelect.data('previous-component', componentSelect.val());
$('#homepage_add_country_page').on('click', function () {
var selectedOption = $('#homepage_country_page_picker').find('option:selected');
addSelectedPage(selectedOption.val(), selectedOption.data('label') || selectedOption.text(), false);
});
$('#homepage_add_travel_page').on('click', function () {
var selectedOption = $('#homepage_page_picker').find('option:selected');
addSelectedPage(selectedOption.val(), selectedOption.data('label') || selectedOption.text(), false);
});
selectedPages.on('click', '[data-remove-page]', function () {