src/pages/Supplier/Card/SupplierConsumption.vue

@@ -1,9 +1,9 @@
 <script setup>
 import { useRoute } from 'vue-router';
-import { computed, onMounted, watch, onUnmounted } from 'vue';
+import { computed, onMounted, watch, onUnmounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
-
+import VnLv from 'src/components/ui/VnLv.vue';
 import FetchedTags from 'components/ui/FetchedTags.vue';
 import SendEmailDialog from 'components/common/SendEmailDialog.vue';
 import SupplierConsumptionFilter from './SupplierConsumptionFilter.vue';
@@ -25,7 +25,7 @@ const route = useRoute();
 const { openReport, sendEmail } = usePrintService();
 const quasar = useQuasar();
 const { notify } = useNotify();
-
+const totalRows = ref({});
 const arrayData = useArrayData('SupplierConsumption', {
     url: 'Suppliers/consumption',
     order: ['itemTypeFk', 'itemName', 'itemSize'],
@@ -34,7 +34,6 @@ const arrayData = useArrayData('SupplierConsumption', {
 
 const store = arrayData.store;
 
-console.log('route del principio', route.query.from);
 watch(() => route.query);
 
 onUnmounted(() => state.unset('SupplierConsumption'));
@@ -44,7 +43,6 @@ const dateRanges = computed(() => {
         to: null,
     };
 
-    console.log('route del if', route.query.from);
     if (route.query && route.query.params) {
         const params = JSON.parse(route.query.params);
         if (params.from && params.to) {
@@ -65,7 +63,10 @@ async function getSupplierConsumptionData() {
     await arrayData.fetch({ append: false });
 }
 
-const rows = computed(() => store.data || []);
+const rows = computed(() => {
+    console.log(store.data);
+    return totalEntryPrice(store.data) || [];
+});
 
 const openReportPdf = () => {
     openReport(`Suppliers/${route.params.id}/campaign-metrics-pdf`, reportParams.value);
@@ -112,11 +113,28 @@ const sendCampaignMetricsEmail = ({ address }) => {
     });
 };
 
-const calculateTotal = (buysArray = []) =>
+const totalEntryPrice = (rows) => {
-    buysArray.reduce((accumulator, { total }) => accumulator + total, 0);
+    let totalPrice = 0;
+    let totalQuantity = 0;
+    if (!rows) return totalPrice;
+    for (const row of rows) {
+        let total = 0;
+        let quantity = 0;
+        for (const buy of row.buys) {
+            total = total + buy.total;
+            quantity = quantity + buy.quantity;
+        }
+        row.total = total;
+        row.quantity = quantity;
+        totalPrice = totalPrice + total;
+        totalQuantity = totalQuantity + quantity;
+    }
+    totalRows.value = { totalPrice, totalQuantity };
+    return rows;
+};
 
-const calculateTotalStems = (buysArray = []) =>
+totalEntryPrice(rows.value);
-    buysArray.reduce((accumulator, { quantity }) => accumulator + quantity, 0);
+console.log('row', rows.value);
 
 onMounted(async () => {
     stateStore.rightDrawer = true;
@@ -153,7 +171,23 @@ console.log('dateRange value', dateRanges.value);
             </QTooltip>
         </QBtn>
     </Teleport>
-
+    <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
+        <div class="row q-gutter-md">
+            <div>
+                {{ t('Total entries') }}:
+                <QChip :dense="$q.screen.lt.sm" text-color="white">
+                    {{ totalRows.totalPrice }} €
+                </QChip>
+            </div>
+            <QSeparator dark vertical />
+            <div>
+                {{ t('Total stems entries') }}:
+                <QChip :dense="$q.screen.lt.sm" text-color="white">
+                    {{ totalRows.totalQuantity }}
+                </QChip>
+            </div>
+        </div>
+    </Teleport>
     <QPage class="column items-center q-pa-md">
         <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
             <QScrollArea class="fit text-grey-8">
@@ -186,7 +220,7 @@ console.log('dateRange value', dateRanges.value);
                 </QTr>
                 <QTr v-for="(buy, index) in row.buys" :key="index">
                     <QTd no-hover>
-                        <QBtn flat color="blue" dense>{{ buy.itemName }}</QBtn>
+                        <QBtn flat color="blue" dense no-caps>{{ buy.itemName }}</QBtn>
                         <ItemDescriptorProxy :id="buy.itemFk" />
                     </QTd>
 
@@ -201,11 +235,11 @@ console.log('dateRange value', dateRanges.value);
                 <QTr>
                     <QTd colspan="5" no-hover>
                         <span class="label">{{ t('Total entry') }}: </span>
-                        <span>{{ calculateTotal(row.buys) }}</span>
+                        <span>{{ row.total }} €</span>
                     </QTd>
                     <QTd no-hover>
                         <span class="label">{{ t('Total stems') }}: </span>
-                        <span>{{ calculateTotalStems(row.buys) }}</span>
+                        <span>{{ row.quantity }}</span>
                     </QTd>
                 </QTr>
             </template>
@@ -222,6 +256,8 @@ console.log('dateRange value', dateRanges.value);
 <i18n>
 es:
     Total entry: Total entrada
+    Total entries: Total de las entradas
+    Total stems entries: Total de tallos de las entradas
     Total stems: Total tallos
     Open as PDF: Abrir como PDF
     Send to email: Enviar por email