Merge branch 'master' into l10n_master

openfoodfacts · Jan 15, 2025 · 8f96c71 · 8f96c71
2 parents dc987fb + 945e54f
commit 8f96c71
Show file tree

Hide file tree

Showing 25 changed files with 367 additions and 55 deletions.
diff --git a/src/components/BarcodeScannerDialog.vue b/src/components/BarcodeScannerDialog.vue
@@ -46,7 +46,7 @@
                 persistent-hint
               >
                 <template #append-inner>
-                  <v-btn :icon="barcodeManualInputMode === 'search' ? 'mdi-magnify' : 'mdi-plus'" :disabled="!barcodeManualFormValid" @click="barcodeSearchOrSend" />
+                  <v-btn color="primary" :icon="barcodeManualInputMode === 'search' ? 'mdi-magnify' : 'mdi-plus'" :disabled="!barcodeManualFormValid" @click="barcodeSearchOrSend" />
                 </template>
               </v-text-field>
             </v-form>

diff --git a/src/components/ChallengeTakePicturesCard.vue b/src/components/ChallengeTakePicturesCard.vue
@@ -0,0 +1,40 @@
+<template>
+  <v-card v-if="exampleProofUrl">
+    <v-card-title>
+      {{ $t('Challenge.StepTakePictures.Title') }}
+    </v-card-title>
+    <v-card-text>
+      <p class="mb-2">
+        {{ $t('Challenge.StepTakePictures.line1') }}
+      </p>
+      <v-img :src="exampleProofUrl" style="max-height: 200px" />
+      <p class="mb-2 mt-2">
+        {{ $t('Challenge.StepTakePictures.line2') }}
+      </p>
+    </v-card-text>
+    <v-divider />
+    <v-card-actions>
+      <v-spacer v-if="$vuetify.display.smAndUp" />
+      <v-btn
+        color="primary"
+        variant="flat"
+        :block="!$vuetify.display.smAndUp"
+        to="/proofs/add/multiple"
+      >
+        {{ $t('Challenge.StepTakePictures.AddPictures') }}
+      </v-btn>
+    </v-card-actions>
+  </v-card>
+</template>
+
+<script>
+export default {
+  props: {
+    exampleProofUrl: {
+      type: String,
+      default: () => {}
+    }
+  },
+}
+</script>
+
diff --git a/src/components/ChallengeTimeline.vue b/src/components/ChallengeTimeline.vue
@@ -0,0 +1,58 @@
+<template>
+  <v-timeline direction="horizontal" truncate-line="both">
+    <v-timeline-item dot-color="success">
+      <div class="text-h6">
+        Start
+      </div>
+      <template #opposite>
+        {{ challenge.startDate }}
+      </template>
+    </v-timeline-item>
+    <v-timeline-item dot-color="error">
+      <template #opposite>
+        <div class="text-h6">
+          End
+        </div>
+      </template>
+      {{ challenge.endDate }}
+    </v-timeline-item>
+  </v-timeline>
+  <v-progress-linear
+    color="info"
+    height="25"
+    :model-value="progress"
+    striped
+    style="width: 50%; margin-left: 25%; top: -55px; margin-top: -25px"
+  >
+    <strong>{{ daysLeftText }}</strong>
+  </v-progress-linear>
+</template>
+
+<script>
+export default {
+  props: {
+    challenge: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  computed: {
+    nbDays() {
+      return Math.round((new Date(this.challenge.endDate) - new Date(this.challenge.startDate)) / (1000 * 60 * 60 * 24))
+    },
+    todayIndex() {
+      return Math.round((new Date() - new Date(this.challenge.startDate)) / (1000 * 60 * 60 * 24))
+    },
+    daysLeftText() {
+      const daysLeft = this.nbDays - this.todayIndex
+      if (daysLeft <= 0) return "Challenge over"
+      if (daysLeft >= this.nbDays) return "Not started"
+      return `${daysLeft} days left`
+    },
+    progress() {
+      return Math.min(100, this.todayIndex * 100 / this.nbDays)
+    }
+  }
+}
+</script>
+
diff --git a/src/components/ChallengeValidateCard.vue b/src/components/ChallengeValidateCard.vue
@@ -0,0 +1,35 @@
+<template>
+  <v-card class="fill-height d-flex flex-column">
+    <v-card-title>
+      {{ $t('Challenge.StepValidate.Title') }}
+    </v-card-title>
+    <v-card-text class="flex-grow-1">
+      <p class="mb-2">
+        {{ $t('Challenge.StepValidate.line1') }}
+      </p>
+      <p class="mb-4">
+        {{ $t('Challenge.StepValidate.line2') }}
+      </p>
+      <p class="mb-2">
+        {{ $t('Challenge.StepValidate.line3') }}
+      </p>
+      <p class="mb-4">
+        {{ $t('Challenge.StepValidate.line4') }}
+      </p>
+    </v-card-text>
+    <v-divider />
+    <v-card-actions>
+      <v-spacer v-if="$vuetify.display.smAndUp" />
+      <v-btn
+        color="primary"
+        variant="flat"
+        :block="!$vuetify.display.smAndUp"
+        to="/experiments/price-validation-assistant"
+      >
+        {{ $t('Challenge.StepValidate.ValidatePrices') }}
+      </v-btn>
+    </v-card-actions>
+  </v-card>
+</template>
+<script>
+</script>
diff --git a/src/components/ContributionAssistantPriceFormCard.vue b/src/components/ContributionAssistantPriceFormCard.vue
@@ -41,7 +41,7 @@
       <v-spacer />
       <v-btn
         v-if="mode === 'Validation'"
-        color="success"
+        color="primary"
         variant="flat"
         @click="validatePriceTag"
       >

diff --git a/src/components/Header.vue b/src/components/Header.vue
@@ -12,8 +12,8 @@
     <v-btn v-else prepend-icon="mdi-magnify" to="/search" :aria-label="$t('Common.Search')">
       {{ $t('Common.Search') }}
     </v-btn>
-    <v-btn v-if="!$vuetify.display.smAndUp" color="primary" icon="mdi-tag-plus-outline" to="/prices/add/multiple" :aria-label="$t('Common.AddPrices')" />
-    <v-btn v-else color="primary" prepend-icon="mdi-tag-plus-outline" to="/prices/add/multiple" :aria-label="$t('Common.AddPrices')">
+    <v-btn v-if="!$vuetify.display.smAndUp" icon="mdi-tag-plus-outline" to="/prices/add/multiple" :aria-label="$t('Common.AddPrices')" />
+    <v-btn v-else prepend-icon="mdi-tag-plus-outline" to="/prices/add/multiple" :aria-label="$t('Common.AddPrices')">
       {{ $t('Common.AddPrices') }}
     </v-btn>
     <template v-if="!username" #append>
@@ -38,7 +38,6 @@
         :slim="true"
         :title="item.title"
         :prepend-icon="item.props['prepend-icon']"
-        :base-color="item.props['base-color']"
         :to="item.props.to"
       />
     </v-list>
@@ -74,7 +73,7 @@ export default {
         .filter(r => r.meta && r.meta.drawerMenu)
         .filter(r => this.username ? r.meta.requiresAuth !== false : !r.meta.requiresAuth)
         .filter(r => !r.meta.drawerMenuConditionalDisplay || this.appStore.user[r.meta.drawerMenuConditionalDisplay])
-        .map((r => ({ title: this.$t(`Router.${r.meta.title}.Title`), props: { 'prepend-icon': r.meta.icon, 'base-color': r.meta.color, to: r.path }})))
+        .map((r => ({ title: this.$t(`Router.${r.meta.title}.Title`), props: { 'prepend-icon': r.meta.icon, to: r.path }})))
     }
   },
   methods: {

diff --git a/src/components/LocationSelectorDialog.vue b/src/components/LocationSelectorDialog.vue
@@ -46,7 +46,7 @@
                 persistent-hint
               >
                 <template #append-inner>
-                  <v-btn icon="mdi-magnify" :disabled="!locationOsmSearchForm.q" @click="locationOsmSearch" />
+                  <v-btn color="primary" icon="mdi-magnify" :disabled="!locationOsmSearchForm.q" @click="locationOsmSearch" />
                 </template>
               </v-text-field>
             </v-form>
@@ -106,7 +106,7 @@
                 persistent-hint
               >
                 <template #append-inner>
-                  <v-btn icon="mdi-plus" :disabled="!locationOnlineFormValid" @click="createOnline" />
+                  <v-btn color="primary" icon="mdi-plus" :disabled="!locationOnlineFormValid" @click="createOnline" />
                 </template>
               </v-text-field>
             </v-form>

diff --git a/src/components/PriceDeleteConfirmationDialog.vue b/src/components/PriceDeleteConfirmationDialog.vue
@@ -21,10 +21,11 @@
       <v-divider />
 
       <v-card-actions>
+        <v-spacer v-if="$vuetify.display.smAndUp" />
         <v-btn
           color="error"
           variant="flat"
-          elevation="1"
+          :block="!$vuetify.display.smAndUp"
           prepend-icon="mdi-delete"
           :loading="loading"
           @click="deletePrice"

diff --git a/src/components/PriceEditDialog.vue b/src/components/PriceEditDialog.vue
@@ -41,11 +41,11 @@
       <v-divider />
 
       <v-card-actions>
+        <v-spacer v-if="$vuetify.display.smAndUp" />
         <v-btn
-          class="float-right"
-          color="success"
+          color="primary"
           variant="flat"
-          elevation="1"
+          :block="!$vuetify.display.smAndUp"
           :loading="loading"
           @click="updatePrice"
         >

diff --git a/src/components/ProofDeleteConfirmationDialog.vue b/src/components/ProofDeleteConfirmationDialog.vue
@@ -17,10 +17,11 @@
       <v-divider />
 
       <v-card-actions>
+        <v-spacer v-if="$vuetify.display.smAndUp" />
         <v-btn
           color="error"
           variant="flat"
-          elevation="1"
+          :block="!$vuetify.display.smAndUp"
           prepend-icon="mdi-delete"
           :loading="loading"
           @click="deleteProof"

diff --git a/src/components/ProofEditDialog.vue b/src/components/ProofEditDialog.vue
@@ -21,11 +21,11 @@
       <v-divider />
 
       <v-card-actions>
+        <v-spacer v-if="$vuetify.display.smAndUp" />
         <v-btn
-          class="float-right"
-          color="success"
+          color="primary"
           variant="flat"
-          elevation="1"
+          :block="!$vuetify.display.smAndUp"
           :disabled="!formFilled"
           :loading="loading"
           @click="updateProof"

diff --git a/src/components/ProofUploadCard.vue b/src/components/ProofUploadCard.vue
@@ -37,10 +37,12 @@
     </v-card-text>
     <v-divider />
     <v-card-actions>
-      <v-spacer />
+      <v-spacer v-if="$vuetify.display.smAndUp" />
       <v-btn
-        color="success"
+        class="float-right"
+        color="primary"
         variant="flat"
+        :block="!$vuetify.display.smAndUp"
         :loading="loading || step === 2"
         :disabled="!proofFormFilled || loading || step === 2"
         @click="uploadProofList"

diff --git a/src/plugins/vuetify.js b/src/plugins/vuetify.js
@@ -15,18 +15,27 @@ export const vuetify = createVuetify({
       mdi,
     },
   },
+  // https://vuetifyjs.com/en/features/theme
   theme: {
     themes: {
       light: {
         colors: {
-          header: "rgb(242, 233, 228)",
+          primary: '#341100',
+          header: '#f2e9e4',
           footer: '#bdbdbd'
+        },
+        variables: {
+          'border-color': '#201A17'
         }
       },
       dark: {
         colors: {
-          header: "#0d161b",
+          primary: '#A08D84',
+          header: '#201A17',
           footer: '#424242'
+        },
+        variables: {
+          'border-color': '#85746C'
         }
       },
     },

diff --git a/src/router.js b/src/router.js
diff --git a/src/services/api.js b/src/services/api.js
@@ -321,6 +321,15 @@ export default {
     .then((response) => response.json())
   },
 
+  getPriceStats(params = {}) {
+    const url = `${import.meta.env.VITE_OPEN_PRICES_API_URL}/prices/stats?${buildURLParams({...params})}`
+    return fetch(url, {
+      method: 'GET',
+      headers: OP_DEFAULT_HEADERS,
+    })
+    .then((response) => response.json())
+  },
+
   openfoodfactsProductSearch(code) {
     const url = `${constants.OFF_API_URL}/${code}.json`
     return fetch(url, {

diff --git a/src/views/ContributionAssistant.vue b/src/views/ContributionAssistant.vue
@@ -61,7 +61,7 @@
               <h3 class="mb-4">
                 {{ $t('ContributionAssistant.LabelsExtractionSteps.SendLabels') }}
               </h3>
-              <v-btn color="success" :disabled="!extractedLabels.length" :loading="processLabelsLoading" @click="processLabels">
+              <v-btn color="primary" :disabled="!extractedLabels.length" :loading="processLabelsLoading" @click="processLabels">
                 {{ $t('ContributionAssistant.LabelsExtractionSteps.SendLabelsButton') }}
               </v-btn>
             </v-col>
@@ -106,7 +106,7 @@
                   {{ $t('ContributionAssistant.PriceAddConfirmationMessage', { numberOfPricesAdded: productPriceFormsWithoutPriceId.length, date: proofObject.date, locationName: locationName }) }}
                 </p>
               </v-alert>
-              <v-btn class="float-right mt-4" color="success" :loading="loading" @click="addPrices">
+              <v-btn class="float-right mt-4" color="primary" :loading="loading" @click="addPrices">
                 {{ $t('Common.UploadMultiplePrices', productPriceFormsWithoutPriceId.length) }}
               </v-btn>
             </v-col>
@@ -129,16 +129,16 @@
               >
                 <strong>{{ $t('ContributionAssistant.PriceAddProgress', { numberOfPricesAdded: numberOfPricesAdded, totalNumberOfPrices: productPriceFormsWithoutPriceId.length }) }}</strong>
               </v-progress-linear>
-              <v-btn to="/dashboard" class="mt-4" :aria-label="$t('Common.Dashboard')" :disabled="!allDone">
+              <v-btn class="mt-4" color="primary" :aria-label="$t('Common.Dashboard')" to="/dashboard" :disabled="!allDone">
                 {{ $t('ContributionAssistant.GoToDashboard') }}
               </v-btn>
-              <v-btn :to="'/proofs/' + proofObject.id" class="mt-4 ml-4" :disabled="!allDone">
+              <v-btn class="mt-4 ml-4" color="primary" :to="'/proofs/' + proofObject.id" :disabled="!allDone">
                 {{ $t('ContributionAssistant.GoToProof') }}
               </v-btn>
-              <v-btn class="mt-4 ml-4" :disabled="!allDone" @click="reloadPage">
+              <v-btn class="mt-4 ml-4" color="primary" :disabled="!allDone" @click="reloadPage">
                 {{ $t('ContributionAssistant.AddNewProof') }}
               </v-btn>
-              <v-btn v-if="proofIdsFromQueryParam" class="mt-4 ml-4" :disabled="!allDone" @click="nextProof">
+              <v-btn v-if="proofIdsFromQueryParam" class="mt-4 ml-4" color="primary" :disabled="!allDone" @click="nextProof">
                 {{ $t('ContributionAssistant.NextProof') }}
               </v-btn>
             </v-col>