diff --git a/src/components/FilterMenu.vue b/src/components/FilterMenu.vue index f1f7988f3cf..12ef2b0cf2b 100644 --- a/src/components/FilterMenu.vue +++ b/src/components/FilterMenu.vue @@ -68,7 +68,7 @@ export default { kind: { type: String, default: 'product', - examples: ['product', 'price', 'proof', 'location', 'user'] + examples: ['product', 'price', 'proof', 'priceTag', 'location', 'user'] }, currentFilter: { type: String, @@ -98,6 +98,7 @@ export default { productFilterList: constants.PRODUCT_FILTER_LIST, priceFilterList: constants.PRICE_FILTER_LIST, proofFilterList: constants.PROOF_FILTER_LIST, + priceTagFilterList: constants.PRICE_TAG_FILTER_LIST, locationFilterList: constants.LOCATION_FILTER_LIST, userFilterList: constants.USER_FILTER_LIST, // other filters diff --git a/src/constants.js b/src/constants.js index 9030328f542..dea0bae1ee5 100644 --- a/src/constants.js +++ b/src/constants.js @@ -117,6 +117,9 @@ export default { PROOF_FILTER_LIST: [ { key: 'hide_price_count_gte_1', value: 'FilterProofWithPriceCountHide' }, ], + PRICE_TAG_FILTER_LIST: [ + { key: 'show_proof_owner', value: 'FilterPriceTagWithProofOwner' }, + ], LOCATION_FILTER_LIST: [ { key: 'hide_price_count_gte_1', value: 'FilterLocationWithPriceCountHide' }, ], diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 95323b53bea..e57e1d12ac9 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -211,6 +211,7 @@ "FilterProductWithoutPriceCount": "Without prices", "FilterPriceMoreThan30DaysHide": "Hide prices older than 30 days", "FilterProofWithPriceCountHide": "Hide proofs with prices", + "FilterPriceTagWithProofOwner": "Show only my proofs", "FilterLocationWithPriceCountHide": "Hide locations with prices", "FilterUserWithPriceCountHide": "Hide contributors with prices", "FAQ": "FAQ", diff --git a/src/views/PriceValidationAssistant.vue b/src/views/PriceValidationAssistant.vue index a994b27366e..d3112c7ddca 100644 --- a/src/views/PriceValidationAssistant.vue +++ b/src/views/PriceValidationAssistant.vue @@ -4,6 +4,7 @@ {{ $t('Common.PriceToValidateCount', { count: priceTagTotal }) }} + @@ -45,6 +46,7 @@ import utils from '../utils.js' export default { components: { + FilterMenu: defineAsyncComponent(() => import('../components/FilterMenu.vue')), ContributionAssistantPriceFormCard: defineAsyncComponent(() => import('../components/ContributionAssistantPriceFormCard.vue')), }, data() { @@ -55,6 +57,7 @@ export default { loading: false, productPriceForms: [], // filter & order + currentFilter: '', currentOrder: '-proof_id', // order by most recent proof // feedback priceRemovedMessage: false, @@ -72,10 +75,28 @@ export default { return 6 }, getPriceTagsParams() { - return { proof__owner: this.username, proof__ready_for_price_tag_validation: true, status__isnull: true, order_by: this.currentOrder, size: this.getApiSize, page: this.priceTagPage } + let defaultParams = { + proof__ready_for_price_tag_validation: true, + status__isnull: true, + order_by: this.currentOrder, + size: this.getApiSize, + page: this.priceTagPage + } + if (this.currentFilter === 'show_proof_owner') { + defaultParams['proof__owner'] = this.username + } + return defaultParams }, }, + watch: { + $route (newRoute, oldRoute) { // only called when query changes to avoid having an API call when the path changes + if (oldRoute.path === newRoute.path && JSON.stringify(oldRoute.query) !== JSON.stringify(newRoute.query)) { + this.initPriceTags() + } + } + }, mounted() { + this.currentFilter = this.$route.query[constants.FILTER_PARAM] || this.currentFilter this.getPriceTags() // load more this.handleDebouncedScroll = utils.debounce(this.handleScroll, 100) @@ -85,6 +106,13 @@ export default { window.removeEventListener('scroll', this.handleDebouncedScroll) }, methods: { + initPriceTags() { + this.locationId = this.$route.params.id + this.priceTagList = [] + this.priceTagTotal = null + this.priceTagPage = 0 + this.getPriceTags() + }, removePriceTag(index, status) { /** * - update the price_tag (API) @@ -198,6 +226,11 @@ export default { this.createPriceLoading = false }) }, + togglePriceTagFilter(filterKey) { + this.currentFilter = this.currentFilter ? '' : filterKey + this.$router.push({ query: { ...this.$route.query, [constants.FILTER_PARAM]: this.currentFilter } }) + // this.initPriceTags() will be called in watch $route + }, handleScroll(event) { // eslint-disable-line no-unused-vars if (utils.getDocumentScrollPercentage() > 90) { this.getPriceTags()