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

   1 <template>
   2     <div v-if="!initialized">{{ $__("Loading") }}</div>
   3     <div v-else-if="resource" id="eholdings_resources_show">
   4         <h2>
   5             {{ $__("Resource #%s").format(resource.resource_id) }}
   6             <span v-if="!updating_is_selected">
   7                 <a
   8                     v-if="!resource.is_selected"
   9                     class="btn btn-default btn-xs"
  10                     role="button"
  11                     @click="add_to_holdings"
  12                     ><font-awesome-icon icon="plus" />
  13                     {{ $__("Add title to holdings") }}</a
  14                 >
  15                 <a
  16                     v-else
  17                     class="btn btn-default btn-xs"
  18                     role="button"
  19                     id="remove-from-holdings"
  20                     @click="remove_from_holdings"
  21                     ><font-awesome-icon icon="minus" />
  22                     {{ $__("Remove title from holdings") }}</a
  23                 > </span
  24             ><span v-else><font-awesome-icon icon="spinner" /></span>
  25         </h2>
  26         <div>
  27             <fieldset class="rows">
  28                 <legend>{{ $__("Resource information") }}</legend>
  29                 <ol>
  30                     <li v-if="resource.resource_id">
  31                         <label>{{ $__("Resource identifier") }}:</label>
  32                         <span>
  33                             {{ resource.resource_id }}
  34                         </span>
  35                     </li>
  36                     <li>
  37                         <label>{{ $__("Publication title") }}:</label>
  38                         <span
  39                             ><router-link
  40                                 :to="`/cgi-bin/koha/erm/eholdings/ebsco/titles/${resource.title_id}`"
  41                                 >{{
  42                                     resource.title.publication_title
  43                                 }}</router-link
  44                             ></span
  45                         >
  46                     </li>
  47                     <li>
  48                         <label>{{ $__("Publisher name") }}:</label>
  49                         <span>
  50                             {{ resource.title.publisher_name }}
  51                         </span>
  52                     </li>
  53                     <li>
  54                         <label>{{ $__("Publication type") }}:</label>
  55                         <span>
  56                             {{ resource.title.publication_type }}
  57                         </span>
  58                     </li>
  59                     <li v-if="resource.title.print_identifier">
  60                         <label>{{ $__("Print-format identifier") }}:</label>
  61                         <span>
  62                             {{ resource.title.print_identifier }}
  63                         </span>
  64                     </li>
  65                     <li v-if="resource.title.online_identifier">
  66                         <label>{{ $__("Online-format identifier") }}:</label>
  67                         <span>
  68                             {{ resource.title.online_identifier }}
  69                         </span>
  70                     </li>
  71                 </ol>
  72             </fieldset>
  73
  74             <fieldset class="rows">
  75                 <ol>
  76                     <li>
  77                         <label>{{ $__("Package") }}:</label>
  78                         <span
  79                             ><router-link
  80                                 :to="`/cgi-bin/koha/erm/eholdings/ebsco/packages/${resource.package_id}`"
  81                                 >{{ resource.package.name }}</router-link
  82                             ></span
  83                         >
  84                     </li>
  85
  86                     <li>
  87                         <label>{{ $__("Vendor") }}:</label>
  88                         <span v-if="resource.vendor">
  89                             {{ resource.vendor.name }}
  90                         </span>
  91                     </li>
  92                     <li v-if="resource.package.content_type">
  93                         <label>{{ $__("Package content type") }}:</label>
  94                         <span>{{ resource.package.content_type }}</span>
  95                     </li>
  96                 </ol>
  97             </fieldset>
  98
  99             <fieldset class="rows">
 100                 <legend>Resource settings</legend>
 101                 <ol>
 102                     <li>
 103                         <label>{{ $__("Coverage dates") }}:</label>
 104                         <span
 105                             >{{ format_date(resource.started_on) }}-{{
 106                                 format_date(resource.ended_on)
 107                             }}</span
 108                         >
 109                     </li>
 110                 </ol>
 111             </fieldset>
 112         </div>
 113     </div>
 114 </template>
 115
 116 <script>
 117 import { inject } from "vue"
 118 import { fetchEBSCOResource } from "../../fetch/erm.js"
 119 import { storeToRefs } from "pinia"
 120 import { checkError } from "../../fetch/erm.js"
 121
 122 export default {
 123     setup() {
 124         const format_date = $date
 125
 126         const vendorStore = inject("vendorStore")
 127         const { vendors } = storeToRefs(vendorStore)
 128         return {
 129             format_date,
 130             vendors,
 131         }
 132     },
 133     data() {
 134         return {
 135             resource: {
 136                 resource_id: null,
 137                 title_id: null,
 138                 package_id: null,
 139                 started_on: "",
 140                 ended_on: "",
 141                 proxy: "",
 142                 title: {},
 143                 package: {},
 144             },
 145             initialized: false,
 146             updating_is_selected: false,
 147         }
 148     },
 149
 150     beforeRouteEnter(to, from, next) {
 151         next(vm => {
 152             vm.getResource(to.params.resource_id)
 153         })
 154     },
 155     beforeRouteUpdate(to, from) {
 156         this.resource = this.getResource(to.params.resource_id)
 157     },
 158     methods: {
 159         async getResource(resource_id) {
 160             const resource = await fetchEBSCOResource(resource_id)
 161             this.resource = resource
 162             this.initialized = true
 163             this.updating_is_selected = false
 164         },
 165         edit_selected(is_selected) {
 166             this.updating_is_selected = true
 167             fetch(
 168                 "/api/v1/erm/eholdings/ebsco/resources/" +
 169                     this.resource.resource_id,
 170                 {
 171                     method: "PATCH",
 172                     body: JSON.stringify({ is_selected }),
 173                     headers: {
 174                         Accept: "application/json",
 175                         "Content-Type": "application/json",
 176                     },
 177                 }
 178             )
 179                 .then(checkError)
 180                 .then(result => {
 181                     // Refresh the page. We should not need that actually.
 182                     this.getResource(this.resource.resource_id)
 183                 })
 184                 .catch(error => {
 185                     setError(error)
 186                 })
 187         },
 188         add_to_holdings() {
 189             this.edit_selected(true)
 190         },
 191         remove_from_holdings() {
 192             this.edit_selected(false)
 193         },
 194     },
 195     name: "EHoldingsEBSCOResourcesShow",
 196 }
 197 </script>
 198 <style scoped>
 199 fieldset.rows label {
 200     width: 25rem;
 201 }
 202 </style>