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

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