feat: new Price Validator Assistant page (#1145)

openfoodfacts · Dec 19, 2024 · 2568db7 · 2568db7
1 parent 696496a
commit 2568db7
Show file tree

Hide file tree

Showing 7 changed files with 275 additions and 22 deletions.
diff --git a/src/components/ContributionAssistantPriceFormCard.vue b/src/components/ContributionAssistantPriceFormCard.vue
@@ -23,17 +23,45 @@
       </v-alert>
       <PriceInputRow class="mt-0" :priceForm="productPriceForm" :hideCurrencyChoice="true" @filled="pricePriceFormFilled = $event" />
     </v-card-text>
+    <v-divider v-if="mode === 'Validation'" />
+    <v-card-text v-if="mode === 'Validation'">
+      <ProofFooterRow :proof="productPriceForm.proof" :hideProofActions="true" :readonly="true" />
+    </v-card-text>
     <v-divider />
-    <v-card-actions>
+    <v-card-actions v-if="mode === 'Contribution'">
       <v-btn
         color="error"
         variant="outlined"
         prepend-icon="mdi-delete"
-        @click="removePrice"
+        @click="removePriceTag"
       >
         {{ $t('Common.Delete') }}
       </v-btn>
     </v-card-actions>
+    <v-card-actions v-else-if="mode === 'Validation'">
+      <v-btn
+        color="error"
+        variant="outlined"
+        @click="removePriceTag(3)"
+      >
+        {{ $t('Common.Error') }}
+      </v-btn>
+      <v-btn
+        color="warning"
+        variant="outlined"
+        @click="removePriceTag(2)"
+      >
+        {{ $t('Common.Unreadable') }}
+      </v-btn>
+      <v-spacer />
+      <v-btn
+        color="success"
+        variant="flat"
+        @click="validatePriceTag"
+      >
+        {{ $t('Common.Upload') }}
+      </v-btn>
+    </v-card-actions>
   </v-card>
 </template>
 
@@ -46,11 +74,13 @@ export default {
   components: {
   ProductInputRow: defineAsyncComponent(() => import('../components/ProductInputRow.vue')),
   PriceInputRow: defineAsyncComponent(() => import('../components/PriceInputRow.vue')),
+  ProofFooterRow: defineAsyncComponent(() => import('../components/ProofFooterRow.vue')),
   },
   props: {
     productPriceForm: {
       type: Object,
       default: () => ({
+        id: null,
         type: null,
         category_tag: null,
         origins_tags: '',
@@ -65,8 +95,12 @@ export default {
         detected_product_code: null
       })
     },
+    mode: {
+      type: String,
+      default: 'Contribution'  // or 'Validation'
+    }
   },
-  emits: ['removePrice'],
+  emits: ['removePriceTag', 'validatePriceTag'],
   data() {
     return {
       productFormFilled: false,
@@ -79,8 +113,11 @@ export default {
     }
   },
   methods: {
-    removePrice() {
-      this.$emit('removePrice')
+    removePriceTag(status=null) {
+      this.$emit('removePriceTag', status)
+    },
+    validatePriceTag() {
+      this.$emit('validatePriceTag')
     }
   }
 }

diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
@@ -175,6 +175,7 @@
 		"DisplayPriceMap": "Map",
 		"DisplayPriceChart": "Chart",
 		"Done": "Done",
+		"Error": "Error",
 		"Experiments": "Experiments",
 		"Label": "Label",
 		"Labels": "Labels",
@@ -241,6 +242,7 @@
 		"Physical": "Physical",
 		"PRICE_TAG": "Price tag",
 		"PriceCount": "{count} prices | {count} price | {count} prices",
+		"PriceToValidateCount": "{count} prices to validate | {count} price to validate | {count} prices to validate",
 		"PriceCreated": "Price created!",
 		"PricesMore": "More prices",
 		"Private": "Private",
@@ -290,6 +292,7 @@
 		"Top": "Top",
 		"Total": "Total",
 		"Type": "Type",
+		"Unreadable": "Unreadable",
 		"Upload": "Upload",
 		"UploadMultipleImages": "Upload {count} image | Upload {count} images",
 		"UploadMultiplePrices": "Upload {count} price | Upload {count} prices",
@@ -585,6 +588,9 @@
 		},
 		"ContributionAssistant": {
 			"Title": "Contribution Assistant"
+		},
+		"PriceValidatorAssistant": {
+			"Title": "Price Validator Assistant"
 		}
 	},
 	"Search": {

diff --git a/src/router.js b/src/router.js
diff --git a/src/services/api.js b/src/services/api.js
@@ -23,7 +23,7 @@ function buildURLParams(params = {}) {
 }
 
 function filterBodyWithAllowedKeys(data, allowedKeys) {
-  const filteredData = {}
+  let filteredData = {}
   for (const key in data) {
     if (allowedKeys.includes(key)) {
       filteredData[key] = data[key]
@@ -32,6 +32,20 @@ function filterBodyWithAllowedKeys(data, allowedKeys) {
   return filteredData
 }
 
+function extraPriceCreateFiltering(data) {
+  let filteredData = {...data}
+  if (filteredData.type == constants.PRICE_TYPE_PRODUCT) {
+    delete filteredData.price_per
+    delete filteredData.category_tag
+    delete filteredData.origins_tags
+    delete filteredData.labels_tags
+  } else if (filteredData.type == constants.PRICE_TYPE_CATEGORY) {
+    delete filteredData.product_code
+    delete filteredData.product
+  }
+  return filteredData
+}
+
 
 export default {
   signIn(username, password) {
@@ -157,7 +171,8 @@ export default {
   },
 
   createPrice(inputData, source = null) {
-    const data = filterBodyWithAllowedKeys(inputData, PRICE_CREATE_FIELDS)
+    let data = filterBodyWithAllowedKeys(inputData, PRICE_CREATE_FIELDS)
+    data = extraPriceCreateFiltering(data)
     const store = useAppStore()
     store.user.last_product_product_used = data.product_code ? constants.PRICE_TYPE_PRODUCT : constants.PRICE_TYPE_CATEGORY
     const url = `${import.meta.env.VITE_OPEN_PRICES_API_URL}/prices?${buildURLParams({'app_version': source})}`
@@ -353,5 +368,26 @@ export default {
       body: formData,
     })
     .then((response) => response.json())
+  },
+  getPriceTags(params = {}) {
+    const defaultParams = {page: 1, size: OP_DEFAULT_PAGE_SIZE}  // order_by default ?
+    const url = `${import.meta.env.VITE_OPEN_PRICES_API_URL}/price-tags?${buildURLParams({...defaultParams, ...params})}`
+    return fetch(url, {
+      method: 'GET',
+      headers: OP_DEFAULT_HEADERS,
+    })
+    .then((response) => response.json())
+  },
+  updatePriceTag(priceTagId, inputData = {}) {
+    const store = useAppStore()
+    const url = `${import.meta.env.VITE_OPEN_PRICES_API_URL}/price-tags/${priceTagId}?${buildURLParams()}`
+    return fetch(url, {
+      method: 'PATCH',
+      headers: Object.assign({}, OP_DEFAULT_HEADERS, {
+        'Authorization': `Bearer ${store.user.token}`,
+      }),
+      body: JSON.stringify(inputData),
+    })
+    .then((response) => response.json())
   }
 }
diff --git a/src/views/ContributionAssistant.vue b/src/views/ContributionAssistant.vue
@@ -74,7 +74,7 @@
               md="6"
               xl="4"
             >
-              <ContributionAssistantPriceFormCard :productPriceForm="productPriceForm" @removePrice="removePrice(index)" />
+              <ContributionAssistantPriceFormCard :productPriceForm="productPriceForm" @removePriceTag="removePriceTag(index)" />
             </v-col>
           </v-row>
           <v-row>
@@ -140,8 +140,8 @@ import { defineAsyncComponent } from 'vue'
 import { mapStores } from 'pinia'
 import { useAppStore } from '../store'
 import api from '../services/api'
-import utils from '../utils.js'
 import constants from '../constants'
+import utils from '../utils.js'
 
 export default {
   components: {
@@ -220,8 +220,8 @@ export default {
     },
     setProof(event) {
       const image = new Image()
-      // image.src = 'https://prices.openfoodfacts.org/img/0024/tM0NEloNU3.webp'
-      // image.src = 'https://prices.openfoodfacts.org/img/0023/f6tJvMcsDk.webp'
+      // image.src = 'https://prices.openfoodfacts.org/img/0024/tM0NEloNU3.webp'  // barcodes
+      // image.src = 'https://prices.openfoodfacts.org/img/0023/f6tJvMcsDk.webp'  // categories
       image.src = `${import.meta.env.VITE_OPEN_PRICES_APP_URL}/img/${event.file_path}`
       image.crossOrigin = 'Anonymous'
       this.image = image
@@ -303,7 +303,7 @@ export default {
       }
       this.tab = 'Cleanup'
     },
-    removePrice(index) {
+    removePriceTag(index) {
       this.productPriceForms.splice(index, 1)
     },
     addPrices() {
@@ -329,16 +329,6 @@ export default {
           location_osm_type: this.proofForm.location_osm_type,
           proof_id: this.proofForm.id
         }
-        // Cleanup unwanted fields for API
-        if (productPriceForm.type == constants.PRICE_TYPE_PRODUCT) {
-          delete priceData.price_per
-          delete priceData.category_tag
-          delete priceData.origins_tags
-          delete priceData.labels_tags
-        } else if (productPriceForm.type == constants.PRICE_TYPE_CATEGORY) {
-          delete priceData.product_code
-          delete priceData.product
-        }
         api.createPrice(priceData, this.$route.path).then(() => {
           // TODO: error handling
           this.productPriceForms[i].processed = true

diff --git a/src/views/Experiments.vue b/src/views/Experiments.vue
@@ -28,6 +28,13 @@
         to="/experiments/contribution-assistant"
       />
     </v-col>
+    <v-col cols="12" sm="6" lg="4">
+      <v-card
+        :title="$t('Router.PriceValidatorAssistant.Title')"
+        prepend-icon="mdi-checkbox-marked-circle-plus-outline"
+        to="/experiments/price-validator-assistant"
+      />
+    </v-col>
   </v-row>
 </template>