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

   1 <template>
   2     <div>
   3         <div v-if="!initialized">{{ $__("Loading") }}</div>
   4         <div v-else id="titles_list">
   5             <Toolbar />
   6             <div
   7                 v-if="title_count > 0"
   8                 id="title_list_result"
   9                 class="page-section"
  10             >
  11                 <table :id="table_id"></table>
  12             </div>
  13             <div v-else class="dialog message">
  14                 {{ $__("There are no titles defined") }}
  15             </div>
  16         </div>
  17     </div>
  18 </template>
  19
  20 <script>
  21 import Toolbar from "./EHoldingsLocalTitlesToolbar.vue"
  22 import { inject, createVNode, render } from "vue"
  23 import { storeToRefs } from "pinia"
  24 import { APIClient } from "../../fetch/api-client.js"
  25 import { useDataTable } from "../../composables/datatables"
  26
  27 export default {
  28     setup() {
  29         const AVStore = inject("AVStore")
  30         const { av_title_publication_types } = storeToRefs(AVStore)
  31         const { get_lib_from_av, map_av_dt_filter } = AVStore
  32
  33         const { setConfirmationDialog, setMessage } = inject("mainStore")
  34
  35         const table_id = "title_list"
  36         useDataTable(table_id)
  37
  38         return {
  39             av_title_publication_types,
  40             get_lib_from_av,
  41             map_av_dt_filter,
  42             table_id,
  43             setConfirmationDialog,
  44             setMessage,
  45         }
  46     },
  47     data: function () {
  48         return {
  49             title_count: 0,
  50             initialized: false,
  51             filters: {
  52                 publication_title: this.$route.query.publication_title || "",
  53                 publication_type: this.$route.query.publication_type || "",
  54             },
  55             cannot_search: false,
  56         }
  57     },
  58     beforeRouteEnter(to, from, next) {
  59         next(vm => {
  60             vm.getTitleCount().then(() => vm.build_datatable())
  61         })
  62     },
  63     methods: {
  64         async getTitleCount() {
  65             const client = APIClient.erm
  66             await client.localTitles.count().then(
  67                 count => {
  68                     this.title_count = count
  69                     this.initialized = true
  70                 },
  71                 error => {}
  72             )
  73         },
  74         show_title: function (title_id) {
  75             this.$router.push(
  76                 "/cgi-bin/koha/erm/eholdings/local/titles/" + title_id
  77             )
  78         },
  79         edit_title: function (title_id) {
  80             this.$router.push(
  81                 "/cgi-bin/koha/erm/eholdings/local/titles/edit/" + title_id
  82             )
  83         },
  84         delete_title: function (title_id, title_publication_title) {
  85             this.setConfirmationDialog(
  86                 {
  87                     title: this.$__(
  88                         "Are you sure you want to remove this title?"
  89                     ),
  90                     message: title_publication_title,
  91                     accept_label: this.$__("Yes, delete"),
  92                     cancel_label: this.$__("No, do not delete"),
  93                 },
  94                 () => {
  95                     const client = APIClient.erm
  96                     client.localTitles.delete(title_id).then(
  97                         success => {
  98                             this.setMessage(
  99                                 this.$__("Local title %s deleted").format(
 100                                     title_publication_title
 101                                 ),
 102                                 true
 103                             )
 104                             $("#" + this.table_id)
 105                                 .DataTable()
 106                                 .ajax.url("/api/v1/erm/eholdings/local/titles")
 107                                 .draw()
 108                         },
 109                         error => {}
 110                     )
 111                 }
 112             )
 113         },
 114         build_datatable: function () {
 115             let show_title = this.show_title
 116             let edit_title = this.edit_title
 117             let delete_title = this.delete_title
 118             let get_lib_from_av = this.get_lib_from_av
 119             let map_av_dt_filter = this.map_av_dt_filter
 120             let filters = this.filters
 121             let table_id = this.table_id
 122
 123             window["av_title_publication_types"] = map_av_dt_filter(
 124                 "av_title_publication_types"
 125             )
 126
 127             $("#" + table_id).kohaTable(
 128                 {
 129                     ajax: {
 130                         url: "/api/v1/erm/eholdings/local/titles",
 131                     },
 132                     embed: ["resources.package"],
 133                     order: [[0, "asc"]],
 134                     autoWidth: false,
 135                     searchCols: [
 136                         { search: filters.publication_title },
 137                         null,
 138                         { search: filters.publication_type },
 139                         null,
 140                     ],
 141                     columns: [
 142                         {
 143                             title: __("Title"),
 144                             data: "me.publication_title",
 145                             searchable: true,
 146                             orderable: true,
 147                             render: function (data, type, row, meta) {
 148                                 // Rendering done in drawCallback
 149                                 return ""
 150                             },
 151                         },
 152                         {
 153                             title: __("Contributors"),
 154                             data: "first_author:first_editor",
 155                             searchable: true,
 156                             orderable: true,
 157                             render: function (data, type, row, meta) {
 158                                 return (
 159                                     escape_str(row.first_author) +
 160                                     (row.first_author && row.first_editor
 161                                         ? "<br/>"
 162                                         : "") +
 163                                     escape_str(row.first_editor)
 164                                 )
 165                             },
 166                         },
 167                         {
 168                             title: __("Publication type"),
 169                             data: "publication_type",
 170                             searchable: true,
 171                             orderable: true,
 172                             render: function (data, type, row, meta) {
 173                                 return escape_str(
 174                                     get_lib_from_av(
 175                                         "av_title_publication_types",
 176                                         row.publication_type
 177                                     )
 178                                 )
 179                             },
 180                         },
 181                         {
 182                             title: __("Identifier"),
 183                             data: "print_identifier:online_identifier",
 184                             searchable: true,
 185                             orderable: true,
 186                             render: function (data, type, row, meta) {
 187                                 let print_identifier = row.print_identifier
 188                                 let online_identifier = row.online_identifier
 189                                 return (
 190                                     (print_identifier
 191                                         ? escape_str(
 192                                               _("ISBN (Print): %s").format(
 193                                                   print_identifier
 194                                               )
 195                                           )
 196                                         : "") +
 197                                     (online_identifier
 198                                         ? escape_str(
 199                                               _("ISBN (Online): %s").format(
 200                                                   online_identifier
 201                                               )
 202                                           )
 203                                         : "")
 204                                 )
 205                             },
 206                         },
 207                         {
 208                             title: __("Actions"),
 209                             data: function (row, type, val, meta) {
 210                                 return '<div class="actions"></div>'
 211                             },
 212                             className: "actions noExport",
 213                             searchable: false,
 214                             orderable: false,
 215                         },
 216                     ],
 217                     drawCallback: function (settings) {
 218                         var api = new $.fn.dataTable.Api(settings)
 219
 220                         $.each(
 221                             $(this).find("td .actions"),
 222                             function (index, e) {
 223                                 let tr = $(this).parent().parent()
 224                                 let title_id = api.row(tr).data().title_id
 225                                 let title_publication_title = api
 226                                     .row(tr)
 227                                     .data().publication_title
 228                                 let editButton = createVNode(
 229                                     "a",
 230                                     {
 231                                         class: "btn btn-default btn-xs",
 232                                         role: "button",
 233                                         onClick: () => {
 234                                             edit_title(title_id)
 235                                         },
 236                                     },
 237                                     [
 238                                         createVNode("i", {
 239                                             class: "fa fa-pencil",
 240                                             "aria-hidden": "true",
 241                                         }),
 242                                         __("Edit"),
 243                                     ]
 244                                 )
 245
 246                                 let deleteButton = createVNode(
 247                                     "a",
 248                                     {
 249                                         class: "btn btn-default btn-xs",
 250                                         role: "button",
 251                                         onClick: () => {
 252                                             delete_title(
 253                                                 title_id,
 254                                                 title_publication_title
 255                                             )
 256                                         },
 257                                     },
 258                                     [
 259                                         createVNode("i", {
 260                                             class: "fa fa-trash",
 261                                             "aria-hidden": "true",
 262                                         }),
 263                                         __("Delete"),
 264                                     ]
 265                                 )
 266
 267                                 let n = createVNode("span", {}, [
 268                                     editButton,
 269                                     " ",
 270                                     deleteButton,
 271                                 ])
 272                                 render(n, e)
 273                             }
 274                         )
 275
 276                         $.each(
 277                             $(this).find("tbody tr td:first-child"),
 278                             function (index, e) {
 279                                 let tr = $(this).parent()
 280                                 let row = api.row(tr).data()
 281                                 if (!row) return // Happen if the table is empty
 282                                 let n = createVNode(
 283                                     "a",
 284                                     {
 285                                         role: "button",
 286                                         href:
 287                                             "/cgi-bin/koha/erm/eholdings/local/titles/" +
 288                                             row.title_id,
 289                                         onClick: e => {
 290                                             e.preventDefault()
 291                                             show_title(row.title_id)
 292                                         },
 293                                     },
 294                                     `${row.publication_title} (#${row.title_id})`
 295                                 )
 296                                 render(n, e)
 297                             }
 298                         )
 299                     },
 300                     preDrawCallback: function (settings) {
 301                         $("#" + table_id)
 302                             .find("thead th")
 303                             .eq(2)
 304                             .attr("data-filter", "av_title_publication_types")
 305                     },
 306                 },
 307                 eholdings_titles_table_settings,
 308                 1
 309             )
 310         },
 311     },
 312     components: { Toolbar },
 313     name: "EHoldingsLocalTitlesList",
 314 }
 315 </script>