diff --git a/package-lock.json b/package-lock.json index 2595f5cd7..d4e7368ec 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4926,6 +4926,11 @@ "yallist": "^4.0.0" } }, + "mitt": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz", + "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==" + }, "mkdirp": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz", diff --git a/package.json b/package.json index 21715c7b5..ba0193c43 100644 --- a/package.json +++ b/package.json @@ -8,6 +8,7 @@ "build-prod": "cross-env NODE_ENV=production webpack --config webpack.prod.js --progress --mode production" }, "dependencies": { + "@vue/compat": "^3.3.4", "apexcharts": "^3.40.0", "axios": "^1.4.0", "blurhash": "^2.0.5", @@ -20,6 +21,7 @@ "leaflet": "^1.9.4", "leaflet-active-area": "^1.2.1", "masonry-layout": "^4.2.2", + "mitt": "^3.0.1", "moment": "^2.29.4", "node-sass": "^7.0.3", "photoswipe": "^5.3.7", @@ -28,7 +30,6 @@ "react-dom": "^17.0.2", "swiper": "^8.4.5", "vue": "^3.3.4", - "@vue/compat": "^3.3.4", "vue-apexcharts": "^1.6.2", "vue-blurhash": "^0.1.4", "vue-countup-v2": "^4.0.0", diff --git a/src/views/admin/components/edition/item-edition-form.vue b/src/views/admin/components/edition/item-edition-form.vue index b28f4a79c..c62f42564 100644 --- a/src/views/admin/components/edition/item-edition-form.vue +++ b/src/views/admin/components/edition/item-edition-form.vue @@ -950,7 +950,7 @@ export default { // Obtains current Sequence Group Info this.fetchSequenceGroup({ collectionId: this.collectionId, groupId: this.sequenceId }); }, - tabs:{ + tabs: { handler() { if (this.tabs.length >= 2) { if (typeof this.swiper.update == 'function') @@ -976,7 +976,8 @@ export default { } } }, - immediate: true + immediate: true, + deep: true } }, created() { @@ -1065,10 +1066,10 @@ export default { }); // Sets feedback variables - eventBusItemMetadata.$on('isUpdatingValue', (status) => { + eventBusItemMetadata.$emitter.$on('isUpdatingValue', (status) => { this.isUpdatingValues = status; }); - eventBusItemMetadata.$on('hasErrorsOnForm', (hasErrors) => { + eventBusItemMetadata.$emitter.$on('hasErrorsOnForm', (hasErrors) => { if (hasErrors) this.formErrorMessage = this.formErrorMessage ? this.formErrorMessage : this.$i18n.get('info_errors_in_form'); else @@ -1077,10 +1078,10 @@ export default { this.cleanLastUpdated(); // Updates variables for metadata navigation from compound childs - eventBusItemMetadata.$on('isOnFirstMetadatumOfCompoundNavigation', (isOnFirstMetadatumOfCompoundNavigation) => { + eventBusItemMetadata.$emitter.$on('isOnFirstMetadatumOfCompoundNavigation', (isOnFirstMetadatumOfCompoundNavigation) => { this.isOnFirstMetadatumOfCompoundNavigation = isOnFirstMetadatumOfCompoundNavigation }); - eventBusItemMetadata.$on('isOnLastMetadatumOfCompoundNavigation', (isOnLastMetadatumOfCompoundNavigation) => { + eventBusItemMetadata.$emitter.$on('isOnLastMetadatumOfCompoundNavigation', (isOnLastMetadatumOfCompoundNavigation) => { this.isOnLastMetadatumOfCompoundNavigation = isOnLastMetadatumOfCompoundNavigation }); @@ -1093,10 +1094,10 @@ export default { this.isMobileSubheaderOpen = true; }, beforeUnmount () { - eventBusItemMetadata.$off('isUpdatingValue'); - eventBusItemMetadata.$off('hasErrorsOnForm'); - eventBusItemMetadata.$off('isOnFirstMetadatumOfCompoundNavigation'); - eventBusItemMetadata.$off('isOnLastMetadatumOfCompoundNavigation'); + eventBusItemMetadata.$emitter.$off('isUpdatingValue'); + eventBusItemMetadata.$emitter.$off('hasErrorsOnForm'); + eventBusItemMetadata.$emitter.$off('isOnFirstMetadatumOfCompoundNavigation'); + eventBusItemMetadata.$emitter.$off('isOnLastMetadatumOfCompoundNavigation'); window.removeEventListener('resize', this.handleWindowResize); if (typeof this.swiper.destroy == 'function') this.swiper.destroy(); diff --git a/src/views/admin/components/edition/item-form-footer-buttons.vue b/src/views/admin/components/edition/item-form-footer-buttons.vue index 1702dec48..4223cd5ea 100644 --- a/src/views/admin/components/edition/item-form-footer-buttons.vue +++ b/src/views/admin/components/edition/item-form-footer-buttons.vue @@ -206,13 +206,13 @@ export default { 'onDiscard', ], mounted() { - this.$parent.$on('toggleItemEditionFooterDropdown', () => { + this.$parent.$emitter.$on('toggleItemEditionFooterDropdown', () => { if (this.$refs && this.$refs['item-edition-footer-dropdown']) this.$refs['item-edition-footer-dropdown'].toggle(); }); }, beforeUnmount() { - this.$parent.$off('toggleItemEditionFooterDropdown'); + this.$parent.$emitter.$off('toggleItemEditionFooterDropdown'); }, methods: { openItemCreationStatusDialog() { diff --git a/src/views/admin/components/filter-types/checkbox/Checkbox.vue b/src/views/admin/components/filter-types/checkbox/Checkbox.vue index 4641d96db..00204cb78 100644 --- a/src/views/admin/components/filter-types/checkbox/Checkbox.vue +++ b/src/views/admin/components/filter-types/checkbox/Checkbox.vue @@ -83,19 +83,23 @@ } }, watch: { - selected(newVal, oldVal) { - const isEqual = (Array.isArray(newVal) && Array.isArray(oldVal) && (newVal.length == oldVal.length)) && newVal.every((element, index) => { - return element === oldVal[index]; - }); - if (!isEqual) - this.onSelect(); + selected: { + handler(newVal, oldVal) { + const isEqual = (Array.isArray(newVal) && Array.isArray(oldVal) && (newVal.length == oldVal.length)) && newVal.every((element, index) => { + return element === oldVal[index]; + }); + if (!isEqual) + this.onSelect(); + }, + deep: true }, facetsFromItemSearch: { handler() { if (this.isUsingElasticSearch) this.loadOptions(); }, - immediate: true + immediate: true, + deep: true }, }, mounted() { @@ -103,10 +107,10 @@ this.loadOptions(); }, created() { - this.$eventBusSearch.$on('hasToReloadFacets', this.reloadOptions); + this.$eventBusSearch.$emitter.$on('hasToReloadFacets', this.reloadOptions); }, beforeUnmount() { - this.$eventBusSearch.$off('hasToReloadFacets', this.reloadOptions); + this.$eventBusSearch.$emitter.$off('hasToReloadFacets', this.reloadOptions); }, methods: { reloadOptions(shouldReload) { diff --git a/src/views/admin/components/filter-types/selectbox/Selectbox.vue b/src/views/admin/components/filter-types/selectbox/Selectbox.vue index c8dfab610..e32b760e2 100644 --- a/src/views/admin/components/filter-types/selectbox/Selectbox.vue +++ b/src/views/admin/components/filter-types/selectbox/Selectbox.vue @@ -46,7 +46,8 @@ if (this.isUsingElasticSearch) this.loadOptions(); }, - immediate: true + immediate: true, + deep: true } }, mounted() { @@ -54,10 +55,10 @@ this.loadOptions(); }, created() { - this.$eventBusSearch.$on('hasToReloadFacets', this.reloadOptions); + this.$eventBusSearch.$emitter.$on('hasToReloadFacets', this.reloadOptions); }, beforeUnmount() { - this.$eventBusSearch.$off('hasToReloadFacets', this.reloadOptions); + this.$eventBusSearch.$emitter.$off('hasToReloadFacets', this.reloadOptions); }, methods: { reloadOptions(shouldReload) { diff --git a/src/views/admin/components/filter-types/taxonomy/Checkbox.vue b/src/views/admin/components/filter-types/taxonomy/Checkbox.vue index 7f93a52f4..49ef893f7 100644 --- a/src/views/admin/components/filter-types/taxonomy/Checkbox.vue +++ b/src/views/admin/components/filter-types/taxonomy/Checkbox.vue @@ -98,19 +98,23 @@ } }, watch: { - selected(newVal, oldVal) { - const isEqual = (Array.isArray(newVal) && Array.isArray(oldVal) && (newVal.length == oldVal.length)) && newVal.every((element, index) => { - return element === oldVal[index]; - }); - if (!isEqual) - this.onSelect(); + selected: { + handler(newVal, oldVal) { + const isEqual = (Array.isArray(newVal) && Array.isArray(oldVal) && (newVal.length == oldVal.length)) && newVal.every((element, index) => { + return element === oldVal[index]; + }); + if (!isEqual) + this.onSelect(); + }, + deep: true }, facetsFromItemSearch: { handler() { if (this.isUsingElasticSearch) this.loadOptions(); }, - immediate: true + immediate: true, + deep:true }, isLoadingItems: { handler() { @@ -129,7 +133,7 @@ this.taxonomyId = this.filter.metadatum.metadata_type_object.options.taxonomy_id; this.taxonomy = this.filter.metadatum.metadata_type_object.options.taxonomy; } - this.$eventBusSearch.$on('hasToReloadFacets', this.reloadOptions); + this.$eventBusSearch.$emitter.$on('hasToReloadFacets', this.reloadOptions); }, mounted(){ if (!this.isUsingElasticSearch) @@ -141,7 +145,7 @@ if (this.getOptionsValuesCancel != undefined) this.getOptionsValuesCancel.cancel('Facet search Canceled.'); - this.$eventBusSearch.$off('hasToReloadFacets', this.reloadOptions); + this.$eventBusSearch.$emitter.$off('hasToReloadFacets', this.reloadOptions); }, methods: { ...mapGetters('search', [ diff --git a/src/views/admin/components/lists/items-list.vue b/src/views/admin/components/lists/items-list.vue index 86d7adfb8..b42d4c9c3 100644 --- a/src/views/admin/components/lists/items-list.vue +++ b/src/views/admin/components/lists/items-list.vue @@ -2107,21 +2107,24 @@ export default { }, immediate: true }, - itemsLocations() { - setTimeout(() => { - if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) { - if (this.itemsLocations.length == 1) - this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] }); - else - this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] }); - } - }, 500) + itemsLocations: { + handler() { + setTimeout(() => { + if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) { + if (this.itemsLocations.length == 1) + this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] }); + else + this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] }); + } + }, 500); + }, + deep: true }, selectedGeocoordinateMetadatum() { this.clearSelectedMarkers(); }, geocoordinateMetadata: { - handler() { + handler() { // Setting default geocoordinate metadatum for map view mode const prefsGeocoordinateMetadatum = !this.isRepositoryLevel ? 'map_view_mode_selected_geocoordinate_metadatum_' + this.collectionId : 'map_view_mode_selected_geocoordinate_metadatum'; const geocoordinateMetadataIds = Object.keys(this.geocoordinateMetadata); @@ -2134,7 +2137,8 @@ export default { else this.selectedGeocoordinateMetadatumId = this.$userPrefs.get(prefsGeocoordinateMetadatum); }, - immediate: true + immediate: true, + deep: true } }, mounted() { diff --git a/src/views/admin/components/metadata-types/compound/Compound.vue b/src/views/admin/components/metadata-types/compound/Compound.vue index e94e1ae1b..59d171e63 100644 --- a/src/views/admin/components/metadata-types/compound/Compound.vue +++ b/src/views/admin/components/metadata-types/compound/Compound.vue @@ -168,27 +168,27 @@ handler() { this.createChildMetadataGroups(); }, - immediate: true + immediate: true, + deep: true }, isMetadataNavigation() { this.focusedGroupMetadatum = 0; this.focusedChildMetadatum = 0; }, isFocused() { - if (this.isFocused) { + if ( this.isFocused ) this.setMetadatumChildFocus({ groupIndex: this.focusedGroupMetadatum, childIndex: this.focusedChildMetadatum, scrollIntoView: true }); - } } }, created() { - eventBusItemMetadata.$on('hasRemovedItemMetadataGroup', this.laterUpdateIsRemovingGroup); - eventBusItemMetadata.$on('focusPreviousChildMetadatum', this.focusPreviousChildMetadatum); - eventBusItemMetadata.$on('focusNextChildMetadatum', this.focusNextChildMetadatum); + eventBusItemMetadata.$emitter.$on('hasRemovedItemMetadataGroup', this.laterUpdateIsRemovingGroup); + eventBusItemMetadata.$emitter.$on('focusPreviousChildMetadatum', this.focusPreviousChildMetadatum); + eventBusItemMetadata.$emitter.$on('focusNextChildMetadatum', this.focusNextChildMetadatum); }, beforeUnmount() { - eventBusItemMetadata.$off('hasRemovedItemMetadataGroup', this.laterUpdateIsRemovingGroup); - eventBusItemMetadata.$off('focusPreviousChildMetadatum', this.focusPreviousChildMetadatum); - eventBusItemMetadata.$off('focusNextChildMetadatum', this.focusNextChildMetadatum); + eventBusItemMetadata.$emitter.$off('hasRemovedItemMetadataGroup', this.laterUpdateIsRemovingGroup); + eventBusItemMetadata.$emitter.$off('focusPreviousChildMetadatum', this.focusPreviousChildMetadatum); + eventBusItemMetadata.$emitter.$off('focusNextChildMetadatum', this.focusNextChildMetadatum); }, methods: { createChildMetadataGroups() { diff --git a/src/views/admin/components/metadata-types/geocoordinate/GeoCoordinate.vue b/src/views/admin/components/metadata-types/geocoordinate/GeoCoordinate.vue index e045775b5..2ae443b7b 100644 --- a/src/views/admin/components/metadata-types/geocoordinate/GeoCoordinate.vue +++ b/src/views/admin/components/metadata-types/geocoordinate/GeoCoordinate.vue @@ -179,16 +179,19 @@ } }, watch: { - selectedLatLng() { - const mapComponentRef = 'map--' + this.itemMetadatumIdentifier; - nextTick(() => { - if ( this.$refs[mapComponentRef] && this.$refs[mapComponentRef].mapObject && this.selectedLatLng.length != undefined) { - if (this.selectedLatLng.length == 1) - this.$refs[mapComponentRef].mapObject.panInsideBounds(this.selectedLatLng, { animate: true, maxZoom: this.maxZoom }); - else - this.$refs[mapComponentRef].mapObject.flyToBounds(this.selectedLatLng, { animate: true, maxZoom: this.maxZoom }); - } - }); + selectedLatLng: { + handler() { + const mapComponentRef = 'map--' + this.itemMetadatumIdentifier; + nextTick(() => { + if ( this.$refs[mapComponentRef] && this.$refs[mapComponentRef].mapObject && this.selectedLatLng.length != undefined) { + if (this.selectedLatLng.length == 1) + this.$refs[mapComponentRef].mapObject.panInsideBounds(this.selectedLatLng, { animate: true, maxZoom: this.maxZoom }); + else + this.$refs[mapComponentRef].mapObject.flyToBounds(this.selectedLatLng, { animate: true, maxZoom: this.maxZoom }); + } + }); + }, + deep: true } }, created() { @@ -199,7 +202,7 @@ // We need to pass mapComponentRef here instead of creating it inside the function // otherwise the listener would conflict when multiple geo metadata are inserted. const mapComponentRef = 'map--' + this.itemMetadatumIdentifier; - eventBusItemMetadata.$on('itemEditionFormResize', () => this.handleWindowResize(mapComponentRef)); + eventBusItemMetadata.$emitter.$on('itemEditionFormResize', () => this.handleWindowResize(mapComponentRef)); }, mounted() { nextTick(() => { @@ -209,7 +212,7 @@ }, beforeUnmount() { const mapComponentRef = 'map--' + this.itemMetadatumIdentifier; - eventBusItemMetadata.$off('itemEditionFormResize', () => this.handleWindowResize(mapComponentRef)); + eventBusItemMetadata.$emitter.$off('itemEditionFormResize', () => this.handleWindowResize(mapComponentRef)); }, methods: { onUpdateFromLatitudeInput: _.debounce( function($event) { diff --git a/src/views/admin/components/metadata-types/tainacan-form-item.vue b/src/views/admin/components/metadata-types/tainacan-form-item.vue index 7fe5fb493..9fe6a4314 100644 --- a/src/views/admin/components/metadata-types/tainacan-form-item.vue +++ b/src/views/admin/components/metadata-types/tainacan-form-item.vue @@ -218,7 +218,7 @@ }, created() { this.setInitialValues(); - eventBusItemMetadata.$on('updateErrorMessageOf#' + (this.itemMetadatum.parent_meta_id ? this.itemMetadatum.metadatum.id + '-' + this.itemMetadatum.parent_meta_id : this.itemMetadatum.metadatum.id), (errors) => { + eventBusItemMetadata.$emitter.$on('updateErrorMessageOf#' + (this.itemMetadatum.parent_meta_id ? this.itemMetadatum.metadatum.id + '-' + this.itemMetadatum.parent_meta_id : this.itemMetadatum.metadatum.id), (errors) => { let updatedErrorMessage = ''; if (errors && errors.errors && this.itemMetadatum && this.itemMetadatum.metadatum && (this.itemMetadatum.parent_meta_id ? (this.itemMetadatum.parent_meta_id == errors.parent_meta_id && this.itemMetadatum.metadatum.id == errors.metadatum_id) : this.itemMetadatum.metadatum.id == errors.metadatum_id)) { for (let error of errors.errors) { @@ -231,7 +231,7 @@ }, beforeUnmount() { if (this.itemMetadatum && this.itemMetadatum.metadatum) { - eventBusItemMetadata.$off('updateErrorMessageOf#' + (this.itemMetadatum.parent_meta_id ? this.itemMetadatum.metadatum.id + '-' + this.itemMetadatum.parent_meta_id : this.itemMetadatum.metadatum.id)); + eventBusItemMetadata.$emitter.$off('updateErrorMessageOf#' + (this.itemMetadatum.parent_meta_id ? this.itemMetadatum.metadatum.id + '-' + this.itemMetadatum.parent_meta_id : this.itemMetadatum.metadatum.id)); } }, mounted () { diff --git a/src/views/admin/components/navigation/tainacan-header.vue b/src/views/admin/components/navigation/tainacan-header.vue index 9d31ff529..b6c1b0db3 100644 --- a/src/views/admin/components/navigation/tainacan-header.vue +++ b/src/views/admin/components/navigation/tainacan-header.vue @@ -130,12 +130,12 @@ } }, created(){ - this.$root.$on('openProcessesPopup', () => { + this.$root.$emitter.$on('openProcessesPopup', () => { this.showProcesses = true; }); }, beforeUnmount() { - this.$root.$off('openProcessesPopup'); + this.$root.$emitter.$off('openProcessesPopup'); }, methods: { updateSearch() { diff --git a/src/views/admin/components/navigation/tainacan-title.vue b/src/views/admin/components/navigation/tainacan-title.vue index af5b93348..401d82553 100644 --- a/src/views/admin/components/navigation/tainacan-title.vue +++ b/src/views/admin/components/navigation/tainacan-title.vue @@ -81,13 +81,16 @@ export default { } }, watch: { - '$route' (to, from) { - if (to.path != from.path) { - this.isRepositoryLevel = (to.params.collectionId == undefined); + '$route': { + handler(to, from) { + if (to.path != from.path) { + this.isRepositoryLevel = (to.params.collectionId == undefined); - this.activeRoute = to.name; - this.pageTitle = this.$route.meta.title; - } + this.activeRoute = to.name; + this.pageTitle = this.$route.meta.title; + } + }, + deep: true } }, created() { @@ -96,10 +99,10 @@ export default { document.title = this.$route.meta.title; this.pageTitle = document.title; - this.$root.$on('onCollectionBreadCrumbUpdate', this.collectionBreadCrumbUpdate); + this.$root.$emitter.$on('onCollectionBreadCrumbUpdate', this.collectionBreadCrumbUpdate); }, beforeUnmount() { - this.$root.$on('onCollectionBreadCrumbUpdate', this.collectionBreadCrumbUpdate); + this.$root.$emitter.$on('onCollectionBreadCrumbUpdate', this.collectionBreadCrumbUpdate); }, methods: { ...mapGetters('collection', [ diff --git a/src/views/admin/components/other/checkbox-radio-filter-input.vue b/src/views/admin/components/other/checkbox-radio-filter-input.vue index 64d07bdb7..b1b419449 100644 --- a/src/views/admin/components/other/checkbox-radio-filter-input.vue +++ b/src/views/admin/components/other/checkbox-radio-filter-input.vue @@ -402,7 +402,7 @@ else this.isCheckboxListLoading = true; - this.$parent.$on('updateTaxonomyInputs', ($event) => { + this.$parent.$emitter.$on('updateTaxonomyInputs', ($event) => { if ($event.taxonomyId == this.taxonomy_id && $event.metadatumId == this.metadatumId) { this.finderColumns = []; this.optionName = ''; diff --git a/src/views/admin/components/other/checkbox-radio-metadata-input.vue b/src/views/admin/components/other/checkbox-radio-metadata-input.vue index 1be11a1c2..5fd03994f 100644 --- a/src/views/admin/components/other/checkbox-radio-metadata-input.vue +++ b/src/views/admin/components/other/checkbox-radio-metadata-input.vue @@ -385,8 +385,11 @@ } }, watch: { - selected() { - this.$emit('input', this.selected); + selected: { + handler() { + this.$emit('input', this.selected); + }, + deep: true }, optionName(newValue, oldValue) { if (newValue != oldValue) { @@ -405,7 +408,7 @@ this.expandResultsSection = this.shouldBeginWithListExpanded; - this.$parent.$on('updateTaxonomyInputs', ($event) => { + this.$parent.$emitter.$on('updateTaxonomyInputs', ($event) => { if ($event.taxonomyId == this.taxonomy_id && $event.metadatumId == this.metadatumId) { this.finderColumns = []; this.optionName = ''; diff --git a/src/views/admin/components/search/filters-items-list.vue b/src/views/admin/components/search/filters-items-list.vue index 96d933bad..597cad4a8 100644 --- a/src/views/admin/components/search/filters-items-list.vue +++ b/src/views/admin/components/search/filters-items-list.vue @@ -356,43 +356,49 @@ } }, watch: { - taxonomyFilters() { - if ( this.taxonomyFilters != undefined && Object.keys(this.taxonomyFilters).length ) { - - Object.assign( this.taxonomyFiltersCollectionNames, { 'repository-filters': this.$i18n.get('repository') }); - - // Cancels previous collection name Request - if (this.collectionNameSearchCancel != undefined) - this.collectionNameSearchCancel.cancel('Collection name search Canceled.'); - let collectionIds = JSON.parse(JSON.stringify(Object.keys(this.taxonomyFilters))); - - this.fetchAllCollectionNames( collectionIds.filter(aCollectionId => aCollectionId !== 'repository-filters') ) - .then((resp) => { - resp.request - .then((collections) => { - for (let collection of collections) - Object.assign( this.taxonomyFiltersCollectionNames, { [collection.id]: collection.name }); - }); - // Search Request Token for cancelling - this.collectionNameSearchCancel = resp.source; - }); - } + taxonomyFilters: { + handler() { + if ( this.taxonomyFilters != undefined && Object.keys(this.taxonomyFilters).length ) { + + Object.assign( this.taxonomyFiltersCollectionNames, { 'repository-filters': this.$i18n.get('repository') }); + + // Cancels previous collection name Request + if (this.collectionNameSearchCancel != undefined) + this.collectionNameSearchCancel.cancel('Collection name search Canceled.'); + let collectionIds = JSON.parse(JSON.stringify(Object.keys(this.taxonomyFilters))); + + this.fetchAllCollectionNames( collectionIds.filter(aCollectionId => aCollectionId !== 'repository-filters') ) + .then((resp) => { + resp.request + .then((collections) => { + for (let collection of collections) + Object.assign( this.taxonomyFiltersCollectionNames, { [collection.id]: collection.name }); + }); + // Search Request Token for cancelling + this.collectionNameSearchCancel = resp.source; + }); + } + }, + deep: true }, - repositoryCollectionFilters() { - if ( this.repositoryCollectionFilters != undefined && Object.keys(this.repositoryCollectionFilters).length ) { - - Object.assign( this.repositoryCollectionNames, { 'repository-filters': this.$i18n.get('repository') }); - - for ( let collection of this.getCollections() ) - Object.assign( this.repositoryCollectionNames, { [collection.id]: collection.name }); - } + repositoryCollectionFilters: { + handler() { + if ( this.repositoryCollectionFilters != undefined && Object.keys(this.repositoryCollectionFilters).length ) { + + Object.assign( this.repositoryCollectionNames, { 'repository-filters': this.$i18n.get('repository') }); + + for ( let collection of this.getCollections() ) + Object.assign( this.repositoryCollectionNames, { [collection.id]: collection.name }); + } + }, + deep: true } }, mounted() { this.prepareFilters(); if (this.isUsingElasticSearch) - this.$eventBusSearch.$on('isLoadingItems', this.updateIsLoadingItems); + this.$eventBusSearch.$emitter.$on('isLoadingItems', this.updateIsLoadingItems); }, beforeUnmount() { // Cancels previous collection name Request @@ -408,7 +414,7 @@ this.filtersSearchCancel.cancel('Filters search Canceled.'); if (this.isUsingElasticSearch) - this.$eventBusSearch.$off('isLoadingItems', this.updateIsLoadingItems); + this.$eventBusSearch.$emitter.$off('isLoadingItems', this.updateIsLoadingItems); }, methods: { diff --git a/src/views/admin/js/admin-main.js b/src/views/admin/js/admin-main.js index 43b638755..9a0ff406c 100644 --- a/src/views/admin/js/admin-main.js +++ b/src/views/admin/js/admin-main.js @@ -87,6 +87,7 @@ import { ThumbnailHelperPlugin, OrderByHelperPlugin } from './utilities'; +import mitt from 'mitt'; export default (element) => { @@ -104,10 +105,13 @@ export default (element) => { store, render: h => h(AdminPage) }); - + app.use(router); app.use(store); + const emitter = mitt(); + app.config.globalProperties.$emitter = emitter; + /* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */ if (typeof window.tainacan_extra_plugins != "undefined") { for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins)) diff --git a/src/views/admin/js/event-bus-item-metadata.js b/src/views/admin/js/event-bus-item-metadata.js index de015facd..40b16c4fe 100644 --- a/src/views/admin/js/event-bus-item-metadata.js +++ b/src/views/admin/js/event-bus-item-metadata.js @@ -1,5 +1,8 @@ import { createApp } from 'vue'; import store from './store/store' +import mitt from 'mitt'; + +const emitter = mitt(); export const eventBusItemMetadata = createApp({ store, @@ -8,13 +11,16 @@ export const eventBusItemMetadata = createApp({ conditionalSections: {} }, watch: { - errors() { - this.$emit('hasErrorsOnForm', this.errors.length > 0 && this.errors[0].errors && this.errors[0].errors.length); - - if (this.errors.length > 0 && this.errors[0].errors && this.errors[0].errors.length) { - for (let error of this.errors) - this.$emit('updateErrorMessageOf#' + (error.metadatum_id + (error.parent_meta_id ? '-' + error.parent_meta_id : '')), error); - } + errors: { + handler() { + this.$emit('hasErrorsOnForm', this.errors.length > 0 && this.errors[0].errors && this.errors[0].errors.length); + + if (this.errors.length > 0 && this.errors[0].errors && this.errors[0].errors.length) { + for (let error of this.errors) + this.$emit('updateErrorMessageOf#' + (error.metadatum_id + (error.parent_meta_id ? '-' + error.parent_meta_id : '')), error); + } + }, + deep: true } }, emits: [ @@ -31,12 +37,12 @@ export const eventBusItemMetadata = createApp({ 'isUpdatingValue' ], created() { - this.$on('input', this.updateValue); - this.$on('removeCompoundGroup', this.removeItemMetadataGroup); + this.$emitter.$on('input', this.updateValue); + this.$emitter.$on('removeCompoundGroup', this.removeItemMetadataGroup); }, beforeUpdate() { - this.$off('input', this.updateValue); - this.$on('removeCompoundGroup', this.removeItemMetadataGroup); + this.$emitter.$off('input', this.updateValue); + this.$emitter.$on('removeCompoundGroup', this.removeItemMetadataGroup); }, methods : { updateValue({ itemId, metadatumId, values, parentMetaId, parentId }){ @@ -153,3 +159,4 @@ export const eventBusItemMetadata = createApp({ } } }); +eventBusItemMetadata.config.globalProperties.$emitter = emitter; \ No newline at end of file diff --git a/src/views/admin/js/event-bus-metadata-list.js b/src/views/admin/js/event-bus-metadata-list.js index 0544d45db..6ca1dddb5 100644 --- a/src/views/admin/js/event-bus-metadata-list.js +++ b/src/views/admin/js/event-bus-metadata-list.js @@ -1,9 +1,12 @@ import { createApp } from 'vue'; +import mitt from 'mitt'; + +const emitter = mitt(); export default { install(app, options = {}) { - + app.config.globalProperties.$emitter = emitter; app.config.globalProperties.$eventBusMetadataList = createApp({ emits: [ 'addMetadatumViaButton', diff --git a/src/views/admin/js/event-bus-search.js b/src/views/admin/js/event-bus-search.js index f9b38bbd4..f0aa8d8dc 100644 --- a/src/views/admin/js/event-bus-search.js +++ b/src/views/admin/js/event-bus-search.js @@ -1,9 +1,12 @@ import { createApp } from 'vue'; +import mitt from 'mitt'; + +const emitter = mitt(); export default { install(app, options = {}) { - + app.config.globalProperties.$emitter = emitter; app.config.globalProperties.$eventBusSearch = createApp({ router: options.router, store: options.store, @@ -26,20 +29,20 @@ export default { 'closeAdvancedSearch' ], created() { - this.$on('input', data => { + this.$emitter.$on('input', data => { if (data.taxonomy) this.addTaxquery(data); else this.addMetaquery(data); }); - this.$root.$on('closeAdvancedSearch', () => { + this.$root.$emitter.$on('closeAdvancedSearch', () => { this.$store.dispatch('search/setPage', 1); this.performAdvancedSearch({}); }); - this.$root.$on('performAdvancedSearch', advancedSearchQuery => { + this.$root.$emitter.$on('performAdvancedSearch', advancedSearchQuery => { this.$store.dispatch('search/setPage', 1); this.performAdvancedSearch(advancedSearchQuery); @@ -47,148 +50,151 @@ export default { }); }, watch: { - '$route' (to, from) { + '$route': { + handler(to, from) { - // Should set Collection ID from URL only when in admin. - if (this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') - this.collectionId = !this.$route.params.collectionId ? this.$route.params.collectionId : parseInt(this.$route.params.collectionId); + // Should set Collection ID from URL only when in admin. + if (this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') + this.collectionId = !this.$route.params.collectionId ? this.$route.params.collectionId : parseInt(this.$route.params.collectionId); - // Fills the URL with appropriate default values in case a query is not passed - if (this.$route.name == null || this.$route.name == undefined || this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') { - - // Items Per Page - if (this.$route.query.perpage == undefined || to.params.collectionId != from.params.collectionId) { - let perPageKey = (this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page'); - let perPageValue = this.$userPrefs.get(perPageKey); - - if (perPageValue) - this.$route.query.perpage = perPageValue; - else { - this.$route.query.perpage = 12; - this.$userPrefs.set(perPageKey, 12); - } - } - - // Page - if (this.$route.query.paged == undefined || to.params.collectionId != from.params.collectionId) - this.$route.query.paged = 1; - - // Order (ASC, DESC) - if (this.$route.query.order == undefined || to.params.collectionId != from.params.collectionId) { - let orderKey = (this.collectionId != undefined ? 'order_' + this.collectionId : 'order'); - let orderValue = this.$userPrefs.get(orderKey) ? this.$userPrefs.get(orderKey) : this.defaultOrder; + // Fills the URL with appropriate default values in case a query is not passed + if (this.$route.name == null || this.$route.name == undefined || this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') { - if (orderValue) - this.$route.query.order = orderValue; - else { - this.$route.query.order = 'DESC'; - this.$userPrefs.set(orderKey, 'DESC'); - } - } - - // Order By (required extra work to deal with custom metadata ordering) - if (this.$route.query.orderby == undefined || (to.params.collectionId != from.params.collectionId)) { - let orderByKey = (this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by'); - let orderBy = this.$userPrefs.get(orderByKey) ? this.$userPrefs.get(orderByKey) : this.defaultOrderBy; - - if (orderBy && orderBy != 'name') { - - // Previously was stored as a metadata object, now it is a orderby object - if (orderBy.slug || typeof orderBy == 'string') - orderBy = this.$orderByHelper.getOrderByForMetadatum(orderBy); + // Items Per Page + if (this.$route.query.perpage == undefined || to.params.collectionId != from.params.collectionId) { + let perPageKey = (this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page'); + let perPageValue = this.$userPrefs.get(perPageKey); - if (orderBy.orderby) - Object.keys(orderBy).forEach((paramKey) => { - this.$route.query[paramKey] = orderBy[paramKey]; - }); - else - this.$route.query.orderby = 'date' + if (perPageValue) + this.$route.query.perpage = perPageValue; + else { + this.$route.query.perpage = 12; + this.$userPrefs.set(perPageKey, 12); + } + } + + // Page + if (this.$route.query.paged == undefined || to.params.collectionId != from.params.collectionId) + this.$route.query.paged = 1; + + // Order (ASC, DESC) + if (this.$route.query.order == undefined || to.params.collectionId != from.params.collectionId) { + let orderKey = (this.collectionId != undefined ? 'order_' + this.collectionId : 'order'); + let orderValue = this.$userPrefs.get(orderKey) ? this.$userPrefs.get(orderKey) : this.defaultOrder; - } else { - this.$route.query.orderby = 'date'; - this.$userPrefs.set(orderByKey, { - slug: 'creation_date', - name: this.$i18n.get('label_creation_date') - }).catch(() => { }); + if (orderValue) + this.$route.query.order = orderValue; + else { + this.$route.query.order = 'DESC'; + this.$userPrefs.set(orderKey, 'DESC'); + } } - } else if ( this.$route.query.orderby == 'creation_date' ) { // Fixes old usage of creation_date - this.$route.query.orderby = 'date' - } - - // Theme View Modes - if ((this.$route.name == null || this.$route.name == undefined ) && - this.$route.name != 'CollectionItemsPage' && this.$route.name != 'ItemsPage' && - (this.$route.query.view_mode == undefined || to.params.collectionId != from.params.collectionId) - ) { - let viewModeKey = (this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode'); - let viewModeValue = this.$userPrefs.get(viewModeKey); + // Order By (required extra work to deal with custom metadata ordering) + if (this.$route.query.orderby == undefined || (to.params.collectionId != from.params.collectionId)) { + let orderByKey = (this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by'); + let orderBy = this.$userPrefs.get(orderByKey) ? this.$userPrefs.get(orderByKey) : this.defaultOrderBy; + + if (orderBy && orderBy != 'name') { + + // Previously was stored as a metadata object, now it is a orderby object + if (orderBy.slug || typeof orderBy == 'string') + orderBy = this.$orderByHelper.getOrderByForMetadatum(orderBy); - if (viewModeValue) - this.$route.query.view_mode = viewModeValue; - else { - this.$route.query.view_mode = 'table'; - this.$userPrefs.set(viewModeKey, 'table'); + if (orderBy.orderby) + Object.keys(orderBy).forEach((paramKey) => { + this.$route.query[paramKey] = orderBy[paramKey]; + }); + else + this.$route.query.orderby = 'date' + + } else { + this.$route.query.orderby = 'date'; + this.$userPrefs.set(orderByKey, { + slug: 'creation_date', + name: this.$i18n.get('label_creation_date') + }).catch(() => { }); + } + } else if ( this.$route.query.orderby == 'creation_date' ) { // Fixes old usage of creation_date + this.$route.query.orderby = 'date' } - } - // Emit slideshow-from to start this view mode from index - if (this.$route.query.view_mode != 'slideshow' && this.$route.query['slideshow-from'] !== null && this.$route.query['slideshow-from'] !== undefined && this.$route.query['slideshow-from'] !== false) - this.$emit('startSlideshowFromItem', this.$route.query['slideshow-from']); + // Theme View Modes + if ((this.$route.name == null || this.$route.name == undefined ) && + this.$route.name != 'CollectionItemsPage' && this.$route.name != 'ItemsPage' && + (this.$route.query.view_mode == undefined || to.params.collectionId != from.params.collectionId) + ) { + + let viewModeKey = (this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode'); + let viewModeValue = this.$userPrefs.get(viewModeKey); - // Admin View Modes - if (this.$route.name != null && this.$route.name != undefined && - (this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') && - (this.$route.query.admin_view_mode == undefined || to.params.collectionId != from.params.collectionId) - ) { - let adminViewModeKey = (this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode'); - let adminViewModeValue = this.$userPrefs.get(adminViewModeKey); - - if (adminViewModeValue) - this.$route.query.admin_view_mode = adminViewModeValue; - else { - this.$route.query.admin_view_mode = 'table'; - this.$userPrefs.set(adminViewModeKey, 'table'); + if (viewModeValue) + this.$route.query.view_mode = viewModeValue; + else { + this.$route.query.view_mode = 'table'; + this.$userPrefs.set(viewModeKey, 'table'); + } } - } - - // Advanced Search - if (this.$route.query && this.$route.query.advancedSearch){ - this.$store.dispatch('search/set_advanced_query', this.$route.query); - } else { - this.$store.dispatch('search/set_postquery', this.$route.query); - } - - // Checks current metaqueries and taxqueries to alert filters that should reload - // For some reason, this process is not working accessing to.query, so we need to check the path string. - const oldQueryString = from.fullPath.replace(from.path + '?', ''); - const newQueryString = to.fullPath.replace(from.path + '?', ''); - - const oldQueryArray = oldQueryString.split('&'); - const newQueryArray = newQueryString.split('&'); - const oldMetaQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('metaquery')); - const newMetaQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('metaquery')); - const oldTaxQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('taxquery')); - const newTaxQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('taxquery')); - const oldStatusArray = oldQueryArray.filter(queryItem => queryItem.startsWith('status')); - const newStatusArray = newQueryArray.filter(queryItem => queryItem.startsWith('status')); - const oldSearchQuery = oldQueryArray.filter(queryItem => queryItem.startsWith('search')); - const newSearchQuery = newQueryArray.filter(queryItem => queryItem.startsWith('search')); + // Emit slideshow-from to start this view mode from index + if (this.$route.query.view_mode != 'slideshow' && this.$route.query['slideshow-from'] !== null && this.$route.query['slideshow-from'] !== undefined && this.$route.query['slideshow-from'] !== false) + this.$emit('startSlideshowFromItem', this.$route.query['slideshow-from']); - if ( - JSON.stringify(oldMetaQueryArray) != JSON.stringify(newMetaQueryArray) || - JSON.stringify(oldTaxQueryArray) != JSON.stringify(newTaxQueryArray) || - JSON.stringify(oldStatusArray) != JSON.stringify(newStatusArray) || - JSON.stringify(oldSearchQuery) != JSON.stringify(newSearchQuery) - ) { - this.$emit('hasToReloadFacets', true); + // Admin View Modes + if (this.$route.name != null && this.$route.name != undefined && + (this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') && + (this.$route.query.admin_view_mode == undefined || to.params.collectionId != from.params.collectionId) + ) { + let adminViewModeKey = (this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode'); + let adminViewModeValue = this.$userPrefs.get(adminViewModeKey); + + if (adminViewModeValue) + this.$route.query.admin_view_mode = adminViewModeValue; + else { + this.$route.query.admin_view_mode = 'table'; + this.$userPrefs.set(adminViewModeKey, 'table'); + } + } + + // Advanced Search + if (this.$route.query && this.$route.query.advancedSearch){ + this.$store.dispatch('search/set_advanced_query', this.$route.query); + } else { + this.$store.dispatch('search/set_postquery', this.$route.query); + } + + // Checks current metaqueries and taxqueries to alert filters that should reload + // For some reason, this process is not working accessing to.query, so we need to check the path string. + const oldQueryString = from.fullPath.replace(from.path + '?', ''); + const newQueryString = to.fullPath.replace(from.path + '?', ''); + + const oldQueryArray = oldQueryString.split('&'); + const newQueryArray = newQueryString.split('&'); + + const oldMetaQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('metaquery')); + const newMetaQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('metaquery')); + const oldTaxQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('taxquery')); + const newTaxQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('taxquery')); + const oldStatusArray = oldQueryArray.filter(queryItem => queryItem.startsWith('status')); + const newStatusArray = newQueryArray.filter(queryItem => queryItem.startsWith('status')); + const oldSearchQuery = oldQueryArray.filter(queryItem => queryItem.startsWith('search')); + const newSearchQuery = newQueryArray.filter(queryItem => queryItem.startsWith('search')); + + if ( + JSON.stringify(oldMetaQueryArray) != JSON.stringify(newMetaQueryArray) || + JSON.stringify(oldTaxQueryArray) != JSON.stringify(newTaxQueryArray) || + JSON.stringify(oldStatusArray) != JSON.stringify(newStatusArray) || + JSON.stringify(oldSearchQuery) != JSON.stringify(newSearchQuery) + ) { + this.$emit('hasToReloadFacets', true); + } + + // Finally, loads items + if (to.fullPath != from.fullPath) + this.loadItems(); } - - // Finally, loads items - if (to.fullPath != from.fullPath) - this.loadItems(); - } + }, + deep: true } }, methods: { diff --git a/src/views/admin/pages/lists/items-page.vue b/src/views/admin/pages/lists/items-page.vue index 63fa64db5..9c3dc4684 100644 --- a/src/views/admin/pages/lists/items-page.vue +++ b/src/views/admin/pages/lists/items-page.vue @@ -816,8 +816,11 @@ } }, watch: { - displayedMetadata() { - this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata)); + displayedMetadata: { + handler() { + this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata)); + }, + deep: true }, openAdvancedSearch(newValue) { if (newValue == false){ @@ -848,7 +851,7 @@ this.$eventBusSearch.setCollectionId(this.collectionId); this.$eventBusSearch.updateStoreFromURL(); - this.$eventBusSearch.$on('isLoadingItems', isLoadingItems => { + this.$eventBusSearch.$emitter.$on('isLoadingItems', isLoadingItems => { if (isLoadingItems != this.isLoadingItems && this.$refs['items-page-container'] && this.$refs['search-control']) { @@ -861,7 +864,7 @@ this.isLoadingItems = isLoadingItems; }); - this.$eventBusSearch.$on('hasFiltered', hasFiltered => { + this.$eventBusSearch.$emitter.$on('hasFiltered', hasFiltered => { this.hasFiltered = hasFiltered; }); @@ -869,7 +872,7 @@ this.openAdvancedSearch = this.$route.query.advancedSearch; } - this.$root.$on('openAdvancedSearch', (openAdvancedSearch) => { + this.$root.$emitter.$on('openAdvancedSearch', (openAdvancedSearch) => { this.openAdvancedSearch = openAdvancedSearch; }); @@ -1393,14 +1396,14 @@ }, 750), removeEventListeners() { // Component - this.$off(); + this.$emitter.$off(); // Window window.removeEventListener('resize', this.hideFiltersOnMobile); // $root - this.$root.$off('openAdvancedSearch'); + this.$root.$emitter.$off('openAdvancedSearch'); // $eventBusSearch - this.$eventBusSearch.$off('isLoadingItems'); - this.$eventBusSearch.$off('hasFiltered'); + this.$eventBusSearch.$emitter.$off('isLoadingItems'); + this.$eventBusSearch.$emitter.$off('hasFiltered'); } } } diff --git a/src/views/gutenberg-blocks/blocks/faceted-search/theme-search/theme-items-page.vue b/src/views/gutenberg-blocks/blocks/faceted-search/theme-search/theme-items-page.vue index eefcb4ddc..e8512ef4b 100644 --- a/src/views/gutenberg-blocks/blocks/faceted-search/theme-search/theme-items-page.vue +++ b/src/views/gutenberg-blocks/blocks/faceted-search/theme-search/theme-items-page.vue @@ -830,8 +830,11 @@ } }, watch: { - displayedMetadata() { - this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata)); + displayedMetadata: { + handler() { + this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata)); + }, + deep: true }, openAdvancedSearch(newValue){ if (newValue == false){ @@ -898,7 +901,7 @@ } } - this.$eventBusSearch.$on('isLoadingItems', isLoadingItems => { + this.$eventBusSearch.$emitter.$on('isLoadingItems', isLoadingItems => { this.isLoadingItems = isLoadingItems; @@ -912,7 +915,7 @@ })); }); - this.$eventBusSearch.$on('hasFiltered', hasFiltered => { + this.$eventBusSearch.$emitter.$on('hasFiltered', hasFiltered => { this.hasFiltered = hasFiltered; }); @@ -922,12 +925,12 @@ this.openAdvancedSearch = this.$route.query.advancedSearch; } - this.$root.$on('openAdvancedSearch', (openAdvancedSearch) => { + this.$root.$emitter.$on('openAdvancedSearch', (openAdvancedSearch) => { this.openAdvancedSearch = openAdvancedSearch; }); } - this.$eventBusSearch.$on('startSlideshowFromItem', (index) => { + this.$eventBusSearch.$emitter.$on('startSlideshowFromItem', (index) => { let currentQuery = this.$route.query; delete currentQuery['slideshow-from']; this.$router.replace({ query: currentQuery }).catch((error) => this.$console.log(error)); @@ -1453,16 +1456,16 @@ }, 500), removeEventListeners() { // Component - this.$off(); + this.$emitter.$off(); // Window if (!this.hideFilters) window.removeEventListener('resize', this.hideFiltersOnMobile); // $root if (!this.hideAdvancedSearch) - this.$root.$off('openAdvancedSearch'); + this.$root.$emitter.$off('openAdvancedSearch'); // $eventBusSearch - this.$eventBusSearch.$off('isLoadingItems'); - this.$eventBusSearch.$off('hasFiltered'); + this.$eventBusSearch.$emitter.$off('isLoadingItems'); + this.$eventBusSearch.$emitter.$off('hasFiltered'); }, } diff --git a/src/views/gutenberg-blocks/blocks/faceted-search/theme.js b/src/views/gutenberg-blocks/blocks/faceted-search/theme.js index 94ccadb2f..16124236e 100644 --- a/src/views/gutenberg-blocks/blocks/faceted-search/theme.js +++ b/src/views/gutenberg-blocks/blocks/faceted-search/theme.js @@ -44,6 +44,7 @@ import { ThumbnailHelperPlugin, OrderByHelperPlugin } from '../../../admin/js/utilities'; +import mitt from 'mitt'; export default (element) => { @@ -279,6 +280,9 @@ export default (element) => { .catch(error => console.log(error)); }); + const emitter = mitt(); + VueItemsList.config.globalProperties.$emitter = emitter; + VueItemsList.use(eventBusSearch, { store: store, router: routerTheme }); VueItemsList.mount(); diff --git a/src/views/gutenberg-blocks/blocks/item-submission-form/item-submission/item-submission-form.vue b/src/views/gutenberg-blocks/blocks/item-submission-form/item-submission/item-submission-form.vue index 6cc012807..086d7df35 100644 --- a/src/views/gutenberg-blocks/blocks/item-submission-form/item-submission/item-submission-form.vue +++ b/src/views/gutenberg-blocks/blocks/item-submission-form/item-submission/item-submission-form.vue @@ -908,7 +908,7 @@ export default { // CREATING NEW ITEM SUBMISSION this.createNewItem(); - eventBusItemMetadata.$on('hasErrorsOnForm', (hasErrors) => { + eventBusItemMetadata.$emitter.$on('hasErrorsOnForm', (hasErrors) => { if (hasErrors) { if (Array.isArray(this.formErrors)) { for (let i = 0; i < this.metadataSectionCollapses.length; i++) @@ -968,7 +968,7 @@ export default { this.form.document_type = 'url'; }, beforeUnmount () { - eventBusItemMetadata.$off('hasErrorsOnForm'); + eventBusItemMetadata.$emitter.$off('hasErrorsOnForm'); }, methods: { ...mapActions('item', [