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

   1 <template>
   2     <fieldset class="rows" id="agreement_relationships">
   3         <legend>{{ $t("Related agreements") }}</legend>
   4         <fieldset
   5             class="rows"
   6             v-for="(relationship, counter) in relationships"
   7             v-bind:key="counter"
   8         >
   9             <legend>
  10                 {{ $t("Related agreement.counter", { counter: counter + 1 }) }}
  11                 <a href="#" @click.prevent="deleteRelationship(counter)"
  12                     ><i class="fa fa-trash"></i>
  13                     {{ $t("Remove this relationship") }}</a
  14                 >
  15             </legend>
  16             <ol>
  17                 <li>
  18                     <label :for="`related_agreement_id_${counter}`"
  19                         >{{ $t("Related agreement") }}:
  20                     </label>
  21                     <select
  22                         v-model="relationship.related_agreement_id"
  23                         :id="`related_agreement_id_${counter}`"
  24                     >
  25                         <option value=""></option>
  26                         <option
  27                             v-for="agreement in agreements"
  28                             :key="agreement.agreement_id"
  29                             :value="agreement.agreement_id"
  30                             :selected="
  31                                 agreement.agreement_id ==
  32                                 relationship.related_agreement_id
  33                                     ? true
  34                                     : false
  35                             "
  36                         >
  37                             {{ agreement.name }}
  38                         </option>
  39                     </select>
  40                 </li>
  41                 <li>
  42                     <label :for="`related_agreement_relationship_${counter}`"
  43                         >{{ $t("Relationship") }}:
  44                     </label>
  45                     <select
  46                         v-model="relationship.relationship"
  47                         :id="`related_agreement_relationship_${counter}`"
  48                         required
  49                     >
  50                         <option value=""></option>
  51                         <option
  52                             v-for="r in av_agreement_relationships"
  53                             :key="r.authorised_values"
  54                             :value="r.authorised_value"
  55                             :selected="
  56                                 r.authorised_value == relationship.relationship
  57                                     ? true
  58                                     : false
  59                             "
  60                         >
  61                             {{ r.lib }}
  62                         </option>
  63                     </select>
  64                     <span class="required">{{ $t("Required") }}</span>
  65                 </li>
  66                 <li>
  67                     <label :for="`related_agreement_notes_${counter}`"
  68                         >{{ $t("Notes") }}:</label
  69                     >
  70                     <input
  71                         :id="`related_agreement_notes_${counter}`"
  72                         v-model="relationship.notes"
  73                         :placeholder="$t('Notes')"
  74                     />
  75                 </li>
  76             </ol>
  77         </fieldset>
  78         <a
  79             v-if="agreements.length"
  80             class="btn btn-default"
  81             @click="addRelationship"
  82             ><font-awesome-icon icon="plus" />
  83             {{ $t("Add new related agreement") }}</a
  84         >
  85         <span v-else>{{
  86             $t("There are no other agreements created yet")
  87         }}</span>
  88     </fieldset>
  89 </template>
  90
  91 <script>
  92 import { fetchAgreements } from "../../fetch"
  93
  94 export default {
  95     data() {
  96         return {
  97             agreements: [],
  98         }
  99     },
 100     beforeCreate() {
 101         fetchAgreements().then((agreements) => {
 102             this.agreements = agreements.filter((agreement) => agreement.agreement_id !== this.agreement_id)
 103         })
 104     },
 105     methods: {
 106         addRelationship() {
 107             this.relationships.push({
 108                 related_agreement_id: null,
 109                 relationship: null,
 110                 notes: '',
 111             })
 112         },
 113         deleteRelationship(counter) {
 114             this.relationships.splice(counter, 1)
 115         },
 116     },
 117     props: {
 118         agreement_id: Number,
 119         av_agreement_relationships: Array,
 120         relationships: Array,
 121     },
 122     name: 'AgreementRelationships',
 123 }
 124 </script>