feat(Price add): simple "quantity bought" field (only for receipt pro…

…ofs) (#1128)

src/components/PriceAlreadyUploadedListCard.vue

@@ -16,7 +16,7 @@
     <v-card-text>
       <v-row>
         <v-col v-for="productPriceUploaded in proofPriceUploadedList" :key="productPriceUploaded" cols="12">
-          <PriceCard :price="productPriceUploaded" :product="productPriceUploaded.product" :hideProductBarcode="false" :hidePriceFooterRow="true" :readonly="true" />
+          <PriceCard :price="productPriceUploaded" :product="productPriceUploaded.product" :hideProductBarcode="false" :hidePriceReceiptQuantity="false" :hidePriceFooterRow="true" :readonly="true" />
         </v-col>
       </v-row>
     </v-card-text>
@@ -77,7 +77,7 @@ export default {
     },
     proofPriceUploadedListSum() {
       return this.proofPriceUploadedList.reduce((acc, priceUploaded) => {
-        return acc + parseFloat(priceUploaded.price)
+        return acc + parseFloat(priceUploaded.price)*parseInt(priceUploaded.receipt_quantity)
       }, 0)
     }
   },

src/components/PriceCard.vue

@@ -29,7 +29,7 @@
             </span>
           </p>
 
-          <PricePriceRow v-if="price" :price="price" :productQuantity="product ? product.product_quantity : null" :productQuantityUnit="product ? product.product_quantity_unit : null" />
+          <PricePriceRow v-if="price" :price="price" :productQuantity="product ? product.product_quantity : null" :productQuantityUnit="product ? product.product_quantity_unit : null" :hidePriceReceiptQuantity="hidePriceReceiptQuantity" />
         </v-col>
       </v-row>
 
@@ -81,6 +81,10 @@ export default {
       type: Boolean,
       default: true
     },
+    hidePriceReceiptQuantity: {
+      type: Boolean,
+      default: true
+    },
     hidePriceFooterRow: {
       type: Boolean,
       default: false

src/components/PriceInputRow.vue

@@ -40,6 +40,17 @@
         hide-details="auto"
       />
     </v-col>
+    <v-col class="pt-0" cols="6">
+      <v-text-field
+        v-model="priceForm.receipt_quantity"
+        density="compact"
+        :label="$t('Common.QuantityBought')"
+        type="text"
+        inputmode="numeric"
+        :prepend-inner-icon="PROOF_TYPE_RECEIPT_ICON"
+        hide-details="auto"
+      />
+    </v-col>
 
     <ChangeCurrencyDialog
       v-if="changeCurrencyDialog"
@@ -64,9 +75,10 @@ export default {
       type: Object,
       default: () => ({
         price: null,
-        currency: null,
         price_is_discounted: false,
-        price_without_discount: null
+        price_without_discount: null,
+        currency: null,
+        receipt_quantity: null,
       })
     },
     hideCurrencyChoice: {
@@ -77,12 +89,17 @@ export default {
       type: Object,
       default: null
     },
+    proofType: {
+      type: String,
+      default: null
+    },
   },
   emits: ['filled'],
   data() {
     return {
       // currency selection
       changeCurrencyDialog: false,
+      PROOF_TYPE_RECEIPT_ICON: constants.PROOF_TYPE_RECEIPT_ICON,
     }
   },
   computed: {
@@ -99,6 +116,9 @@ export default {
       let keys = ['price', 'currency']
       return Object.keys(this.priceForm).filter(k => keys.includes(k)).every(k => !!this.priceForm[k])
     },
+    proofIsTypeReceipt() {
+      return this.proofType === constants.PROOF_TYPE_RECEIPT
+    },
   },
   watch: {
     priceFormFilled(newPriceFormFilled, oldPriceFormFilled) {  // eslint-disable-line no-unused-vars

src/components/PricePriceRow.vue

@@ -4,11 +4,16 @@
       <span class="mr-1">{{ getPriceValueDisplay(price.price) }}</span>
       <span v-if="hasProductQuantity" class="mr-1">({{ getPricePerUnit(price.price) }})</span>
       <span v-if="price.price_is_discounted">
-        <v-chip class="mr-1" color="red" variant="outlined" size="small" density="comfortable">
+        <v-chip class="ml-1 mr-1" color="red" variant="outlined" size="small" density="comfortable">
           {{ $t('PriceCard.Discount') }}
           <v-tooltip v-if="price.price_without_discount" activator="parent" open-on-click location="top">{{ $t('PriceCard.FullPrice') }} {{ getPriceValueDisplay(price.price_without_discount) }}</v-tooltip>
         </v-chip>
       </span>
+      <span v-if="!hidePriceReceiptQuantity && price.receipt_quantity && price.receipt_quantity > 1" class="mr-1">
+        <v-chip class="ml-1" variant="outlined" size="small" density="comfortable">
+          x{{ price.receipt_quantity }}
+        </v-chip>
+      </span>
     </v-col>
   </v-row>
 </template>
@@ -31,9 +36,9 @@ export default {
       type: String,
       default: constants.PRODUCT_QUANTITY_UNIT_G
     },
-    hidePriceDate: {
+    hidePriceReceiptQuantity: {
       type: Boolean,
-      default: false
+      default: true
     },
   },
   data() {

src/i18n/locales/en.json

@@ -250,6 +250,9 @@
 		"ProofSelected": "Proof selected!",
 		"ProofSelectedCount": "{count} proofs selected | {count} proof selected | {count} proofs selected",
 		"Public": "Public",
+		"Quantity": "Quantity",
+		"QuantityBought": "Quantity bought",
+		"QuantityMissing": "Quantity missing",
 		"Receipt": "Receipt",
 		"Receipts": "Receipts",
 		"ReceiptPriceCount": "Number of prices",

src/services/api.js

@@ -2,7 +2,7 @@ import { useAppStore } from '../store'
 import constants from '../constants'
 
 
-const PRICE_UPDATE_FIELDS = ['price', 'price_is_discounted', 'price_without_discount', 'price_per', 'currency', 'date']
+const PRICE_UPDATE_FIELDS = ['price', 'price_is_discounted', 'price_without_discount', 'price_per', 'currency', 'receipt_quantity', 'date']
 const PRICE_CREATE_FIELDS = PRICE_UPDATE_FIELDS.concat(['type', 'product_code', 'product_name', 'category_tag', 'labels_tags', 'origins_tags', 'location_id', 'location_osm_id', 'location_osm_type', 'proof_id'])
 const PROOF_UPDATE_FIELDS = ['type', 'date', 'currency', 'receipt_price_count', 'receipt_price_total']
 const PROOF_CREATE_FIELDS = PROOF_UPDATE_FIELDS.concat(['location_id', 'location_osm_id', 'location_osm_type'])  // 'file'

src/views/AddPriceMultiple.vue

@@ -114,6 +114,7 @@ import { defineAsyncComponent } from 'vue'
 import { mapStores } from 'pinia'
 import { useAppStore } from '../store'
 import api from '../services/api'
+import constants from '../constants'
 import utils from '../utils.js'
 
 export default {
@@ -159,7 +160,8 @@ export default {
         price_per: null,
         price_is_discounted: false,
         price_without_discount: null,
-        currency: null  // see initNewProductPriceForm
+        currency: null,  // see initNewProductPriceForm
+        receipt_quantity: null,
       },
       categoryPricePerList: [
         {key: 'KILOGRAM', value: this.$t('AddPriceSingle.CategoryPricePer.PerKg'), icon: 'mdi-weight-kilogram'},
@@ -239,6 +241,9 @@ export default {
       this.productPriceForm.type = this.appStore.user.last_product_type_used  // can be overriden in ProductInputRow
       this.productPriceForm.price_per = this.categoryPricePerList[0].key // init to 'KILOGRAM' because it's the most common use-case
       this.productPriceForm.currency = this.addPriceMultipleForm.currency || this.appStore.getUserLastCurrencyUsed  // get currency from proof first
+      if (this.proofObject.type === constants.PROOF_TYPE_RECEIPT) {
+        this.productPriceForm.receipt_quantity = 1
+      }
       // scroll to the form
       this.goTo('#product-price-form')
     },

src/views/AddPriceSingle.vue

@@ -121,6 +121,7 @@ export default {
         price_is_discounted: false,
         price_without_discount: null,
         currency: null,  // see initPriceSingleForm
+        receipt_quantity: null,
         location_id: null,
         location_osm_id: null,
         location_osm_type: '',