refactor: homogeize detail page init with route params. fixes. ref #844…

…, #858, #856
openfoodfacts · Sep 27, 2024 · a65ae6b · a65ae6b
1 parent cb00fb8
commit a65ae6b
Show file tree

Hide file tree

Showing 11 changed files with 38 additions and 36 deletions.
diff --git a/src/views/BrandDetail.vue b/src/views/BrandDetail.vue
@@ -46,15 +46,14 @@ export default {
   data() {
     return {
       brandId: this.$route.params.id,
-      // filter & order
-      currentFilter: '',
-      currentOrder: constants.PRODUCT_ORDER_LIST[1].key,
       // data
-      brand: null,  // see init
       brandProductList: [],
       brandProductTotal: null,
       brandProductPage: 0,
       loading: false,
+      // filter & order
+      currentFilter: '',
+      currentOrder: constants.PRODUCT_ORDER_LIST[0].key,  // price_count
     }
   },
   computed: {
@@ -67,9 +66,8 @@ export default {
     },
   },
   watch: {
-    $route (newBrand, oldBrand) {
-      if (oldBrand && newBrand && newBrand.name == 'brand-detail' && oldBrand.fullPath != newBrand.fullPath) {
-        this.brandId = newBrand.params.id
+    $route (newRoute, oldRoute) {
+      if (oldRoute && newRoute && newRoute.name == 'brand-detail' && oldRoute.fullPath != newRoute.fullPath) {
         this.initBrand()
       }
     }
@@ -87,6 +85,7 @@ export default {
   },
   methods: {
     initBrand() {
+      this.brandId = this.$route.params.id
       this.brandProductList = []
       this.brandProductTotal = null
       this.brandProductPage = 0

diff --git a/src/views/CategoryDetail.vue b/src/views/CategoryDetail.vue
@@ -46,15 +46,15 @@ export default {
   data() {
     return {
       categoryId: this.$route.params.id,
-      // filter & order
-      currentFilter: '',
-      currentOrder: constants.PRODUCT_ORDER_LIST[1].key,
       // data
       category: null,  // see init
       categoryProductList: [],
       categoryProductTotal: null,
       categoryProductPage: 0,
       loading: false,
+      // filter & order
+      currentFilter: '',
+      currentOrder: constants.PRODUCT_ORDER_LIST[0].key,  // price_count
     }
   },
   computed: {
@@ -67,9 +67,8 @@ export default {
     },
   },
   watch: {
-    $route (newCategory, oldCategory) {
-      if (oldCategory && newCategory && newCategory.name == 'category-detail' && oldCategory.fullPath != newCategory.fullPath) {
-        this.categoryId = newCategory.params.id
+    $route (newRoute, oldRoute) {
+      if (oldRoute && newRoute && newRoute.name == 'category-detail' && oldRoute.fullPath != newRoute.fullPath) {
         this.initCategory()
       }
     }
@@ -87,6 +86,7 @@ export default {
   },
   methods: {
     initCategory() {
+      this.categoryId = this.$route.params.id
       this.category = {'id': this.categoryId, 'name': this.categoryId}
       this.categoryProductList = []
       this.categoryProductTotal = null

diff --git a/src/views/CountryCityDetail.vue b/src/views/CountryCityDetail.vue
@@ -55,16 +55,16 @@ export default {
   },
   data() {
     return {
-      // order & display
-      currentOrder: '-price_count',
-      currentDisplay: constants.LOCATION_DISPLAY_LIST[0].key,
+      country: this.$route.params.country,
+      countryCity: this.$route.params.city,
       // data
-      country: null,  // see init
-      countryCity: null,  // see init
       countryCityLocationList: [],
       countryCityLocationTotal: null,
       countryCityLocationPage: 0,
       loading: false,
+      // order & display
+      currentOrder: '-price_count',
+      currentDisplay: constants.LOCATION_DISPLAY_LIST[0].key,
     }
   },
   computed: {

diff --git a/src/views/CountryDetail.vue b/src/views/CountryDetail.vue
@@ -55,15 +55,15 @@ export default {
   },
   data() {
     return {
-      // order & display
-      currentOrder: '-price_count',
-      currentDisplay: constants.LOCATION_DISPLAY_LIST[0].key,
+      country: this.$route.params.country,
       // data
-      country: null,  // see init
       countryLocationList: [],
       countryLocationTotal: null,
       countryLocationPage: 0,
       loading: false,
+      // order & display
+      currentOrder: '-price_count',
+      currentDisplay: constants.LOCATION_DISPLAY_LIST[0].key,
     }
   },
   computed: {

diff --git a/src/views/DateDetail.vue b/src/views/DateDetail.vue
@@ -43,14 +43,14 @@ export default {
   },
   data() {
     return {
+      date: this.$route.params.date,
       // data
-      date: null,  // see init
       datePriceList: [],
       datePriceTotal: null,
       datePricePage: 0,
       loading: false,
       // filter & order
-      currentOrder: constants.PRICE_ORDER_LIST[1].key,
+      currentOrder: constants.PRICE_ORDER_LIST[1].key,  // date
     }
   },
   computed: {
@@ -75,8 +75,8 @@ export default {
     },
   },
   watch: {
-    $route (newDate, oldDate) {
-      if (oldDate && newDate && newDate.name == 'date-detail' && oldDate.fullPath != newDate.fullPath) {
+    $route (newRoute, oldRoute) {
+      if (oldRoute && newRoute && newRoute.name == 'date-detail' && oldRoute.fullPath != newRoute.fullPath) {
         this.initDate()
       }
     }

diff --git a/src/views/LabelDetail.vue b/src/views/LabelDetail.vue
@@ -46,15 +46,15 @@ export default {
   data() {
     return {
       labelId: this.$route.params.id,
-      // filter & order
-      currentFilter: '',
-      currentOrder: constants.PRODUCT_ORDER_LIST[1].key,
       // data
       label: null,  // see init
       labelProductList: [],
       labelProductTotal: null,
       labelProductPage: 0,
       loading: false,
+      // filter & order
+      currentFilter: '',
+      currentOrder: constants.PRODUCT_ORDER_LIST[0].key,  // price_count
     }
   },
   computed: {
@@ -69,7 +69,6 @@ export default {
   watch: {
     $route (newRoute, oldRoute) {
       if (oldRoute && newRoute && newRoute.name == 'label-detail' && oldRoute.fullPath != newRoute.fullPath) {
-        this.labelId = this.$route.params.id
         this.initLabel()
       }
     }
@@ -87,6 +86,7 @@ export default {
   },
   methods: {
     initLabel() {
+      this.labelId = this.$route.params.id
       this.label = {'id': this.labelId, 'name': this.labelId}
       this.labelProductList = []
       this.labelProductTotal = null

diff --git a/src/views/LocationDetail.vue b/src/views/LocationDetail.vue
@@ -54,6 +54,7 @@ export default {
   data() {
     return {
       locationId: this.$route.params.id,
+      // data
       location: null,
       locationPriceList: [],
       locationPriceTotal: null,
@@ -99,6 +100,7 @@ export default {
   },
   methods: {
     initLocationPrices() {
+      this.locationId = this.$route.params.id
       this.locationPriceList = []
       this.locationPriceTotal = null
       this.locationPricePage = 0

diff --git a/src/views/PriceDetail.vue b/src/views/PriceDetail.vue
@@ -23,6 +23,7 @@ export default {
   data() {
     return {
       priceId: this.$route.params.id,
+      // data
       price: null,
       loading: false,
     }

diff --git a/src/views/ProductDetail.vue b/src/views/ProductDetail.vue
@@ -92,6 +92,7 @@ export default {
     return {
       OFF_NAME: constants.OFF_NAME,
       productId: this.$route.params.id,  // product_code or product_category
+      // data
       product: null,
       category: null,
       productPriceList: [],
@@ -162,6 +163,7 @@ export default {
   },
   methods: {
     initProductPrices() {
+      this.productId = this.$route.params.id
       this.productPriceList = []
       this.productPriceTotal = 0
       this.productPricePage = 0

diff --git a/src/views/ProofDetail.vue b/src/views/ProofDetail.vue
@@ -44,6 +44,7 @@ export default {
   data() {
     return {
       proofId: this.$route.params.id,
+      // data
       proof: null,
       proofPriceList: [],
       proofPriceTotal: null,

diff --git a/src/views/UserDetail.vue b/src/views/UserDetail.vue
@@ -31,8 +31,6 @@
 
 <script>
 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'
@@ -47,6 +45,8 @@ export default {
   },
   data() {
     return {
+      username: this.$route.params.username,
+      // data
       userPriceList: [],
       userPriceTotal: null,
       userPricePage: 0,
@@ -57,10 +57,6 @@ export default {
     }
   },
   computed: {
-    ...mapStores(useAppStore),
-    username() {
-      return this.$route.params.username
-    },
     getPricesParams() {
       let defaultParams = { owner: this.username, order_by: `${this.currentOrder}`, page: this.userPricePage }
       if (this.currentFilter === 'show_last_month') {
@@ -91,6 +87,7 @@ export default {
   },
   methods: {
     initUserPrices() {
+      this.username = this.$route.params.username
       this.userPriceList = []
       this.userPriceTotal = null
       this.userPricePage = 0