Enhance RevenueSection UI and streamline price loading logic

- Updated the display of city prices in the RevenueSection component to include both city names and formatted price values, improving user experience.
- Removed unnecessary console logs from the loadPricesForAllProducts method to clean up the code and reduce clutter, while maintaining essential functionality.
- Simplified the getBetterPrices method by eliminating redundant logging, enhancing code clarity and performance.

frontend/src/components/falukant/RevenueSection.vue

@@ -32,7 +32,8 @@
                   <span v-for="city in getBetterPrices(product.id)" :key="city.regionId" 
                         :class="['city-price', getCityPriceClass(city.branchType)]"
                         :title="`${city.regionName}: ${formatPrice(city.price)}`">
-                    {{ city.regionName }}
+                    <span class="city-name">{{ city.regionName }}</span>
+                    <span class="city-price-value">({{ formatPrice(city.price) }})</span>
                   </span>
                 </div>
                 <span v-else class="no-better-prices">—</span>
@@ -113,19 +114,15 @@
         }
       },
       async loadPricesForAllProducts() {
-        console.log('[RevenueSection] loadPricesForAllProducts called, currentRegionId:', this.currentRegionId);
         if (this.currentRegionId === null || this.currentRegionId === undefined) {
-          console.log('[RevenueSection] currentRegionId is null/undefined, returning');
           return;
         }
-        console.log('[RevenueSection] Loading prices for', this.products.length, 'products');
         for (const product of this.products) {
           if (this.loadingPrices.has(product.id)) continue;
           this.loadingPrices.add(product.id);
           try {
             // Verwende den gerundeten Preis aus calculateProductRevenue (wie gewollt)
             const currentPrice = parseFloat(this.calculateProductRevenue(product).absolute);
-            console.log(`[RevenueSection] Loading prices for product ${product.id} (${product.labelTr}), currentPrice: ${currentPrice}`);
             
             const { data } = await apiClient.get('/api/falukant/products/prices-in-cities', {
               params: {
@@ -134,14 +131,12 @@
                 currentRegionId: this.currentRegionId
               }
             });
-            console.log(`[RevenueSection] Received ${data?.length || 0} better prices for product ${product.id}:`, data);
             // Speichere betterPrices in einem separaten Map, nicht auf dem product Objekt
             // In Vue 3 müssen wir ein neues Objekt erstellen, um die Reaktivität zu triggern
             this.betterPricesMap = {
               ...this.betterPricesMap,
               [product.id]: data || []
             };
-            console.log(`[RevenueSection] Updated betterPricesMap for product ${product.id}:`, this.betterPricesMap[product.id]);
           } catch (error) {
             console.error(`Error loading prices for product ${product.id}:`, error);
             this.betterPricesMap = {
@@ -152,12 +147,9 @@
             this.loadingPrices.delete(product.id);
           }
         }
-        console.log('[RevenueSection] Finished loading prices, betterPricesMap:', this.betterPricesMap);
       },
       getBetterPrices(productId) {
-        const prices = this.betterPricesMap[productId] || [];
-        console.log(`[RevenueSection] getBetterPrices(${productId}):`, prices, 'full map:', this.betterPricesMap);
-        return prices;
+        return this.betterPricesMap[productId] || [];
       },
       getCityPriceClass(branchType) {
         if (branchType === 'store') return 'city-price-green';
@@ -214,6 +206,16 @@
     border-radius: 3px;
     font-size: 0.85em;
     cursor: help;
+    display: inline-flex;
+    align-items: center;
+    gap: 0.3em;
+  }
+  .city-name {
+    font-weight: 500;
+  }
+  .city-price-value {
+    font-size: 0.9em;
+    opacity: 0.9;
   }
   .city-price-green {
     background-color: #90EE90;