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

   1 <template>
   2     <div v-if="!initialized">{{ $__("Loading") }}</div>
   3     <div v-else id="packages_add">
   4         <h2 v-if="erm_package.package_id">
   5             {{ $__("Edit package #%s").format(erm_package.package_id) }}
   6         </h2>
   7         <h2 v-else>{{ $__("New package") }}</h2>
   8         <div>
   9             <form @submit="onSubmit($event)">
  10                 <fieldset class="rows">
  11                     <ol>
  12                         <li>
  13                             <label class="required" for="package_name"
  14                                 >{{ $__("Package name") }}:</label
  15                             >
  16                             <input
  17                                 id="package_name"
  18                                 v-model="erm_package.name"
  19                                 :placeholder="$__('Package name')"
  20                                 required
  21                             />
  22                             <span class="required">{{ $__("Required") }}</span>
  23                         </li>
  24                         <li>
  25                             <label for="package_vendor_id"
  26                                 >{{ $__("Vendor") }}:</label
  27                             >
  28                             <v-select
  29                                 id="package_vendor_id"
  30                                 v-model="erm_package.vendor_id"
  31                                 label="name"
  32                                 :reduce="vendor => vendor.id"
  33                                 :options="vendors"
  34                             />
  35                         </li>
  36                         <li>
  37                             <label for="package_type">{{ $__("Type") }}:</label>
  38                             <v-select
  39                                 id="package_type"
  40                                 v-model="erm_package.package_type"
  41                                 label="lib"
  42                                 :reduce="av => av.authorised_value"
  43                                 :options="av_package_types"
  44                             />
  45                         </li>
  46                         <li>
  47                             <label for="package_content_type">{{
  48                                 $__("Content type: ")
  49                             }}</label>
  50                             <v-select
  51                                 id="package_content_type"
  52                                 v-model="erm_package.content_type"
  53                                 label="lib"
  54                                 :reduce="av => av.authorised_value"
  55                                 :options="av_package_content_types"
  56                             />
  57                         </li>
  58                         <li>
  59                             <label for="package_notes"
  60                                 >{{ $__("Notes") }}:</label
  61                             >
  62                             <textarea
  63                                 id="package_notes"
  64                                 v-model="erm_package.notes"
  65                             />
  66                         </li>
  67
  68                         <EHoldingsPackageAgreements
  69                             :package_agreements="erm_package.package_agreements"
  70                         />
  71                     </ol>
  72                 </fieldset>
  73                 <fieldset class="action">
  74                     <input type="submit" value="Submit" />
  75                     <router-link
  76                         to="/cgi-bin/koha/erm/eholdings/local/packages"
  77                         role="button"
  78                         class="cancel"
  79                         >{{ $__("Cancel") }}</router-link
  80                     >
  81                 </fieldset>
  82             </form>
  83         </div>
  84     </div>
  85 </template>
  86
  87 <script>
  88 import { inject } from "vue"
  89 import EHoldingsPackageAgreements from "./EHoldingsLocalPackageAgreements.vue"
  90 import { setMessage, setError, setWarning } from "../../messages"
  91 import { fetchLocalPackage, createPackage, editPackage } from "../../fetch"
  92 import { storeToRefs } from "pinia"
  93
  94 export default {
  95     setup() {
  96         const vendorStore = inject("vendorStore")
  97         const { vendors } = storeToRefs(vendorStore)
  98         const AVStore = inject("AVStore")
  99         const { av_package_types, av_package_content_types } =
 100             storeToRefs(AVStore)
 101
 102         return {
 103             vendors,
 104             av_package_types,
 105             av_package_content_types,
 106         }
 107     },
 108     data() {
 109         return {
 110             erm_package: {
 111                 package_id: null,
 112                 vendor_id: null,
 113                 name: "",
 114                 external_id: "",
 115                 package_type: "",
 116                 content_type: "",
 117                 notes: "",
 118                 created_on: null,
 119                 resources: null,
 120                 package_agreements: [],
 121             },
 122             initialized: false,
 123         }
 124     },
 125     beforeRouteEnter(to, from, next) {
 126         next(vm => {
 127             if (to.params.package_id) {
 128                 vm.erm_package = vm.getPackage(to.params.package_id)
 129             } else {
 130                 vm.initialized = true
 131             }
 132         })
 133     },
 134     methods: {
 135         async getPackage(package_id) {
 136             const erm_package = await fetchLocalPackage(package_id)
 137             this.erm_package = erm_package
 138             this.initialized = true
 139         },
 140         checkForm(erm_package) {
 141             let errors = []
 142             let package_agreements = erm_package.package_agreements
 143             const agreement_ids = package_agreements.map(pa => pa.agreement_id)
 144             const duplicate_agreement_ids = agreement_ids.filter(
 145                 (id, i) => agreement_ids.indexOf(id) !== i
 146             )
 147
 148             if (duplicate_agreement_ids.length) {
 149                 errors.push(this.$__("An agreement is used several times"))
 150             }
 151
 152             errors.forEach(function (e) {
 153                 setWarning(e)
 154             })
 155             return !errors.length
 156         },
 157         onSubmit(e) {
 158             e.preventDefault()
 159
 160             let erm_package = JSON.parse(JSON.stringify(this.erm_package)) // copy
 161
 162             if (!this.checkForm(erm_package)) {
 163                 return false
 164             }
 165
 166             if (erm_package.package_id) {
 167                 editPackage(erm_package).then(response => {
 168                     if (response.status == 200) {
 169                         this.$router.push(
 170                             "/cgi-bin/koha/erm/eholdings/local/packages"
 171                         )
 172                         setMessage(this.$__("Package updated"))
 173                     } else {
 174                         setError(response.message || response.statusText)
 175                     }
 176                 })
 177             } else {
 178                 createPackage(erm_package).then(response => {
 179                     if (response.status == 201) {
 180                         this.$router.push(
 181                             "/cgi-bin/koha/erm/eholdings/local/packages"
 182                         )
 183                         setMessage(this.$__("Package created"))
 184                     } else {
 185                         setError(response.message || response.statusText)
 186                     }
 187                 })
 188             }
 189         },
 190     },
 191     components: {
 192         EHoldingsPackageAgreements,
 193     },
 194     name: "EHoldingsEBSCOPackagesFormAdd",
 195 }
 196 </script>