koha-dev.rot13.org Git - srvgit/blob - koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/LicensesList.vue

   1 <template>
   2     <div v-if="!initialized">{{ $t("Loading") }}</div>
   3     <div v-else-if="licenses" id="licenses_list">
   4         <Toolbar />
   5         <table v-if="licenses.length" :id="table_id"></table>
   6         <div v-else-if="initialized" class="dialog message">
   7             {{ $t("There are no licenses defined") }}
   8         </div>
   9     </div>
  10 </template>
  11
  12 <script>
  13 import Toolbar from "./LicensesToolbar.vue"
  14 import { createVNode, render } from 'vue'
  15 import { useVendorStore } from "../../stores/vendors"
  16 import { useAVStore } from "../../stores/authorised_values"
  17 import { storeToRefs } from "pinia"
  18 import { fetchLicenses } from "../../fetch"
  19 import { useDataTable } from "../../composables/datatables"
  20
  21 export default {
  22     setup() {
  23         const vendorStore = useVendorStore()
  24         const { vendors } = storeToRefs(vendorStore)
  25
  26         const AVStore = useAVStore()
  27         const { get_lib_from_av, map_av_dt_filter } = AVStore
  28
  29         const table_id = "license_list"
  30         useDataTable(table_id)
  31
  32         return {
  33             vendors,
  34             get_lib_from_av,
  35             map_av_dt_filter,
  36             table_id,
  37         }
  38     },
  39     data: function () {
  40         return {
  41             licenses: [],
  42             initialized: false,
  43         }
  44     },
  45     beforeRouteEnter(to, from, next) {
  46         next(vm => {
  47             vm.getLicenses().then(() => vm.build_datatable())
  48         })
  49     },
  50     methods: {
  51         async getLicenses() {
  52             const licenses = await fetchLicenses()
  53             this.licenses = licenses
  54             this.initialized = true
  55         },
  56         show_license: function (license_id) {
  57             this.$router.push("/cgi-bin/koha/erm/licenses/" + license_id)
  58         },
  59         edit_license: function (license_id) {
  60             this.$router.push("/cgi-bin/koha/erm/licenses/edit/" + license_id)
  61         },
  62         delete_license: function (license_id) {
  63             this.$router.push("/cgi-bin/koha/erm/licenses/delete/" + license_id)
  64         },
  65         build_datatable: function () {
  66
  67             let show_license = this.show_license
  68             let edit_license = this.edit_license
  69             let delete_license = this.delete_license
  70             let get_lib_from_av = this.get_lib_from_av
  71             let map_av_dt_filter = this.map_av_dt_filter
  72             let default_search = this.$route.query.q
  73             let table_id = this.table_id
  74
  75             window['vendors'] = this.vendors.map(e => {
  76                 e['_id'] = e['id']
  77                 e['_str'] = e['name']
  78                 return e
  79             })
  80             let vendors_map = this.vendors.reduce((map, e) => {
  81                 map[e.id] = e
  82                 return map
  83             }, {})
  84             let avs = ['av_license_types', 'av_license_statuses']
  85             avs.forEach(function (av_cat) {
  86                 window[av_cat] = map_av_dt_filter(av_cat)
  87             })
  88
  89             $('#' + table_id).kohaTable({
  90                 ajax: {
  91                     "url": "/api/v1/erm/licenses",
  92                 },
  93                 order: [[0, "asc"]],
  94                 search: { search: default_search },
  95                 columnDefs: [{
  96                     targets: [0, 1],
  97                     render: function (data, type, row, meta) {
  98                         if (type == 'display') {
  99                             return escape_str(data)
 100                         }
 101                         return data
 102                     }
 103                 }],
 104                 columns: [
 105                     {
 106                         title: __("Name"),
 107                         data: "me.license_id:me.name",
 108                         searchable: true,
 109                         orderable: true,
 110                         render: function (data, type, row, meta) {
 111                             // Rendering done in drawCallback
 112                             return ""
 113                         }
 114                     },
 115                     {
 116                         title: __("Vendor"),
 117                         data: "vendor_id",
 118                         searchable: true,
 119                         orderable: true,
 120                         render: function (data, type, row, meta) {
 121                             return row.vendor_id != undefined ? escape_str(vendors_map[row.vendor_id].name) : ""
 122                         }
 123                     },
 124
 125                     {
 126                         title: __("Description"),
 127                         data: "description",
 128                         searchable: true,
 129                         orderable: true
 130                     },
 131                     {
 132                         title: __("Type"),
 133                         data: "type",
 134                         searchable: true,
 135                         orderable: true,
 136                         render: function (data, type, row, meta) {
 137                             return escape_str(get_lib_from_av("av_license_types", row.type))
 138                         }
 139                     },
 140                     {
 141                         title: __("Status"),
 142                         data: "status",
 143                         searchable: true,
 144                         orderable: true,
 145                         render: function (data, type, row, meta) {
 146                             return escape_str(get_lib_from_av("av_license_statuses", row.status))
 147                         }
 148                     },
 149                     {
 150                         title: __("Started on"),
 151                         data: "started_on",
 152                         searchable: true,
 153                         orderable: true,
 154                         render: function (data, type, row, meta) {
 155                             return $date(row.started_on)
 156                         }
 157                     },
 158                     {
 159                         title: __("Ended on"),
 160                         data: "ended_on",
 161                         searchable: true,
 162                         orderable: true,
 163                         render: function (data, type, row, meta) {
 164                             return $date(row.ended_on)
 165                         }
 166                     },
 167                     {
 168                         title: __("Actions"),
 169                         data: function (row, type, val, meta) {
 170                             return '<div class="actions"></div>'
 171                         },
 172                         className: "actions noExport",
 173                         searchable: false,
 174                         orderable: false
 175                     }
 176                 ],
 177                 drawCallback: function (settings) {
 178
 179                     var api = new $.fn.dataTable.Api(settings)
 180
 181                     $.each($(this).find("td .actions"), function (index, e) {
 182                         let tr = $(this).parent().parent()
 183                         let license_id = api.row(tr).data().license_id
 184                         let editButton = createVNode("a", {
 185                             class: "btn btn-default btn-xs", role: "button", onClick: () => {
 186                                 edit_license(license_id)
 187                             }
 188                         },
 189                             [createVNode("i", { class: "fa fa-pencil", 'aria-hidden': "true" }), __("Edit")])
 190
 191                         let deleteButton = createVNode("a", {
 192                             class: "btn btn-default btn-xs", role: "button", onClick: () => {
 193                                 delete_license(license_id)
 194                             }
 195                         },
 196                             [createVNode("i", { class: "fa fa-trash", 'aria-hidden': "true" }), __("Delete")])
 197
 198                         let n = createVNode('span', {}, [editButton, " ", deleteButton])
 199                         render(n, e)
 200                     })
 201
 202                     $.each($(this).find("tbody tr td:first-child"), function (index, e) {
 203                         let tr = $(this).parent()
 204                         let row = api.row(tr).data()
 205                         if (!row) return // Happen if the table is empty
 206                         let n = createVNode("a", {
 207                             role: "button",
 208                             onClick: () => {
 209                                 show_license(row.license_id)
 210                             }
 211                         },
 212                             `${row.name} (#${row.license_id})`
 213                         )
 214                         render(n, e)
 215                     })
 216                 },
 217                 preDrawCallback: function (settings) {
 218                     $("#" + table_id).find("thead th").eq(1).attr('data-filter', 'vendors')
 219                     $("#" + table_id).find("thead th").eq(3).attr('data-filter', 'av_license_types')
 220                     $("#" + table_id).find("thead th").eq(4).attr('data-filter', 'av_license_statuses')
 221                 }
 222
 223             }, license_table_settings, 1)
 224         },
 225     },
 226     props: {
 227         av_license_types: Array,
 228         av_license_statuses: Array,
 229     },
 230     components: { Toolbar },
 231     name: "LicensesList",
 232 }
 233 </script>