Pop Übersichtsmap update
* Gesamtanzahl wird nun angezeigt mit und ohne Koordinaten
This commit is contained in:
@@ -48,7 +48,7 @@ Vue.component('pop-map-modal', {
|
||||
<label class="custom-control-label" for="cat-all" style="cursor: pointer;">
|
||||
</label>
|
||||
</div>
|
||||
<label for="cat-all" style="cursor: pointer; margin-bottom: 0;"><strong>Alle auswählen</strong></label>
|
||||
<label for="cat-all" style="cursor: pointer; margin-bottom: 0;"><strong>Alle auswählen</strong> ({{ totalCount }} <span v-if="totalCount !== allPops.length" class="text-danger" title="Gesamtanzahl inklusive POPs ohne Koordinaten">/ {{ allPops.length }}</span>)</label>
|
||||
</div>
|
||||
<div v-for="(label, key) in categories" :key="key" class="mb-1 d-flex align-items-center">
|
||||
<div class="custom-control custom-checkbox mr-2">
|
||||
@@ -96,11 +96,11 @@ Vue.component('pop-map-modal', {
|
||||
99: 'img/markers/marker-pop-bl.png'
|
||||
},
|
||||
categoryColors: {
|
||||
1: '#a1dfa0', // Outdoor - Green
|
||||
2: '#f8b767', // Indoor - Orange
|
||||
3: '#a9b8ec', // Sender - Blue
|
||||
4: '#f89797', // Container - Yellow
|
||||
99: '#808080' // Unbekannt - Gray
|
||||
1: '#a1dfa0',
|
||||
2: '#f8b767',
|
||||
3: '#a9b8ec',
|
||||
4: '#f89797',
|
||||
99: '#808080'
|
||||
},
|
||||
visibleCategories: {
|
||||
1: true,
|
||||
@@ -121,6 +121,9 @@ Vue.component('pop-map-modal', {
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
totalCount() {
|
||||
return Object.values(this.categoryCounts).reduce((acc, count) => acc + count, 0);
|
||||
},
|
||||
allCategoriesSelected: {
|
||||
get() {
|
||||
return Object.keys(this.categories).every(key => this.visibleCategories[key]);
|
||||
@@ -134,16 +137,12 @@ Vue.component('pop-map-modal', {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// Prepare data
|
||||
const popsObj = window.TT_CONFIG.POPS || {};
|
||||
this.allPops = Object.values(popsObj);
|
||||
|
||||
this.calculateCounts();
|
||||
|
||||
// Listen to modal open event to init map correctly (fix render issues)
|
||||
$(document).on('shown.bs.modal', '#popMapModal', this.initMap);
|
||||
|
||||
// Close suggestions when clicking outside
|
||||
document.addEventListener('click', this.handleClickOutside);
|
||||
},
|
||||
beforeDestroy() {
|
||||
@@ -152,17 +151,23 @@ Vue.component('pop-map-modal', {
|
||||
},
|
||||
methods: {
|
||||
calculateCounts() {
|
||||
// Reset counts
|
||||
for (let key in this.categoryCounts) {
|
||||
this.categoryCounts[key] = 0;
|
||||
}
|
||||
|
||||
this.allPops.forEach(pop => {
|
||||
const gps = pop.gps;
|
||||
if (!gps) return;
|
||||
const parts = gps.split(',');
|
||||
if (parts.length !== 2) return;
|
||||
const lat = parseFloat(parts[0]);
|
||||
const lng = parseFloat(parts[1]);
|
||||
if (isNaN(lat) || isNaN(lng) || (lat === 0 && lng === 0)) return;
|
||||
|
||||
const category = pop.category || 99;
|
||||
if (this.categoryCounts.hasOwnProperty(category)) {
|
||||
this.categoryCounts[category]++;
|
||||
} else {
|
||||
// Just in case we have a category not in our list, count it as 99 or ignore
|
||||
this.categoryCounts[99]++;
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user