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

   1 <template>
   2     <transition name="modal">
   3         <div v-if="showModal" class="modal">
   4             <AgreementsList @select-agreement="addAgreement" />
   5             <input
   6                 type="button"
   7                 @click="showModal = false"
   8                 :value="$t('Close')"
   9             />
  10         </div>
  11     </transition>
  12     <div id="package_agreements">
  13         <div
  14             v-for="(
  15                 package_agreement, counter
  16             ) in erm_package.package_agreements"
  17             v-bind:key="counter"
  18         >
  19             <router-link
  20                 :to="`/cgi-bin/koha/erm/agreements/${package_agreement.agreement.agreement_id}`"
  21                 >{{ package_agreement.agreement.name }}</router-link
  22             >
  23             &nbsp;
  24             <a
  25                 href="#"
  26                 @click.prevent="deleteAgreement(counter)"
  27                 :title="$t('Remove this agreement')"
  28                 ><i class="fa fa-trash"></i
  29             ></a>
  30         </div>
  31         <a class="btn btn-default btn-xs" @click="showModal = true"
  32             ><font-awesome-icon icon="plus" /> {{ $t("Add new agreement") }}</a
  33         >
  34     </div>
  35 </template>
  36
  37 <script>
  38 import AgreementsList from "./AgreementsList.vue"
  39 import { createPackage, editPackage } from "../../fetch"
  40 import { setWarning, removeMessages } from "../../messages"
  41
  42 export default {
  43     data() {
  44         return { showModal: false, }
  45     },
  46     beforeCreate() {
  47     },
  48     methods: {
  49         serializeAgreement() {
  50             let erm_package = JSON.parse(JSON.stringify(this.erm_package)) // copy
  51             delete erm_package.vendor_id // This is the EBSCO's vendor_id
  52
  53             // Remove remote data, we don't need to store them (don't we?)
  54             // Keep the name, it's mandatory by the REST API specs
  55             delete erm_package.package_type
  56             delete erm_package.content_type
  57             erm_package.external_id = erm_package.package_id
  58             delete erm_package.package_id
  59             erm_package.provider = 'ebsco'
  60             erm_package.package_id = erm_package.koha_internal_id
  61             delete erm_package.koha_internal_id
  62             return erm_package
  63         },
  64         addAgreement(agreement_id) {
  65             removeMessages()
  66             this.showModal = false
  67             let erm_package = this.serializeAgreement()
  68             // Only add if it does not exist
  69             if (!erm_package.package_agreements.find((a) => a.agreement_id == agreement_id)) {
  70                 erm_package.package_agreements.push({ agreement_id })
  71                 if (this.erm_package.koha_internal_id) {
  72                     editPackage(erm_package).then(() => {
  73                         this.$emit('refresh-agreements')
  74                     })
  75                 } else {
  76                     createPackage(erm_package).then(() => {
  77                         this.$emit('refresh-agreements')
  78                     })
  79                 }
  80             } else {
  81                 setWarning(this.$t("This agreement is already linked with this package"))
  82             }
  83         },
  84         deleteAgreement(counter) {
  85             let erm_package = this.serializeAgreement()
  86             erm_package.package_agreements.splice(counter, 1)
  87             editPackage(erm_package).then(() => {
  88                 this.$emit('refresh-agreements')
  89             })
  90         },
  91     },
  92     props: {
  93         erm_package: Object,
  94     },
  95     components: {
  96         AgreementsList,
  97     },
  98     emits: ['refresh-agreements'],
  99     name: 'EHoldingsEBSCOPackageAgreements',
 100 }
 101 </script>
 102 <style scoped>
 103 #package_agreements {
 104     padding-left: 26rem;
 105 }
 106 .modal {
 107     position: fixed;
 108     z-index: 9998;
 109     top: 0;
 110     left: 0;
 111     width: 80%;
 112     height: 80%;
 113     background-color: rgba(0, 0, 0, 0.5);
 114     display: table;
 115     transition: opacity 0.3s ease;
 116     margin: auto;
 117     padding: 20px 30px;
 118     background-color: #fff;
 119     border-radius: 2px;
 120     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);
 121     transition: all 0.3s ease;
 122     font-family: Helvetica, Arial, sans-serif;
 123 }
 124 </style>