Bug 32991: Licenses: Add delete dialog to list and show. Removed FormConfirmDelete component and routes

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>

Signed-off-by: Pedro Amorim <pedro.amorim@ptfs-europe.com>
Signed-off-by: Agustín Moyano <agustinmoyano@theke.io>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>

koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesFormConfirmDelete.vue

@@ -1,77 +0,0 @@
-<template>
-    <div v-if="!initialized">{{ $__("Loading") }}</div>
-    <div v-else id="licenses_confirm_delete">
-        <h2>{{ $__("Delete license") }}</h2>
-        <div>
-            <form @submit="onSubmit($event)">
-                <fieldset class="rows">
-                    <ol>
-                        <li>
-                            {{ $__("License name") }}:
-                            {{ license.name }}
-                        </li>
-                        <li>
-                            {{ $__("Description") }}:
-                            {{ license.description }}
-                        </li>
-                    </ol>
-                </fieldset>
-                <fieldset class="action">
-                    <input
-                        type="submit"
-                        variant="primary"
-                        :value="$__('Yes, delete')"
-                    />
-                    <router-link
-                        to="/cgi-bin/koha/erm/licenses"
-                        role="button"
-                        class="cancel"
-                        >{{ $__("No, do not delete") }}</router-link
-                    >
-                </fieldset>
-            </form>
-        </div>
-    </div>
-</template>
-
-<script>
-import { APIClient } from "../../fetch/api-client.js"
-import { setMessage } from "../../messages"
-
-export default {
-    data() {
-        return {
-            license: {},
-            initialized: false,
-        }
-    },
-    beforeRouteEnter(to, from, next) {
-        next(vm => {
-            vm.license = vm.getLicense(to.params.license_id)
-            vm.initialized = true
-        })
-    },
-    methods: {
-        async getLicense(license_id) {
-            const client = APIClient.erm
-            client.licenses.get(license_id).then(data => {
-                this.license = data
-                this.initialized = true
-            })
-        },
-        onSubmit(e) {
-            e.preventDefault()
-
-            const client = APIClient.erm
-            client.licenses.delete(this.license.license_id).then(
-                success => {
-                    setMessage(this.$__("License deleted"))
-                    this.$router.push("/cgi-bin/koha/erm/licenses")
-                },
-                error => {}
-            )
-        },
-    },
-    name: "LicensesFormConfirmDelete",
-}
-</script>

koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesList.vue

@@ -26,6 +26,8 @@ export default {
         const AVStore = inject("AVStore")
         const { get_lib_from_av, map_av_dt_filter } = AVStore
 
+        const { setConfirmationDialog, setMessage } = inject("mainStore")
+
         const table_id = "license_list"
         useDataTable(table_id)
 
@@ -34,6 +36,8 @@ export default {
             get_lib_from_av,
             map_av_dt_filter,
             table_id,
+            setConfirmationDialog,
+            setMessage,
         }
     },
     data: function () {
@@ -64,8 +68,34 @@ export default {
         edit_license: function (license_id) {
             this.$router.push("/cgi-bin/koha/erm/licenses/edit/" + license_id)
         },
-        delete_license: function (license_id) {
+        delete_license: function (license_id, license_name) {
-            this.$router.push("/cgi-bin/koha/erm/licenses/delete/" + license_id)
+            this.setConfirmationDialog(
+                {
+                    title: this.$__(
+                        "Are you sure you want to remove this license?"
+                    ),
+                    message: license_name,
+                    accept_label: this.$__("Yes, delete"),
+                    cancel_label: this.$__("No, do not delete"),
+                },
+                () => {
+                    const client = APIClient.erm
+                    client.licenses.delete(license_id).then(
+                        success => {
+                            this.setMessage(
+                                this.$__("License %s deleted").format(
+                                    license_name
+                                )
+                            )
+                            $("#" + this.table_id)
+                                .DataTable()
+                                .ajax.url("/api/v1/erm/licenses")
+                                .draw()
+                        },
+                        error => {}
+                    )
+                }
+            )
         },
         build_datatable: function () {
             let show_license = this.show_license
@@ -203,6 +233,7 @@ export default {
                             function (index, e) {
                                 let tr = $(this).parent().parent()
                                 let license_id = api.row(tr).data().license_id
+                                let license_name = api.row(tr).data().name
                                 let editButton = createVNode(
                                     "a",
                                     {
@@ -227,7 +258,10 @@ export default {
                                         class: "btn btn-default btn-xs",
                                         role: "button",
                                         onClick: () => {
-                                            delete_license(license_id)
+                                            delete_license(
+                                                license_id,
+                                                license_name
+                                            )
                                         },
                                     },
                                     [

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

@@ -9,11 +9,9 @@
                     :title="$__('Edit')"
                     ><i class="fa fa-pencil"></i
                 ></router-link>
-                <router-link
+                <a @click="delete_license(license.license_id, license.name)"
-                    :to="`/cgi-bin/koha/erm/licenses/delete/${license.license_id}`"
-                    :title="$__('Delete')"
                     ><i class="fa fa-trash"></i
-                ></router-link>
+                ></a>
             </span>
         </h2>
         <div>
@@ -152,6 +150,8 @@ export default {
         const format_date = $date
         const patron_to_html = $patron_to_html
 
+        const { setConfirmationDialog, setMessage } = inject("mainStore")
+
         const AVStore = inject("AVStore")
         const { get_lib_from_av } = AVStore
 
@@ -159,6 +159,8 @@ export default {
             format_date,
             patron_to_html,
             get_lib_from_av,
+            setConfirmationDialog,
+            setMessage,
         }
     },
     data() {
@@ -194,6 +196,32 @@ export default {
                 error => {}
             )
         },
+        delete_license: function (license_id, license_name) {
+            this.setConfirmationDialog(
+                {
+                    title: this.$__(
+                        "Are you sure you want to remove this license?"
+                    ),
+                    message: license_name,
+                    accept_label: this.$__("Yes, delete"),
+                    cancel_label: this.$__("No, do not delete"),
+                },
+                () => {
+                    const client = APIClient.erm
+                    client.licenses.delete(license_id).then(
+                        success => {
+                            this.setMessage(
+                                this.$__("License %s deleted").format(
+                                    license_name
+                                )
+                            )
+                            this.$router.push("/cgi-bin/koha/erm/licenses")
+                        },
+                        error => {}
+                    )
+                }
+            )
+        },
     },
     components: {},
     name: "LicensesShow",
@@ -203,6 +231,7 @@ export default {
 .action_links a {
     padding-left: 0.2em;
     font-size: 11px;
+    cursor: pointer;
 }
 #license_documents ul {
     padding-left: 0px;

koha-tmpl/intranet-tmpl/prog/js/vue/routes/erm.js

@@ -19,7 +19,6 @@ import EHoldingsEBSCOTitlesShow from "../components/ERM/EHoldingsEBSCOTitlesShow
 import LicensesList from "../components/ERM/LicensesList.vue";
 import LicensesShow from "../components/ERM/LicensesShow.vue";
 import LicensesFormAdd from "../components/ERM/LicensesFormAdd.vue";
-import LicensesFormConfirmDelete from "../components/ERM/LicensesFormConfirmDelete.vue";
 
 const breadcrumbs = {
     home: {
@@ -470,17 +469,6 @@ export const routes = [
                         ),
                 },
             },
-            {
-                path: "delete/:license_id",
-                component: LicensesFormConfirmDelete,
-                meta: {
-                    breadcrumb: () =>
-                        build_breadcrumb(
-                            breadcrumb_paths.licenses,
-                            "Delete license" // $t("Delete license")
-                        ),
-                },
-            },
             {
                 path: "add",
                 component: LicensesFormAdd,