fixed serving property calculation

Knalltuete5000 · Aug 24, 2023 · 17fa3c8 · 17fa3c8
1 parent c1ae4e3
commit 17fa3c8
Showing 1 changed file with 12 additions and 24 deletions.
diff --git a/vue/src/components/PropertyViewComponent.vue b/vue/src/components/PropertyViewComponent.vue
@@ -8,13 +8,6 @@
                     <h5><i class="fas fa-database"></i> {{ $t('Properties') }}</h5>
                 </b-col>
                 <b-col class="text-right">
-                    <span v-if="!show_total">{{ $t('per_serving') }} </span>
-                    <span v-if="show_total">{{ $t('total') }} </span>
-
-                    <a href="#" @click="show_total = !show_total">
-                        <i class="fas fa-toggle-on" v-if="!show_total"></i>
-                        <i class="fas fa-toggle-off" v-if="show_total"></i>
-                    </a>
 
                     <div v-if="hasRecipeProperties && hasFoodProperties">
                         <span v-if="!show_recipe_properties">{{ $t('Food') }} </span>
@@ -31,13 +24,20 @@
 
 
             <table class="table table-bordered table-sm">
+                <tr >
+                    <td style="border-top: none"></td>
+                    <td class="text-right" style="border-top: none">{{ $t('per_serving') }}</td>
+                    <td class="text-right" style="border-top: none">{{ $t('total') }}</td>
+                    <td style="border-top: none"></td>
+                </tr>
 
                 <tr v-for="p in property_list" v-bind:key="`id_${p.id}`">
                     <td>
 
                         {{ p.icon }} {{ p.name }}
                     </td>
-                    <td class="text-right">{{ get_amount(p.property_amount) }}</td>
+                    <td class="text-right">{{ p.property_amount_per_serving }}</td>
+                    <td class="text-right">{{ p.property_amount_total }}</td>
                     <td class=""> {{ p.unit }}</td>
 
                     <td class="align-middle text-center" v-if="!show_recipe_properties">
@@ -97,7 +97,6 @@ export default {
             selected_property: undefined,
             selected_food: undefined,
             show_food_edit_modal: false,
-            show_total: false,
             show_recipe_properties: false,
         }
     },
@@ -128,7 +127,8 @@ export default {
                             'description': rp.property_type.description,
                             'icon': rp.property_type.icon,
                             'food_values': [],
-                            'property_amount': rp.property_amount,
+                            'property_amount_per_serving': rp.property_amount,
+                            'property_amount_total': rp.property_amount * this.recipe.servings * (this.servings / this.recipe.servings),
                             'missing_value': false,
                             'unit': rp.property_type.unit,
                         }
@@ -143,7 +143,8 @@ export default {
                             'description': fp.description,
                             'icon': fp.icon,
                             'food_values': fp.food_values,
-                            'property_amount': fp.total_value,
+                            'property_amount_per_serving': fp.total_value / this.recipe.servings,
+                            'property_amount_total': fp.total_value * (this.servings / this.recipe.servings),
                             'missing_value': fp.missing_value,
                             'unit': fp.unit,
                         }
@@ -159,19 +160,6 @@ export default {
         }
     },
     methods: {
-        get_amount: function (amount) {
-            if (this.show_total) {
-                return (amount * (this.servings / this.recipe.servings)).toLocaleString(window.CUSTOM_LOCALE, {
-                    'maximumFractionDigits': 2,
-                    'minimumFractionDigits': 2
-                })
-            } else {
-                return (amount / this.recipe.servings).toLocaleString(window.CUSTOM_LOCALE, {
-                    'maximumFractionDigits': 2,
-                    'minimumFractionDigits': 2
-                })
-            }
-        },
         openFoodEditModal: function (food) {
             console.log(food)
             let apiClient = ApiApiFactory()