Creation of PersonResource

src/Bundle/ChillPersonBundle/Resources/public/mod/AccompanyingPeriod/setReferrer.js

@@ -0,0 +1,47 @@
+import {createApp} from 'vue';
+import SetReferrer from 'ChillPersonAssets/vuejs/_components/AccompanyingPeriod/SetReferrer.vue';
+import {fetchResults} from 'ChillMainAssets/lib/api/apiMethods.js';
+
+document.querySelectorAll('[data-set-referrer-app]').forEach(function (el) {
+  let
+    periodId = Number.parseInt(el.dataset.setReferrerAccompanyingPeriodId);
+
+  const url = `/api/1.0/person/accompanying-course/${periodId}/referrers-suggested.json`;
+  fetchResults(url).then(suggested => {
+    const app = createApp({
+      components: {
+        SetReferrer,
+      },
+      template:
+        '<set-referrer :suggested="this.suggested" :periodId="periodId" @referrerSet="onReferrerSet"></set-referrer>',
+      data() {
+        return {
+          suggested, periodId,
+        }
+      },
+      methods: {
+        onReferrerSet(ref) {
+          const bloc = document.querySelector(`[data-accompanying-period-id="${this.periodId}"]`);
+          if (bloc === null) {
+            console.error('bloc not found');
+            return;
+          }
+
+          const label = bloc.querySelector('[data-referrer-text]');
+
+          if (label === null) {
+            console.error('label not found');
+            return;
+          }
+
+          label.textContent = ref.text;
+          label.classList.remove('chill-no-data-statement');
+
+        }
+      }
+    });
+
+    app.mount(el);
+
+  })
+})

src/Bundle/ChillPersonBundle/Resources/public/page/person_resource/showhide-input.js

@@ -0,0 +1,55 @@
+import {ShowHide} from 'ChillMainAssets/lib/show_hide/show_hide.js';
+
+window.addEventListener('DOMContentLoaded', function() {
+    let
+        personContainer = document.querySelector('#person-entity'),
+        entitySelector = document.querySelector('#entity-selector'),
+        freetextContainer = document.querySelector('#freetext-entity'),
+        thirdpartyContainer = document.querySelector('#thirdparty-entity')
+    ;
+    if (null === entitySelector) {
+        return;
+    }
+
+    new ShowHide({
+        debug: false,
+        load_event: null,
+        froms: [entitySelector],
+        container: [personContainer],
+        test: function(froms, event) {
+            for (let container of froms) {
+                return container.querySelector('input[value="person"]').checked;
+            }
+            console.log('we couldnt find the input');
+            return false;
+        },
+    })
+
+    new ShowHide({
+        debug: false,
+        load_event: null,
+        froms: [entitySelector],
+        container: [thirdpartyContainer],
+        test: function(froms, event) {
+            for (let container of froms) {
+                return container.querySelector('input[value="thirdparty"]').checked;
+            }
+            console.log('we couldnt find the input');
+            return false;
+        },
+    })
+
+    new ShowHide({
+        debug: false,
+        load_event: null,
+        froms: [entitySelector],
+        container: [freetextContainer],
+        test: function(froms, event) {
+            for (let container of froms) {
+                return container.querySelector('input[value="freetext"]').checked;
+            }
+            console.log('we couldnt find the input');
+            return false;
+        },
+    })
+});

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AccompanyingPeriod/SetReferrer.vue

@@ -0,0 +1,44 @@
+<template>
+<ul class="list-suggest add-items" v-if="this.suggested.length > 0">
+  <li v-for="r in this.suggested" @click="setReferrer(r)"><span>{{ r.text }}</span></li>
+</ul>
+</template>
+
+<script>
+
+import {makeFetch} from 'ChillMainAssets/lib/api/apiMethods.js';
+
+export default {
+  name: "SetReferrer",
+  props: {
+    suggested: {
+      type: Array,
+      required: false,
+      default: [],
+    },
+    periodId: {
+      type: Number,
+      required: true
+    }
+  },
+  emits: ['referrerSet'],
+  methods: {
+    setReferrer: function(ref) {
+      const url = `/api/1.0/person/accompanying-course/${this.periodId}.json`;
+      const body = { type: "accompanying_period", user: { id: ref.id, type: ref.type }};
+
+      return makeFetch('PATCH', url, body)
+          .then((response) => {
+            this.$emit('referrerSet', ref);
+          })
+          .catch((error) => {
+            throw error;
+          })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>