From d3222816bbb25f8200591aa907524fbc1c46ede7 Mon Sep 17 00:00:00 2001
From: Matt Blenkinsop <matt.blenkinsop@ptfs-europe.com>
Date: Thu, 14 Sep 2023 12:35:08 +0000
Subject: [PATCH] Bug 34788: Add Vue components, api client and navigation
 route

This patch adds a new component to handle the file import, a route to that component and the API client route needed to access the API

Signed-off-by: Clemens Tubach <clemens.tubach@kit.edu>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
---
 .../ERM/EHoldingsLocalTitlesKBARTImport.vue   | 124 ++++++++++++++++++
 .../ERM/EHoldingsLocalTitlesList.vue          |  17 +++
 .../prog/js/vue/fetch/erm-api-client.js       |   5 +
 .../intranet-tmpl/prog/js/vue/routes/erm.js   |   9 ++
 4 files changed, 155 insertions(+)
 create mode 100644 koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesKBARTImport.vue

diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesKBARTImport.vue b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesKBARTImport.vue
new file mode 100644
index 0000000000..6d2269db54
--- /dev/null
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesKBARTImport.vue
@@ -0,0 +1,124 @@
+<template>
+    <h2>{{ $__("Import from a KBART file") }}</h2>
+    <div class="page-section" id="files">
+        <form @submit="addDocument($event)" class="file_upload">
+            <label>{{ $__("File") }}:</label>
+            <div class="file_information">
+                <span v-if="!file.filename">
+                    {{ $__("Select a file") }}
+                    <input
+                        type="file"
+                        @change="selectFile($event)"
+                        :id="`import_file`"
+                        :name="`import_file`"
+                    />
+                </span>
+                <ol>
+                    <li v-show="file.filename">
+                        {{ $__("File name") }}:
+                        <span>{{ file.filename }}</span>
+                    </li>
+                    <li v-show="file.file_type">
+                        {{ $__("File type") }}:
+                        <span>{{ file.file_type }}</span>
+                    </li>
+                </ol>
+            </div>
+            <fieldset class="action">
+                <ButtonSubmit />
+                <a @click="clearForm($event)" role="button" class="cancel">{{
+                    $__("Clear form")
+                }}</a>
+            </fieldset>
+        </form>
+    </div>
+</template>
+
+<script>
+import ButtonSubmit from "../ButtonSubmit.vue"
+import { APIClient } from "../../fetch/api-client.js"
+import { setMessage, setWarning } from "../../messages"
+
+export default {
+    data() {
+        return {
+            file: {
+                filename: null,
+                file_content: null,
+            },
+        }
+    },
+    methods: {
+        selectFile(e) {
+            let files = e.target.files
+            if (!files) return
+            let file = files[0]
+            const reader = new FileReader()
+            reader.onload = e => this.loadFile(file.name, e.target.result)
+            reader.readAsBinaryString(file)
+        },
+        loadFile(filename, content) {
+            this.file.filename = filename
+            this.file.file_content = btoa(content)
+        },
+        addDocument(e) {
+            e.preventDefault()
+            const client = APIClient.erm
+            client.localTitles.import_kbart(this.file).then(
+                success => {
+                    let message = ""
+                    if (success.job_ids) {
+                        if (success.job_ids.length > 1) {
+                            message += this.__(
+                                "<li>Your file was too large to process in one job, the file has been split into %s jobs to meet the maximum size limits.</li>"
+                            ).format(success.job_ids.length)
+                        }
+                        success.job_ids.forEach((job, i) => {
+                            message += this.$__(
+                                '<li>Job for uploaded file %s has been queued, <a href="/cgi-bin/koha/admin/background_jobs.pl?op=view&id=%s" target="_blank">click here</a> to check its progress.</li>'
+                            ).format(i + 1, job)
+                        })
+                        setMessage(message, true)
+                    }
+                    if (success.invalid_columns) {
+                        message +=
+                            "<p>Invalid columns were detected in your report, please check the list below:</p>"
+                        success.invalid_columns.forEach(column => {
+                            message += this.$__(
+                                `<li style="font-weight: normal; font-size: medium;">%s</li>`
+                            ).format(column)
+                        })
+                        message +=
+                            '<p style="margin-top: 1em;">Below is a list of columns allowed in a KBART phase II report:</p>'
+                        success.valid_columns.forEach(column => {
+                            message += this.$__(
+                                `<li style="font-weight: normal; font-size: medium;">%s</li>`
+                            ).format(column)
+                        })
+                        setWarning(message)
+                    }
+                },
+                error => {}
+            )
+        },
+        clearForm(e) {
+            e.preventDefault()
+            this.file = {
+                filename: null,
+                file_type: null,
+                file_content: null,
+            }
+        },
+    },
+    components: {
+        ButtonSubmit,
+    },
+    name: "EHoldingsLocalTitlesKBARTImport",
+}
+</script>
+
+<style scoped>
+label {
+    margin: 0px 10px 0px 0px;
+}
+</style>
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 7a0dc98edc..3c261bc897 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
@@ -102,6 +102,23 @@ export default {
                 },
             },
             cannot_search: false,
+            toolbar_options: [
+                {
+                    to: "EHoldingsLocalTitlesFormAdd",
+                    icon: "plus",
+                    button_title: this.$__("New title"),
+                },
+                {
+                    to: "EHoldingsLocalTitlesFormImport",
+                    icon: "plus",
+                    button_title: this.$__("Import from list"),
+                },
+                {
+                    to: "EHoldingsLocalTitlesKBARTImport",
+                    icon: "plus",
+                    button_title: this.$__("Import from KBART file"),
+                },
+            ],
         }
     },
     beforeRouteEnter(to, from, next) {
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/fetch/erm-api-client.js b/koha-tmpl/intranet-tmpl/prog/js/vue/fetch/erm-api-client.js
index f563f61701..c69dada53b 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/fetch/erm-api-client.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/fetch/erm-api-client.js
@@ -189,6 +189,11 @@ export class ERMAPIClient extends HttpClient {
                     endpoint: "eholdings/local/titles/import",
                     body,
                 }),
+            import_kbart: body =>
+                this.post({
+                    endpoint: "eholdings/local/titles/import_kbart",
+                    body,
+                }),
         };
     }
 
diff --git a/koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js b/koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js
index 4f2331bdda..46c10babbf 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js
@@ -7,6 +7,7 @@ import AgreementsFormAdd from "../components/ERM/AgreementsFormAdd.vue";
 import EHoldingsLocalPackagesFormAdd from "../components/ERM/EHoldingsLocalPackagesFormAdd.vue";
 import EHoldingsLocalTitlesFormAdd from "../components/ERM/EHoldingsLocalTitlesFormAdd.vue";
 import EHoldingsLocalTitlesFormImport from "../components/ERM/EHoldingsLocalTitlesFormImport.vue";
+import EHoldingsLocalTitlesKBARTImport from "../components/ERM/EHoldingsLocalTitlesKBARTImport.vue";
 import EHoldingsLocalPackagesList from "../components/ERM/EHoldingsLocalPackagesList.vue";
 import EHoldingsLocalPackagesShow from "../components/ERM/EHoldingsLocalPackagesShow.vue";
 import EHoldingsLocalResourcesShow from "../components/ERM/EHoldingsLocalResourcesShow.vue";
@@ -200,6 +201,14 @@ export const routes = [
                                         ),
                                         title: $__("Import from a list"),
                                     },
+                                    {
+                                        path: "kbart-import",
+                                        name: "EHoldingsLocalTitlesKBARTImport",
+                                        component: markRaw(
+                                            EHoldingsLocalTitlesKBARTImport
+                                        ),
+                                        title: $__("Import from a KBART file"),
+                                    },
                                     {
                                         path: "/cgi-bin/koha/erm/eholdings/local/resources/:resource_id",
                                         name: "EHoldingsLocalResourcesShow",
-- 
2.39.5