From b563544200c7d11fa012a5cd5e81356ad9305a39 Mon Sep 17 00:00:00 2001
From: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Date: Fri, 28 Oct 2022 17:43:26 +0200
Subject: [PATCH] Bug 32030: Pretty vue files

The plan was to rewrite the whole history, but it failed
(see https://tree.taiga.io/project/joubu-koha-erm/us/129)

yarn run prettier --trailing-comma es5 --semi false --arrow-parens avoid --write **/*.vue

TODO - Add a QA check + git pre-commit hook

Signed-off-by: Jonathan Field <jonathan.field@ptfs-europe.com>

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
---
 .../vue/components/ERM/AgreementLicenses.vue  |  16 +-
 .../vue/components/ERM/AgreementPeriods.vue   |  12 +-
 .../components/ERM/AgreementRelationships.vue |  14 +-
 .../vue/components/ERM/AgreementUserRoles.vue |  33 +-
 .../vue/components/ERM/AgreementsFormAdd.vue  | 119 +++--
 .../ERM/AgreementsFormConfirmDelete.vue       |  31 +-
 .../js/vue/components/ERM/AgreementsList.vue  | 443 +++++++++++-------
 .../js/vue/components/ERM/AgreementsShow.vue  |  16 +-
 .../prog/js/vue/components/ERM/Breadcrumb.vue |  14 +-
 .../prog/js/vue/components/ERM/Dialog.vue     |   2 +-
 .../prog/js/vue/components/ERM/Documents.vue  |   7 +-
 .../ERM/EHoldingsEBSCOPackageAgreements.vue   |  29 +-
 .../ERM/EHoldingsEBSCOPackageTitlesList.vue   | 156 +++---
 .../ERM/EHoldingsEBSCOPackagesList.vue        | 225 +++++----
 .../ERM/EHoldingsEBSCOPackagesShow.vue        |  70 +--
 .../ERM/EHoldingsEBSCOResourcesShow.vue       |  55 ++-
 .../ERM/EHoldingsEBSCOTitlePackagesList.vue   | 158 ++++---
 .../ERM/EHoldingsEBSCOTitlesList.vue          | 243 ++++++----
 .../ERM/EHoldingsEBSCOTitlesShow.vue          |  56 +--
 .../ERM/EHoldingsLocalPackageAgreements.vue   |   6 +-
 .../ERM/EHoldingsLocalPackageTitlesList.vue   | 133 +++---
 .../ERM/EHoldingsLocalPackagesFormAdd.vue     |  48 +-
 ...HoldingsLocalPackagesFormConfirmDelete.vue |  35 +-
 .../ERM/EHoldingsLocalPackagesList.vue        | 322 ++++++++-----
 .../ERM/EHoldingsLocalPackagesShow.vue        |  12 +-
 .../ERM/EHoldingsLocalResourcesShow.vue       |  10 +-
 .../ERM/EHoldingsLocalTitlePackagesList.vue   |  92 ++--
 .../ERM/EHoldingsLocalTitlesFormAdd.vue       | 125 +++--
 .../EHoldingsLocalTitlesFormAddResources.vue  |  16 +-
 .../EHoldingsLocalTitlesFormConfirmDelete.vue |  34 +-
 .../ERM/EHoldingsLocalTitlesFormImport.vue    | 118 +++--
 .../ERM/EHoldingsLocalTitlesList.vue          | 287 +++++++-----
 .../ERM/EHoldingsLocalTitlesShow.vue          |  56 +--
 .../prog/js/vue/components/ERM/ERMHome.vue    |  15 +-
 .../prog/js/vue/components/ERM/ERMMain.vue    |  20 +-
 .../js/vue/components/ERM/LicensesFormAdd.vue |  76 +--
 .../ERM/LicensesFormConfirmDelete.vue         |  31 +-
 .../js/vue/components/ERM/LicensesList.vue    | 324 +++++++------
 .../js/vue/components/ERM/LicensesShow.vue    |  15 +-
 39 files changed, 2058 insertions(+), 1416 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementLicenses.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementLicenses.vue
index 4b523d84c3..46980679ae 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementLicenses.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementLicenses.vue
@@ -23,7 +23,7 @@
                         :id="`license_id_${counter}`"
                         v-model="agreement_license.license_id"
                         label="name"
-                        :reduce="(l) => l.license_id"
+                        :reduce="l => l.license_id"
                         :options="licenses"
                     >
                         <template #search="{ attributes, events }">
@@ -45,7 +45,7 @@
                         :id="`license_status_${counter}`"
                         v-model="agreement_license.status"
                         label="lib"
-                        :reduce="(av) => av.authorised_value"
+                        :reduce="av => av.authorised_value"
                         :options="av_agreement_license_statuses"
                     >
                         <template #search="{ attributes, events }">
@@ -67,7 +67,7 @@
                         :id="`license_location_${counter}`"
                         v-model="agreement_license.physical_location"
                         label="lib"
-                        :reduce="(av) => av.authorised_value"
+                        :reduce="av => av.authorised_value"
                         :options="av_agreement_license_location"
                     />
                 </li>
@@ -101,9 +101,9 @@
 </template>
 
 <script>
-import { fetchLicenses } from '../../fetch'
+import { fetchLicenses } from "../../fetch"
 export default {
-    name: 'AgreementLicenses',
+    name: "AgreementLicenses",
     data() {
         return {
             licenses: [],
@@ -115,7 +115,7 @@ export default {
         agreement_licenses: Array,
     },
     beforeCreate() {
-        fetchLicenses().then((licenses) => this.licenses = licenses)
+        fetchLicenses().then(licenses => (this.licenses = licenses))
     },
     methods: {
         addLicense() {
@@ -123,8 +123,8 @@ export default {
                 license_id: null,
                 status: null,
                 physical_location: null,
-                notes: '',
-                uri: '',
+                notes: "",
+                uri: "",
             })
         },
         deleteLicense(counter) {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementPeriods.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementPeriods.vue
index edaad8f06f..0354c78c50 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementPeriods.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementPeriods.vue
@@ -67,16 +67,16 @@
 </template>
 
 <script>
-import flatPickr from 'vue-flatpickr-component'
+import flatPickr from "vue-flatpickr-component"
 export default {
-    name: 'AgreementPeriods',
+    name: "AgreementPeriods",
     data() {
         return {
             fp_config: flatpickr_defaults,
         }
     },
     props: {
-        periods: Array
+        periods: Array,
     },
     methods: {
         addPeriod() {
@@ -89,10 +89,10 @@ export default {
         },
         deletePeriod(counter) {
             this.periods.splice(counter, 1)
-        }
+        },
     },
     components: {
-        flatPickr
-    }
+        flatPickr,
+    },
 }
 </script>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementRelationships.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementRelationships.vue
index 845fe7a6fb..b9226f0196 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementRelationships.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementRelationships.vue
@@ -22,7 +22,7 @@
                         :id="`related_agreement_id_${counter}`"
                         v-model="relationship.related_agreement_id"
                         label="name"
-                        :reduce="(a) => a.agreement_id"
+                        :reduce="a => a.agreement_id"
                         :options="agreements"
                     >
                         <template #search="{ attributes, events }">
@@ -44,7 +44,7 @@
                         :id="`related_agreement_relationship_${counter}`"
                         v-model="relationship.relationship"
                         label="lib"
-                        :reduce="(av) => av.authorised_value"
+                        :reduce="av => av.authorised_value"
                         :options="av_agreement_relationships"
                     >
                         <template #search="{ attributes, events }">
@@ -93,8 +93,10 @@ export default {
         }
     },
     beforeCreate() {
-        fetchAgreements().then((agreements) => {
-            this.agreements = agreements.filter((agreement) => agreement.agreement_id !== this.agreement_id)
+        fetchAgreements().then(agreements => {
+            this.agreements = agreements.filter(
+                agreement => agreement.agreement_id !== this.agreement_id
+            )
         })
     },
     methods: {
@@ -102,7 +104,7 @@ export default {
             this.relationships.push({
                 related_agreement_id: null,
                 relationship: null,
-                notes: '',
+                notes: "",
             })
         },
         deleteRelationship(counter) {
@@ -114,6 +116,6 @@ export default {
         av_agreement_relationships: Array,
         relationships: Array,
     },
-    name: 'AgreementRelationships',
+    name: "AgreementRelationships",
 }
 </script>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementUserRoles.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementUserRoles.vue
index dad31f2bbe..0cc8412be0 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementUserRoles.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementUserRoles.vue
@@ -9,12 +9,15 @@
             <legend>
                 {{ $__("Agreement user %s").format(counter + 1) }}
                 <a href="#" @click.prevent="deleteUser(counter)"
-                    ><i class="fa fa-trash"></i> {{ $__("Remove this user") }}</a
+                    ><i class="fa fa-trash"></i>
+                    {{ $__("Remove this user") }}</a
                 >
             </legend>
             <ol>
                 <li>
-                    <label :for="`user_id_${counter}`">{{ $__("User") }}:</label>
+                    <label :for="`user_id_${counter}`"
+                        >{{ $__("User") }}:</label
+                    >
                     <span class="user">
                         {{ user_role.patron_str }}
                     </span>
@@ -33,7 +36,7 @@
                         :id="`user_role_${counter}`"
                         v-model="user_role.role"
                         label="lib"
-                        :reduce="(av) => av.authorised_value"
+                        :reduce="av => av.authorised_value"
                         :options="av_agreement_user_roles"
                     >
                         <template #search="{ attributes, events }">
@@ -64,7 +67,7 @@
 import { fetchPatron } from "../../fetch"
 
 export default {
-    name: 'AgreementUserRoles',
+    name: "AgreementUserRoles",
     props: {
         av_agreement_user_roles: Array,
         user_roles: Array,
@@ -79,29 +82,35 @@ export default {
             this.user_roles.push({
                 user_id: null,
                 role: null,
-                patron_str: '',
+                patron_str: "",
             })
         },
         deleteUser(counter) {
             this.user_roles.splice(counter, 1)
         },
         selectUser(counter) {
-            let select_user_window = window.open("/cgi-bin/koha/members/search.pl?columns=cardnumber,name,category,branch,action&selection_type=select&filter=erm_users",
-                'PatronPopup',
-                'width=740,height=450,location=yes,toolbar=no,'
-                + 'scrollbars=yes,resize=yes'
+            let select_user_window = window.open(
+                "/cgi-bin/koha/members/search.pl?columns=cardnumber,name,category,branch,action&selection_type=select&filter=erm_users",
+                "PatronPopup",
+                "width=740,height=450,location=yes,toolbar=no," +
+                    "scrollbars=yes,resize=yes"
             )
             // This is a bit dirty, the "select user" window should be rewritten and be a Vue component
             // but that's not for now...
-            select_user_window.addEventListener('beforeunload', this.newUserSelected, false)
+            select_user_window.addEventListener(
+                "beforeunload",
+                this.newUserSelected,
+                false
+            )
             select_user_window.counter = counter
         },
         newUserSelected(e) {
             let c = e.currentTarget.counter
-            let selected_patron_id = document.getElementById("selected_patron_id").value
+            let selected_patron_id =
+                document.getElementById("selected_patron_id").value
             let patron
             // FIXME We are missing a "loading..."
-            fetchPatron(selected_patron_id).then((p) => {
+            fetchPatron(selected_patron_id).then(p => {
                 patron = p
                 this.user_roles[c].patron = patron
                 this.user_roles[c].patron_str = $patron_to_html(patron)
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormAdd.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormAdd.vue
index 9aeaf49ebb..183dbba17b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormAdd.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormAdd.vue
@@ -32,7 +32,7 @@
                                     id="agreement_vendor_id"
                                     v-model="agreement.vendor_id"
                                     label="name"
-                                    :reduce="(vendor) => vendor.id"
+                                    :reduce="vendor => vendor.id"
                                     :options="vendors"
                                 />
                             </li>
@@ -60,7 +60,7 @@
                                     id="agreement_status"
                                     v-model="agreement.status"
                                     label="lib"
-                                    :reduce="(av) => av.authorised_value"
+                                    :reduce="av => av.authorised_value"
                                     :options="av_agreement_statuses"
                                     @option:selected="onStatusChanged"
                                     :required="!agreement.status"
@@ -86,7 +86,7 @@
                                     id="agreement_closure_reason"
                                     v-model="agreement.closure_reason"
                                     label="lib"
-                                    :reduce="(av) => av.authorised_value"
+                                    :reduce="av => av.authorised_value"
                                     :options="av_agreement_closure_reasons"
                                     :disabled="
                                         agreement.status == 'closed'
@@ -130,7 +130,7 @@
                                     id="agreement_renewal_priority"
                                     v-model="agreement.renewal_priority"
                                     label="lib"
-                                    :reduce="(av) => av.authorised_value"
+                                    :reduce="av => av.authorised_value"
                                     :options="av_agreement_renewal_priorities"
                                 />
                             </li>
@@ -182,22 +182,22 @@
 </template>
 
 <script>
-import { inject } from 'vue'
-import AgreementPeriods from './AgreementPeriods.vue'
-import AgreementUserRoles from './AgreementUserRoles.vue'
-import AgreementLicenses from './AgreementLicenses.vue'
-import AgreementRelationships from './AgreementRelationships.vue'
-import Documents from './Documents.vue'
+import { inject } from "vue"
+import AgreementPeriods from "./AgreementPeriods.vue"
+import AgreementUserRoles from "./AgreementUserRoles.vue"
+import AgreementLicenses from "./AgreementLicenses.vue"
+import AgreementRelationships from "./AgreementRelationships.vue"
+import Documents from "./Documents.vue"
 import { setMessage, setError, setWarning } from "../../messages"
-import { fetchAgreement } from '../../fetch'
+import { fetchAgreement } from "../../fetch"
 import { storeToRefs } from "pinia"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const {
             av_agreement_statuses,
             av_agreement_closure_reasons,
@@ -223,14 +223,14 @@ export default {
         return {
             agreement: {
                 agreement_id: null,
-                name: '',
+                name: "",
                 vendor_id: null,
-                description: '',
-                status: '',
-                closure_reason: '',
+                description: "",
+                status: "",
+                closure_reason: "",
                 is_perpetual: false,
-                renewal_priority: '',
-                license_info: '',
+                renewal_priority: "",
+                license_info: "",
                 periods: [],
                 user_roles: [],
                 agreement_licenses: [],
@@ -262,24 +262,41 @@ export default {
             // Do not use al.license.name here! Its name is not the one linked with al.license_id
             // At this point al.license is meaningless, form/template only modified al.license_id
             const license_ids = agreement_licenses.map(al => al.license_id)
-            const duplicate_license_ids = license_ids.filter((id, i) => license_ids.indexOf(id) !== i)
+            const duplicate_license_ids = license_ids.filter(
+                (id, i) => license_ids.indexOf(id) !== i
+            )
 
             if (duplicate_license_ids.length) {
                 errors.push(this.$__("A license is used several times"))
             }
 
-            const related_agreement_ids = agreement.agreement_relationships.map(rs => rs.related_agreement_id)
-            const duplicate_related_agreement_ids = related_agreement_ids.filter((id, i) => related_agreement_ids.indexOf(id) !== i)
+            const related_agreement_ids = agreement.agreement_relationships.map(
+                rs => rs.related_agreement_id
+            )
+            const duplicate_related_agreement_ids =
+                related_agreement_ids.filter(
+                    (id, i) => related_agreement_ids.indexOf(id) !== i
+                )
 
             if (duplicate_related_agreement_ids.length) {
-                errors.push(this.$__("An agreement is used as relationship several times"))
+                errors.push(
+                    this.$__(
+                        "An agreement is used as relationship several times"
+                    )
+                )
             }
 
-            if (agreement_licenses.filter(al => al.status == 'controlling').length > 1) {
+            if (
+                agreement_licenses.filter(al => al.status == "controlling")
+                    .length > 1
+            ) {
                 errors.push(this.$__("Only one controlling license is allowed"))
             }
 
-            if (agreement_licenses.filter(al => al.status == 'controlling').length > 1) {
+            if (
+                agreement_licenses.filter(al => al.status == "controlling")
+                    .length > 1
+            ) {
                 errors.push(this.$__("Only one controlling license is allowed"))
             }
 
@@ -298,12 +315,12 @@ export default {
                 return false
             }
 
-            let apiUrl = '/api/v1/erm/agreements'
+            let apiUrl = "/api/v1/erm/agreements"
 
-            let method = 'POST'
+            let method = "POST"
             if (agreement.agreement_id) {
-                method = 'PUT'
-                apiUrl += '/' + agreement.agreement_id
+                method = "PUT"
+                apiUrl += "/" + agreement.agreement_id
             }
             delete agreement.agreement_id
             delete agreement.vendor
@@ -313,15 +330,32 @@ export default {
                 agreement.vendor_id = null
             }
 
-            agreement.periods = agreement.periods.map(({ agreement_id, agreement_period_id, ...keepAttrs }) => keepAttrs)
+            agreement.periods = agreement.periods.map(
+                ({ agreement_id, agreement_period_id, ...keepAttrs }) =>
+                    keepAttrs
+            )
 
-            agreement.user_roles = agreement.user_roles.map(({ patron, patron_str, ...keepAttrs }) => keepAttrs)
+            agreement.user_roles = agreement.user_roles.map(
+                ({ patron, patron_str, ...keepAttrs }) => keepAttrs
+            )
 
-            agreement.agreement_licenses = agreement.agreement_licenses.map(({ license, agreement_id, agreement_license_id, ...keepAttrs }) => keepAttrs)
+            agreement.agreement_licenses = agreement.agreement_licenses.map(
+                ({
+                    license,
+                    agreement_id,
+                    agreement_license_id,
+                    ...keepAttrs
+                }) => keepAttrs
+            )
 
-            agreement.agreement_relationships = agreement.agreement_relationships.map(({ related_agreement, ...keepAttrs }) => keepAttrs)
+            agreement.agreement_relationships =
+                agreement.agreement_relationships.map(
+                    ({ related_agreement, ...keepAttrs }) => keepAttrs
+                )
 
-            agreement.documents = agreement.documents.map(({ file_type, uploaded_on, ...keepAttrs }) => keepAttrs)
+            agreement.documents = agreement.documents.map(
+                ({ file_type, uploaded_on, ...keepAttrs }) => keepAttrs
+            )
 
             delete agreement.agreement_packages
 
@@ -329,7 +363,7 @@ export default {
                 method: method,
                 body: JSON.stringify(agreement),
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
@@ -344,17 +378,16 @@ export default {
                     } else {
                         setError(response.message || response.statusText)
                     }
-                }).catch(
-                    (error) => {
-                        this.setError(error)
-                    }
-                )
+                })
+                .catch(error => {
+                    this.setError(error)
+                })
         },
         onStatusChanged(e) {
-            if (e.authorised_value != 'closed') {
-                this.agreement.closure_reason = ''
+            if (e.authorised_value != "closed") {
+                this.agreement.closure_reason = ""
             }
-        }
+        },
     },
     components: {
         AgreementPeriods,
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormConfirmDelete.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormConfirmDelete.vue
index 647d1ad2e4..5a98d04204 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormConfirmDelete.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsFormConfirmDelete.vue
@@ -60,31 +60,28 @@ export default {
         onSubmit(e) {
             e.preventDefault()
 
-            let apiUrl = '/api/v1/erm/agreements/' + this.agreement.agreement_id
+            let apiUrl = "/api/v1/erm/agreements/" + this.agreement.agreement_id
 
             const options = {
-                method: 'DELETE',
+                method: "DELETE",
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
             fetch(apiUrl, options)
-                .then(
-                    (response) => {
-                        if (response.status == 204) {
-                            setMessage(this.$__("Agreement deleted"))
-                            this.$router.push("/cgi-bin/koha/erm/agreements")
-                        } else {
-                            setError(response.message || response.statusText)
-                        }
+                .then(response => {
+                    if (response.status == 204) {
+                        setMessage(this.$__("Agreement deleted"))
+                        this.$router.push("/cgi-bin/koha/erm/agreements")
+                    } else {
+                        setError(response.message || response.statusText)
                     }
-                ).catch(
-                    (error) => {
-                        setError(error)
-                    }
-                )
-        }
+                })
+                .catch(error => {
+                    setError(error)
+                })
+        },
     },
     name: "AgreementsFormConfirmDelete",
 }
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 1297942238..6e4c819b7c 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
@@ -32,20 +32,19 @@
 </template>
 
 <script>
-import flatPickr from 'vue-flatpickr-component'
+import flatPickr from "vue-flatpickr-component"
 import Toolbar from "./AgreementsToolbar.vue"
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
 import { fetchAgreements } from "../../fetch"
 import { useDataTable, build_url } from "../../composables/datatables"
 
 export default {
     setup() {
-
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
         const table_id = "agreement_list"
@@ -65,7 +64,8 @@ export default {
             initialized: false,
             filters: {
                 by_expired: this.$route.query.by_expired || false,
-                max_expiration_date: this.$route.query.max_expiration_date || "",
+                max_expiration_date:
+                    this.$route.query.max_expiration_date || "",
             },
             before_route_entered: false,
             building_table: false,
@@ -82,11 +82,12 @@ export default {
     },
     computed: {
         datatable_url() {
-            let url = '/api/v1/erm/agreements'
+            let url = "/api/v1/erm/agreements"
             if (this.filters.by_expired)
-                url += '?max_expiration_date=' + this.filters.max_expiration_date
+                url +=
+                    "?max_expiration_date=" + this.filters.max_expiration_date
             return url
-        }
+        },
     },
     methods: {
         async getAgreements() {
@@ -98,27 +99,35 @@ export default {
             this.$router.push("/cgi-bin/koha/erm/agreements/" + agreement_id)
         },
         edit_agreement: function (agreement_id) {
-            this.$router.push("/cgi-bin/koha/erm/agreements/edit/" + agreement_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/agreements/edit/" + agreement_id
+            )
         },
         delete_agreement: function (agreement_id) {
-            this.$router.push("/cgi-bin/koha/erm/agreements/delete/" + agreement_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/agreements/delete/" + agreement_id
+            )
         },
         select_agreement: function (agreement_id) {
-            this.$emit('select-agreement', agreement_id)
-            this.$emit('close')
+            this.$emit("select-agreement", agreement_id)
+            this.$emit("close")
         },
         filter_table: async function () {
-            let new_route = build_url("/cgi-bin/koha/erm/agreements", this.filters)
+            let new_route = build_url(
+                "/cgi-bin/koha/erm/agreements",
+                this.filters
+            )
             this.$router.push(new_route)
             if (this.filters.by_expired) {
                 if (!this.filters.max_expiration_date)
                     this.filters.max_expiration_date = new Date()
             }
-            $('#' + this.table_id).DataTable().ajax.url(this.datatable_url).draw()
-        },
-        table_url: function () {
-
+            $("#" + this.table_id)
+                .DataTable()
+                .ajax.url(this.datatable_url)
+                .draw()
         },
+        table_url: function () {},
         build_datatable: function () {
             let show_agreement = this.show_agreement
             let edit_agreement = this.edit_agreement
@@ -128,178 +137,282 @@ export default {
             let map_av_dt_filter = this.map_av_dt_filter
             let datatable_url = this.datatable_url
             let default_search = this.$route.query.q
-            let actions = this.before_route_entered ? 'edit_delete' : 'select'
+            let actions = this.before_route_entered ? "edit_delete" : "select"
             let table_id = this.table_id
 
-            window['vendors'] = this.vendors.map(e => {
-                e['_id'] = e['id']
-                e['_str'] = e['name']
+            window["vendors"] = this.vendors.map(e => {
+                e["_id"] = e["id"]
+                e["_str"] = e["name"]
                 return e
             })
             let vendors_map = this.vendors.reduce((map, e) => {
                 map[e.id] = e
                 return map
             }, {})
-            let avs = ['av_agreement_statuses', 'av_agreement_closure_reasons', 'av_agreement_renewal_priorities']
+            let avs = [
+                "av_agreement_statuses",
+                "av_agreement_closure_reasons",
+                "av_agreement_renewal_priorities",
+            ]
             avs.forEach(function (av_cat) {
                 window[av_cat] = map_av_dt_filter(av_cat)
             })
 
-            window['av_agreement_is_perpetual'] = [{ _id: 0, _str: _('No') }, { _id: 1, _str: _("Yes") }]
+            window["av_agreement_is_perpetual"] = [
+                { _id: 0, _str: _("No") },
+                { _id: 1, _str: _("Yes") },
+            ]
 
-            const table = $("#" + table_id).kohaTable({
-                ajax: {
-                    url: datatable_url
-                },
-                order: [[0, "asc"]],
-                autoWidth: false,
-                search: { search: default_search },
-                columnDefs: [{
-                    targets: [0, 2],
-                    render: function (data, type, row, meta) {
-                        if (type == 'display') {
-                            return escape_str(data)
-                        }
-                        return data
-                    }
-                }],
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "me.agreement_id:me.name",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
-                    },
-                    {
-                        title: __("Vendor"),
-                        data: "vendor_id",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return row.vendor_id != undefined ? escape_str(vendors_map[row.vendor_id].name) : ""
-                        }
-                    },
-                    {
-                        title: __("Description"),
-                        data: "description",
-                        searchable: true,
-                        orderable: true
+            const table = $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url: datatable_url,
                     },
-                    {
-                        title: __("Status"),
-                        data: "status",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_agreement_statuses", row.status))
-                        }
-                    },
-                    {
-                        title: __("Closure reason"),
-                        data: "closure_reason",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_agreement_closure_reasons", row.closure_reason))
-                        }
-                    },
-                    {
-                        title: __("Is perpetual"),
-                        data: "is_perpetual",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(row.is_perpetual ? _("Yes") : _("No"))
-                        }
-                    },
-                    {
-                        title: __("Renewal priority"),
-                        data: "renewal_priority",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_agreement_renewal_priorities", row.renewal_priority))
-                        }
-                    },
-                    {
-                        title: __("Actions"),
-                        data: function (row, type, val, meta) {
-                            return '<div class="actions"></div>'
+                    order: [[0, "asc"]],
+                    autoWidth: false,
+                    search: { search: default_search },
+                    columnDefs: [
+                        {
+                            targets: [0, 2],
+                            render: function (data, type, row, meta) {
+                                if (type == "display") {
+                                    return escape_str(data)
+                                }
+                                return data
+                            },
+                        },
+                    ],
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "me.agreement_id:me.name",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
                         },
-                        className: "actions noExport",
-                        searchable: false,
-                        orderable: false
-                    }
-                ],
-                drawCallback: function (settings) {
+                        {
+                            title: __("Vendor"),
+                            data: "vendor_id",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return row.vendor_id != undefined
+                                    ? escape_str(
+                                          vendors_map[row.vendor_id].name
+                                      )
+                                    : ""
+                            },
+                        },
+                        {
+                            title: __("Description"),
+                            data: "description",
+                            searchable: true,
+                            orderable: true,
+                        },
+                        {
+                            title: __("Status"),
+                            data: "status",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_agreement_statuses",
+                                        row.status
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Closure reason"),
+                            data: "closure_reason",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_agreement_closure_reasons",
+                                        row.closure_reason
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Is perpetual"),
+                            data: "is_perpetual",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    row.is_perpetual ? _("Yes") : _("No")
+                                )
+                            },
+                        },
+                        {
+                            title: __("Renewal priority"),
+                            data: "renewal_priority",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_agreement_renewal_priorities",
+                                        row.renewal_priority
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Actions"),
+                            data: function (row, type, val, meta) {
+                                return '<div class="actions"></div>'
+                            },
+                            className: "actions noExport",
+                            searchable: false,
+                            orderable: false,
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        if (actions == "edit_delete") {
+                            $.each(
+                                $(this).find("td .actions"),
+                                function (index, e) {
+                                    let tr = $(this).parent().parent()
+                                    let agreement_id = api
+                                        .row(tr)
+                                        .data().agreement_id
+                                    let editButton = createVNode(
+                                        "a",
+                                        {
+                                            class: "btn btn-default btn-xs",
+                                            role: "button",
+                                            onClick: () => {
+                                                edit_agreement(agreement_id)
+                                            },
+                                        },
+                                        [
+                                            createVNode("i", {
+                                                class: "fa fa-pencil",
+                                                "aria-hidden": "true",
+                                            }),
+                                            __("Edit"),
+                                        ]
+                                    )
 
-                    if (actions == 'edit_delete') {
-                        $.each($(this).find("td .actions"), function (index, e) {
-                            let tr = $(this).parent().parent()
-                            let agreement_id = api.row(tr).data().agreement_id
-                            let editButton = createVNode("a", {
-                                class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                    edit_agreement(agreement_id)
-                                }
-                            },
-                                [createVNode("i", { class: "fa fa-pencil", 'aria-hidden': "true" }), __("Edit")])
+                                    let deleteButton = createVNode(
+                                        "a",
+                                        {
+                                            class: "btn btn-default btn-xs",
+                                            role: "button",
+                                            onClick: () => {
+                                                delete_agreement(agreement_id)
+                                            },
+                                        },
+                                        [
+                                            createVNode("i", {
+                                                class: "fa fa-trash",
+                                                "aria-hidden": "true",
+                                            }),
+                                            __("Delete"),
+                                        ]
+                                    )
 
-                            let deleteButton = createVNode("a", {
-                                class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                    delete_agreement(agreement_id)
+                                    let n = createVNode("span", {}, [
+                                        editButton,
+                                        " ",
+                                        deleteButton,
+                                    ])
+                                    render(n, e)
                                 }
-                            },
-                                [createVNode("i", { class: "fa fa-trash", 'aria-hidden': "true" }), __("Delete")])
+                            )
+                        } else {
+                            $.each(
+                                $(this).find("td .actions"),
+                                function (index, e) {
+                                    let tr = $(this).parent().parent()
+                                    let agreement_id = api
+                                        .row(tr)
+                                        .data().agreement_id
+                                    let selectButton = createVNode(
+                                        "a",
+                                        {
+                                            class: "btn btn-default btn-xs",
+                                            role: "button",
+                                            onClick: () => {
+                                                select_agreement(agreement_id)
+                                            },
+                                        },
+                                        [
+                                            createVNode("i", {
+                                                class: "fa fa-check",
+                                                "aria-hidden": "true",
+                                            }),
+                                            __("Select"),
+                                        ]
+                                    )
 
-                            let n = createVNode('span', {}, [editButton, " ", deleteButton])
-                            render(n, e)
-                        })
-                    } else {
-                        $.each($(this).find("td .actions"), function (index, e) {
-                            let tr = $(this).parent().parent()
-                            let agreement_id = api.row(tr).data().agreement_id
-                            let selectButton = createVNode("a", {
-                                class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                    select_agreement(agreement_id)
+                                    let n = createVNode("span", {}, [
+                                        selectButton,
+                                    ])
+                                    render(n, e)
                                 }
-                            },
-                                [createVNode("i", { class: "fa fa-check", 'aria-hidden': "true" }), __("Select")])
-
-                            let n = createVNode('span', {}, [selectButton])
-                            render(n, e)
-                        })
-                    }
+                            )
+                        }
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            onClick: () => {
-                                show_agreement(row.agreement_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        onClick: () => {
+                                            show_agreement(row.agreement_id)
+                                        },
+                                    },
+                                    `${row.name} (#${row.agreement_id})`
+                                )
+                                render(n, e)
                             }
-                        },
-                            `${row.name} (#${row.agreement_id})`
                         )
-                        render(n, e)
-                    })
+                    },
+                    preDrawCallback: function (settings) {
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(1)
+                            .attr("data-filter", "vendors")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(3)
+                            .attr("data-filter", "av_agreement_statuses")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(4)
+                            .attr("data-filter", "av_agreement_closure_reasons")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(5)
+                            .attr("data-filter", "av_agreement_is_perpetual")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(6)
+                            .attr(
+                                "data-filter",
+                                "av_agreement_renewal_priorities"
+                            )
+                    },
                 },
-                preDrawCallback: function (settings) {
-                    $("#" + table_id).find("thead th").eq(1).attr('data-filter', 'vendors')
-                    $("#" + table_id).find("thead th").eq(3).attr('data-filter', 'av_agreement_statuses')
-                    $("#" + table_id).find("thead th").eq(4).attr('data-filter', 'av_agreement_closure_reasons')
-                    $("#" + table_id).find("thead th").eq(5).attr('data-filter', 'av_agreement_is_perpetual')
-                    $("#" + table_id).find("thead th").eq(6).attr('data-filter', 'av_agreement_renewal_priorities')
-                }
-
-            }, agreement_table_settings, 1)
+                agreement_table_settings,
+                1
+            )
         },
     },
     mounted() {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsShow.vue
index 17baef2f60..ee8d4337ae 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsShow.vue
@@ -299,7 +299,7 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import { fetchAgreement } from "../../fetch"
 
 export default {
@@ -307,7 +307,7 @@ export default {
         const format_date = $date
         const patron_to_html = $patron_to_html
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
         return {
@@ -320,15 +320,15 @@ export default {
         return {
             agreement: {
                 agreement_id: null,
-                name: '',
+                name: "",
                 vendor_id: null,
                 vendor: null,
-                description: '',
-                status: '',
-                closure_reason: '',
+                description: "",
+                status: "",
+                closure_reason: "",
                 is_perpetual: false,
-                renewal_priority: '',
-                license_info: '',
+                renewal_priority: "",
+                license_info: "",
                 periods: [],
                 user_roles: [],
                 agreement_packages: [],
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Breadcrumb.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Breadcrumb.vue
index b1e3edbe5a..5ab4af80b7 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Breadcrumb.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Breadcrumb.vue
@@ -11,16 +11,14 @@
                 <router-link v-else-if="item.path" :to="item.path">
                     {{ $__(item.text) }}</router-link
                 >
-                <a v-else class="disabled">
-                    {{ $__(item.text) }}</a
-                >
+                <a v-else class="disabled"> {{ $__(item.text) }}</a>
             </li>
         </ol>
     </nav>
 </template>
 
 <script>
-import { useRouter } from 'vue-router'
+import { useRouter } from "vue-router"
 export default {
     computed: {
         breadCrumbs() {
@@ -28,14 +26,16 @@ export default {
                 return this.$route.meta.breadcrumb()
             }
         },
-        currentRoute() { return this.$route.path }
+        currentRoute() {
+            return this.$route.path
+        },
     },
-};
+}
 </script>
 
 <style scoped>
 a.disabled {
-    padding: .6em .3em;
+    padding: 0.6em 0.3em;
     text-decoration: none;
     color: #000;
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Dialog.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Dialog.vue
index c1f3040d53..ae336ce1dd 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Dialog.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Dialog.vue
@@ -24,7 +24,7 @@ export default {
         const { removeMessages } = mainStore
         return { message, error, warning, removeMessages }
     },
-};
+}
 </script>
 
 <style scoped>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Documents.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Documents.vue
index 59e6d44b8d..6727027370 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Documents.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Documents.vue
@@ -137,12 +137,11 @@ export default {
         },
         deleteDocument(counter) {
             this.documents.splice(counter, 1)
-        }
+        },
     },
-    name: 'Documents',
+    name: "Documents",
     props: {
-        documents: Array
+        documents: Array,
     },
-
 }
 </script>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageAgreements.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageAgreements.vue
index 1c2ce08807..bb202c7d2c 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageAgreements.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageAgreements.vue
@@ -41,10 +41,9 @@ import { setWarning, removeMessages } from "../../messages"
 
 export default {
     data() {
-        return { showModal: false, }
-    },
-    beforeCreate() {
+        return { showModal: false }
     },
+    beforeCreate() {},
     methods: {
         serializeAgreement() {
             let erm_package = JSON.parse(JSON.stringify(this.erm_package)) // copy
@@ -56,7 +55,7 @@ export default {
             delete erm_package.content_type
             erm_package.external_id = erm_package.package_id
             delete erm_package.package_id
-            erm_package.provider = 'ebsco'
+            erm_package.provider = "ebsco"
             erm_package.package_id = erm_package.koha_internal_id
             delete erm_package.koha_internal_id
             return erm_package
@@ -66,26 +65,34 @@ export default {
             this.showModal = false
             let erm_package = this.serializeAgreement()
             // Only add if it does not exist
-            if (!erm_package.package_agreements.find((a) => a.agreement_id == agreement_id)) {
+            if (
+                !erm_package.package_agreements.find(
+                    a => a.agreement_id == agreement_id
+                )
+            ) {
                 erm_package.package_agreements.push({ agreement_id })
                 if (this.erm_package.koha_internal_id) {
                     editPackage(erm_package).then(() => {
-                        this.$emit('refresh-agreements')
+                        this.$emit("refresh-agreements")
                     })
                 } else {
                     createPackage(erm_package).then(() => {
-                        this.$emit('refresh-agreements')
+                        this.$emit("refresh-agreements")
                     })
                 }
             } else {
-                setWarning(this.$__("This agreement is already linked with this package"))
+                setWarning(
+                    this.$__(
+                        "This agreement is already linked with this package"
+                    )
+                )
             }
         },
         deleteAgreement(counter) {
             let erm_package = this.serializeAgreement()
             erm_package.package_agreements.splice(counter, 1)
             editPackage(erm_package).then(() => {
-                this.$emit('refresh-agreements')
+                this.$emit("refresh-agreements")
             })
         },
     },
@@ -95,8 +102,8 @@ export default {
     components: {
         AgreementsList,
     },
-    emits: ['refresh-agreements'],
-    name: 'EHoldingsEBSCOPackageAgreements',
+    emits: ["refresh-agreements"],
+    name: "EHoldingsEBSCOPackageAgreements",
 }
 </script>
 <style scoped>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageTitlesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageTitlesList.vue
index 6e08d3901c..c4a4d669e5 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageTitlesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackageTitlesList.vue
@@ -3,7 +3,9 @@
         <div id="filters">
             <a href="#" @click.prevent="toggle_filters($event)"
                 ><i class="fa fa-search"></i>
-                {{ display_filters ? $__("Hide filters") : $__("Show filters") }}
+                {{
+                    display_filters ? $__("Hide filters") : $__("Show filters")
+                }}
             </a>
             <fieldset v-if="display_filters">
                 <ol>
@@ -58,14 +60,13 @@
 </template>
 
 <script>
-
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
     setup() {
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { av_title_publication_types } = storeToRefs(AVStore)
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
@@ -91,10 +92,14 @@ export default {
     },
     methods: {
         show_resource: function (resource_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/ebsco/resources/" + resource_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/ebsco/resources/" + resource_id
+            )
         },
         filter_table: function () {
-            $('#' + this.table_id).DataTable().draw()
+            $("#" + this.table_id)
+                .DataTable()
+                .draw()
         },
         toggle_filters: function (e) {
             this.display_filters = !this.display_filters
@@ -107,7 +112,9 @@ export default {
             let filters = this.filters
             let table_id = this.table_id
 
-            window['av_title_publication_types'] = map_av_dt_filter('av_title_publication_types')
+            window["av_title_publication_types"] = map_av_dt_filter(
+                "av_title_publication_types"
+            )
 
             let additional_filters = {
                 publication_title: function () {
@@ -121,61 +128,94 @@ export default {
                 },
             }
 
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    url: "/api/v1/erm/eholdings/ebsco/packages/" + package_id + "/resources",
-                },
-                ordering: false,
-                dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
-                aLengthMenu: [[10, 20, 50, 100], [10, 20, 50, 100]],
-                embed: ['title'],
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "title.publication_title",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url:
+                            "/api/v1/erm/eholdings/ebsco/packages/" +
+                            package_id +
+                            "/resources",
                     },
-                    {
-                        title: __("Publication type"),
-                        data: "title.publication_type",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_title_publication_types", row.title.publication_type))
-                        }
-                    },
-                ],
-                drawCallback: function (settings) {
-
-                    var api = new $.fn.dataTable.Api(settings)
+                    ordering: false,
+                    dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
+                    aLengthMenu: [
+                        [10, 20, 50, 100],
+                        [10, 20, 50, 100],
+                    ],
+                    embed: ["title"],
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "title.publication_title",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                        },
+                        {
+                            title: __("Publication type"),
+                            data: "title.publication_type",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_title_publication_types",
+                                        row.title.publication_type
+                                    )
+                                )
+                            },
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/ebsco/resources/" + row.resource_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_resource(row.resource_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/ebsco/resources/" +
+                                            row.resource_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_resource(row.resource_id)
+                                        },
+                                    },
+                                    `${row.title.publication_title}`
+                                )
+                                if (row.is_selected) {
+                                    n = createVNode("span", {}, [
+                                        n,
+                                        " ",
+                                        createVNode("i", {
+                                            class: "fa fa-check-square-o",
+                                            style: {
+                                                color: "green",
+                                                float: "right",
+                                            },
+                                            title: __("Is selected"),
+                                        }),
+                                    ])
+                                }
+                                render(n, e)
                             }
-                        },
-                            `${row.title.publication_title}`
                         )
-                        if (row.is_selected) {
-                            n = createVNode('span', {}, [n, " ", createVNode("i", { class: "fa fa-check-square-o", style: { color: "green", float: "right" }, title: __("Is selected") })])
-                        }
-                        render(n, e)
-                    })
+                    },
                 },
-            }, null, 0, additional_filters)
+                null,
+                0,
+                additional_filters
+            )
         },
     },
     mounted() {
@@ -184,7 +224,7 @@ export default {
     props: {
         package_id: String,
     },
-    name: 'EHoldingsEBSCOPackageTitlesList',
+    name: "EHoldingsEBSCOPackageTitlesList",
 }
 </script>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesList.vue
index 217e50a90a..b7f6225884 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesList.vue
@@ -60,18 +60,23 @@
 </template>
 
 <script>
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
-import { fetchCountLocalPackages } from './../../fetch'
-import { useDataTable, build_url_params, build_url } from "../../composables/datatables"
+import { fetchCountLocalPackages } from "./../../fetch"
+import {
+    useDataTable,
+    build_url_params,
+    build_url,
+} from "../../composables/datatables"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
-        const { av_package_types, av_package_content_types } = storeToRefs(AVStore)
+        const AVStore = inject("AVStore")
+        const { av_package_types, av_package_content_types } =
+            storeToRefs(AVStore)
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
         const table_id = "package_list"
@@ -101,7 +106,12 @@ export default {
         }
     },
     computed: {
-        local_packages_url() { return build_url("/cgi-bin/koha/erm/eholdings/local/packages", this.filters) },
+        local_packages_url() {
+            return build_url(
+                "/cgi-bin/koha/erm/eholdings/local/packages",
+                this.filters
+            )
+        },
     },
     beforeRouteEnter(to, from, next) {
         next(vm => {
@@ -110,16 +120,25 @@ export default {
     },
     methods: {
         show_package: function (package_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/ebsco/packages/" + package_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/ebsco/packages/" + package_id
+            )
         },
         filter_table: async function () {
-            let new_route = build_url("/cgi-bin/koha/erm/eholdings/ebsco/packages", this.filters)
+            let new_route = build_url(
+                "/cgi-bin/koha/erm/eholdings/ebsco/packages",
+                this.filters
+            )
             this.$router.push(new_route)
             this.show_table = true
             this.local_count_packages = null
-            $('#' + this.table_id).DataTable().draw()
-            if (this.erm_providers.includes('local')) {
-                this.local_count_packages = await fetchCountLocalPackages(this.filters)
+            $("#" + this.table_id)
+                .DataTable()
+                .draw()
+            if (this.erm_providers.includes("local")) {
+                this.local_count_packages = await fetchCountLocalPackages(
+                    this.filters
+                )
             }
         },
         build_datatable: function () {
@@ -128,18 +147,20 @@ export default {
             let map_av_dt_filter = this.map_av_dt_filter
 
             if (!this.show_table) {
-                this.show_table = build_url_params(this.filters).length ? true : false
+                this.show_table = build_url_params(this.filters).length
+                    ? true
+                    : false
             }
             let filters = this.filters
             let show_table = this.show_table
             let table_id = this.table_id
 
-            window['vendors'] = this.vendors.map(e => {
-                e['_id'] = e['id']
-                e['_str'] = e['name']
+            window["vendors"] = this.vendors.map(e => {
+                e["_id"] = e["id"]
+                e["_str"] = e["name"]
                 return e
             })
-            let avs = ['av_package_types', 'av_package_content_types']
+            let avs = ["av_package_types", "av_package_content_types"]
             avs.forEach(function (av_cat) {
                 window[av_cat] = map_av_dt_filter(av_cat)
             })
@@ -156,78 +177,116 @@ export default {
                 },
             }
 
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    url: "/api/v1/erm/eholdings/ebsco/packages",
-                },
-                embed: ['resources+count', 'vendor.name'],
-                ordering: false,
-                dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
-                aLengthMenu: [[10, 20, 50, 100], [10, 20, 50, 100]],
-                deferLoading: show_table ? false : true,
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "me.package_id:me.name",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url: "/api/v1/erm/eholdings/ebsco/packages",
                     },
-                    {
-                        title: __("Vendor"),
-                        data: "vendor_id",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            return row.vendor ? escape_str(row.vendor.name) : ""
+                    embed: ["resources+count", "vendor.name"],
+                    ordering: false,
+                    dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
+                    aLengthMenu: [
+                        [10, 20, 50, 100],
+                        [10, 20, 50, 100],
+                    ],
+                    deferLoading: show_table ? false : true,
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "me.package_id:me.name",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
                         },
-                    },
-                    {
-                        title: __("Type"),
-                        data: "package_type",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_package_types", row.package_type))
-                        }
-                    }, {
-                        title: __("Content type"),
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_package_content_types", row.content_type))
-                        }
-                    },
-                ],
-                drawCallback: function (settings) {
-
-                    var api = new $.fn.dataTable.Api(settings)
+                        {
+                            title: __("Vendor"),
+                            data: "vendor_id",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                return row.vendor
+                                    ? escape_str(row.vendor.name)
+                                    : ""
+                            },
+                        },
+                        {
+                            title: __("Type"),
+                            data: "package_type",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_package_types",
+                                        row.package_type
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Content type"),
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_package_content_types",
+                                        row.content_type
+                                    )
+                                )
+                            },
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/ebsco/packages/" + row.package_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_package(row.package_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/ebsco/packages/" +
+                                            row.package_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_package(row.package_id)
+                                        },
+                                    },
+                                    `${row.name} (#${row.package_id})`
+                                )
+                                if (row.is_selected) {
+                                    n = createVNode("span", {}, [
+                                        n,
+                                        " ",
+                                        createVNode("i", {
+                                            class: "fa fa-check-square-o",
+                                            style: {
+                                                color: "green",
+                                                float: "right",
+                                            },
+                                            title: __("Is selected"),
+                                        }),
+                                    ])
+                                }
+                                render(n, e)
                             }
-                        },
-                            `${row.name} (#${row.package_id})`
                         )
-                        if (row.is_selected) {
-                            n = createVNode('span', {}, [n, " ", createVNode("i", { class: "fa fa-check-square-o", style: { color: "green", float: "right" }, title: __("Is selected") })])
-                        }
-                        render(n, e)
-                    })
+                    },
                 },
-            }, null, 0, additional_filters)
+                null,
+                0,
+                additional_filters
+            )
 
             if (filters.package_name.length) {
                 this.filter_table()
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesShow.vue
index ed00fb1874..4951ae6763 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOPackagesShow.vue
@@ -9,7 +9,8 @@
                     class="btn btn-default btn-xs"
                     role="button"
                     @click="add_to_holdings"
-                    ><font-awesome-icon icon="plus" /> {{ $__("Add package to holdings") }}</a
+                    ><font-awesome-icon icon="plus" />
+                    {{ $__("Add package to holdings") }}</a
                 >
                 <a
                     v-else
@@ -17,7 +18,8 @@
                     role="button"
                     id="remove-from-holdings"
                     @click="remove_from_holdings"
-                    ><font-awesome-icon icon="minus" /> {{ $__("Remove package from holdings") }}</a
+                    ><font-awesome-icon icon="minus" />
+                    {{ $__("Remove package from holdings") }}</a
                 > </span
             ><span v-else><font-awesome-icon icon="spinner" /></span>
         </h2>
@@ -37,12 +39,19 @@
                     <li v-if="false">
                         <label>{{ $__("External ID") }}:</label>
                         <span>
-                            <span v-if="false">FIXME - Does not replace this v-if with an HTML comment, it breaks xgettext</span>
-                            <span v-if="false">FIXME - Create a syspref to store the URL</span>
+                            <span v-if="false"
+                                >FIXME - Does not replace this v-if with an HTML
+                                comment, it breaks xgettext</span
+                            >
+                            <span v-if="false"
+                                >FIXME - Create a syspref to store the URL</span
+                            >
                             <a
                                 :href="`https://replace_with_syspref_value_here.folio.ebsco.com/eholdings/packages/${erm_package.vendor.external_id}-${erm_package.external_id}`"
                             >
-                                {{ erm_package.vendor.external_id }}-{{ erm_package.external_id }}
+                                {{ erm_package.vendor.external_id }}-{{
+                                    erm_package.external_id
+                                }}
                             </a>
                         </span>
                     </li>
@@ -104,7 +113,7 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import EHoldingsPackageAgreements from "./EHoldingsEBSCOPackageAgreements.vue"
 import EHoldingsPackageTitlesList from "./EHoldingsEBSCOPackageTitlesList.vue"
 import { fetchEBSCOPackage, checkError } from "../../fetch"
@@ -113,7 +122,7 @@ export default {
     setup() {
         const format_date = $date
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
         return {
@@ -126,11 +135,11 @@ export default {
             erm_package: {
                 package_id: null,
                 vendor_id: null,
-                name: '',
-                external_id: '',
-                provider: '',
-                package_type: '',
-                content_type: '',
+                name: "",
+                external_id: "",
+                provider: "",
+                package_type: "",
+                content_type: "",
                 created_on: null,
                 resources: null,
                 package_agreements: [],
@@ -156,25 +165,26 @@ export default {
         },
         edit_selected(is_selected) {
             this.updating_is_selected = true
-            fetch('/api/v1/erm/eholdings/ebsco/packages/' + this.erm_package.package_id, {
-                method: "PATCH",
-                body: JSON.stringify({ is_selected }),
-                headers: {
-                    'Accept': 'application/json',
-                    'Content-Type': 'application/json'
-                },
-            })
-                .then(checkError)
-                .then(
-                    (result) => {
-                        // Refresh the page. We should not need that actually.
-                        this.getPackage(this.erm_package.package_id)
+            fetch(
+                "/api/v1/erm/eholdings/ebsco/packages/" +
+                    this.erm_package.package_id,
+                {
+                    method: "PATCH",
+                    body: JSON.stringify({ is_selected }),
+                    headers: {
+                        Accept: "application/json",
+                        "Content-Type": "application/json",
                     },
-                ).catch(
-                    (error) => {
-                        setError(error)
-                    }
-                )
+                }
+            )
+                .then(checkError)
+                .then(result => {
+                    // Refresh the page. We should not need that actually.
+                    this.getPackage(this.erm_package.package_id)
+                })
+                .catch(error => {
+                    setError(error)
+                })
         },
         add_to_holdings() {
             this.edit_selected(true)
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOResourcesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOResourcesShow.vue
index 1cac04847f..6753ce2acf 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOResourcesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOResourcesShow.vue
@@ -9,7 +9,8 @@
                     class="btn btn-default btn-xs"
                     role="button"
                     @click="add_to_holdings"
-                    ><font-awesome-icon icon="plus" /> {{ $__("Add title to holdings") }}</a
+                    ><font-awesome-icon icon="plus" />
+                    {{ $__("Add title to holdings") }}</a
                 >
                 <a
                     v-else
@@ -17,7 +18,8 @@
                     role="button"
                     id="remove-from-holdings"
                     @click="remove_from_holdings"
-                    ><font-awesome-icon icon="minus" /> {{ $__("Remove title from holdings") }}</a
+                    ><font-awesome-icon icon="minus" />
+                    {{ $__("Remove title from holdings") }}</a
                 > </span
             ><span v-else><font-awesome-icon icon="spinner" /></span>
         </h2>
@@ -112,16 +114,16 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import { fetchEBSCOResource } from "../../fetch"
 import { storeToRefs } from "pinia"
-import { checkError } from '../../fetch.js'
+import { checkError } from "../../fetch.js"
 
 export default {
     setup() {
         const format_date = $date
 
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
         return {
             format_date,
@@ -134,9 +136,9 @@ export default {
                 resource_id: null,
                 title_id: null,
                 package_id: null,
-                started_on: '',
-                ended_on: '',
-                proxy: '',
+                started_on: "",
+                ended_on: "",
+                proxy: "",
                 title: {},
                 package: {},
             },
@@ -162,25 +164,26 @@ export default {
         },
         edit_selected(is_selected) {
             this.updating_is_selected = true
-            fetch('/api/v1/erm/eholdings/ebsco/resources/' + this.resource.resource_id, {
-                method: "PATCH",
-                body: JSON.stringify({ is_selected }),
-                headers: {
-                    'Accept': 'application/json',
-                    'Content-Type': 'application/json'
-                },
-            })
-                .then(checkError)
-                .then(
-                    (result) => {
-                        // Refresh the page. We should not need that actually.
-                        this.getResource(this.resource.resource_id)
+            fetch(
+                "/api/v1/erm/eholdings/ebsco/resources/" +
+                    this.resource.resource_id,
+                {
+                    method: "PATCH",
+                    body: JSON.stringify({ is_selected }),
+                    headers: {
+                        Accept: "application/json",
+                        "Content-Type": "application/json",
                     },
-                ).catch(
-                    (error) => {
-                        setError(error)
-                    }
-                )
+                }
+            )
+                .then(checkError)
+                .then(result => {
+                    // Refresh the page. We should not need that actually.
+                    this.getResource(this.resource.resource_id)
+                })
+                .catch(error => {
+                    setError(error)
+                })
         },
         add_to_holdings() {
             this.edit_selected(true)
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlePackagesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlePackagesList.vue
index 5f27cc596a..7b599667e7 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlePackagesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlePackagesList.vue
@@ -3,7 +3,9 @@
         <div id="filters">
             <a href="#" @click.prevent="toggle_filters($event)"
                 ><i class="fa fa-search"></i>
-                {{ display_filters ? $__("Hide filters") : $__("Show filters") }}
+                {{
+                    display_filters ? $__("Hide filters") : $__("Show filters")
+                }}
             </a>
             <fieldset v-if="display_filters" id="filters">
                 <ol>
@@ -41,8 +43,7 @@
 </template>
 
 <script>
-
-import { createVNode, render } from 'vue'
+import { createVNode, render } from "vue"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
@@ -65,13 +66,17 @@ export default {
     },
     methods: {
         show_resource: function (resource_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/ebsco/resources/" + resource_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/ebsco/resources/" + resource_id
+            )
         },
         toggle_filters: function (e) {
             this.display_filters = !this.display_filters
         },
         filter_table: function () {
-            $('#' + this.table_id).DataTable().draw()
+            $("#" + this.table_id)
+                .DataTable()
+                .draw()
         },
         build_datatable: function () {
             let show_resource = this.show_resource
@@ -79,65 +84,98 @@ export default {
             let filters = this.filters
             let table_id = this.table_id
 
-            $.fn.dataTable.ext.search = $.fn.dataTable.ext.search.filter((search) => search.name != 'apply_filter')
-            $('#' + table_id).dataTable($.extend(true, {}, dataTablesDefaults, {
-                data: resources,
-                embed: ['package.name'],
-                ordering: false,
-                dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
-                aLengthMenu: [[10, 20, 50, 100], [10, 20, 50, 100]],
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "package.name",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
+            $.fn.dataTable.ext.search = $.fn.dataTable.ext.search.filter(
+                search => search.name != "apply_filter"
+            )
+            $("#" + table_id).dataTable(
+                $.extend(true, {}, dataTablesDefaults, {
+                    data: resources,
+                    embed: ["package.name"],
+                    ordering: false,
+                    dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
+                    aLengthMenu: [
+                        [10, 20, 50, 100],
+                        [10, 20, 50, 100],
+                    ],
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "package.name",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                            width: "100%",
                         },
-                        width: '100%',
-                    },
-                ],
-                drawCallback: function (settings) {
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        if (!api.rows({ search: "applied" }).count()) return
 
-                    if (!api.rows({ search: 'applied' }).count()) return
-
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/ebsco/resources/" + row.resource_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_resource(row.resource_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/ebsco/resources/" +
+                                            row.resource_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_resource(row.resource_id)
+                                        },
+                                    },
+                                    `${row.package.name}`
+                                )
+                                if (row.is_selected) {
+                                    n = createVNode("span", {}, [
+                                        n,
+                                        " ",
+                                        createVNode("i", {
+                                            class: "fa fa-check-square-o",
+                                            style: {
+                                                color: "green",
+                                                float: "right",
+                                            },
+                                            title: __("Is selected"),
+                                        }),
+                                    ])
+                                }
+                                render(n, e)
                             }
-                        },
-                            `${row.package.name}`
                         )
-                        if (row.is_selected) {
-                            n = createVNode('span', {}, [n, " ", createVNode("i", { class: "fa fa-check-square-o", style: { color: "green", float: "right" }, title: __("Is selected") })])
-                        }
-                        render(n, e)
-                    })
-                },
-                initComplete: function () {
-                    $.fn.dataTable.ext.search.push(
-                        function apply_filter(settings, data, dataIndex, row) {
-                            return row.package.name.match(new RegExp(filters.package_name, "i"))
-                                && (filters.selection_type == 0
-                                    || filters.selection_type == 1 && row.is_selected
-                                    || filters.selection_type == 2 && !row.is_selected)
-                        }
-                    )
-                }
-            }))
-        }
+                    },
+                    initComplete: function () {
+                        $.fn.dataTable.ext.search.push(function apply_filter(
+                            settings,
+                            data,
+                            dataIndex,
+                            row
+                        ) {
+                            return (
+                                row.package.name.match(
+                                    new RegExp(filters.package_name, "i")
+                                ) &&
+                                (filters.selection_type == 0 ||
+                                    (filters.selection_type == 1 &&
+                                        row.is_selected) ||
+                                    (filters.selection_type == 2 &&
+                                        !row.is_selected))
+                            )
+                        })
+                    },
+                })
+            )
+        },
     },
     mounted() {
         this.build_datatable()
@@ -145,7 +183,7 @@ export default {
     props: {
         resources: Array,
     },
-    name: 'EHoldingsEBSCOTitlePackagesList',
+    name: "EHoldingsEBSCOTitlePackagesList",
 }
 </script>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesList.vue
index b0e72b1913..d95be95206 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesList.vue
@@ -66,17 +66,21 @@
 </template>
 
 <script>
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
 import { fetchCountLocalTitles } from "./../../fetch"
-import { useDataTable, build_url_params, build_url } from "../../composables/datatables"
+import {
+    useDataTable,
+    build_url_params,
+    build_url,
+} from "../../composables/datatables"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { av_title_publication_types } = storeToRefs(AVStore)
         const { get_lib_from_av } = AVStore
 
@@ -106,7 +110,12 @@ export default {
         }
     },
     computed: {
-        local_titles_url() { return build_url("/cgi-bin/koha/erm/eholdings/local/titles", this.filters) },
+        local_titles_url() {
+            return build_url(
+                "/cgi-bin/koha/erm/eholdings/local/titles",
+                this.filters
+            )
+        },
     },
     beforeRouteEnter(to, from, next) {
         next(vm => {
@@ -115,18 +124,27 @@ export default {
     },
     methods: {
         show_title: function (title_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/ebsco/titles/" + title_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/ebsco/titles/" + title_id
+            )
         },
         filter_table: async function () {
             if (this.filters.publication_title.length) {
                 this.cannot_search = false
-                let new_route = build_url("/cgi-bin/koha/erm/eholdings/ebsco/titles", this.filters)
+                let new_route = build_url(
+                    "/cgi-bin/koha/erm/eholdings/ebsco/titles",
+                    this.filters
+                )
                 this.$router.push(new_route)
                 this.show_table = true
                 this.local_count_titles = null
-                $('#' + this.table_id).DataTable().draw()
-                if (this.erm_providers.includes('local')) {
-                    this.local_count_titles = await fetchCountLocalTitles(this.filters)
+                $("#" + this.table_id)
+                    .DataTable()
+                    .draw()
+                if (this.erm_providers.includes("local")) {
+                    this.local_count_titles = await fetchCountLocalTitles(
+                        this.filters
+                    )
                 }
             } else {
                 this.cannot_search = true
@@ -136,25 +154,28 @@ export default {
             let show_title = this.show_title
             let get_lib_from_av = this.get_lib_from_av
             if (!this.show_table) {
-                this.show_table = build_url_params(this.filters).length ? true : false
+                this.show_table = build_url_params(this.filters).length
+                    ? true
+                    : false
             }
             let filters = this.filters
             let table_id = this.table_id
 
-            window['vendors'] = this.vendors.map(e => {
-                e['_id'] = e['id']
-                e['_str'] = e['name']
+            window["vendors"] = this.vendors.map(e => {
+                e["_id"] = e["id"]
+                e["_str"] = e["name"]
                 return e
             })
             let vendors_map = this.vendors.reduce((map, e) => {
                 map[e.id] = e
                 return map
             }, {})
-            window['av_title_publication_types'] = this.av_title_publication_types.map(e => {
-                e['_id'] = e['authorised_value']
-                e['_str'] = e['lib']
-                return e
-            })
+            window["av_title_publication_types"] =
+                this.av_title_publication_types.map(e => {
+                    e["_id"] = e["authorised_value"]
+                    e["_str"] = e["lib"]
+                    return e
+                })
 
             let additional_filters = {
                 publication_title: function () {
@@ -167,84 +188,126 @@ export default {
                     return filters.selection_type || ""
                 },
             }
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    url: "/api/v1/erm/eholdings/ebsco/titles",
-                },
-                ordering: false,
-                dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
-                aLengthMenu: [[10, 20, 50, 100], [10, 20, 50, 100]],
-                deferLoading: true,
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Title"),
-                        data: "me.publication_title",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
-                    },
-                    {
-                        title: __("Publisher name"),
-                        data: "me.publisher_name",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            return escape_str(row.publisher_name)
-                        }
-                    },
-                    {
-                        title: __("Publication type"),
-                        data: "publication_type",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_title_publication_types", row.publication_type))
-                        }
-                    },
-                    {
-                        title: __("Identifier"),
-                        data: "print_identifier:online_identifier",
-                        searchable: false,
-                        orderable: false,
-                        render: function (data, type, row, meta) {
-                            let print_identifier = row.print_identifier
-                            let online_identifier = row.online_identifier
-                            return (print_identifier ? escape_str(_("ISBN (Print): %s").format(print_identifier)) : "") +
-                                (online_identifier ? escape_str(_("ISBN (Online): %s").format(online_identifier)) : "")
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url: "/api/v1/erm/eholdings/ebsco/titles",
                     },
-                ],
-                drawCallback: function (settings) {
+                    ordering: false,
+                    dom: '<"top pager"<"table_entries"ilp>>tr<"bottom pager"ip>',
+                    aLengthMenu: [
+                        [10, 20, 50, 100],
+                        [10, 20, 50, 100],
+                    ],
+                    deferLoading: true,
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Title"),
+                            data: "me.publication_title",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                        },
+                        {
+                            title: __("Publisher name"),
+                            data: "me.publisher_name",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                return escape_str(row.publisher_name)
+                            },
+                        },
+                        {
+                            title: __("Publication type"),
+                            data: "publication_type",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_title_publication_types",
+                                        row.publication_type
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Identifier"),
+                            data: "print_identifier:online_identifier",
+                            searchable: false,
+                            orderable: false,
+                            render: function (data, type, row, meta) {
+                                let print_identifier = row.print_identifier
+                                let online_identifier = row.online_identifier
+                                return (
+                                    (print_identifier
+                                        ? escape_str(
+                                              _("ISBN (Print): %s").format(
+                                                  print_identifier
+                                              )
+                                          )
+                                        : "") +
+                                    (online_identifier
+                                        ? escape_str(
+                                              _("ISBN (Online): %s").format(
+                                                  online_identifier
+                                              )
+                                          )
+                                        : "")
+                                )
+                            },
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        if (!api.rows({ search: "applied" }).count()) return
 
-                    if (!api.rows({ search: 'applied' }).count()) return
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_title(row.title_id)
+                                        },
+                                    },
+                                    `${row.publication_title} (#${row.title_id})`
+                                )
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_title(row.title_id)
+                                if (row.is_selected) {
+                                    n = createVNode("span", {}, [
+                                        n,
+                                        " ",
+                                        createVNode("i", {
+                                            class: "fa fa-check-square-o",
+                                            style: {
+                                                color: "green",
+                                                float: "right",
+                                            },
+                                            title: __("Is selected"),
+                                        }),
+                                    ])
+                                }
+                                render(n, e)
                             }
-                        },
-                            `${row.publication_title} (#${row.title_id})`
                         )
-
-                        if (row.is_selected) {
-                            n = createVNode('span', {}, [n, " ", createVNode("i", { class: "fa fa-check-square-o", style: { color: "green", float: "right" }, title: __("Is selected") })])
-                        }
-                        render(n, e)
-                    })
+                    },
                 },
-            }, null, 0, additional_filters)
+                null,
+                0,
+                additional_filters
+            )
 
             if (filters.publication_title.length) {
                 this.filter_table()
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesShow.vue
index 7b4c9561a0..26c60ea07b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsEBSCOTitlesShow.vue
@@ -1,6 +1,6 @@
 <template>
     <div v-if="!initialized">{{ $__("Loading") }}</div>
-    <div v-else-if=title id="eholdings_title_show">
+    <div v-else-if="title" id="eholdings_title_show">
         <h2>
             {{ $__("Title #%s").format(title.title_id) }}
         </h2>
@@ -243,12 +243,12 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import EHoldingsTitlePackagesList from "./EHoldingsEBSCOTitlePackagesList.vue"
 import { fetchEBSCOTitle } from "../../fetch"
 export default {
     setup() {
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
         return {
@@ -259,31 +259,31 @@ export default {
         return {
             title: {
                 title_id: null,
-                publication_title: '',
-                external_id: '',
-                print_identifier: '',
-                online_identifier: '',
-                date_first_issue_online: '',
-                num_first_vol_online: '',
-                num_first_issue_online: '',
-                date_last_issue_online: '',
-                num_last_vol_online: '',
-                num_last_issue_online: '',
-                title_url: '',
-                first_author: '',
-                embargo_info: '',
-                coverage_depth: '',
-                notes: '',
-                publisher_name: '',
-                publication_type: '',
-                date_monograph_published_print: '',
-                date_monograph_published_online: '',
-                monograph_volume: '',
-                monograph_edition: '',
-                first_editor: '',
-                parent_publication_title_id: '',
-                preceeding_publication_title_id: '',
-                access_type: '',
+                publication_title: "",
+                external_id: "",
+                print_identifier: "",
+                online_identifier: "",
+                date_first_issue_online: "",
+                num_first_vol_online: "",
+                num_first_issue_online: "",
+                date_last_issue_online: "",
+                num_last_vol_online: "",
+                num_last_issue_online: "",
+                title_url: "",
+                first_author: "",
+                embargo_info: "",
+                coverage_depth: "",
+                notes: "",
+                publisher_name: "",
+                publication_type: "",
+                date_monograph_published_print: "",
+                date_monograph_published_online: "",
+                monograph_volume: "",
+                monograph_edition: "",
+                first_editor: "",
+                parent_publication_title_id: "",
+                preceeding_publication_title_id: "",
+                access_type: "",
                 resources: [],
             },
             initialized: false,
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageAgreements.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageAgreements.vue
index c4344214eb..1cd25fcbdd 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageAgreements.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageAgreements.vue
@@ -22,7 +22,7 @@
                         :id="`agreement_id_${counter}`"
                         v-model="package_agreement.agreement_id"
                         label="name"
-                        :reduce="(a) => a.agreement_id"
+                        :reduce="a => a.agreement_id"
                         :options="agreements"
                     >
                         <template #search="{ attributes, events }">
@@ -58,7 +58,7 @@ export default {
         }
     },
     beforeCreate() {
-        fetchAgreements().then((agreements) => {
+        fetchAgreements().then(agreements => {
             this.agreements = agreements
         })
     },
@@ -75,6 +75,6 @@ export default {
     props: {
         package_agreements: Array,
     },
-    name: 'EHoldingsLocalPackageAgreements',
+    name: "EHoldingsLocalPackageAgreements",
 }
 </script>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageTitlesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageTitlesList.vue
index 2484f9e0b6..f325f41d00 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageTitlesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackageTitlesList.vue
@@ -5,13 +5,12 @@
 </template>
 
 <script>
-
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
     setup() {
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
         const table_id = "title_list"
@@ -24,12 +23,13 @@ export default {
         }
     },
     data() {
-        return {
-        }
+        return {}
     },
     methods: {
         show_resource: function (resource_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/resources/" + resource_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/resources/" + resource_id
+            )
         },
         build_datatable: function () {
             let show_resource = this.show_resource
@@ -38,60 +38,83 @@ export default {
             let map_av_dt_filter = this.map_av_dt_filter
             let table_id = this.table_id
 
-            window['av_title_publication_types'] = map_av_dt_filter('av_title_publication_types')
+            window["av_title_publication_types"] = map_av_dt_filter(
+                "av_title_publication_types"
+            )
 
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    url: "/api/v1/erm/eholdings/local/packages/" + package_id + "/resources",
-                },
-                embed: ['title'],
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "title.publication_title",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
-                    },
-                    {
-                        title: __("Publication type"),
-                        data: "title.publication_type",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_title_publication_types", row.title.publication_type))
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url:
+                            "/api/v1/erm/eholdings/local/packages/" +
+                            package_id +
+                            "/resources",
                     },
-                ],
-                drawCallback: function (settings) {
-
-                    var api = new $.fn.dataTable.Api(settings)
+                    embed: ["title"],
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "title.publication_title",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                        },
+                        {
+                            title: __("Publication type"),
+                            data: "title.publication_type",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_title_publication_types",
+                                        row.title.publication_type
+                                    )
+                                )
+                            },
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/local/resources/" + row.resource_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_resource(row.resource_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/local/resources/" +
+                                            row.resource_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_resource(row.resource_id)
+                                        },
+                                    },
+                                    `${row.title.publication_title}`
+                                )
+                                render(n, e)
                             }
-                        },
-                            `${row.title.publication_title}`
                         )
-                        render(n, e)
-                    })
+                    },
+                    preDrawCallback: function (settings) {
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(1)
+                            .attr("data-filter", "av_title_publication_types")
+                    },
                 },
-                preDrawCallback: function (settings) {
-                    $("#" + table_id).find("thead th").eq(1).attr('data-filter', 'av_title_publication_types')
-                }
-            }, null, 1)
+                null,
+                1
+            )
         },
     },
     mounted() {
@@ -100,7 +123,7 @@ export default {
     props: {
         package_id: String,
     },
-    name: 'EHoldingsLocalPackageTitlesList',
+    name: "EHoldingsLocalPackageTitlesList",
 }
 </script>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormAdd.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormAdd.vue
index 3809392d7f..82d0eb9611 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormAdd.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormAdd.vue
@@ -29,7 +29,7 @@
                                 id="package_vendor_id"
                                 v-model="erm_package.vendor_id"
                                 label="name"
-                                :reduce="(vendor) => vendor.id"
+                                :reduce="vendor => vendor.id"
                                 :options="vendors"
                             />
                         </li>
@@ -39,7 +39,7 @@
                                 id="package_type"
                                 v-model="erm_package.package_type"
                                 label="lib"
-                                :reduce="(av) => av.authorised_value"
+                                :reduce="av => av.authorised_value"
                                 :options="av_package_types"
                             />
                         </li>
@@ -51,14 +51,14 @@
                                 id="package_content_type"
                                 v-model="erm_package.content_type"
                                 label="lib"
-                                :reduce="(av) => av.authorised_value"
+                                :reduce="av => av.authorised_value"
                                 :options="av_package_content_types"
                             />
                         </li>
                         <li>
-                            <label for="package_notes">{{
-                                $__("Notes")
-                            }}:</label>
+                            <label for="package_notes"
+                                >{{ $__("Notes") }}:</label
+                            >
                             <textarea
                                 id="package_notes"
                                 v-model="erm_package.notes"
@@ -85,21 +85,19 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import EHoldingsPackageAgreements from "./EHoldingsLocalPackageAgreements.vue"
 import { setMessage, setError, setWarning } from "../../messages"
-import { fetchLocalPackage, createPackage, editPackage } from '../../fetch'
+import { fetchLocalPackage, createPackage, editPackage } from "../../fetch"
 import { storeToRefs } from "pinia"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
-        const AVStore = inject('AVStore')
-        const {
-            av_package_types,
-            av_package_content_types,
-        } = storeToRefs(AVStore)
+        const AVStore = inject("AVStore")
+        const { av_package_types, av_package_content_types } =
+            storeToRefs(AVStore)
 
         return {
             vendors,
@@ -112,11 +110,11 @@ export default {
             erm_package: {
                 package_id: null,
                 vendor_id: null,
-                name: '',
-                external_id: '',
-                package_type: '',
-                content_type: '',
-                notes: '',
+                name: "",
+                external_id: "",
+                package_type: "",
+                content_type: "",
+                notes: "",
                 created_on: null,
                 resources: null,
                 package_agreements: [],
@@ -143,7 +141,9 @@ export default {
             let errors = []
             let package_agreements = erm_package.package_agreements
             const agreement_ids = package_agreements.map(pa => pa.agreement_id)
-            const duplicate_agreement_ids = agreement_ids.filter((id, i) => agreement_ids.indexOf(id) !== i)
+            const duplicate_agreement_ids = agreement_ids.filter(
+                (id, i) => agreement_ids.indexOf(id) !== i
+            )
 
             if (duplicate_agreement_ids.length) {
                 errors.push(this.$__("An agreement is used several times"))
@@ -166,7 +166,9 @@ export default {
             if (erm_package.package_id) {
                 editPackage(erm_package).then(response => {
                     if (response.status == 200) {
-                        this.$router.push("/cgi-bin/koha/erm/eholdings/local/packages")
+                        this.$router.push(
+                            "/cgi-bin/koha/erm/eholdings/local/packages"
+                        )
                         setMessage(this.$__("Package updated"))
                     } else {
                         setError(response.message || response.statusText)
@@ -175,7 +177,9 @@ export default {
             } else {
                 createPackage(erm_package).then(response => {
                     if (response.status == 201) {
-                        this.$router.push("/cgi-bin/koha/erm/eholdings/local/packages")
+                        this.$router.push(
+                            "/cgi-bin/koha/erm/eholdings/local/packages"
+                        )
                         setMessage(this.$__("Package created"))
                     } else {
                         setError(response.message || response.statusText)
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormConfirmDelete.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormConfirmDelete.vue
index 67349cbe07..6f7b43e6e6 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormConfirmDelete.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesFormConfirmDelete.vue
@@ -55,31 +55,32 @@ export default {
         onSubmit(e) {
             e.preventDefault()
 
-            let apiUrl = '/api/v1/erm/eholdings/local/packages/' + this.erm_package.package_id
+            let apiUrl =
+                "/api/v1/erm/eholdings/local/packages/" +
+                this.erm_package.package_id
 
             const options = {
-                method: 'DELETE',
+                method: "DELETE",
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
             fetch(apiUrl, options)
-                .then(
-                    (response) => {
-                        if (response.status == 204) {
-                            setMessage(this.$__("Package deleted"))
-                            this.$router.push("/cgi-bin/koha/erm/eholdings/local/packages")
-                        } else {
-                            setError(response.message || response.statusText)
-                        }
+                .then(response => {
+                    if (response.status == 204) {
+                        setMessage(this.$__("Package deleted"))
+                        this.$router.push(
+                            "/cgi-bin/koha/erm/eholdings/local/packages"
+                        )
+                    } else {
+                        setError(response.message || response.statusText)
                     }
-                ).catch(
-                    (error) => {
-                        setError(error)
-                    }
-                )
-        }
+                })
+                .catch(error => {
+                    setError(error)
+                })
+        },
     },
     name: "EHoldingsLocalPackagesFormConfirmDelete",
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesList.vue
index 13b94c9fdd..a62e20785c 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesList.vue
@@ -15,17 +15,17 @@
 
 <script>
 import Toolbar from "./EHoldingsLocalPackagesToolbar.vue"
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
 import { fetchLocalPackages } from "../../fetch"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
         const table_id = "package_list"
@@ -60,13 +60,20 @@ export default {
             this.initialized = true
         },
         show_package: function (package_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/packages/" + package_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/packages/" + package_id
+            )
         },
         edit_package: function (package_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/packages/edit/" + package_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/packages/edit/" + package_id
+            )
         },
         delete_package: function (package_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/packages/delete/" + package_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/packages/delete/" +
+                    package_id
+            )
         },
         build_datatable: function () {
             let show_package = this.show_package
@@ -77,144 +84,205 @@ export default {
             let filters = this.filters
             let table_id = this.table_id
 
-            window['vendors'] = this.vendors.map(e => {
-                e['_id'] = e['id']
-                e['_str'] = e['name']
+            window["vendors"] = this.vendors.map(e => {
+                e["_id"] = e["id"]
+                e["_str"] = e["name"]
                 return e
             })
-            let avs = ['av_package_types', 'av_package_content_types']
+            let avs = ["av_package_types", "av_package_content_types"]
             avs.forEach(function (av_cat) {
                 window[av_cat] = map_av_dt_filter(av_cat)
             })
 
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    url: "/api/v1/erm/eholdings/local/packages",
-                },
-                embed: ['resources+count', 'vendor.name'],
-                order: [[0, "asc"]],
-                autoWidth: false,
-                searchCols: [
-                    { search: filters.package_name },
-                    null,
-                    null,
-                    { search: filters.content_type },
-                    null,
-                    null,
-                ],
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "me.package_id:me.name",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url: "/api/v1/erm/eholdings/local/packages",
                     },
-                    {
-                        title: __("Vendor"),
-                        data: "vendor_id",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return row.vendor ? escape_str(row.vendor.name) : ""
+                    embed: ["resources+count", "vendor.name"],
+                    order: [[0, "asc"]],
+                    autoWidth: false,
+                    searchCols: [
+                        { search: filters.package_name },
+                        null,
+                        null,
+                        { search: filters.content_type },
+                        null,
+                        null,
+                    ],
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "me.package_id:me.name",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
                         },
-                    },
-                    {
-                        title: __("Type"),
-                        data: "package_type",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_package_types", row.package_type))
-                        }
-                    }, {
-                        title: __("Content type"),
-                        data: "content_type",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_package_content_types", row.content_type))
-                        }
-                    },
-                    {
-                        title: __("Created on"),
-                        data: "created_on",
-                        searchable: false,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return $date(row.created_on)
-                        }
-                    },
-                    {
-                        title: __("Notes"),
-                        data: "notes",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return row.notes;
-                        }
-                    },
-                    {
-                        title: __("Actions"),
-                        data: function (row, type, val, meta) {
-                            return '<div class="actions"></div>'
+                        {
+                            title: __("Vendor"),
+                            data: "vendor_id",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return row.vendor
+                                    ? escape_str(row.vendor.name)
+                                    : ""
+                            },
+                        },
+                        {
+                            title: __("Type"),
+                            data: "package_type",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_package_types",
+                                        row.package_type
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Content type"),
+                            data: "content_type",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_package_content_types",
+                                        row.content_type
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Created on"),
+                            data: "created_on",
+                            searchable: false,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return $date(row.created_on)
+                            },
+                        },
+                        {
+                            title: __("Notes"),
+                            data: "notes",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return row.notes
+                            },
                         },
-                        className: "actions noExport",
-                        searchable: false,
-                        orderable: false
-                    }
-                ],
-                drawCallback: function (settings) {
+                        {
+                            title: __("Actions"),
+                            data: function (row, type, val, meta) {
+                                return '<div class="actions"></div>'
+                            },
+                            className: "actions noExport",
+                            searchable: false,
+                            orderable: false,
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        $.each(
+                            $(this).find("td .actions"),
+                            function (index, e) {
+                                let tr = $(this).parent().parent()
+                                let package_id = api.row(tr).data().package_id
+                                let editButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            edit_package(package_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-pencil",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Edit"),
+                                    ]
+                                )
 
-                    $.each($(this).find("td .actions"), function (index, e) {
-                        let tr = $(this).parent().parent()
-                        let package_id = api.row(tr).data().package_id
-                        let editButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                edit_package(package_id)
-                            }
-                        },
-                            [createVNode("i", { class: "fa fa-pencil", 'aria-hidden': "true" }), __("Edit")])
+                                let deleteButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            delete_package(package_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-trash",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Delete"),
+                                    ]
+                                )
 
-                        let deleteButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                delete_package(package_id)
+                                let n = createVNode("span", {}, [
+                                    editButton,
+                                    " ",
+                                    deleteButton,
+                                ])
+                                render(n, e)
                             }
-                        },
-                            [createVNode("i", { class: "fa fa-trash", 'aria-hidden': "true" }), __("Delete")])
-
-                        let n = createVNode('span', {}, [editButton, " ", deleteButton])
-                        render(n, e)
-                    })
+                        )
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/local/packages/" + row.package_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_package(row.package_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/local/packages/" +
+                                            row.package_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_package(row.package_id)
+                                        },
+                                    },
+                                    `${row.name} (#${row.package_id})`
+                                )
+                                render(n, e)
                             }
-                        },
-                            `${row.name} (#${row.package_id})`
                         )
-                        render(n, e)
-                    })
+                    },
+                    preDrawCallback: function (settings) {
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(1)
+                            .attr("data-filter", "vendors")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(2)
+                            .attr("data-filter", "av_package_types")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(3)
+                            .attr("data-filter", "av_package_content_types")
+                    },
                 },
-                preDrawCallback: function (settings) {
-                    $("#" + table_id).find("thead th").eq(1).attr('data-filter', 'vendors')
-                    $("#" + table_id).find("thead th").eq(2).attr('data-filter', 'av_package_types')
-                    $("#" + table_id).find("thead th").eq(3).attr('data-filter', 'av_package_content_types')
-                }
-            }, eholdings_packages_table_settings, 1)
+                eholdings_packages_table_settings,
+                1
+            )
         },
     },
     components: { Toolbar },
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesShow.vue
index 8efddffba8..1f22509533 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesShow.vue
@@ -104,7 +104,7 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import EHoldingsPackageTitlesList from "./EHoldingsLocalPackageTitlesList.vue"
 import { fetchLocalPackage } from "../../fetch"
 
@@ -112,7 +112,7 @@ export default {
     setup() {
         const format_date = $date
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
         return {
@@ -125,10 +125,10 @@ export default {
             erm_package: {
                 package_id: null,
                 vendor_id: null,
-                name: '',
-                external_id: '',
-                package_type: '',
-                content_type: '',
+                name: "",
+                external_id: "",
+                package_type: "",
+                content_type: "",
                 created_on: null,
                 resources: null,
                 package_agreements: [],
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalResourcesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalResourcesShow.vue
index bb3798cb12..6f2cc09e03 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalResourcesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalResourcesShow.vue
@@ -95,14 +95,14 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import { fetchLocalResource } from "../../fetch"
 import { storeToRefs } from "pinia"
 export default {
     setup() {
         const format_date = $date
 
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
         return {
             format_date,
@@ -115,9 +115,9 @@ export default {
                 resource_id: null,
                 title_id: null,
                 package_id: null,
-                started_on: '',
-                ended_on: '',
-                proxy: '',
+                started_on: "",
+                ended_on: "",
+                proxy: "",
                 title: {},
                 package: {},
             },
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlePackagesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlePackagesList.vue
index d5cdc175aa..85646aa2a4 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlePackagesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlePackagesList.vue
@@ -5,8 +5,7 @@
 </template>
 
 <script>
-
-import { createVNode, render } from 'vue'
+import { createVNode, render } from "vue"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
@@ -19,58 +18,67 @@ export default {
         }
     },
     data() {
-        return {
-        }
+        return {}
     },
     methods: {
         show_resource: function (resource_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/resources/" + resource_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/resources/" + resource_id
+            )
         },
         build_datatable: function () {
             let show_resource = this.show_resource
             let resources = this.resources
             let table_id = this.table_id
 
-            $('#' + table_id).dataTable($.extend(true, {}, dataTablesDefaults, {
-                data: resources,
-                embed: ['package.name'],
-                order: [[0, "asc"]],
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "package.name",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
+            $("#" + table_id).dataTable(
+                $.extend(true, {}, dataTablesDefaults, {
+                    data: resources,
+                    embed: ["package.name"],
+                    order: [[0, "asc"]],
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "package.name",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                            width: "100%",
                         },
-                        width: '100%',
-                    },
-                ],
-                drawCallback: function (settings) {
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
-
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/local/resources/" + row.resource_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_resource(row.resource_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/local/resources/" +
+                                            row.resource_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_resource(row.resource_id)
+                                        },
+                                    },
+                                    `${row.package.name}`
+                                )
+                                render(n, e)
                             }
-                        },
-                            `${row.package.name}`
                         )
-                        render(n, e)
-                    })
-                },
-            }))
+                    },
+                })
+            )
         },
     },
     mounted() {
@@ -79,7 +87,7 @@ export default {
     props: {
         resources: Array,
     },
-    name: 'EHoldingsLocalTitlePackagesList',
+    name: "EHoldingsLocalTitlePackagesList",
 }
 </script>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAdd.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAdd.vue
index 29c684874f..ca3585b2cb 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAdd.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAdd.vue
@@ -103,7 +103,9 @@
                                 id="title_num_first_issue_online"
                                 v-model="title.num_first_issue_online"
                                 :placeholder="
-                                    $__('Number of first issue available online')
+                                    $__(
+                                        'Number of first issue available online'
+                                    )
                                 "
                             />
                         </li>
@@ -135,7 +137,9 @@
                                 id="title_num_last_vol_online"
                                 v-model="title.num_last_vol_online"
                                 :placeholder="
-                                    $__('Number of last volume available online')
+                                    $__(
+                                        'Number of last volume available online'
+                                    )
                                 "
                             />
                         </li>
@@ -143,7 +147,9 @@
                         <li>
                             <label for="title_num_last_issue_online"
                                 >{{
-                                    $__("Number of last issue available online")
+                                    $__(
+                                        "Number of last issue available online"
+                                    )
                                 }}:</label
                             >
                             <input
@@ -227,7 +233,7 @@
                                 id="title_publication_type"
                                 v-model="title.publication_type"
                                 label="lib"
-                                :reduce="(av) => av.authorised_value"
+                                :reduce="av => av.authorised_value"
                                 :options="av_title_publication_types"
                             />
                         </li>
@@ -379,18 +385,18 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import EHoldingsTitlesFormAddResources from "./EHoldingsLocalTitlesFormAddResources.vue"
 import { setMessage, setError, setWarning } from "../../messages"
-import { fetchLocalTitle } from '../../fetch'
+import { fetchLocalTitle } from "../../fetch"
 import { storeToRefs } from "pinia"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { av_title_publication_types } = storeToRefs(AVStore)
         const { get_lib_from_av } = AVStore
 
@@ -404,31 +410,31 @@ export default {
         return {
             title: {
                 title_id: null,
-                publication_title: '',
-                external_id: '',
-                print_identifier: '',
-                online_identifier: '',
-                date_first_issue_online: '',
-                num_first_vol_online: '',
-                num_first_issue_online: '',
-                date_last_issue_online: '',
-                num_last_vol_online: '',
-                num_last_issue_online: '',
-                title_url: '',
-                first_author: '',
-                embargo_info: '',
-                coverage_depth: '',
-                notes: '',
-                publisher_name: '',
-                publication_type: '',
-                date_monograph_published_print: '',
-                date_monograph_published_online: '',
-                monograph_volume: '',
-                monograph_edition: '',
-                first_editor: '',
-                parent_publication_title_id: '',
-                preceeding_publication_title_id: '',
-                access_type: '',
+                publication_title: "",
+                external_id: "",
+                print_identifier: "",
+                online_identifier: "",
+                date_first_issue_online: "",
+                num_first_vol_online: "",
+                num_first_issue_online: "",
+                date_last_issue_online: "",
+                num_last_vol_online: "",
+                num_last_issue_online: "",
+                title_url: "",
+                first_author: "",
+                embargo_info: "",
+                coverage_depth: "",
+                notes: "",
+                publisher_name: "",
+                publication_type: "",
+                date_monograph_published_print: "",
+                date_monograph_published_online: "",
+                monograph_volume: "",
+                monograph_edition: "",
+                first_editor: "",
+                parent_publication_title_id: "",
+                preceeding_publication_title_id: "",
+                access_type: "",
                 resources: [],
             },
             initialized: false,
@@ -454,7 +460,9 @@ export default {
 
             let resources = title.resources
             const package_ids = resources.map(al => al.package_id)
-            const duplicate_package_ids = package_ids.filter((id, i) => package_ids.indexOf(id) !== i)
+            const duplicate_package_ids = package_ids.filter(
+                (id, i) => package_ids.indexOf(id) !== i
+            )
 
             if (duplicate_package_ids.length) {
                 errors.push(this.$__("A package is used several times"))
@@ -473,41 +481,54 @@ export default {
             if (!this.checkForm(title)) {
                 return false
             }
-            let apiUrl = '/api/v1/erm/eholdings/local/titles'
+            let apiUrl = "/api/v1/erm/eholdings/local/titles"
 
-            let method = 'POST'
+            let method = "POST"
             if (title.title_id) {
-                method = 'PUT'
-                apiUrl += '/' + title.title_id
+                method = "PUT"
+                apiUrl += "/" + title.title_id
             }
             delete title.title_id
             delete title.biblio_id
 
             // Cannot use the map/keepAttrs because of the reserved keywork 'package'
-            title.resources.forEach(function (e) { delete e.package; delete e.resource_id })
+            title.resources.forEach(function (e) {
+                delete e.package
+                delete e.resource_id
+            })
 
             const options = {
                 method: method,
                 body: JSON.stringify(title),
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
             fetch(apiUrl, options)
-                .then(response => {
-                    if (response.status == 200) {
-                        this.$router.push("/cgi-bin/koha/erm/eholdings/local/titles")
-                        setMessage(this.$__("Title updated"))
-                    } else if (response.status == 201) {
-                        this.$router.push("/cgi-bin/koha/erm/eholdings/local/titles")
-                        setMessage(this.$__("Title created"))
-                    } else {
-                        setError(response.message || response.statusText)
+                .then(
+                    response => {
+                        if (response.status == 200) {
+                            this.$router.push(
+                                "/cgi-bin/koha/erm/eholdings/local/titles"
+                            )
+                            setMessage(this.$__("Title updated"))
+                        } else if (response.status == 201) {
+                            this.$router.push(
+                                "/cgi-bin/koha/erm/eholdings/local/titles"
+                            )
+                            setMessage(this.$__("Title created"))
+                        } else {
+                            setError(response.message || response.statusText)
+                        }
+                    },
+                    error => {
+                        setError(error)
                     }
-                }, (error) => {
-                    setError(error)
-                }).catch(e => { console.log(e) })
+                )
+                .catch(e => {
+                    console.log(e)
+                })
         },
     },
     components: { EHoldingsTitlesFormAddResources },
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAddResources.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAddResources.vue
index 0550308ce3..a4d954baa1 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAddResources.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormAddResources.vue
@@ -25,7 +25,7 @@
                         :id="`resource_package_id_${counter}`"
                         v-model="resource.package_id"
                         label="name"
-                        :reduce="(p) => parseInt(p.package_id)"
+                        :reduce="p => parseInt(p.package_id)"
                         :options="packages"
                     >
                         <template #search="{ attributes, events }">
@@ -47,7 +47,7 @@
                         :id="`resource_vendor_id_${counter}`"
                         v-model="resource.vendor_id"
                         label="name"
-                        :reduce="(vendor) => vendor.id"
+                        :reduce="vendor => vendor.id"
                         :options="vendors"
                     />
                 </li>
@@ -92,14 +92,14 @@
 </template>
 
 <script>
-import { inject } from 'vue'
-import flatPickr from 'vue-flatpickr-component'
+import { inject } from "vue"
+import flatPickr from "vue-flatpickr-component"
 import { storeToRefs } from "pinia"
 import { fetchLocalPackages } from "../../fetch"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
         return { vendors }
     },
@@ -110,7 +110,7 @@ export default {
         }
     },
     beforeCreate() {
-        fetchLocalPackages().then((packages) => this.packages = packages)
+        fetchLocalPackages().then(packages => (this.packages = packages))
     },
     methods: {
         addPackage() {
@@ -119,7 +119,7 @@ export default {
                 vendor_id: null,
                 started_on: null,
                 ended_on: null,
-                proxy: '',
+                proxy: "",
             })
         },
         deletePackage(counter) {
@@ -130,6 +130,6 @@ export default {
         resources: Array,
     },
     components: { flatPickr },
-    name: 'EHoldingsLocalTitlesFormAddResources',
+    name: "EHoldingsLocalTitlesFormAddResources",
 }
 </script>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormConfirmDelete.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormConfirmDelete.vue
index f8eea2a6c4..3981fdfa13 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormConfirmDelete.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormConfirmDelete.vue
@@ -55,31 +55,31 @@ export default {
         onSubmit(e) {
             e.preventDefault()
 
-            let apiUrl = '/api/v1/erm/eholdings/local/titles/' + this.eholding.title_id
+            let apiUrl =
+                "/api/v1/erm/eholdings/local/titles/" + this.eholding.title_id
 
             const options = {
-                method: 'DELETE',
+                method: "DELETE",
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
             fetch(apiUrl, options)
-                .then(
-                    (response) => {
-                        if (response.status == 204) {
-                            setMessage(this.$__("Title deleted"))
-                            this.$router.push("/cgi-bin/koha/erm/eholdings/local/titles")
-                        } else {
-                            setError(response.message || response.statusText)
-                        }
+                .then(response => {
+                    if (response.status == 204) {
+                        setMessage(this.$__("Title deleted"))
+                        this.$router.push(
+                            "/cgi-bin/koha/erm/eholdings/local/titles"
+                        )
+                    } else {
+                        setError(response.message || response.statusText)
                     }
-                ).catch(
-                    (error) => {
-                        setError(error)
-                    }
-                )
-        }
+                })
+                .catch(error => {
+                    setError(error)
+                })
+        },
     },
     name: "EHoldingsLocalTitlesFormConfirmDelete",
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormImport.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormImport.vue
index fd827a6e88..8ff87af18b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormImport.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesFormImport.vue
@@ -11,7 +11,7 @@
         <v-select
             v-model="package_id"
             label="name"
-            :reduce="(p) => p.package_id"
+            :reduce="p => p.package_id"
             :options="packages"
             :clearable="false"
         >
@@ -24,9 +24,9 @@
 
 <script>
 import { setMessage, setError, setWarning } from "../../messages"
-import { createVNode, render } from 'vue'
+import { createVNode, render } from "vue"
 import { useDataTable } from "../../composables/datatables"
-import { checkError, fetchLocalPackages } from '../../fetch.js'
+import { checkError, fetchLocalPackages } from "../../fetch.js"
 
 export default {
     setup() {
@@ -46,7 +46,7 @@ export default {
         }
     },
     beforeCreate() {
-        fetchLocalPackages().then((packages) => {
+        fetchLocalPackages().then(packages => {
             this.packages = packages
             if (this.packages.length) {
                 this.package_id = packages[0].package_id
@@ -60,20 +60,20 @@ export default {
                 return
             }
             if (!list_id) return
-            await fetch('/api/v1/erm/eholdings/local/titles/import', {
+            await fetch("/api/v1/erm/eholdings/local/titles/import", {
                 method: "POST",
                 body: JSON.stringify({ list_id, package_id: this.package_id }),
                 headers: {
-                    'Accept': 'application/json',
-                    'Content-Type': 'application/json'
+                    Accept: "application/json",
+                    "Content-Type": "application/json",
                 },
             })
                 .then(checkError)
                 .then(
-                    (result) => {
+                    result => {
                         this.job_id = result.job_id
                     },
-                    (error) => {
+                    error => {
                         setError(error)
                     }
                 )
@@ -82,50 +82,70 @@ export default {
             let lists = this.logged_in_user_lists
             let table_id = this.table_id
             let import_from_list = this.import_from_list
-            $('#' + table_id).dataTable($.extend(true, {}, dataTablesDefaults, {
-                data: lists,
-                order: [[0, "asc"]],
-                autoWidth: false,
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "shelfname",
-                        searchable: true,
-                        orderable: true,
-                        width: '100%',
-                        render: function (data, type, row, meta) {
-                            return row.shelfname + ' (#' + row.shelfnumber + ')'
-                        }
-                    },
-                    {
-                        title: __("Actions"),
-                        data: function (row, type, val, meta) {
-                            return '<div class="actions"></div>'
+            $("#" + table_id).dataTable(
+                $.extend(true, {}, dataTablesDefaults, {
+                    data: lists,
+                    order: [[0, "asc"]],
+                    autoWidth: false,
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "shelfname",
+                            searchable: true,
+                            orderable: true,
+                            width: "100%",
+                            render: function (data, type, row, meta) {
+                                return (
+                                    row.shelfname +
+                                    " (#" +
+                                    row.shelfnumber +
+                                    ")"
+                                )
+                            },
                         },
-                        className: "actions noExport",
-                        searchable: false,
-                        orderable: false
-                    }
-                ],
-                drawCallback: function (settings) {
+                        {
+                            title: __("Actions"),
+                            data: function (row, type, val, meta) {
+                                return '<div class="actions"></div>'
+                            },
+                            className: "actions noExport",
+                            searchable: false,
+                            orderable: false,
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        $.each(
+                            $(this).find("td .actions"),
+                            function (index, e) {
+                                let tr = $(this).parent().parent()
+                                let list_id = api.row(tr).data().shelfnumber
+                                let importButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            import_from_list(list_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-download",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Import"),
+                                    ]
+                                )
 
-                    $.each($(this).find("td .actions"), function (index, e) {
-                        let tr = $(this).parent().parent()
-                        let list_id = api.row(tr).data().shelfnumber
-                        let importButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                import_from_list(list_id)
+                                let n = createVNode("span", {}, [importButton])
+                                render(n, e)
                             }
-                        },
-                            [createVNode("i", { class: "fa fa-download", 'aria-hidden': "true" }), __("Import")])
-
-                        let n = createVNode('span', {}, [importButton])
-                        render(n, e)
-                    })
-                }
-            }))
+                        )
+                    },
+                })
+            )
         },
     },
     mounted() {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesList.vue
index ca9d5054b2..201fd6eb61 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesList.vue
@@ -15,14 +15,14 @@
 
 <script>
 import Toolbar from "./EHoldingsLocalTitlesToolbar.vue"
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
 import { fetchLocalTitles } from "../../fetch"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
     setup() {
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { av_title_publication_types } = storeToRefs(AVStore)
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
@@ -59,13 +59,19 @@ export default {
             this.initialized = true
         },
         show_title: function (title_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/titles/" + title_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/titles/" + title_id
+            )
         },
         edit_title: function (title_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/titles/edit/" + title_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/titles/edit/" + title_id
+            )
         },
         delete_title: function (title_id) {
-            this.$router.push("/cgi-bin/koha/erm/eholdings/local/titles/delete/" + title_id)
+            this.$router.push(
+                "/cgi-bin/koha/erm/eholdings/local/titles/delete/" + title_id
+            )
         },
         build_datatable: function () {
             let show_title = this.show_title
@@ -76,118 +82,187 @@ export default {
             let filters = this.filters
             let table_id = this.table_id
 
-            window['av_title_publication_types'] = map_av_dt_filter('av_title_publication_types')
+            window["av_title_publication_types"] = map_av_dt_filter(
+                "av_title_publication_types"
+            )
 
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    url: "/api/v1/erm/eholdings/local/titles",
-                },
-                embed: ["resources.package"],
-                order: [[0, "asc"]],
-                autoWidth: false,
-                searchCols: [
-                    { search: filters.publication_title },
-                    null,
-                    { search: filters.publication_type },
-                    null,
-                ],
-                columns: [
-                    {
-                        title: __("Title"),
-                        data: "me.publication_title",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
-                    },
-                    {
-                        title: __("Contributors"),
-                        data: "first_author:first_editor",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(row.first_author) + (row.first_author && row.first_editor ? "<br/>" : "") + escape_str(row.first_editor)
-                        }
-                    },
-                    {
-                        title: __("Publication type"),
-                        data: "publication_type",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_title_publication_types", row.publication_type))
-                        }
-                    },
-                    {
-                        title: __("Identifier"),
-                        data: "print_identifier:online_identifier",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            let print_identifier = row.print_identifier
-                            let online_identifier = row.online_identifier
-                            return (print_identifier ? escape_str(_("ISBN (Print): %s").format(print_identifier)) : "") +
-                                (online_identifier ? escape_str(_("ISBN (Online): %s").format(online_identifier)) : "")
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url: "/api/v1/erm/eholdings/local/titles",
                     },
-                    {
-                        title: __("Actions"),
-                        data: function (row, type, val, meta) {
-                            return '<div class="actions"></div>'
+                    embed: ["resources.package"],
+                    order: [[0, "asc"]],
+                    autoWidth: false,
+                    searchCols: [
+                        { search: filters.publication_title },
+                        null,
+                        { search: filters.publication_type },
+                        null,
+                    ],
+                    columns: [
+                        {
+                            title: __("Title"),
+                            data: "me.publication_title",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                        },
+                        {
+                            title: __("Contributors"),
+                            data: "first_author:first_editor",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return (
+                                    escape_str(row.first_author) +
+                                    (row.first_author && row.first_editor
+                                        ? "<br/>"
+                                        : "") +
+                                    escape_str(row.first_editor)
+                                )
+                            },
+                        },
+                        {
+                            title: __("Publication type"),
+                            data: "publication_type",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_title_publication_types",
+                                        row.publication_type
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Identifier"),
+                            data: "print_identifier:online_identifier",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                let print_identifier = row.print_identifier
+                                let online_identifier = row.online_identifier
+                                return (
+                                    (print_identifier
+                                        ? escape_str(
+                                              _("ISBN (Print): %s").format(
+                                                  print_identifier
+                                              )
+                                          )
+                                        : "") +
+                                    (online_identifier
+                                        ? escape_str(
+                                              _("ISBN (Online): %s").format(
+                                                  online_identifier
+                                              )
+                                          )
+                                        : "")
+                                )
+                            },
+                        },
+                        {
+                            title: __("Actions"),
+                            data: function (row, type, val, meta) {
+                                return '<div class="actions"></div>'
+                            },
+                            className: "actions noExport",
+                            searchable: false,
+                            orderable: false,
                         },
-                        className: "actions noExport",
-                        searchable: false,
-                        orderable: false
-                    }
-                ],
-                drawCallback: function (settings) {
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        $.each(
+                            $(this).find("td .actions"),
+                            function (index, e) {
+                                let tr = $(this).parent().parent()
+                                let title_id = api.row(tr).data().title_id
+                                let editButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            edit_title(title_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-pencil",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Edit"),
+                                    ]
+                                )
 
-                    $.each($(this).find("td .actions"), function (index, e) {
-                        let tr = $(this).parent().parent()
-                        let title_id = api.row(tr).data().title_id
-                        let editButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                edit_title(title_id)
-                            }
-                        },
-                            [createVNode("i", { class: "fa fa-pencil", 'aria-hidden': "true" }), __("Edit")])
+                                let deleteButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            delete_title(title_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-trash",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Delete"),
+                                    ]
+                                )
 
-                        let deleteButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                delete_title(title_id)
+                                let n = createVNode("span", {}, [
+                                    editButton,
+                                    " ",
+                                    deleteButton,
+                                ])
+                                render(n, e)
                             }
-                        },
-                            [createVNode("i", { class: "fa fa-trash", 'aria-hidden': "true" }), __("Delete")])
-
-                        let n = createVNode('span', {}, [editButton, " ", deleteButton])
-                        render(n, e)
-                    })
+                        )
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            href: "/cgi-bin/koha/erm/eholdings/local/titles/" + row.title_id,
-                            onClick: (e) => {
-                                e.preventDefault()
-                                show_title(row.title_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        href:
+                                            "/cgi-bin/koha/erm/eholdings/local/titles/" +
+                                            row.title_id,
+                                        onClick: e => {
+                                            e.preventDefault()
+                                            show_title(row.title_id)
+                                        },
+                                    },
+                                    `${row.publication_title} (#${row.title_id})`
+                                )
+                                render(n, e)
                             }
-                        },
-                            `${row.publication_title} (#${row.title_id})`
                         )
-                        render(n, e)
-                    })
+                    },
+                    preDrawCallback: function (settings) {
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(2)
+                            .attr("data-filter", "av_title_publication_types")
+                    },
                 },
-                preDrawCallback: function (settings) {
-                    $("#" + table_id).find("thead th").eq(2).attr('data-filter', 'av_title_publication_types')
-                }
-            }, eholdings_titles_table_settings, 1)
+                eholdings_titles_table_settings,
+                1
+            )
         },
     },
     components: { Toolbar },
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesShow.vue
index cc452ca411..4d705a62c7 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesShow.vue
@@ -1,6 +1,6 @@
 <template>
     <div v-if="!initialized">{{ $__("Loading") }}</div>
-    <div v-else-if=title id="eholdings_title_show">
+    <div v-else-if="title" id="eholdings_title_show">
         <h2>
             {{ $__("Title #%s").format(title.title_id) }}
             <span class="action_links">
@@ -256,12 +256,12 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import EHoldingsTitlePackagesList from "./EHoldingsLocalTitlePackagesList.vue"
 import { fetchLocalTitle } from "../../fetch"
 export default {
     setup() {
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
         return {
@@ -272,31 +272,31 @@ export default {
         return {
             title: {
                 title_id: null,
-                publication_title: '',
-                external_id: '',
-                print_identifier: '',
-                online_identifier: '',
-                date_first_issue_online: '',
-                num_first_vol_online: '',
-                num_first_issue_online: '',
-                date_last_issue_online: '',
-                num_last_vol_online: '',
-                num_last_issue_online: '',
-                title_url: '',
-                first_author: '',
-                embargo_info: '',
-                coverage_depth: '',
-                notes: '',
-                publisher_name: '',
-                publication_type: '',
-                date_monograph_published_print: '',
-                date_monograph_published_online: '',
-                monograph_volume: '',
-                monograph_edition: '',
-                first_editor: '',
-                parent_publication_title_id: '',
-                preceeding_publication_title_id: '',
-                access_type: '',
+                publication_title: "",
+                external_id: "",
+                print_identifier: "",
+                online_identifier: "",
+                date_first_issue_online: "",
+                num_first_vol_online: "",
+                num_first_issue_online: "",
+                date_last_issue_online: "",
+                num_last_vol_online: "",
+                num_last_issue_online: "",
+                title_url: "",
+                first_author: "",
+                embargo_info: "",
+                coverage_depth: "",
+                notes: "",
+                publisher_name: "",
+                publication_type: "",
+                date_monograph_published_print: "",
+                date_monograph_published_online: "",
+                monograph_volume: "",
+                monograph_edition: "",
+                first_editor: "",
+                parent_publication_title_id: "",
+                preceeding_publication_title_id: "",
+                access_type: "",
                 resources: [],
             },
             initialized: false,
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMHome.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMHome.vue
index d091e87770..e924a04a2b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMHome.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMHome.vue
@@ -1,16 +1,11 @@
-<template>
-</template>
+<template></template>
 
 <script>
-
 export default {
     data() {
-        return {
-        }
-    },
-    methods: {
-    },
-    components: {
+        return {}
     },
-};
+    methods: {},
+    components: {},
+}
 </script>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMMain.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMMain.vue
index 9fb8a85a49..65b7c9f5c6 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMMain.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/ERMMain.vue
@@ -78,10 +78,7 @@
                                                             :to="`/cgi-bin/koha/erm/eholdings/${provider}/packages`"
                                                         >
                                                             <i
-                                                                class="
-                                                                    fa
-                                                                    fa-archive
-                                                                "
+                                                                class="fa fa-archive"
                                                             ></i>
                                                             {{
                                                                 $__("Packages")
@@ -93,10 +90,7 @@
                                                             :to="`/cgi-bin/koha/erm/eholdings/${provider}/titles`"
                                                         >
                                                             <i
-                                                                class="
-                                                                    fa
-                                                                    fa-sort-alpha-asc
-                                                                "
+                                                                class="fa fa-sort-alpha-asc"
                                                             ></i>
                                                             {{
                                                                 $__("Titles")
@@ -125,7 +119,7 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import Breadcrumb from "./Breadcrumb.vue"
 import Dialog from "./Dialog.vue"
 import { fetchVendors } from "../../fetch"
@@ -133,7 +127,7 @@ import "vue-select/dist/vue-select.css"
 
 export default {
     setup() {
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         AVStore.av_agreement_statuses = agreement_statuses
         AVStore.av_agreement_closure_reasons = agreement_closure_reasons
         AVStore.av_agreement_renewal_priorities = agreement_renewal_priorities
@@ -146,7 +140,7 @@ export default {
         AVStore.av_package_content_types = package_content_types
         AVStore.av_title_publication_types = title_publication_types
 
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
 
         return {
             vendorStore,
@@ -160,13 +154,13 @@ export default {
         }
     },
     beforeCreate() {
-        fetchVendors().then((vendors) => this.vendorStore.vendors = vendors)
+        fetchVendors().then(vendors => (this.vendorStore.vendors = vendors))
     },
     components: {
         Breadcrumb,
         Dialog,
     },
-};
+}
 </script>
 
 <style>
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormAdd.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormAdd.vue
index 0f24dbf17d..f1c4fc5a34 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormAdd.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormAdd.vue
@@ -32,7 +32,7 @@
                                     id="license_vendor_id"
                                     v-model="license.vendor_id"
                                     label="name"
-                                    :reduce="(vendor) => vendor.id"
+                                    :reduce="vendor => vendor.id"
                                     :options="vendors"
                                 />
                             </li>
@@ -60,7 +60,7 @@
                                     id="license_type"
                                     v-model="license.type"
                                     label="lib"
-                                    :reduce="(av) => av.authorised_value"
+                                    :reduce="av => av.authorised_value"
                                     :options="av_license_types"
                                 >
                                     <template #search="{ attributes, events }">
@@ -83,7 +83,7 @@
                                 <v-select
                                     id="license_status"
                                     v-model="license.status"
-                                    :reduce="(av) => av.authorised_value"
+                                    :reduce="av => av.authorised_value"
                                     :options="av_license_statuses"
                                     label="lib"
                                 >
@@ -140,24 +140,20 @@
 </template>
 
 <script>
-import { inject } from 'vue'
-import flatPickr from 'vue-flatpickr-component'
-import Documents from './Documents.vue'
+import { inject } from "vue"
+import flatPickr from "vue-flatpickr-component"
+import Documents from "./Documents.vue"
 import { setMessage, setError } from "../../messages"
-import { fetchLicense } from '../../fetch'
+import { fetchLicense } from "../../fetch"
 import { storeToRefs } from "pinia"
 
 export default {
-
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
-        const {
-            av_license_types,
-            av_license_statuses,
-        } = storeToRefs(AVStore)
+        const AVStore = inject("AVStore")
+        const { av_license_types, av_license_statuses } = storeToRefs(AVStore)
 
         return {
             vendors,
@@ -170,11 +166,11 @@ export default {
             fp_config: flatpickr_defaults,
             license: {
                 license_id: null,
-                name: '',
+                name: "",
                 vendor_id: null,
-                description: '',
-                type: '',
-                status: '',
+                description: "",
+                type: "",
+                status: "",
                 started_on: undefined,
                 ended_on: undefined,
                 documents: [],
@@ -201,12 +197,12 @@ export default {
             e.preventDefault()
 
             let license = JSON.parse(JSON.stringify(this.license)) // copy
-            let apiUrl = '/api/v1/erm/licenses'
+            let apiUrl = "/api/v1/erm/licenses"
 
-            let method = 'POST'
+            let method = "POST"
             if (license.license_id) {
-                method = 'PUT'
-                apiUrl += '/' + license.license_id
+                method = "PUT"
+                apiUrl += "/" + license.license_id
             }
             delete license.license_id
             delete license.vendor
@@ -215,30 +211,38 @@ export default {
                 license.vendor_id = null
             }
 
-            license.documents = license.documents.map(({ file_type, uploaded_on, ...keepAttrs }) => keepAttrs)
+            license.documents = license.documents.map(
+                ({ file_type, uploaded_on, ...keepAttrs }) => keepAttrs
+            )
 
             const options = {
                 method: method,
                 body: JSON.stringify(license),
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
             fetch(apiUrl, options)
-                .then(response => {
-                    if (response.status == 200) {
-                        this.$router.push("/cgi-bin/koha/erm/licenses")
-                        setMessage(this.$__("License updated"))
-                    } else if (response.status == 201) {
-                        this.$router.push("/cgi-bin/koha/erm/licenses")
-                        setMessage(this.$__("License created"))
-                    } else {
-                        setError(response.message || response.statusText)
+                .then(
+                    response => {
+                        if (response.status == 200) {
+                            this.$router.push("/cgi-bin/koha/erm/licenses")
+                            setMessage(this.$__("License updated"))
+                        } else if (response.status == 201) {
+                            this.$router.push("/cgi-bin/koha/erm/licenses")
+                            setMessage(this.$__("License created"))
+                        } else {
+                            setError(response.message || response.statusText)
+                        }
+                    },
+                    error => {
+                        setError(error)
                     }
-                }, (error) => {
-                    setError(error)
-                }).catch(e => { console.log(e) })
+                )
+                .catch(e => {
+                    console.log(e)
+                })
         },
     },
     components: {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormConfirmDelete.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormConfirmDelete.vue
index 6c820ac564..1de737b10a 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormConfirmDelete.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormConfirmDelete.vue
@@ -60,31 +60,28 @@ export default {
         onSubmit(e) {
             e.preventDefault()
 
-            let apiUrl = '/api/v1/erm/licenses/' + this.license.license_id
+            let apiUrl = "/api/v1/erm/licenses/" + this.license.license_id
 
             const options = {
-                method: 'DELETE',
+                method: "DELETE",
                 headers: {
-                    'Content-Type': 'application/json;charset=utf-8'
+                    "Content-Type": "application/json;charset=utf-8",
                 },
             }
 
             fetch(apiUrl, options)
-                .then(
-                    (response) => {
-                        if (response.status == 204) {
-                            this.$router.push("/cgi-bin/koha/erm/licenses")
-                            setMessage(this.$__("License deleted"))
-                        } else {
-                            setError(response.message || response.statusText)
-                        }
+                .then(response => {
+                    if (response.status == 204) {
+                        this.$router.push("/cgi-bin/koha/erm/licenses")
+                        setMessage(this.$__("License deleted"))
+                    } else {
+                        setError(response.message || response.statusText)
                     }
-                ).catch(
-                    (error) => {
-                        setError(error)
-                    }
-                )
-        }
+                })
+                .catch(error => {
+                    setError(error)
+                })
+        },
     },
     name: "LicensesFormConfirmDelete",
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesList.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesList.vue
index 66a92d8c07..fd7fcd7b06 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesList.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesList.vue
@@ -11,17 +11,17 @@
 
 <script>
 import Toolbar from "./LicensesToolbar.vue"
-import { inject, createVNode, render } from 'vue'
+import { inject, createVNode, render } from "vue"
 import { storeToRefs } from "pinia"
 import { fetchLicenses } from "../../fetch"
 import { useDataTable } from "../../composables/datatables"
 
 export default {
     setup() {
-        const vendorStore = inject('vendorStore')
+        const vendorStore = inject("vendorStore")
         const { vendors } = storeToRefs(vendorStore)
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
         const table_id = "license_list"
@@ -61,7 +61,6 @@ export default {
             this.$router.push("/cgi-bin/koha/erm/licenses/delete/" + license_id)
         },
         build_datatable: function () {
-
             let show_license = this.show_license
             let edit_license = this.edit_license
             let delete_license = this.delete_license
@@ -70,155 +69,216 @@ export default {
             let default_search = this.$route.query.q
             let table_id = this.table_id
 
-            window['vendors'] = this.vendors.map(e => {
-                e['_id'] = e['id']
-                e['_str'] = e['name']
+            window["vendors"] = this.vendors.map(e => {
+                e["_id"] = e["id"]
+                e["_str"] = e["name"]
                 return e
             })
             let vendors_map = this.vendors.reduce((map, e) => {
                 map[e.id] = e
                 return map
             }, {})
-            let avs = ['av_license_types', 'av_license_statuses']
+            let avs = ["av_license_types", "av_license_statuses"]
             avs.forEach(function (av_cat) {
                 window[av_cat] = map_av_dt_filter(av_cat)
             })
 
-            $('#' + table_id).kohaTable({
-                ajax: {
-                    "url": "/api/v1/erm/licenses",
-                },
-                order: [[0, "asc"]],
-                search: { search: default_search },
-                columnDefs: [{
-                    targets: [0, 1],
-                    render: function (data, type, row, meta) {
-                        if (type == 'display') {
-                            return escape_str(data)
-                        }
-                        return data
-                    }
-                }],
-                columns: [
-                    {
-                        title: __("Name"),
-                        data: "me.license_id:me.name",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            // Rendering done in drawCallback
-                            return ""
-                        }
-                    },
-                    {
-                        title: __("Vendor"),
-                        data: "vendor_id",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return row.vendor_id != undefined ? escape_str(vendors_map[row.vendor_id].name) : ""
-                        }
+            $("#" + table_id).kohaTable(
+                {
+                    ajax: {
+                        url: "/api/v1/erm/licenses",
                     },
+                    order: [[0, "asc"]],
+                    search: { search: default_search },
+                    columnDefs: [
+                        {
+                            targets: [0, 1],
+                            render: function (data, type, row, meta) {
+                                if (type == "display") {
+                                    return escape_str(data)
+                                }
+                                return data
+                            },
+                        },
+                    ],
+                    columns: [
+                        {
+                            title: __("Name"),
+                            data: "me.license_id:me.name",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                // Rendering done in drawCallback
+                                return ""
+                            },
+                        },
+                        {
+                            title: __("Vendor"),
+                            data: "vendor_id",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return row.vendor_id != undefined
+                                    ? escape_str(
+                                          vendors_map[row.vendor_id].name
+                                      )
+                                    : ""
+                            },
+                        },
 
-                    {
-                        title: __("Description"),
-                        data: "description",
-                        searchable: true,
-                        orderable: true
-                    },
-                    {
-                        title: __("Type"),
-                        data: "type",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_license_types", row.type))
-                        }
-                    },
-                    {
-                        title: __("Status"),
-                        data: "status",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return escape_str(get_lib_from_av("av_license_statuses", row.status))
-                        }
-                    },
-                    {
-                        title: __("Started on"),
-                        data: "started_on",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return $date(row.started_on)
-                        }
-                    },
-                    {
-                        title: __("Ended on"),
-                        data: "ended_on",
-                        searchable: true,
-                        orderable: true,
-                        render: function (data, type, row, meta) {
-                            return $date(row.ended_on)
-                        }
-                    },
-                    {
-                        title: __("Actions"),
-                        data: function (row, type, val, meta) {
-                            return '<div class="actions"></div>'
+                        {
+                            title: __("Description"),
+                            data: "description",
+                            searchable: true,
+                            orderable: true,
+                        },
+                        {
+                            title: __("Type"),
+                            data: "type",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_license_types",
+                                        row.type
+                                    )
+                                )
+                            },
+                        },
+                        {
+                            title: __("Status"),
+                            data: "status",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return escape_str(
+                                    get_lib_from_av(
+                                        "av_license_statuses",
+                                        row.status
+                                    )
+                                )
+                            },
                         },
-                        className: "actions noExport",
-                        searchable: false,
-                        orderable: false
-                    }
-                ],
-                drawCallback: function (settings) {
+                        {
+                            title: __("Started on"),
+                            data: "started_on",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return $date(row.started_on)
+                            },
+                        },
+                        {
+                            title: __("Ended on"),
+                            data: "ended_on",
+                            searchable: true,
+                            orderable: true,
+                            render: function (data, type, row, meta) {
+                                return $date(row.ended_on)
+                            },
+                        },
+                        {
+                            title: __("Actions"),
+                            data: function (row, type, val, meta) {
+                                return '<div class="actions"></div>'
+                            },
+                            className: "actions noExport",
+                            searchable: false,
+                            orderable: false,
+                        },
+                    ],
+                    drawCallback: function (settings) {
+                        var api = new $.fn.dataTable.Api(settings)
 
-                    var api = new $.fn.dataTable.Api(settings)
+                        $.each(
+                            $(this).find("td .actions"),
+                            function (index, e) {
+                                let tr = $(this).parent().parent()
+                                let license_id = api.row(tr).data().license_id
+                                let editButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            edit_license(license_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-pencil",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Edit"),
+                                    ]
+                                )
 
-                    $.each($(this).find("td .actions"), function (index, e) {
-                        let tr = $(this).parent().parent()
-                        let license_id = api.row(tr).data().license_id
-                        let editButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                edit_license(license_id)
-                            }
-                        },
-                            [createVNode("i", { class: "fa fa-pencil", 'aria-hidden': "true" }), __("Edit")])
+                                let deleteButton = createVNode(
+                                    "a",
+                                    {
+                                        class: "btn btn-default btn-xs",
+                                        role: "button",
+                                        onClick: () => {
+                                            delete_license(license_id)
+                                        },
+                                    },
+                                    [
+                                        createVNode("i", {
+                                            class: "fa fa-trash",
+                                            "aria-hidden": "true",
+                                        }),
+                                        __("Delete"),
+                                    ]
+                                )
 
-                        let deleteButton = createVNode("a", {
-                            class: "btn btn-default btn-xs", role: "button", onClick: () => {
-                                delete_license(license_id)
+                                let n = createVNode("span", {}, [
+                                    editButton,
+                                    " ",
+                                    deleteButton,
+                                ])
+                                render(n, e)
                             }
-                        },
-                            [createVNode("i", { class: "fa fa-trash", 'aria-hidden': "true" }), __("Delete")])
-
-                        let n = createVNode('span', {}, [editButton, " ", deleteButton])
-                        render(n, e)
-                    })
+                        )
 
-                    $.each($(this).find("tbody tr td:first-child"), function (index, e) {
-                        let tr = $(this).parent()
-                        let row = api.row(tr).data()
-                        if (!row) return // Happen if the table is empty
-                        let n = createVNode("a", {
-                            role: "button",
-                            onClick: () => {
-                                show_license(row.license_id)
+                        $.each(
+                            $(this).find("tbody tr td:first-child"),
+                            function (index, e) {
+                                let tr = $(this).parent()
+                                let row = api.row(tr).data()
+                                if (!row) return // Happen if the table is empty
+                                let n = createVNode(
+                                    "a",
+                                    {
+                                        role: "button",
+                                        onClick: () => {
+                                            show_license(row.license_id)
+                                        },
+                                    },
+                                    `${row.name} (#${row.license_id})`
+                                )
+                                render(n, e)
                             }
-                        },
-                            `${row.name} (#${row.license_id})`
                         )
-                        render(n, e)
-                    })
+                    },
+                    preDrawCallback: function (settings) {
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(1)
+                            .attr("data-filter", "vendors")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(3)
+                            .attr("data-filter", "av_license_types")
+                        $("#" + table_id)
+                            .find("thead th")
+                            .eq(4)
+                            .attr("data-filter", "av_license_statuses")
+                    },
                 },
-                preDrawCallback: function (settings) {
-                    $("#" + table_id).find("thead th").eq(1).attr('data-filter', 'vendors')
-                    $("#" + table_id).find("thead th").eq(3).attr('data-filter', 'av_license_types')
-                    $("#" + table_id).find("thead th").eq(4).attr('data-filter', 'av_license_statuses')
-                }
-
-            }, license_table_settings, 1)
+                license_table_settings,
+                1
+            )
         },
     },
     props: {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesShow.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesShow.vue
index 93c7163534..bee40eb0ac 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesShow.vue
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesShow.vue
@@ -117,14 +117,14 @@
 </template>
 
 <script>
-import { inject } from 'vue'
+import { inject } from "vue"
 import { fetchLicense } from "../../fetch"
 
 export default {
     setup() {
         const format_date = $date
 
-        const AVStore = inject('AVStore')
+        const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
         return {
@@ -136,12 +136,12 @@ export default {
         return {
             license: {
                 license_id: null,
-                name: '',
+                name: "",
                 vendor_id: null,
                 vendor: null,
-                description: '',
-                type: '',
-                status: '',
+                description: "",
+                type: "",
+                status: "",
                 started_on: undefined,
                 ended_on: undefined,
             },
@@ -160,8 +160,7 @@ export default {
             this.initialized = true
         },
     },
-    components: {
-    },
+    components: {},
     name: "LicensesShow",
 }
 </script>
-- 
2.39.2