From 38829f661df3f852e7384b227d324e2dfe209748 Mon Sep 17 00:00:00 2001 From: Matt Blenkinsop Date: Tue, 17 Sep 2024 14:27:55 +0000 Subject: [PATCH] Bug 37930: Change how we load authorised values in Vue This patch adds a method to initialise the authorised values in a vue app. It will automatically load authorised values into the app and store them in the store for your app. The intent behind this is to make adding authorised values into a Vue app much simpler and more DRY, especially when creating a new vue app. You will just need to add your desired authorised values into the store for your app and they will be loaded automatically --- .../js/vue/components/ERM/AgreementsList.vue | 3 + .../prog/js/vue/components/ERM/Main.vue | 56 +++---------------- .../intranet-tmpl/prog/js/vue/modules/erm.ts | 3 - .../intranet-tmpl/prog/js/vue/stores/erm.js | 50 +++++++++++++++++ .../intranet-tmpl/prog/js/vue/stores/main.js | 56 +++++++++++++++++++ 5 files changed, 116 insertions(+), 52 deletions(-) diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsList.vue index 0b3fc2aa822..a22e14819af 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsList.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsList.vue @@ -75,6 +75,9 @@ export default { const { setConfirmationDialog, setMessage } = inject("mainStore") + const { authorisedValues } = inject("ERMStore") + console.log(authorisedValues) + const table = ref() const filters = reactive({ diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Main.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Main.vue index 3eaf6dd4891..b3c61e6c9a4 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Main.vue +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Main.vue @@ -41,24 +41,23 @@ export default { setup() { const vendorStore = inject("vendorStore") - const AVStore = inject("AVStore") - const mainStore = inject("mainStore") - const { loading, loaded, setError } = mainStore + const { loading, loaded, setError, loadAuthorisedValues } = mainStore const ERMStore = inject("ERMStore") - const { config } = storeToRefs(ERMStore) + const { config, authorisedValues } = storeToRefs(ERMStore) return { vendorStore, - AVStore, ERMStore, config, setError, loading, loaded, + loadAuthorisedValues, + authorisedValues, } }, data() { @@ -80,51 +79,10 @@ export default { }, error => {} ) - - const av_client = APIClient.authorised_values - const authorised_values = { - av_agreement_statuses: "ERM_AGREEMENT_STATUS", - av_agreement_closure_reasons: "ERM_AGREEMENT_CLOSURE_REASON", - av_agreement_renewal_priorities: - "ERM_AGREEMENT_RENEWAL_PRIORITY", - av_user_roles: "ERM_USER_ROLES", - av_license_types: "ERM_LICENSE_TYPE", - av_license_statuses: "ERM_LICENSE_STATUS", - av_agreement_license_statuses: "ERM_AGREEMENT_LICENSE_STATUS", - av_agreement_license_location: "ERM_AGREEMENT_LICENSE_LOCATION", - av_package_types: "ERM_PACKAGE_TYPE", - av_package_content_types: "ERM_PACKAGE_CONTENT_TYPE", - av_title_publication_types: "ERM_TITLE_PUBLICATION_TYPE", - av_report_types: "ERM_REPORT_TYPES", - av_platform_reports_metrics: "ERM_PLATFORM_REPORTS_METRICS", - av_database_reports_metrics: "ERM_DATABASE_REPORTS_METRICS", - av_title_reports_metrics: "ERM_TITLE_REPORTS_METRICS", - av_item_reports_metrics: "ERM_ITEM_REPORTS_METRICS", - } - - let av_cat_array = Object.keys(authorised_values).map(function ( - av_cat - ) { - return '"' + authorised_values[av_cat] + '"' + this.loadAuthorisedValues(this.authorisedValues).then(() => { + this.loaded() + this.initialized = true }) - - promises.push( - av_client.values - .getCategoriesWithValues(av_cat_array) - .then(av_categories => { - Object.entries(authorised_values).forEach( - ([av_var, av_cat]) => { - const av_match = av_categories.find( - element => element.category_name == av_cat - ) - this.AVStore[av_var] = - av_match.authorised_values - } - ) - }) - ) - - return Promise.all(promises) } const client = APIClient.erm diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts b/koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts index f00746675b1..4dcca91eddc 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/modules/erm.ts @@ -21,7 +21,6 @@ import { routes as routesDef } from "../routes/erm"; import { useMainStore } from "../stores/main"; import { useVendorStore } from "../stores/vendors"; -import { useAVStore } from "../stores/authorised-values"; import { useERMStore } from "../stores/erm"; import { useNavigationStore } from "../stores/navigation"; import { useReportsStore } from "../stores/usage-reports"; @@ -30,7 +29,6 @@ import i18n from "../i18n"; const pinia = createPinia(); const mainStore = useMainStore(pinia); -const AVStore = useAVStore(pinia); const navigationStore = useNavigationStore(pinia); const routes = navigationStore.setRoutes(routesDef); @@ -52,7 +50,6 @@ const rootComponent = app app.config.unwrapInjectedRef = true; app.provide("vendorStore", useVendorStore(pinia)); app.provide("mainStore", mainStore); -app.provide("AVStore", AVStore); app.provide("navigationStore", navigationStore); const ERMStore = useERMStore(pinia); app.provide("ERMStore", ERMStore); diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/stores/erm.js b/koha-tmpl/intranet-tmpl/prog/js/vue/stores/erm.js index 3570499eadd..6e8b13074d0 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/stores/erm.js +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/stores/erm.js @@ -8,5 +8,55 @@ export const useERMStore = defineStore("erm", { ERMProviders: [], }, }, + authorisedValues: { + av_agreement_statuses: "ERM_AGREEMENT_STATUS", + av_agreement_closure_reasons: "ERM_AGREEMENT_CLOSURE_REASON", + av_agreement_renewal_priorities: "ERM_AGREEMENT_RENEWAL_PRIORITY", + av_user_roles: "ERM_USER_ROLES", + av_license_types: "ERM_LICENSE_TYPE", + av_license_statuses: "ERM_LICENSE_STATUS", + av_agreement_license_statuses: "ERM_AGREEMENT_LICENSE_STATUS", + av_agreement_license_location: "ERM_AGREEMENT_LICENSE_LOCATION", + av_package_types: "ERM_PACKAGE_TYPE", + av_package_content_types: "ERM_PACKAGE_CONTENT_TYPE", + av_title_publication_types: "ERM_TITLE_PUBLICATION_TYPE", + av_report_types: "ERM_REPORT_TYPES", + av_platform_reports_metrics: "ERM_PLATFORM_REPORTS_METRICS", + av_database_reports_metrics: "ERM_DATABASE_REPORTS_METRICS", + av_title_reports_metrics: "ERM_TITLE_REPORTS_METRICS", + av_item_reports_metrics: "ERM_ITEM_REPORTS_METRICS", + av_agreement_relationships: [ + { value: "supersedes", description: __("supersedes") }, + { + value: "is-superseded-by", + description: __("is superseded by"), + }, + { + value: "provides_post-cancellation_access_for", + description: __("provides post-cancellation access for"), + }, + { + value: "has-post-cancellation-access-in", + description: __("has post-cancellation access in"), + }, + { + value: "tracks_demand-driven_acquisitions_for", + description: __("tracks demand-driven acquisitions for"), + }, + { + value: "has-demand-driven-acquisitions-in", + description: __("has demand-driven acquisitions in"), + }, + { + value: "has_backfile_in", + description: __("has backfile in"), + }, + { + value: "has_frontfile_in", + description: __("has frontfile in"), + }, + { value: "related_to", description: __("related to") }, + ], + }, }), }); diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/stores/main.js b/koha-tmpl/intranet-tmpl/prog/js/vue/stores/main.js index 7a0c9e65166..bfa548840c8 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/vue/stores/main.js +++ b/koha-tmpl/intranet-tmpl/prog/js/vue/stores/main.js @@ -1,4 +1,5 @@ import { defineStore } from "pinia"; +import { APIClient } from "../fetch/api-client.js"; export const useMainStore = defineStore("main", { state: () => ({ @@ -12,6 +13,7 @@ export const useMainStore = defineStore("main", { displayed_already: false, _is_submitting: false, _is_loading: false, + authorisedValues: {}, }), actions: { setMessage(message, displayed = false) { @@ -90,6 +92,60 @@ export const useMainStore = defineStore("main", { loaded() { this._is_loading = false; }, + get_lib_from_av(arr_name, av) { + if (this.authorisedValues[arr_name] === undefined) { + console.warn( + "The authorised value category for '%s' is not defined.".format( + arr_name + ) + ); + return; + } + let o = this.authorisedValues[arr_name].find(e => e.value == av); + return o ? o.description : av; + }, + map_av_dt_filter(arr_name) { + return this.authorisedValues[arr_name].map(e => { + e["_id"] = e["value"]; + e["_str"] = e["description"]; + return e; + }); + }, + async loadAuthorisedValues(authorisedValues) { + console.log(authorisedValues); + const AVsToFetch = Object.keys(authorisedValues).reduce( + (acc, avKey) => { + if (Array.isArray(authorisedValues[avKey])) return acc; + acc[avKey] = authorisedValues[avKey]; + return acc; + }, + {} + ); + + const AVCatArray = Object.keys(AVsToFetch).map(avCat => { + return '"' + AVsToFetch[avCat] + '"'; + }); + + const promises = []; + const AVClient = APIClient.authorised_values; + promises.push( + AVClient.values + .getCategoriesWithValues(AVCatArray) + .then(AVCategories => { + Object.entries(AVsToFetch).forEach( + ([AVName, AVCat]) => { + const AVMatch = AVCategories.find( + element => element.category_name == AVCat + ); + this.authorisedValues[AVName] = + AVMatch.authorised_values; + } + ); + }) + ); + + return Promise.all(promises); + }, }, getters: { error() { -- 2.39.3 (Apple Git-146)