feat(Proof card): show new consumption-related fields in the footer (#…

…977)
openfoodfacts · Oct 21, 2024 · e0ee131 · e0ee131
1 parent c50b188
commit e0ee131
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 1 deletion.
diff --git a/src/components/ProofCard.vue b/src/components/ProofCard.vue
@@ -64,7 +64,7 @@ export default {
   computed: {
     getProofUrl() {
       // return 'https://prices.openfoodfacts.org/img/0002/qU59gK8PQw.400.webp'  // PRICE_TAG
-      // return 'https://prices.openfoodfacts.net/img/0001/lZGFga9ZOT.400.webp'  // RECEIPT
+      // return 'https://prices.openfoodfacts.net/img/0001/lZGFga9ZOT.webp'  // RECEIPT
       if (this.proof.image_thumb_path && this.showImageThumb) {
         return `${import.meta.env.VITE_OPEN_PRICES_APP_URL}/img/${this.proof.image_thumb_path}`
       }

diff --git a/src/components/ProofFooterRow.vue b/src/components/ProofFooterRow.vue
@@ -2,6 +2,12 @@
   <v-row>
     <v-col :cols="userIsProofOwner ? '11' : '12'">
       <ProofTypeChip class="mr-1" :proof="proof" />
+      <v-chip v-if="showReceiptPriceCount" class="mr-1" label size="small" variant="flat" density="comfortable" :title="$t('Common.ReceiptPriceCount')">
+        {{ $t('Common.PriceCount', { count: proof.receipt_price_count }) }}
+      </v-chip>
+      <v-chip v-if="showReceiptPriceTotal" class="mr-1" label size="small" variant="flat" density="comfortable" :title="$t('Common.ReceiptPriceTotal')">
+        {{ getPriceValueDisplay(proof.receipt_price_total) }}
+      </v-chip>
       <PriceCountChip :count="proof.price_count" :withLabel="true" @click="goToProof()" />
       <LocationChip class="mr-1" :location="proof.location" :locationId="proof.location_id" :readonly="readonly" :showErrorIfLocationMissing="true" />
       <DateChip class="mr-1" :date="proof.date" :showErrorIfDateMissing="true" />
@@ -18,6 +24,8 @@
 import { defineAsyncComponent } from 'vue'
 import { mapStores } from 'pinia'
 import { useAppStore } from '../store'
+import constants from '../constants'
+import utils from '../utils.js'
 
 export default {
   components: {
@@ -56,8 +64,24 @@ export default {
     userIsProofOwner() {
       return this.username && (this.proof.owner === this.username)
     },
+    isTypeReceipt() {
+      return this.proof && this.proof.type === constants.PROOF_TYPE_RECEIPT
+    },
+    showReceiptPriceCount() {
+      return this.userIsProofOwner && this.isTypeReceipt && this.proof.receipt_price_count
+    },
+    showReceiptPriceTotal() {
+      return this.userIsProofOwner && this.isTypeReceipt && this.proof.receipt_price_total
+    },
   },
   methods: {
+    getPriceValue(priceValue, priceCurrency) {
+      return utils.prettyPrice(priceValue, priceCurrency)
+    },
+    getPriceValueDisplay(price) {
+      price = parseFloat(price)
+      return this.getPriceValue(price, this.proof.currency)
+    },
     goToProof() {
       if (this.readonly || !this.userIsProofOwner) {
         return