Refactor RevenueSection to utilize a betterPricesMap for improved price handling

- Replaced direct product.betterPrices usage with a betterPricesMap to store prices separately, enhancing data management.
- Updated computed properties and methods to clear betterPricesMap when product list or region changes, ensuring accurate price loading.
- Introduced getBetterPrices method for cleaner access to price data, improving code readability and maintainability.
This commit is contained in:
Torsten Schulz (local)
2025-12-03 13:32:02 +01:00
parent 90fbcaf31d
commit 87c720c3fe

View File

@@ -28,8 +28,8 @@
<td>{{ calculateProductProfit(product).absolute }}</td> <td>{{ calculateProductProfit(product).absolute }}</td>
<td>{{ calculateProductProfit(product).perMinute }}</td> <td>{{ calculateProductProfit(product).perMinute }}</td>
<td> <td>
<div v-if="product.betterPrices && product.betterPrices.length > 0" class="price-cities"> <div v-if="getBetterPrices(product.id) && getBetterPrices(product.id).length > 0" class="price-cities">
<span v-for="city in product.betterPrices" :key="city.regionId" <span v-for="city in getBetterPrices(product.id)" :key="city.regionId"
:class="['city-price', getCityPriceClass(city.branchType)]" :class="['city-price', getCityPriceClass(city.branchType)]"
:title="`${city.regionName}: ${formatPrice(city.price)}`"> :title="`${city.regionName}: ${formatPrice(city.price)}`">
{{ city.regionName }} {{ city.regionName }}
@@ -59,6 +59,7 @@
return { return {
isRevenueTableOpen: false, isRevenueTableOpen: false,
loadingPrices: new Set(), loadingPrices: new Set(),
betterPricesMap: {}, // Map von productId zu betterPrices Array
}; };
}, },
computed: { computed: {
@@ -83,14 +84,22 @@
} }
}, },
products: { products: {
handler() { handler(newProducts, oldProducts) {
// Leere betterPricesMap wenn sich die Produktliste ändert
if (oldProducts && oldProducts.length > 0) {
this.betterPricesMap = {};
}
if (this.isRevenueTableOpen && this.currentRegionId !== null) { if (this.isRevenueTableOpen && this.currentRegionId !== null) {
this.loadPricesForAllProducts(); this.loadPricesForAllProducts();
} }
}, },
deep: true deep: true
}, },
currentRegionId(newVal) { currentRegionId(newVal, oldVal) {
// Leere betterPricesMap wenn sich die Region ändert
if (oldVal !== null && oldVal !== undefined) {
this.betterPricesMap = {};
}
if (this.isRevenueTableOpen && newVal !== null) { if (this.isRevenueTableOpen && newVal !== null) {
this.loadPricesForAllProducts(); this.loadPricesForAllProducts();
} }
@@ -111,7 +120,9 @@
if (this.loadingPrices.has(product.id)) continue; if (this.loadingPrices.has(product.id)) continue;
this.loadingPrices.add(product.id); this.loadingPrices.add(product.id);
try { try {
// Verwende den gerundeten Preis aus calculateProductRevenue (wie gewollt)
const currentPrice = parseFloat(this.calculateProductRevenue(product).absolute); const currentPrice = parseFloat(this.calculateProductRevenue(product).absolute);
const { data } = await apiClient.get('/api/falukant/products/prices-in-cities', { const { data } = await apiClient.get('/api/falukant/products/prices-in-cities', {
params: { params: {
productId: product.id, productId: product.id,
@@ -119,15 +130,19 @@
currentRegionId: this.currentRegionId currentRegionId: this.currentRegionId
} }
}); });
this.$set(product, 'betterPrices', data || []); // Speichere betterPrices in einem separaten Map, nicht auf dem product Objekt
this.$set(this.betterPricesMap, product.id, data || []);
} catch (error) { } catch (error) {
console.error(`Error loading prices for product ${product.id}:`, error); console.error(`Error loading prices for product ${product.id}:`, error);
this.$set(product, 'betterPrices', []); this.$set(this.betterPricesMap, product.id, []);
} finally { } finally {
this.loadingPrices.delete(product.id); this.loadingPrices.delete(product.id);
} }
} }
}, },
getBetterPrices(productId) {
return this.betterPricesMap[productId] || [];
},
getCityPriceClass(branchType) { getCityPriceClass(branchType) {
if (branchType === 'store') return 'city-price-green'; if (branchType === 'store') return 'city-price-green';
if (branchType === 'production') return 'city-price-orange'; if (branchType === 'production') return 'city-price-orange';