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="{
  41                                     name: 'EHoldingsEBSCOTitlesShow',
  42                                     params: { title_id: resource.title_id },
  43                                 }"
  44                                 >{{
  45                                     resource.title.publication_title
  46                                 }}</router-link
  47                             ></span
  48                         >
  49                     </li>
  50                     <li>
  51                         <label>{{ $__("Publisher name") }}:</label>
  52                         <span>
  53                             {{ resource.title.publisher_name }}
  54                         </span>
  55                     </li>
  56                     <li>
  57                         <label>{{ $__("Publication type") }}:</label>
  58                         <span>
  59                             {{ resource.title.publication_type }}
  60                         </span>
  61                     </li>
  62                     <li v-if="resource.title.print_identifier">
  63                         <label>{{ $__("Print-format identifier") }}:</label>
  64                         <span>
  65                             {{ resource.title.print_identifier }}
  66                         </span>
  67                     </li>
  68                     <li v-if="resource.title.online_identifier">
  69                         <label>{{ $__("Online-format identifier") }}:</label>
  70                         <span>
  71                             {{ resource.title.online_identifier }}
  72                         </span>
  73                     </li>
  74                 </ol>
  75             </fieldset>
  76
  77             <fieldset class="rows">
  78                 <ol>
  79                     <li>
  80                         <label>{{ $__("Package") }}:</label>
  81                         <span
  82                             ><router-link
  83                                 :to="{
  84                                     name: 'EHoldingsEBSCOPackagesShow',
  85                                     params: { package_id: resource.package_id },
  86                                 }"
  87                                 >{{ resource.package.name }}</router-link
  88                             ></span
  89                         >
  90                     </li>
  91
  92                     <li>
  93                         <label>{{ $__("Vendor") }}:</label>
  94                         <span v-if="resource.vendor">
  95                             {{ resource.vendor.name }}
  96                         </span>
  97                     </li>
  98                     <li v-if="resource.package.content_type">
  99                         <label>{{ $__("Package content type") }}:</label>
 100                         <span>{{ resource.package.content_type }}</span>
 101                     </li>
 102                 </ol>
 103             </fieldset>
 104
 105             <fieldset class="rows">
 106                 <legend>Resource settings</legend>
 107                 <ol>
 108                     <li>
 109                         <label>{{ $__("Coverage dates") }}:</label>
 110                         <span
 111                             >{{ format_date(resource.started_on) }}-{{
 112                                 format_date(resource.ended_on)
 113                             }}</span
 114                         >
 115                     </li>
 116                 </ol>
 117             </fieldset>
 118         </div>
 119     </div>
 120 </template>
 121
 122 <script>
 123 import { inject } from "vue"
 124 import { storeToRefs } from "pinia"
 125 import { APIClient } from "../../fetch/api-client.js"
 126
 127 export default {
 128     setup() {
 129         const format_date = $date
 130
 131         return {
 132             format_date,
 133         }
 134     },
 135     data() {
 136         return {
 137             resource: {
 138                 resource_id: null,
 139                 title_id: null,
 140                 package_id: null,
 141                 started_on: "",
 142                 ended_on: "",
 143                 proxy: "",
 144                 title: {},
 145                 package: {},
 146             },
 147             initialized: false,
 148             updating_is_selected: false,
 149         }
 150     },
 151
 152     beforeRouteEnter(to, from, next) {
 153         next(vm => {
 154             vm.getResource(to.params.resource_id)
 155         })
 156     },
 157     beforeRouteUpdate(to, from) {
 158         this.resource = this.getResource(to.params.resource_id)
 159     },
 160     methods: {
 161         getResource(resource_id) {
 162             const client = APIClient.erm
 163             client.EBSCOResources.get(resource_id).then(
 164                 resource => {
 165                     this.resource = resource
 166                     this.initialized = true
 167                     this.updating_is_selected = false
 168                 },
 169                 error => {}
 170             )
 171         },
 172         edit_selected(is_selected) {
 173             this.updating_is_selected = true
 174             const client = APIClient.erm
 175             client.EBSCOResources.patch(this.resource.resource_id, {
 176                 is_selected,
 177             }).then(
 178                 result => {
 179                     // Refresh the page. We should not need that actually.
 180                     this.getResource(this.resource.resource_id)
 181                 },
 182                 error => {}
 183             )
 184         },
 185         add_to_holdings() {
 186             this.edit_selected(true)
 187         },
 188         remove_from_holdings() {
 189             this.edit_selected(false)
 190         },
 191     },
 192     name: "EHoldingsEBSCOResourcesShow",
 193 }
 194 </script>
 195 <style scoped>
 196 fieldset.rows label {
 197     width: 25rem;
 198 }
 199 </style>