Koha-community/Koha
13
7
Fork 0
Code Issues Releases Wiki Activity

Bug 34788: Add Vue components, api client and navigation route

Browse source 
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>
This commit is contained in:
Matt Blenkinsop 2023-09-14 12:35:08 +00:00 committed by Katrin Fischer
parent c76ea88b0e
commit d3222816bb
Signed by: kfischer
GPG key ID: 0EF6E2C03357A834
4 changed files with 155 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

124
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesKBARTImport.vue Normal file
View file

@ -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>

17
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesList.vue
View file

@ -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) {

5
koha-tmpl/intranet-tmpl/prog/js/vue/fetch/erm-api-client.js
View file

@ -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,
}),
};
}

9
koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js
View file

@ -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",