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