Merge remote-tracking branch 'origin/master' into issue442_toggle_emergency

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated.vue

@@ -20,7 +20,6 @@
             <div class="form-check" v-for="p in participationWithoutHousehold" :key="p.id">
                <input type="checkbox"
                   class="form-check-input"
-                  v-model="hasNoHousehold"
                   name="persons[]"
                   checked="checked"
                   :id="p.person.id"

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Referrer.vue

@@ -97,16 +97,10 @@ export default {
     ...mapGetters(['isJobValid', 'usersSuggestedFilteredByJob']),
     users: function () {
       let users = this.$store.getters.usersFilteredByJob;
-
-      console.log('users filtered by job', users);
-
       // ensure that the selected user is in the list. add it if necessary
       if (this.$store.state.accompanyingCourse.user !== null && users.find(u => this.$store.state.accompanyingCourse.user.id === u.id) === undefined) {
-        console.log('add user to users');
         users.push(this.$store.state.accompanyingCourse.user);
       }
-
-      console.log('users to return', users);
       return users;
     },
     valueJob: {

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Requestor.vue

@@ -6,7 +6,7 @@
    <div v-if="accompanyingCourse.requestor && isAnonymous" class="flex-table">
 
       <label>
-         <input type="checkbox" v-model="isAnonymous" class="me-2" />
+         <input type="checkbox" v-model="requestorIsAnonymous" class="me-2" />
          {{ $t('requestor.is_anonymous') }}
       </label>
       <confidential v-if="accompanyingCourse.requestor.type === 'thirdparty'">
@@ -72,7 +72,7 @@
 
    <div v-else-if="accompanyingCourse.requestor && !isAnonymous" class="flex-table">
       <label>
-         <input type="checkbox" v-model="isAnonymous" class="me-2" />
+         <input type="checkbox" v-model="requestorIsAnonymous" class="me-2" />
          {{ $t('requestor.is_anonymous') }}
       </label>
 
@@ -199,7 +199,7 @@ export default {
       ...mapState({
          suggestedEntities: state => {
            return [
-               ...state.accompanyingCourse.participations.map(p => p.person),
+               ...state.accompanyingCourse.participations.filter((p) => p.endDate === null).map((p) => p.person),
                ...state.accompanyingCourse.resources.map(r => r.resource)
              ]
                .filter((e) => e !== null)
@@ -218,7 +218,7 @@ export default {
       accompanyingCourse() {
          return this.$store.state.accompanyingCourse
       },
-      isAnonymous: {
+      requestorIsAnonymous: {
          set(value) {
             this.$store.dispatch('requestorIsAnonymous', value);
          },
@@ -287,7 +287,9 @@ export default {
             body.name = payload.data.text;
             body.email = payload.data.email;
             body.telephone = payload.data.phonenumber;
-            body.address = { id: payload.data.address.address_id };
+            if (payload.data.address) {
+                body.address = { id: payload.data.address.address_id };
+            }
 
             makeFetch('PATCH', `/api/1.0/thirdparty/thirdparty/${payload.data.id}.json`, body)
                .then(response => {

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources.vue

@@ -77,7 +77,7 @@ export default {
       counter: state => state.accompanyingCourse.resources.length,
       suggestedEntities: state => [
             state.accompanyingCourse.requestor,
-            ...state.accompanyingCourse.participations.map(p => p.person),
+            ...state.accompanyingCourse.participations.filter((p) => p.endDate === null).map((p) => p.person),
          ]
          .filter((e) => e !== null)
          .filter(

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources/ResourceItem.vue

@@ -159,18 +159,19 @@ export default {
                .catch((error) => {
                   if (error.name === 'ValidationException') {
                      for (let v of error.violations) {
-                         this.$toast.open({message: v });
+                        this.$toast.open({message: v });
                      }
                   } else {
-                      this.$toast.open({message: 'An error occurred'});
+                     this.$toast.open({message: 'An error occurred'});
                   }
                })
          }
          else if (payload.type === 'thirdparty') {
+            console.log('data', payload.data)
             body.name = payload.data.text;
             body.email = payload.data.email;
             body.telephone = payload.data.phonenumber;
-            body.address = { id: payload.data.address.address_id };
+            body.address = payload.data.address ? { id: payload.data.address.address_id } :  null;
 
             makeFetch('PATCH', `/api/1.0/thirdparty/thirdparty/${payload.data.id}.json`, body)
                .then(response => {
@@ -180,10 +181,10 @@ export default {
                .catch((error) => {
                   if (error.name === 'ValidationException') {
                      for (let v of error.violations) {
-                         this.$toast.open({message: v });
+                        this.$toast.open({message: v });
                      }
                   } else {
-                      this.$toast.open({message: 'An error occurred'});
+                     this.$toast.open({message: 'An error occurred'});
                   }
                })
          }

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/store/index.js

@@ -428,42 +428,6 @@ let initPromise = (root) => Promise.all([getScopesPromise(root), accompanyingCou
                      throw error;
                   })
             },
-            /**
-             * On The Fly
-             */
-            patchOnTheFly({ commit }, payload) {
-               // TODO should be into the dedicated component, no ? JF
-               console.log('## action: patch OnTheFly', payload);
-               let body = { type: payload.type };
-               if (payload.type === 'person') {
-                  body.firstName = payload.data.firstName;
-                  body.lastName = payload.data.lastName;
-                  if (payload.data.birthdate !== null) { body.birthdate = payload.data.birthdate; }
-                  body.phonenumber = payload.data.phonenumber;
-                  body.mobilenumber = payload.data.mobilenumber;
-                  body.gender = payload.data.gender;
-                  console.log('id', payload.data.id, 'and body', body);
-                  patchPerson(payload.data.id, body)
-                     .then(person => new Promise((resolve, reject) => {
-                        console.log('patch person', person);
-                        commit('updatePerson', { target: payload.target, person: person });
-                        resolve();
-                     }));
-               }
-               else if (payload.type === 'thirdparty') {
-                  body.name = payload.data.text;
-                  body.email = payload.data.email;
-                  body.telephone = payload.data.phonenumber;
-                  body.address = { id: payload.data.address.address_id };
-                  console.log('id', payload.data.id, 'and body', body);
-                  patchThirdparty(payload.data.id, body)
-                     .then(thirdparty => new Promise((resolve, reject) => {
-                        console.log('patch thirdparty', thirdparty);
-                        commit('updateThirdparty', { target: payload.target, thirdparty: thirdparty });
-                        resolve();
-                  }));
-               }
-            },
             /**
              * Update accompanying course intensity/emergency/confidentiality
              */

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue

@@ -251,6 +251,7 @@
           relatedEntityClass="Chill\PersonBundle\Entity\AccompanyingPeriod\AccompanyingPeriodWork"
           :relatedEntityId="this.work.id"
           :workflowsAvailables="this.work.workflows_availables"
+          :preventDefaultMoveToGenerate="true"
           @go-to-generate-workflow="goToGenerateWorkflow"
        ></list-workflow-modal>
     </li>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/components/AddEvaluation.vue

@@ -106,8 +106,6 @@ export default {
          this.toggleEditEvaluation();
       },
       goToGenerateWorkflow({event, link, workflowName}) {
-        console.log('goToGenerate in evaluation', event, link, workflowName);
-
         const callback = (data) => {
           let evaluationId = data.accompanyingPeriodWorkEvaluations.find(e => e.key === this.evaluation.key).id;
           window.location.assign(buildLinkCreate(workflowName,

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/components/FormEvaluation.vue

@@ -65,29 +65,55 @@
        <h5>{{ $t('Documents') }} :</h5>
 
        <div class="flex-table">
-         <div class="item-bloc" v-for="d in evaluation.documents">
+         <div class="item-bloc" v-for="(d, i) in evaluation.documents" :key="d.key">
            <div class="item-row">
-             <div class="item-col"><h6>{{ d.template.name.fr }}</h6></div>
-             <div class="item-col">
-               <p>Créé par {{ d.createdBy.text }}<br/>
-               Le {{ $d(ISOToDatetime(d.createdAt.datetime), 'long') }}</p>
-
-             </div>
+               <div class="input-group input-group-lg mb-3">
+                  <div>
+                     <input
+                         class="form-control form-control-lg"
+                         style="font-weight: bold;"
+                         type="text"
+                         :value="d.title"
+                         :id="d.id"
+                         @input="onInputDocumentTitle"/>
+                  </div>
+               </div>
            </div>
            <div class="item-row">
-            <ul class="record_actions" >
-             <li>
-               <a :href="buildEditLink(d.storedObject)" class="btn btn-action btn-sm">
-                 <i class="fa fa-edit"></i>
-               </a>
-             </li>
-            </ul>
+               <div class="item-col item-meta">
+                  <p v-if="d.createdBy" class="createdBy">Créé par {{ d.createdBy.text }}<br/>
+                  Le {{ $d(ISOToDatetime(d.createdAt.datetime), 'long') }}</p>
+               </div>
+               <div class="item-col">
+                 <ul class="record_actions" >
+                   <li v-if="d.workflows_availables.length > 0">
+                     <list-workflow-modal
+                         :workflows="d.workflows"
+                         :allowCreate="true"
+                         relatedEntityClass="Chill\PersonBundle\Entity\AccompanyingPeriod\AccompanyingPeriodWorkEvaluationDocument"
+                         :relatedEntityId="d.id"
+                         :workflowsAvailables="d.workflows_availables"
+                         :preventDefaultMoveToGenerate="true"
+                         :goToGenerateWorkflowPayload="{doc: d}"
+                         @go-to-generate-workflow="goToGenerateWorkflowEvaluationDocument"
+                     ></list-workflow-modal>
+                   </li>
+                   <li>
+                     <a :href="buildEditLink(d.storedObject)" class="btn btn-wopilink"></a>
+                   </li>
+                   <li>
+                     <a class="btn btn-delete" @click="removeDocument(d)">
+                     </a>
+                   </li>
+                 </ul>
+               </div>
            </div>
          </div>
        </div>
      </div>
 
      <div class="row mb-3">
+      <h6>{{ $t('document_add') }} :</h6>
        <pick-template
            entityClass="Chill\PersonBundle\Entity\AccompanyingPeriod\AccompanyingPeriodWorkEvaluation"
            :id="evaluation.id"
@@ -99,6 +125,20 @@
            <label class="col-sm-4 col-form-label">{{ $t('evaluation_generate_a_document') }}</label>
          </template>
        </pick-template>
+      <div>
+         <label class="col-sm-4 col-form-label">{{ $t('document_upload') }}</label>
+         <ul class="record_actions">
+            <li>
+               <add-async-upload
+                  :buttonTitle="$t('browse')"
+                  :options="asyncUploadOptions"
+                  @addDocument="addDocument"
+               >
+               </add-async-upload>
+            </li>
+         </ul>
+      </div>
+
      </div>
    </div>
 </div>
@@ -111,6 +151,9 @@ import ClassicEditor from 'ChillMainAssets/module/ckeditor5/index.js';
 import { mapGetters, mapState } from 'vuex';
 import PickTemplate from 'ChillDocGeneratorAssets/vuejs/_components/PickTemplate.vue';
 import {buildLink} from 'ChillDocGeneratorAssets/lib/document-generator';
+import AddAsyncUpload from 'ChillDocStoreAssets/vuejs/_components/AddAsyncUpload.vue';
+import ListWorkflowModal from 'ChillMainAssets/vuejs/_components/EntityWorkflow/ListWorkflowModal.vue';
+import {buildLinkCreate} from 'ChillMainAssets/lib/entity-workflow/api.js';
 
 const i18n = {
    messages: {
@@ -129,6 +172,11 @@ const i18n = {
          evaluation_add_a_document: "Ajouter un document",
          evaluation_add: "Ajouter une évaluation",
          Documents: "Documents",
+         document_add: "Générer ou téléverser un document",
+         document_upload: "Téléverser un document",
+         document_title: "Titre du document",
+         template_title: "Nom du template",
+         browse: "Ajouter un document"
       }
    }
 };
@@ -139,12 +187,19 @@ export default {
    components: {
       ckeditor: CKEditor.component,
       PickTemplate,
+      AddAsyncUpload,
+      ListWorkflowModal,
    },
    i18n,
    data() {
       return {
          editor: ClassicEditor,
          template: null,
+         asyncUploadOptions: {
+            maxFiles: 1,
+            maxPostSize: 15000000,
+            required: false,
+         }
       }
    },
    computed: {
@@ -162,7 +217,6 @@ export default {
           return dateToISO(this.evaluation.startDate);
         },
         set(v) {
-          console.log(v);
           this.$store.commit('setEvaluationStartDate', { key: this.evaluation.key, date: ISOToDate(v) });
         }
       },
@@ -205,11 +259,11 @@ export default {
          })
          ;
       },
-     buildEditLink(storedObject) {
-       return `/wopi/edit/${storedObject.uuid}?returnPath=` + encodeURIComponent(
+      buildEditLink(storedObject) {
+         return `/wopi/edit/${storedObject.uuid}?returnPath=` + encodeURIComponent(
            window.location.pathname + window.location.search + window.location.hash);
-     },
-     submitBeforeGenerate({template}) {
+      },
+      submitBeforeGenerate({template}) {
         const callback = (data) => {
           let evaluationId = data.accompanyingPeriodWorkEvaluations.find(e => e.key === this.evaluation.key).id;
 
@@ -217,7 +271,36 @@ export default {
         };
 
         return this.$store.dispatch('submit', callback).catch(e => { console.log(e); throw e; });
-      }
+      },
+      onInputDocumentTitle(event) {
+         const id = Number(event.target.id);
+         const title = event.target.value;
+         this.$store.commit('updateDocumentTitle', {id: id, evaluationKey: this.evaluation.key, title: title});
+      },
+      addDocument(storedObject) {
+         let document = {
+            type: 'accompanying_period_work_evaluation_document',
+            storedObject: storedObject,
+            title: 'Nouveau document',
+         };
+         this.$store.commit('addDocument', {key: this.evaluation.key, document: document});
+      },
+      removeDocument(document) {
+         if (window.confirm("Êtes-vous sûr·e de vouloir supprimer le document qui a pour titre \"" + document.title +"\" ?")) {
+           this.$store.commit('removeDocument', {key: this.evaluation.key, document: document});
+         }
+      },
+      goToGenerateWorkflowEvaluationDocument({event, link, workflowName, payload}) {
+       const callback = (data) => {
+         let evaluation = data.accompanyingPeriodWorkEvaluations.find(e => e.key === this.evaluation.key);
+         let updatedDocument = evaluation.documents.find(d => d.key === payload.doc.key);
+         window.location.assign(buildLinkCreate(workflowName,
+             'Chill\\PersonBundle\\Entity\\AccompanyingPeriod\\AccompanyingPeriodWorkEvaluationDocument', updatedDocument.id));
+       };
+
+       return this.$store.dispatch('submit', callback)
+           .catch(e => { console.log(e); throw e; });
+     },
    },
 }
 </script>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/store.js

@@ -110,6 +110,7 @@ const store = createStore({
             maxDate: e.maxDate !== null ? { datetime: datetimeToISO(e.maxDate) } : null,
             warningInterval: intervalDaysToISO(e.warningInterval),
             comment: e.comment,
+            documents: e.documents
           };
           if (e.id !== undefined) {
             o.id = e.id;
@@ -130,6 +131,11 @@ const store = createStore({
           endDate: e.endDate !== null ? ISOToDatetime(e.endDate.datetime) : null,
           maxDate: e.maxDate !== null ? ISOToDatetime(e.maxDate.datetime) : null,
           warningInterval: e.warningInterval !== null ? intervalISOToDays(e.warningInterval) : null,
+          documents: e.documents.map((d, dindex) => {
+            return Object.assign(d, {
+              key: index
+            });
+          }),
         });
 
         return k;
@@ -197,6 +203,24 @@ const store = createStore({
 
       found.results = found.results.filter(r => r.id !== result.id);
     },
+    addDocument(state, payload) {
+      let evaluation = state.evaluationsPicked.find(e => e.key === payload.key);
+      evaluation.documents.push(Object.assign(
+        payload.document, {
+          key: evaluation.documents.length + 1,
+          workflows_availables: state.work.workflows_availables_evaluation_documents,
+          workflows: [],
+        }));
+    },
+    removeDocument(state, {key, document}) {
+      let evaluations = state.evaluationsPicked.find(e => e.key === key);
+
+      if (evaluations === undefined) {
+        return;
+      }
+
+      evaluations.documents = evaluations.documents.filter(d => d.key !== document.key);
+    },
     addEvaluation(state, evaluation) {
       let e = {
         type: "accompanying_period_work_evaluation",
@@ -284,6 +308,10 @@ const store = createStore({
     setIsPosting(state, st) {
       state.isPosting = st;
     },
+    updateDocumentTitle(state, payload) {
+      state.evaluationsPicked.find(e => e.key === payload.evaluationKey)
+          .documents.find(d => d.id === payload.id).title = payload.title;
+    }
   },
   actions: {
     updateThirdParty({ commit }, payload) {
@@ -374,13 +402,18 @@ const store = createStore({
           });
       }
     },
+    addDocument({commit}, payload) {
+      commit('addDocument', payload);
+    },
+    removeDocument({commit}, payload) {
+      commit('removeDocument', payload);
+    },
     submit({ getters, state, commit }, callback) {
       let
         payload = getters.buildPayload,
         url = `/api/1.0/person/accompanying-course/work/${state.work.id}.json`,
         errors = []
       ;
-
       commit('setIsPosting', true);
 
       return makeFetch('PUT', url, payload)
@@ -397,36 +430,9 @@ const store = createStore({
           commit('setErrors', error.violations);
         });
     },
-    patchOnTheFly({ commit }, payload) {
-      let body = { type: payload.type };
-      const id = payload.data.id;
-      let url = `/api/1.0/person/person/${id}.json`;
-      let mutation = "updatePerson";
-
-      if (payload.type === 'person') {
-          body.firstName = payload.data.firstName;
-          body.lastName = payload.data.lastName;
-          if (payload.data.birthdate !== null) { body.birthdate = payload.data.birthdate; }
-            body.phonenumber = payload.data.phonenumber;
-            body.mobilenumber = payload.data.mobilenumber;
-            body.gender = payload.data.gender;
-      } else if (payload.type === 'thirdparty') {
-          body.name = payload.data.text;
-          body.email = payload.data.email;
-          body.telephone = payload.data.phonenumber;
-          body.address = { id: payload.data.address.address_id };
-
-        url = `/api/1.0/thirdparty/thirdparty/${id}.json`;
-        mutation = 'updateThirdparty'
-      }
-      makeFetch('PATCH', url, body)
-        .then((response) => {
-            commit(mutation, {target: payload.target, thirdparty: response});
-        })
-        .catch((error) => {
-            throw error;
-        })
-  },
+    updateDocumentTitle({commit}, payload) {
+      commit('updateDocumentTitle', payload)
+    }
   }
 });
 

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue

@@ -57,13 +57,17 @@
                   v-bind:item="item"
                   v-bind:search="search"
                   v-bind:type="checkUniq"
+                  @saveFormOnTheFly="saveFormOnTheFly"
+                  @newPriorSuggestion="newPriorSuggestion"
                   @updateSelected="updateSelected">
                </person-suggestion>
 
                <div class="create-button">
                   <on-the-fly
-                     v-if="query.length >= 3"
+                     v-if="queryLength >= 3 && (options.type.includes('person') || options.type.includes('thirdparty'))"
                      :buttonText="$t('onthefly.create.button', {q: query})"
+                     :allowedTypes="options.type"
+                     :query="query"
                      action="create"
                      @saveFormOnTheFly="saveFormOnTheFly"
                      ref="onTheFly">
@@ -247,7 +251,7 @@ export default {
          }
       },
       newPriorSuggestion(entity) {
-         console.log('newPriorSuggestion', entity);
+         // console.log('newPriorSuggestion', entity);
          if (entity !== null) {
             let suggestion = {
                key: entity.type + entity.id,

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/PersonSuggestion.vue

@@ -18,6 +18,7 @@
 
          <suggestion-third-party
             v-if="item.result.type === 'thirdparty'"
+            @newPriorSuggestion="newPriorSuggestion"
             v-bind:item="item">
          </suggestion-third-party>
 
@@ -26,10 +27,10 @@
             v-bind:item="item">
          </suggestion-user>
 
-        <suggestion-household
-            v-if="item.result.type === 'household'"
-            v-bind:item="item">
-        </suggestion-household>
+         <suggestion-household
+               v-if="item.result.type === 'household'"
+               v-bind:item="item">
+         </suggestion-household>
       </label>
 
    </div>
@@ -54,7 +55,7 @@ export default {
       'search',
       'type'
    ],
-   emits: ['updateSelected'],
+   emits: ['updateSelected', 'newPriorSuggestion'],
    computed: {
       selected: {
          set(value) {
@@ -72,6 +73,9 @@ export default {
    methods: {
       setValueByType(value, type) {
          return (type === 'radio')? [value] : value;
+      },
+      newPriorSuggestion(response) {
+         this.$emit('newPriorSuggestion', response)
       }
    }
 };

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons/TypeThirdParty.vue

@@ -1,13 +1,14 @@
 <template>
     <div class="container tpartycontainer">
       <div class="tparty-identification">
+        <span v-if="item.result.profession" class="profession">{{ item.result.profession.name.fr }}</span>
         <span class="name">
-           {{ item.result.text }}&nbsp;
+          {{ item.result.text }}&nbsp;
         </span>
         <span class="location">
           <template v-if="hasAddress">
-           {{ getAddress.text }} -
-           {{ getAddress.postcode.name }}
+            {{ getAddress.text }} -
+            {{ getAddress.postcode.name }}
           </template>
         </span>
       </div>
@@ -19,21 +20,28 @@
     </div>
 
     <div class="right_actions">
-       <badge-entity
-         :entity="item.result"
-         :options="{ displayLong: true }">
-       </badge-entity>
-       <on-the-fly
-           type="thirdparty"
-           v-bind:id="item.result.id"
-           action="show">
-       </on-the-fly>
+      <badge-entity
+        :entity="item.result"
+        :options="{ displayLong: true }">
+      </badge-entity>
+      <on-the-fly v-if="item.result.kind === 'company'"
+          v-bind:parent="item.result"
+          @saveFormOnTheFly="saveFormOnTheFly"
+          action="addContact"
+          ref="onTheFly"
+      ></on-the-fly>
+      <on-the-fly
+          type="thirdparty"
+          v-bind:id="item.result.id"
+          action="show">
+      </on-the-fly>
     </div>
 </template>
 
 <script>
 import OnTheFly from 'ChillMainAssets/vuejs/OnTheFly/components/OnTheFly.vue';
 import BadgeEntity from 'ChillMainAssets/vuejs/_components/BadgeEntity.vue';
+import { makeFetch } from 'ChillMainAssets/lib/api/apiMethods';
 
 const i18n = {
   messages: {
@@ -48,54 +56,79 @@ const i18n = {
 };
 
 export default {
-   name: 'SuggestionThirdParty',
-   components: {
-      OnTheFly,
-      BadgeEntity
-   },
-   props: ['item'],
-   i18n,
-   computed: {
-     hasAddress() {
-       if (this.$props.item.result.address !== null) {
-         return true;
-       }
-       if (this.$props.item.result.parent !== null) {
-         this.$props.item.result.parent.address !== null;
-       }
-     },
-     hasParent() {
-       return this.$props.item.result.parent !== null;
-     },
-     getAddress() {
-       if (this.$props.item.result.address !== null) {
-         return this.$props.item.result.address;
-       }
-       if (this.$props.item.result.parent.address !== null) {
-         return this.$props.item.result.parent.address;
-       }
+  name: 'SuggestionThirdParty',
+  components: {
+    OnTheFly,
+    BadgeEntity
+  },
+  props: ['item'],
+  emits: ['newPriorSuggestion'],
+  i18n,
+  computed: {
+    hasAddress() {
+      if (this.$props.item.result.address !== null) {
+        return true;
+      }
+      if (this.$props.item.result.parent !== null) {
+        this.$props.item.result.parent.address !== null;
+      }
+    },
+    hasParent() {
+      return this.$props.item.result.parent !== null;
+    },
+    getAddress() {
+      if (this.$props.item.result.address !== null) {
+        return this.$props.item.result.address;
+      }
+      if (this.$props.item.result.parent.address !== null) {
+        return this.$props.item.result.parent.address;
+      }
 
-       return null;
-     }
-   }
+      return null;
+    }
+  },
+  methods: {
+    saveFormOnTheFly({data, type}) {
+      makeFetch('POST', '/api/1.0/thirdparty/thirdparty.json', data)
+        .then(response => {
+            this.$emit('newPriorSuggestion', response);
+            this.$refs.onTheFly.closeModal();
+        })
+        .catch((error) => {
+            if (error.name === 'ValidationException') {
+              for (let v of error.violations) {
+                  this.$toast.open({message: v });
+              }
+            } else {
+              this.$toast.open({message: 'An error occurred'});
+            }
+        })
+
+    }
+  }
 }
 </script>
 
 <style lang="scss" scoped>
 .tpartycontainer {
- .tpartyparent {
-    .name {
-      font-weight: bold;
-      font-variant: all-small-caps;
+  .tpartyparent {
+      .name {
+        font-weight: bold;
+        font-variant: all-small-caps;
+      }
+  }
+  .tparty-identification {
+    span:not(.name) {
+      margin-left: 0.5em;
+      opacity: 0.5;
+      font-size: 90%;
+      font-style: italic;
     }
- }
- .tparty-identification {
-   span:not(.name) {
-     margin-left: 0.5em;
-     opacity: 0.5;
-     font-size: 90%;
-     font-style: italic;
-   }
- }
+    .profession {
+      font-weight: 800;
+      color: black;
+      font-style: normal !important;
+    }
+  }
 }
 </style>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue

@@ -12,6 +12,7 @@
                       <!-- use person-text here to avoid code duplication ? TODO -->
                         <span class="firstname">{{ person.firstName }}</span>
                         <span class="lastname">{{ person.lastName }}</span>
+                        <span v-if="person.suffixText" class="suffixtext">&nbsp;{{ person.suffixText }}</span>
                         <span v-if="person.altNames && options.addAltNames ==  true" class="altnames">
                             <span :class="'altname altname-' + altNameKey">{{ altNameLabel }}</span>
                         </span>
@@ -20,6 +21,7 @@
                   <!-- use person-text here to avoid code duplication ? TODO -->
                     <span class="firstname">{{ person.firstName }}</span>
                     <span class="lastname">{{ person.lastName }}</span>
+                    <span v-if="person.suffixText" class="suffixtext">&nbsp;{{ person.suffixText }}</span>
                     <span v-if="person.deathdate" class="deathdate"> (‡)</span>
                     <span v-if="person.altNames && options.addAltNames ==  true" class="altnames">
                         <span :class="'altname altname-' + altNameKey">{{ altNameLabel }}</span>
@@ -85,6 +87,15 @@
                             </p>
                         </li>
 
+                        <li v-if="person.email">
+                            <i class="fa fa-li fa-envelope-o"></i>
+                            <a :href="'mailto: ' + person.email">{{ person.email }}</a>
+                        </li>
+                        <li v-else-if="options.addNoData">
+                            <i class="fa fa-li fa-envelope-o"></i>
+                            <p class="chill-no-data-statement">{{ $t('renderbox.no_data') }}</p>
+                        </li>
+
                         <li v-if="person.mobilenumber">
                             <i class="fa fa-li fa-mobile"></i>
                             <a :href="'tel: ' + person.mobilenumber">{{ person.mobilenumber }}</a>
@@ -102,6 +113,15 @@
                             <p class="chill-no-data-statement">{{ $t('renderbox.no_data') }}</p>
                         </li>
 
+                        <li v-if="person.email">
+                            <i class="fa fa-li fa-envelope-o"></i>
+                            <a :href="'mailto: ' + person.email">{{ person.email }}</a>
+                        </li>
+                        <li v-else-if="options.addNoData">
+                            <i class="fa fa-li fa-envelope-o"></i>
+                            <p class="chill-no-data-statement">{{ $t('renderbox.no_data') }}</p>
+                        </li>
+
                         <li v-if="person.centers !== undefined && person.centers.length > 0 && options.addCenter">
                             <i class="fa fa-li fa-long-arrow-right"></i>
                             <template v-for="c in person.centers">{{ c.name }}</template>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonText.vue

@@ -6,6 +6,7 @@
         <span v-if="person.altNames && person.altNames.length > 0" class="altnames">
             <span :class="'altname altname-' + altNameKey"> ({{ altNameLabel }})</span>
         </span>
+        <span v-if="person.suffixText" class="suffixtext">&nbsp;{{ person.suffixText }}</span>
         <span class="age" v-if="this.addAge && person.birthdate !== null && person.deathdate === null">{{ $tc('renderbox.years_old', person.age) }}</span>
         <span v-else-if="this.addAge && person.deathdate !== null">&nbsp;(‡)</span>
     </span>

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue

@@ -32,6 +32,14 @@
       <label for="lastname">{{ $t('person.lastname') }}</label>
    </div>
 
+   <div v-if="queryItems">
+      <ul class="list-suggest add-items inline">
+         <li v-for="(qi, i) in queryItems" :key="i" @click="addQueryItem('lastName', qi)">
+            <span class="person-text">{{ qi }}</span>
+         </li>
+      </ul>
+   </div>
+
    <div class="form-floating mb-3">
       <input
           class="form-control form-control-lg"
@@ -43,6 +51,14 @@
       <label for="firstname">{{ $t('person.firstname') }}</label>
    </div>
 
+   <div v-if="queryItems">
+      <ul class="list-suggest add-items inline">
+         <li v-for="(qi, i) in queryItems" :key="i" @click="addQueryItem('firstName', qi)">
+            <span class="person-text">{{ qi }}</span>
+         </li>
+      </ul>
+   </div>
+
    <div v-for="(a, i) in config.altNames" :key="a.key" class="form-floating mb-3">
       <input
           class="form-control form-control-lg"
@@ -122,7 +138,7 @@ import PersonRenderBox from '../Entity/PersonRenderBox.vue';
 
 export default {
    name: "OnTheFlyPerson",
-   props: ['id', 'type', 'action'],
+   props: ['id', 'type', 'action', 'query'],
    //emits: ['createAction'],
    components: {
       PersonRenderBox
@@ -203,6 +219,9 @@ export default {
       },
       personAltNamesLabels() {
          return this.person.altNames.map(a => a ? a.label : '');
+      },
+      queryItems() {
+         return this.query ? this.query.split(' ') : null;
       }
    },
    mounted() {
@@ -244,6 +263,16 @@ export default {
          )
          this.person.altNames = updateAltNames;
       },
+      addQueryItem(field, queryItem) {
+         switch (field) {
+            case 'lastName':
+               this.person.lastName = queryItem;
+               break;
+            case 'firstName':
+               this.person.firstName = queryItem;
+               break;
+         }
+      }
    }
 }
 </script>