AddPersons in activity

* modal button dont submit all form
* addNewPersons action mutation loop ready

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/App.vue

@@ -7,7 +7,7 @@
         v-bind:key="addPersons.key"
         v-bind:options="addPersons.options"
         @addNewPersons="addNewPersons"
-        ref="addPersons"> <!-- to cast child method -->
+        ref="addPersons">
      </add-persons>
   </teleport>
  
@@ -41,7 +41,7 @@ export default {
       addNewPersons({ selected, modal }) {
          console.log('@@@ CLICK button addNewPersons', selected);
          selected.forEach(function(item) {
-               //this.$store.dispatch('addResource', item);
+               this.$store.dispatch('addPersonsInvolved', item);
                console.log('item', item);
             }, this
          );

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/i18n.js

@@ -3,7 +3,7 @@ import { personMessages } from 'ChillPersonAssets/vuejs/_js/i18n'
 const appMessages = {
    fr: {
       activities: {
-         add_persons: "Ajouter des personnes"
+         add_persons: "Ajouter des personnes concernées"
       }
    }
 }

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/parcours.html

@@ -1,72 +0,0 @@
-Controleur:
-
-activity_json = $this->serializer->serialize($activity, 'json', []);
-
-return render('@ChillActivity/...', [
-  'activity' => $activity,
-  'activity_json' => $activity_json
-])
-
-
-{# template twig de activity #}
-
-{{ form(activity) }}
-
-{% block js %}
-<script>
-{# window.activity = {{ activity_json|e('json') }}; #}
-window.activity = {
-  "type": "activity",
-  "persons": [
-    { type: person, id: xxx, ...}
-    { ...}
-  ],
-  ""
-};
-</script>
-{{ encore_entry_script_tags('activity_form') }}
-{% endblock %}
-
-
-{# -----
-   dans le fichier app.js: #}
-<script type="text/javascript">
-
-
-
-const store = createStore({
-   strict: debug,
-   state(): return {
-     activity: window.activity
-   },
-   getters: {
-
-   },
-   mutations: {
-      addPerson(state, payload) {
-
-      }
-   },
-   actions: {
-      addPerson() {
-        let el = document.getElementById('form['activity']['xxx']['xxxx']');
-        let option = document.createElement('option');
-        option.value = person.id;
-        el.appendChild(option);
-        commit('addPerson', payload)
-     }
-  }
-});
-
-const i18n = _createI18n(appMessages);
-
-const app = createApp({
-   template: `<app></app>`,
-})
-.use(store)
-.use(i18n)
-.component('app', App)
-.mount('#activity');
-
-
-</script>

src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/store.js

@@ -13,17 +13,18 @@ const store = createStore({
 
    },
    mutations: {
-      addPerson(state, payload) {
+      addPersonsInvolved(state, payload) {
-
+         console.log('### mutation addPersonsInvolved', payload);
       }
    },
    actions: {
-      addPerson() {
+      addPersonsInvolved({ commit }, payload) {
+         console.log('### action addPersonsInvolved', payload);
         //let el = document.getElementById('form['activity']['xxx']['xxxx']');
         //let option = document.createElement('option');
         //option.value = person.id;
         //el.appendChild(option);
-        commit('addPerson', payload)
+        commit('addPersonsInvolved', payload)
      }
   }
 });

src/Bundle/ChillActivityBundle/Resources/views/Activity/editAccompanyingCourse.html.twig

@@ -13,7 +13,8 @@
 {% block js %}
     <script src="{{ asset('build/async_upload.js') }}" type="text/javascript"></script>
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', 
+            '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
         window.activity = {{ activity_json|json_encode|raw }}; 
     </script>
     {{ encore_entry_script_tags('vue_activity') }}

src/Bundle/ChillActivityBundle/Resources/views/Activity/editPerson.html.twig

@@ -28,7 +28,8 @@
 {% block js %}
     <script src="{{ asset('build/async_upload.js') }}" type="text/javascript"></script>
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        chill.displayAlertWhenLeavingModifiedForm('form[name="{{ edit_form.vars.form.vars.name }}"]', 
+            '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
         window.activity = {{ activity_json|json_encode|raw }};
     </script>
     {{ encore_entry_script_tags('vue_activity') }}

src/Bundle/ChillActivityBundle/Resources/views/Activity/newAccompanyingCourse.html.twig

@@ -13,7 +13,8 @@
 {% block js %}
     <script src="{{ asset('build/async_upload.js') }}" type="text/javascript"></script>
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', 
+            '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
         window.activity = {{ activity_json|json_encode|raw }}; 
     </script>
     {{ encore_entry_script_tags('vue_activity') }}

src/Bundle/ChillActivityBundle/Resources/views/Activity/newPerson.html.twig

@@ -12,7 +12,8 @@
 {% block js %}
     <script src="{{ asset('build/async_upload.js') }}" type="text/javascript"></script>
     <script type="text/javascript">
-        chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
+        chill.displayAlertWhenLeavingUnsubmittedForm('form[name="{{ form.vars.form.vars.name }}"]', 
+            '{{ "You are going to leave a page with unsubmitted data. Are you sure you want to leave ?"|trans }}');
         window.activity = {{ activity_json|json_encode|raw }};
     </script>
     {{ encore_entry_script_tags('vue_activity') }}

src/Bundle/ChillActivityBundle/translations/messages.fr.yml

@@ -20,7 +20,7 @@ present: présent
 not present: absent
 Delete: Supprimer
 Update: Mettre à jour
-Update activity: Édition de l'activité
+Update activity: Modifier l'activité
 Scope: Cercle
 Activity data: Données de l'activité
 No reason associated: Aucun sujet

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

@@ -1,9 +1,9 @@
 <template>
    <ul class="record_actions">
-      <li>
+      <li class="add-persons">
-         <button class="sc-button bt-create" @click="openModal">
+         <a class="sc-button bt-create" @click="openModal">
             {{ $t(buttonTitle) }}
-         </button>
+         </a>
       </li>
    </ul>
 
@@ -213,6 +213,11 @@ export default {
 </script>
 
 <style lang="scss">
+   li.add-persons {
+      a {
+         cursor: pointer;
+      }
+   }
    div.body-head {
       overflow-y: unset;
       div.modal-body:first-child {