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

Bug 37274: Use the Toolbar component in all Vue components

Browse source 
We have a Toolbar component that must be used everywhere for
consistency.
This patch adds it when missing:
* ERM/AgreementsShow
Show an agreement

* ERM/EHoldingsLocalPackagesShow
Show a local package
* ERM/EHoldingsLocalTitlesShow
Show a local title

* ERM/LicensesShow
Show a license

* ERM/UsageStatisticsDataProvidersShow
Show a data provider

* Preservation/SettingsProcessingsShow
Show the the settings of a processing (Preservation module)

Confirm that the "Edit" and "Delete" icons are now replaced with buttons
(in a toolbar) on those views.

Signed-off-by: Pedro Amorim <pedro.amorim@ptfs-europe.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Katrin Fischer <katrin.fischer@bsz-bw.de>
This commit is contained in:
Jonathan Druart 2024-07-09 14:34:29 +02:00 committed by Katrin Fischer
parent e81f7e2ef2
commit 25c232e3b6
Signed by: kfischer
GPG key ID: 0EF6E2C03357A834
11 changed files with 142 additions and 135 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/AgreementsShow.vue
View file

@ -1,24 +1,27 @@
<template>
<div v-if="!initialized">{{ $__("Loading") }}</div>
<div v-else id="agreements_show">
<Toolbar>
<ToolbarButton
:to="{
name: 'AgreementsFormAddEdit',
params: { agreement_id: agreement.agreement_id },
}"
class="btn btn-default"
icon="pencil"
:title="$__('Edit')"
/>
<a
@click="
delete_agreement(agreement.agreement_id, agreement.name)
"
class="btn btn-default"
><font-awesome-icon icon="trash" /> {{ $__("Delete") }}</a
>
</Toolbar>
<h2>
{{ $__("Agreement #%s").format(agreement.agreement_id) }}
<span class="action_links">
<router-link
:to="{
name: 'AgreementsFormAddEdit',
params: { agreement_id: agreement.agreement_id },
}"
:title="$__('Edit')"
><i class="fa fa-pencil"></i
></router-link>
<a
@click="
delete_agreement(agreement.agreement_id, agreement.name)
"
><i class="fa fa-trash"></i
></a>
</span>
</h2>
<div>
<fieldset class="rows">
@ -334,6 +337,8 @@
<script>
import { inject } from "vue"
import { APIClient } from "../../fetch/api-client.js"
import Toolbar from "../Toolbar.vue"
import ToolbarButton from "../ToolbarButton.vue"
export default {
setup() {
@ -420,15 +425,11 @@ export default {
)
},
},
components: { Toolbar, ToolbarButton },
name: "AgreementsShow",
}
</script>
<style scoped>
.action_links a {
padding-left: 0.2em;
font-size: 11px;
cursor: pointer;
}
#agreement_documents ul {
padding-left: 0px;
}

45
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalPackagesShow.vue
View file

@ -1,25 +1,27 @@
<template>
<div v-if="!initialized">{{ $__("Loading") }}</div>
<div v-else-if="erm_package" id="packages_show">
<Toolbar>
<ToolbarButton
:to="{
name: 'EHoldingsLocalPackagesFormAddEdit',
params: { package_id: erm_package.package_id },
}"
class="btn btn-default"
icon="pencil"
:title="$__('Edit')"
/>
<a
@click="
delete_package(erm_package.package_id, erm_package.name)
"
class="btn btn-default"
><font-awesome-icon icon="trash" /> {{ $__("Delete") }}</a
>
</Toolbar>
<h2>
{{ $__("Package #%s").format(erm_package.package_id) }}
<span class="action_links">
<router-link
:to="{
name: 'EHoldingsLocalPackagesFormAddEdit',
params: { package_id: erm_package.package_id },
}"
:title="$__('Edit')"
><i class="fa fa-pencil"></i
></router-link>
<a
@click="
delete_package(erm_package.package_id, erm_package.name)
"
><i class="fa fa-trash"></i
></a>
</span>
</h2>
<div>
<fieldset class="rows">
@ -116,6 +118,8 @@
import { inject } from "vue"
import EHoldingsPackageTitlesList from "./EHoldingsLocalPackageTitlesList.vue"
import { APIClient } from "../../fetch/api-client.js"
import Toolbar from "../Toolbar.vue"
import ToolbarButton from "../ToolbarButton.vue"
export default {
setup() {
@ -200,16 +204,13 @@ export default {
},
components: {
EHoldingsPackageTitlesList,
Toolbar,
ToolbarButton,
},
name: "EHoldingsLocalPackagesShow",
}
</script>
<style scoped>
.action_links a {
padding-left: 0.2em;
font-size: 11px;
cursor: pointer;
}
fieldset.rows label {
width: 25rem;
}

43
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/EHoldingsLocalTitlesShow.vue
View file

@ -1,25 +1,25 @@
<template>
<div v-if="!initialized">{{ $__("Loading") }}</div>
<div v-else-if="title" id="eholdings_title_show">
<Toolbar>
<ToolbarButton
:to="{
name: 'EHoldingsLocalTitlesFormAddEdit',
params: { title_id: title.title_id },
}"
class="btn btn-default"
icon="pencil"
:title="$__('Edit')"
/>
<a
@click="delete_title(title.title_id, title.publication_title)"
class="btn btn-default"
><font-awesome-icon icon="trash" /> {{ $__("Delete") }}</a
>
</Toolbar>
<h2>
{{ $__("Title #%s").format(title.title_id) }}
<span class="action_links">
<router-link
:to="{
name: 'EHoldingsLocalTitlesFormAddEdit',
params: { title_id: title.title_id },
}"
:title="$__('Edit')"
><i class="fa fa-pencil"></i
></router-link>
<a
@click="
delete_title(title.title_id, title.publication_title)
"
><i class="fa fa-trash"></i
></a>
</span>
</h2>
<div>
<fieldset class="rows">
@ -265,6 +265,8 @@
import { inject } from "vue"
import EHoldingsTitlePackagesList from "./EHoldingsLocalTitlePackagesList.vue"
import { APIClient } from "../../fetch/api-client.js"
import Toolbar from "../Toolbar.vue"
import ToolbarButton from "../ToolbarButton.vue"
export default {
setup() {
@ -363,16 +365,13 @@ export default {
},
components: {
EHoldingsTitlePackagesList,
Toolbar,
ToolbarButton,
},
name: "EHoldingsLocalTitlesShow",
}
</script>
<style scoped>
.action_links a {
padding-left: 0.2em;
font-size: 11px;
cursor: pointer;
}
fieldset.rows label {
width: 25rem;
}

39
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesShow.vue
View file

@ -1,21 +1,25 @@
<template>
<div v-if="!initialized">{{ $__("Loading") }}</div>
<div v-else id="licenses_show">
<Toolbar>
<ToolbarButton
:to="{
name: 'LicensesFormAddEdit',
params: { license_id: license.license_id },
}"
class="btn btn-default"
icon="pencil"
:title="$__('Edit')"
/>
<a
@click="delete_license(license.license_id, license.name)"
class="btn btn-default"
><font-awesome-icon icon="trash" /> {{ $__("Delete") }}</a
>
</Toolbar>
<h2>
{{ $__("License #%s").format(license.license_id) }}
<span class="action_links">
<router-link
:to="{
name: 'LicensesFormAddEdit',
params: { license_id: license.license_id },
}"
:title="$__('Edit')"
><i class="fa fa-pencil"></i
></router-link>
<a @click="delete_license(license.license_id, license.name)"
><i class="fa fa-trash"></i
></a>
</span>
</h2>
<div>
<fieldset class="rows">
@ -147,6 +151,8 @@
<script>
import { inject } from "vue"
import { APIClient } from "../../fetch/api-client.js"
import Toolbar from "../Toolbar.vue"
import ToolbarButton from "../ToolbarButton.vue"
export default {
setup() {
@ -227,16 +233,11 @@ export default {
)
},
},
components: {},
components: { Toolbar, ToolbarButton },
name: "LicensesShow",
}
</script>
<style scoped>
.action_links a {
padding-left: 0.2em;
font-size: 11px;
cursor: pointer;
}
#license_documents ul {
padding-left: 0px;
}

56
koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/UsageStatisticsDataProvidersShow.vue
View file

@ -1,34 +1,37 @@
<template>
<div v-if="!initialized">{{ $__("Loading") }}</div>
<div v-else id="usage_data_providers_show">
<Toolbar>
<ToolbarButton
:to="{
name: 'UsageStatisticsDataProvidersFormAddEdit',
params: {
usage_data_provider_id:
usage_data_provider.erm_usage_data_provider_id,
},
}"
class="btn btn-default"
icon="pencil"
:title="$__('Edit')"
/>
<a
@click="
delete_usage_data_provider(
usage_data_provider.erm_usage_data_provider_id,
usage_data_provider.name
)
"
class="btn btn-default"
><font-awesome-icon icon="trash" /> {{ $__("Delete") }}</a
>
</Toolbar>
<h2>
{{
$__("Data provider #%s").format(
usage_data_provider.erm_usage_data_provider_id
)
}}
<span class="action_links">
<router-link
:to="{
name: 'UsageStatisticsDataProvidersFormAddEdit',
params: {
usage_data_provider_id:
usage_data_provider.erm_usage_data_provider_id,
},
}"
:title="$__('Edit')"
><i class="fa fa-pencil"></i
></router-link>
<a
@click="
delete_usage_data_provider(
usage_data_provider.erm_usage_data_provider_id,
usage_data_provider.name
)
"
><i class="fa fa-trash"></i
></a>
</span>
</h2>
<div id="usage_data_providerstabs" class="toptabs numbered">
<ul class="nav nav-tabs" role="tablist">
@ -123,6 +126,8 @@
<script>
import { inject } from "vue"
import { APIClient } from "../../fetch/api-client.js"
import Toolbar from "../Toolbar.vue"
import ToolbarButton from "../ToolbarButton.vue"
import UsageStatisticsDataProvidersFileImport from "./UsageStatisticsDataProvidersFileImport.vue"
import UsageStatisticsDataProvidersCounterLogs from "./UsageStatisticsDataProvidersCounterLogs.vue"
import UsageStatisticsDataProviderDetails from "./UsageStatisticsDataProviderDetails.vue"
@ -230,15 +235,12 @@ export default {
UsageStatisticsDataProvidersCounterLogs,
UsageStatisticsDataProviderDetails,
UsageStatisticsProviderDataList,
Toolbar,
ToolbarButton,
},
}
</script>
<style scoped>
.action_links a {
padding-left: 0.2em;
font-size: 11px;
cursor: pointer;
}
.active {
cursor: pointer;
}

37
koha-tmpl/intranet-tmpl/prog/js/vue/components/Preservation/SettingsProcessingsShow.vue
View file

@ -1,19 +1,23 @@
<template>
<div v-if="!initialized">{{ $__("Loading") }}</div>
<div v-else id="processing_show">
<Toolbar>
<ToolbarButton
:to="{
name: 'SettingsProcessingsFormEdit',
params: { processing_id: processing.processing_id },
}"
class="btn btn-default"
icon="pencil"
:title="$__('Edit')"
/>
<a @click="doDelete()" class="btn btn-default"
><font-awesome-icon icon="trash" /> {{ $__("Delete") }}</a
>
</Toolbar>
<h2>
{{ $__("Processing #%s").format(processing.processing_id) }}
<span class="action_links">
<router-link
:to="{
name: 'SettingsProcessingsFormEdit',
params: { processing_id: processing.processing_id },
}"
:title="$__('Edit')"
><i class="fa fa-pencil"></i
></router-link>
<a @click="doDelete()"><i class="fa fa-trash"></i></a>
</span>
</h2>
<div>
<fieldset class="rows">
@ -86,6 +90,8 @@
<script>
import { inject } from "vue"
import { APIClient } from "../../fetch/api-client.js"
import Toolbar from "../Toolbar.vue"
import ToolbarButton from "../ToolbarButton.vue"
export default {
setup() {
@ -164,13 +170,8 @@ export default {
)
},
},
components: { Toolbar, ToolbarButton },
name: "ProcessingsShow",
}
</script>
<style scoped>
.action_links a {
padding-left: 0.2em;
font-size: 11px;
cursor: pointer;
}
</style>
<style scoped></style>

4
t/cypress/integration/ERM/Agreements_spec.ts
View file

@ -555,7 +555,7 @@ describe("Agreement CRUD operations", () => {
// AV's libs displayed
// Tables for periods and users
});
it("Delete agreement", () => {
it.only("Delete agreement", () => {
let agreement = cy.get_agreement();
let agreements = [agreement];
@ -633,7 +633,7 @@ describe("Agreement CRUD operations", () => {
"Agreement #" + agreement.agreement_id
);
cy.get("#agreements_show .action_links .fa-trash").click();
cy.get("#agreements_show #toolbar").contains("Delete").click();
cy.get(".dialog.alert.confirmation h1").contains(
"remove this agreement"
);

4
t/cypress/integration/ERM/DataProviders_spec.ts
View file

@ -383,7 +383,9 @@ describe("Data provider CRUD operations", () => {
"Data provider #" + dataProvider.erm_usage_data_provider_id
);
cy.get("#usage_data_providers_show .action_links .fa-trash").click();
cy.get("#usage_data_providers_show #toolbar")
.contains("Delete")
.click();
cy.get(".dialog.alert.confirmation h1").contains(
"remove this data provider"
);

2
t/cypress/integration/ERM/Licenses_spec.ts
View file

@ -352,7 +352,7 @@ describe("License CRUD operations", () => {
cy.wait(500); // Cypress is too fast! Vue hasn't populated the form yet!
cy.get("#licenses_show h2").contains("License #" + license.license_id);
cy.get("#licenses_show .action_links .fa-trash").click();
cy.get("#licenses_show #toolbar").contains("Delete").click();
cy.get(".dialog.alert.confirmation h1").contains("remove this license");
cy.contains("Yes, delete").click();

2
t/cypress/integration/ERM/Packages_spec.ts
View file

@ -351,7 +351,7 @@ describe("Package CRUD operations", () => {
"Package #" + erm_package.package_id
);
cy.get("#packages_show .action_links .fa-trash").click();
cy.get("#packages_show #toolbar").contains("Delete").click();
cy.get(".dialog.alert.confirmation h1").contains("remove this package");
cy.contains("Yes, delete").click();

2
t/cypress/integration/ERM/Titles_spec.ts
View file

@ -514,7 +514,7 @@ describe("Title CRUD operations", () => {
"Title #" + erm_title.title_id
);
cy.get("#eholdings_title_show .action_links .fa-trash").click();
cy.get("#eholdings_title_show #toolbar").contains("Delete").click();
cy.get(".dialog.alert.confirmation h1").contains("remove this title");
cy.contains("Yes, delete").click();