Pop Erweiterung auf Adressen

This commit is contained in:
Daniel Spitzer
2026-02-20 11:22:21 +01:00
parent 86bc518663
commit 4d518981fa
7 changed files with 205 additions and 13 deletions

View File

@@ -28,7 +28,12 @@ Vue.component('pop-map-modal', {
<div class="d-flex w-100 justify-content-between">
<h6 class="mb-1" :class="{ 'text-white': index === selectedIndex }">{{ pop.name }}</h6>
</div>
<small :class="index === selectedIndex ? 'text-white' : 'text-muted'">{{ categories[pop.category || 99] }} | {{ pop.location }}</small>
<small :class="index === selectedIndex ? 'text-white' : 'text-muted'">
<template v-if="pop.street || pop.city">
{{ pop.street }} {{ pop.number }}, {{ pop.zip }} {{ pop.city }} |
</template>
{{ categories[pop.category || 99] }}
</small>
</a>
</div>
</div>
@@ -257,11 +262,15 @@ Vue.component('pop-map-modal', {
let categoryName = this.categories[category] || 'Unbekannt';
let stateText = this.states[pop.state] || pop.state || '-';
let addressHtml = (pop.street || pop.city)
? `<div><strong>Adresse:</strong> ${pop.street || ''} ${pop.number || ''}, ${pop.zip || ''} ${pop.city || ''}</div>`
: '';
const popupContent = `
<div style="min-width: 200px;">
<h6 class="p-0"><i class="fas fa-building"></i> <strong>${pop.name}</strong></h6>
<hr class="my-2">
${addressHtml}
<div><strong>Kategorie:</strong> ${categoryName}</div>
<div><strong>Status:</strong> ${stateText}</div>
<div><strong>Info:</strong> ${pop.location || '-'}</div>
@@ -300,7 +309,10 @@ Vue.component('pop-map-modal', {
this.filteredPops = this.allPops.filter(pop =>
pop.name.toLowerCase().includes(query) ||
(pop.location && pop.location.toLowerCase().includes(query))
(pop.location && pop.location.toLowerCase().includes(query)) ||
(pop.street && pop.street.toLowerCase().includes(query)) ||
(pop.city && pop.city.toLowerCase().includes(query)) ||
(pop.zip && pop.zip.toLowerCase().includes(query))
).slice(0, 10);
this.showSuggestions = true;
@@ -345,10 +357,20 @@ Vue.component('pop-map-modal', {
this.showSuggestions = false;
this.selectedIndex = -1;
let found = this.markers.find(m => m.popData.name.toLowerCase().includes(query));
let found = this.markers.find(m =>
m.popData.name.toLowerCase().includes(query) ||
(m.popData.street && m.popData.street.toLowerCase().includes(query)) ||
(m.popData.city && m.popData.city.toLowerCase().includes(query)) ||
(m.popData.zip && m.popData.zip.toLowerCase().includes(query))
);
if (!found) {
const hiddenPop = this.allPops.find(p => p.name.toLowerCase().includes(query));
const hiddenPop = this.allPops.find(p =>
p.name.toLowerCase().includes(query) ||
(p.street && p.street.toLowerCase().includes(query)) ||
(p.city && p.city.toLowerCase().includes(query)) ||
(p.zip && p.zip.toLowerCase().includes(query))
);
if (hiddenPop) {
const category = hiddenPop.category || 99;
if (!this.visibleCategories[category]) {