Fixes routing issues caused by Vue 3 Migration #794.

This commit is contained in:
mateuswetah 2024-01-26 14:31:20 -03:00
parent 9738ac7dc2
commit 230f974f68
3 changed files with 94 additions and 77 deletions

View File

@ -560,6 +560,38 @@ AdminOptionsHelperPlugin.install = function (app, options = {}) {
console.log('Tainacan Admin loaded in ' + adminSpecialMode);
// Under these special modes, several routes do not need to exist
if (
adminSpecialMode === 'itemsMultipleSelectionMode' ||
adminSpecialMode === 'itemsSingleSelectionMode' ||
adminSpecialMode === 'itemsSearchSelectionMode' ||
adminSpecialMode === 'itemEditionMode'
) {
app.config.globalProperties.$router.removeRoute('HomePage');
app.config.globalProperties.$router.removeRoute('CollectionsPage');
app.config.globalProperties.$router.removeRoute('CollectionCreationForm');
app.config.globalProperties.$router.removeRoute('CollectionItemBulkAddPage');
app.config.globalProperties.$router.removeRoute('CollectionEditionForm');
app.config.globalProperties.$router.removeRoute('CollectionMetadataPage');
app.config.globalProperties.$router.removeRoute('CollectionFiltersPage');
app.config.globalProperties.$router.removeRoute('CollectionActivitiesPage');
app.config.globalProperties.$router.removeRoute('CollectionCapabilitiesPage');
app.config.globalProperties.$router.removeRoute('MappedCollectionCreationForm');
app.config.globalProperties.$router.removeRoute('FiltersPage');
app.config.globalProperties.$router.removeRoute('MetadataPage');
app.config.globalProperties.$router.removeRoute('TaxonomyPage');
app.config.globalProperties.$router.removeRoute('TaxonomyCreationForm');
app.config.globalProperties.$router.removeRoute('TaxonomyEditionForm');
app.config.globalProperties.$router.removeRoute('ActivitiesPage');
app.config.globalProperties.$router.removeRoute('CapabilitiesPage');
app.config.globalProperties.$router.removeRoute('AvailableImportersPage');
app.config.globalProperties.$router.removeRoute('ImporterEditionForm');
app.config.globalProperties.$router.removeRoute('ImporterCreationForm');
app.config.globalProperties.$router.removeRoute('ImporterMappingForm');
app.config.globalProperties.$router.removeRoute('ExportersPage');
app.config.globalProperties.$router.removeRoute('ExporterEditionForm');
}
for (let option in adminSpecialModes[adminSpecialMode])
app.config.globalProperties.$adminOptions[option] = adminSpecialModes[adminSpecialMode][option];
}

View File

@ -4,11 +4,6 @@ export default {
install(app) {
const router = app.config.globalProperties.$router;
const route = app.config.globalProperties.$route;
const store = app.config.globalProperties.$store;
const userPrefs = app.config.globalProperties.$userPrefs;
const emitter = mitt();
const bus = {
collectionId: undefined,
@ -18,18 +13,18 @@ export default {
termId: undefined,
searchCancel: undefined,
performAdvancedSearch(data) {
store.dispatch('search/setAdvancedQuery', data);
app.config.globalProperties.$store.dispatch('search/setAdvancedQuery', data);
this.updateURLQueries();
},
addMetaquery( data ){
if ( data && data.collection_id ){
store.dispatch('search/addMetaquery', data );
app.config.globalProperties.$store.dispatch('search/addMetaquery', data );
}
this.updateURLQueries();
},
addTaxquery( data ){
if ( data && data.collection_id ){
store.dispatch('search/addTaxquery', data );
app.config.globalProperties.$store.dispatch('search/addTaxquery', data );
}
this.updateURLQueries();
},
@ -39,7 +34,7 @@ export default {
if (filterTag.argType !== 'postin') {
if (filterTag.taxonomy) {
store.dispatch('search/removeTaxQuery', {
app.config.globalProperties.$store.dispatch('search/removeTaxQuery', {
filterId: filterTag.filterId,
label: filterTag.singleLabel ? filterTag.singleLabel : filterTag.label,
isMultiValue: filterTag.singleLabel ? false : true,
@ -47,7 +42,7 @@ export default {
value: filterTag.value
});
} else {
store.dispatch('search/removeMetaQuery', {
app.config.globalProperties.$store.dispatch('search/removeMetaQuery', {
filterId: filterTag.filterId,
label: filterTag.singleLabel ? filterTag.singleLabel : filterTag.label,
isMultiValue: filterTag.singleLabel ? false : true,
@ -56,50 +51,50 @@ export default {
});
}
} else {
store.dispatch('search/removePostIn');
app.config.globalProperties.$store.dispatch('search/removePostIn');
}
store.dispatch('search/removeFilterTag', filterTag);
app.config.globalProperties.$store.dispatch('search/removeFilterTag', filterTag);
}
this.updateURLQueries();
},
addFetchOnly( metadatum, ignorePrefs, metadatumIDs ) {
store.dispatch('search/addFetchOnly', metadatum );
store.dispatch('search/addFetchOnlyMeta', metadatumIDs);
app.config.globalProperties.$store.dispatch('search/addFetchOnly', metadatum );
app.config.globalProperties.$store.dispatch('search/addFetchOnlyMeta', metadatumIDs);
this.updateURLQueries();
if (!ignorePrefs) {
let prefsFetchOnly = this.collectionId ? `fetch_only_${this.collectionId}` : 'fetch_only';
let prefsFetchOnlyMeta = this.collectionId ? `fetch_only_meta_${this.collectionId}` : 'fetch_only_meta';
if (userPrefs.get(prefsFetchOnly) != metadatum)
userPrefs.set(prefsFetchOnly, metadatum);
if (app.config.globalProperties.$userPrefs.get(prefsFetchOnly) != metadatum)
app.config.globalProperties.$userPrefs.set(prefsFetchOnly, metadatum);
if (userPrefs.get(prefsFetchOnlyMeta) != metadatumIDs)
userPrefs.set(prefsFetchOnlyMeta, metadatumIDs);
if (app.config.globalProperties.$userPrefs.get(prefsFetchOnlyMeta) != metadatumIDs)
app.config.globalProperties.$userPrefs.set(prefsFetchOnlyMeta, metadatumIDs);
}
},
cleanFetchOnly() {
store.dispatch('search/cleanFetchOnly');
app.config.globalProperties.$store.dispatch('search/cleanFetchOnly');
},
removeFetchOnlyMeta( metadatum ){
store.dispatch('search/removeFetchOnlyMeta', metadatum );
app.config.globalProperties.$store.dispatch('search/removeFetchOnlyMeta', metadatum );
this.updateURLQueries();
},
setPage(page) {
store.dispatch('search/setPage', page);
app.config.globalProperties.$store.dispatch('search/setPage', page);
this.updateURLQueries();
},
resetPageOnStore() {
store.dispatch('search/setPage', 1);
app.config.globalProperties.$store.dispatch('search/setPage', 1);
},
setItemsPerPage(itemsPerPage, shouldNotUpdatePrefs) {
store.dispatch('search/setItemsPerPage', itemsPerPage);
app.config.globalProperties.$store.dispatch('search/setItemsPerPage', itemsPerPage);
this.updateURLQueries();
if (shouldNotUpdatePrefs == undefined || shouldNotUpdatePrefs == false) {
let prefsPerPage = this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page';
if (userPrefs.get(prefsPerPage) != itemsPerPage) {
userPrefs.set(prefsPerPage, itemsPerPage)
if (app.config.globalProperties.$userPrefs.get(prefsPerPage) != itemsPerPage) {
app.config.globalProperties.$userPrefs.set(prefsPerPage, itemsPerPage)
.catch(() => {});
}
}
@ -108,76 +103,76 @@ export default {
let prefsOrderBy = this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by';
if (orderBy.metakey) {
if (!userPrefs.get(prefsOrderBy) || orderBy.metakey != userPrefs.get(prefsOrderBy).metakey)
userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
if (!app.config.globalProperties.$userPrefs.get(prefsOrderBy) || orderBy.metakey != app.config.globalProperties.$userPrefs.get(prefsOrderBy).metakey)
app.config.globalProperties.$userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
} else {
if (orderBy != userPrefs.get(prefsOrderBy))
userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
if (orderBy != app.config.globalProperties.$userPrefs.get(prefsOrderBy))
app.config.globalProperties.$userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
}
store.dispatch('search/setOrderBy', orderBy);
app.config.globalProperties.$store.dispatch('search/setOrderBy', orderBy);
this.updateURLQueries();
},
setOrder(order) {
let prefsOrder = this.collectionId != undefined ? 'order_' + this.collectionId : 'order';
if (userPrefs.get(prefsOrder) != order) {
userPrefs.set(prefsOrder, order)
if (app.config.globalProperties.$userPrefs.get(prefsOrder) != order) {
app.config.globalProperties.$userPrefs.set(prefsOrder, order)
.catch(() => {});
}
store.dispatch('search/setOrder', order);
app.config.globalProperties.$store.dispatch('search/setOrder', order);
this.updateURLQueries();
},
setStatus(status) {
store.dispatch('search/setStatus', status);
app.config.globalProperties.$store.dispatch('search/setStatus', status);
this.updateURLQueries();
},
setTotalItems(totalItems) {
store.dispatch('search/setTotalItems', totalItems);
app.config.globalProperties.$store.dispatch('search/setTotalItems', totalItems);
},
setSentenceMode(sentenceMode) {
store.dispatch('search/setSentenceMode', sentenceMode);
app.config.globalProperties.$store.dispatch('search/setSentenceMode', sentenceMode);
},
setSearchQuery(searchQuery) {
store.dispatch('search/setSearchQuery', searchQuery);
app.config.globalProperties.$store.dispatch('search/setSearchQuery', searchQuery);
this.updateURLQueries();
},
setViewMode(viewMode) {
store.dispatch('search/setViewMode', viewMode);
app.config.globalProperties.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
let prefsViewMode = this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode';
if(userPrefs.get(prefsViewMode) != viewMode) {
userPrefs.set(prefsViewMode, viewMode)
if(app.config.globalProperties.$userPrefs.get(prefsViewMode) != viewMode) {
app.config.globalProperties.$userPrefs.set(prefsViewMode, viewMode)
.catch(() => {});
}
},
setAdminViewMode(adminViewMode) {
store.dispatch('search/setAdminViewMode', adminViewMode);
app.config.globalProperties.$store.dispatch('search/setAdminViewMode', adminViewMode);
this.updateURLQueries();
let prefsAdminViewMode = this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode';
if (userPrefs.get(prefsAdminViewMode) != adminViewMode) {
userPrefs.set(prefsAdminViewMode, adminViewMode)
if (app.config.globalProperties.$userPrefs.get(prefsAdminViewMode) != adminViewMode) {
app.config.globalProperties.$userPrefs.set(prefsAdminViewMode, adminViewMode)
.catch(() => { });
}
},
setInitialViewMode(viewMode) {
store.dispatch('search/setViewMode', viewMode);
app.config.globalProperties.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
},
setInitialAdminViewMode(adminViewMode) {
store.dispatch('search/setAdminViewMode', adminViewMode);
app.config.globalProperties.$store.dispatch('search/setAdminViewMode', adminViewMode);
this.updateURLQueries();
},
async setSelectedItemsForIframe(selectedItems, singleSelection) {
if (singleSelection)
store.dispatch('search/cleanSelectedItems');
app.config.globalProperties.$store.dispatch('search/cleanSelectedItems');
store.dispatch('search/setSelectedItems', selectedItems);
app.config.globalProperties.$store.dispatch('search/setSelectedItems', selectedItems);
let currentSelectedItems = store.getters['search/getSelectedItems'];
let currentSelectedItems = app.config.globalProperties.$store.getters['search/getSelectedItems'];
if (window.history.replaceState) {
let searchParams = new URLSearchParams(window.location.search);
@ -186,55 +181,45 @@ export default {
searchParams.append('selecteditems', selectedItem);
let newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?' + searchParams.toString() + window.location.hash;
await router.push(newurl)
window.history.replaceState({ ...window.history.state, ...{ path: newurl } }, '')
window.history.pushState({path: newurl}, '', newurl);
}
},
cleanSelectedItems() {
store.dispatch('search/cleanSelectedItems');
app.config.globalProperties.$store.dispatch('search/cleanSelectedItems');
},
filterBySelectedItems(selectedItems) {
if ( route.name ) {
router.replace({ query: {} });
router.replace({ query: { postin: selectedItems } });
} else {
router.replace({ query: {} });
router.replace({ query: { postin: selectedItems } });
}
async filterBySelectedItems(selectedItems) {
await app.config.globalProperties.$router.replace({ path: app.config.globalProperties.$route.path, query: {} });
await app.config.globalProperties.$router.replace({ path: app.config.globalProperties.$route.path, query: { postin: selectedItems } });
},
highlightsItem(itemId) {
store.dispatch('search/highlightsItem', itemId);
app.config.globalProperties.$store.dispatch('search/highlightsItem', itemId);
this.updateURLQueries();
},
exitViewModeWithoutPagination() {
app.config.globalProperties.$eventBusSearchEmitter.emit( 'exitViewModeWithoutPagination', true);
},
async updateURLQueries() {
const newQueries = store.getters['search/getPostQuery'];
await router.replace({ query: {} });
await router.replace({ query: newQueries });
const newQueries = app.config.globalProperties.$store.getters['search/getPostQuery'];
await app.config.globalProperties.$router.replace({ path: app.config.globalProperties.$route.path, query: {} });
await app.config.globalProperties.$router.replace({ path: app.config.globalProperties.$route.path, query: newQueries });
},
updateStoreFromURL() {
store.dispatch('search/setPostQuery', route.query);
app.config.globalProperties.$store.dispatch('search/setPostQuery', app.config.globalProperties.$route.query);
},
loadItems() {
console.log('loadItems')
console.log(JSON.parse(JSON.stringify(store.getters['search/getPostQuery'])))
console.log(JSON.parse(JSON.stringify(app.config.globalProperties.$store.getters['search/getPostQuery'])))
// Forces fetch_only to be filled before any search happens
if (store.getters['search/getPostQuery']['fetch_only'] != undefined) {
if (app.config.globalProperties.$store.getters['search/getPostQuery']['fetch_only'] != undefined) {
app.config.globalProperties.$eventBusSearchEmitter.emit( 'isLoadingItems', true);
// Cancels previous Request
if (this.searchCancel != undefined)
this.searchCancel.cancel('Item search Canceled.');
console.log('fetching')
store.dispatch('collection/fetchItems', {
app.config.globalProperties.$store.dispatch('collection/fetchItems', {
'collectionId': this.collectionId,
'isOnTheme': route.meta && route.meta.isOnTheme,
'isOnTheme': app.config.globalProperties.$route.meta && app.config.globalProperties.$route.meta.isOnTheme,
'termId': this.termId,
'taxonomy': this.taxonomy
}).then((resp) => {
@ -267,9 +252,9 @@ export default {
this.taxonomy = taxonomy;
},
clearAllFilters() {
store.dispatch('search/cleanFilterTags');
store.dispatch('search/cleanMetaQueries', { keepCollections: true });
store.dispatch('search/cleanTaxQueries');
app.config.globalProperties.$store.dispatch('search/cleanFilterTags');
app.config.globalProperties.$store.dispatch('search/cleanMetaQueries', { keepCollections: true });
app.config.globalProperties.$store.dispatch('search/cleanTaxQueries');
this.updateURLQueries();
}
}

View File

@ -44,7 +44,7 @@ const routes = [
* https://router.vuejs.org/guide/migration/#Named-children-routes-with-an-empty-path-no-longer-appends-a-slash
*/
{ path: '/collections/:collectionId', redirect: { name: 'CollectionItemsPage' }},
{ path: 'items', component: ItemsPage, name: 'CollectionItemsPage', meta: {title: i18nGet('title_collection_page') }, meta: { isOnTheme: false } },
{ path: 'items', component: ItemsPage, name: 'CollectionItemsPage', meta: {title: i18nGet('title_collection_page') }, props: { isOnTheme: false } },
{ path: 'items/:itemId/edit', name: 'ItemEditionForm', component: ItemEditionForm, meta: {title: i18nGet('title_edit_item') } },
{ path: 'items/new', name: 'CollectionItemCreatePage', component: ItemEditionForm, meta: {title: i18nGet('title_create_item_collection') } },
{ path: 'items/:itemId', name: 'ItemPage', component: ItemPage, meta: {title: i18nGet('title_item_page') } },
@ -83,7 +83,7 @@ const routes = [
{ path: '/exporters/', name: 'ExportersPage', component: AvailableExportersPage, meta: {title: i18nGet('title_exporters_page') } },
{ path: '/exporters/:exporterSlug', name: 'ExporterEditionForm', component: ExporterEditionForm, meta: {title: i18nGet('title_exporter_page') }},
{ path: '/:pathMatch(.*)*', redirect: { name: 'HomePage' } }
{ path: '/:pathMatch(.*)*', name: 'DefaultRedirect', redirect: { name: 'HomePage' } }
];
export default createRouter({