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

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