prepare close participation button (wip)

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

@@ -24,10 +24,16 @@
          </li>
          <li>
             <button class="sc-button bt-delete"
-               :title="$t('action.remove')" 
+               :title="$t('action.delete')" 
                @click.prevent="$emit('remove', participation)">
             </button>
          </li>
+         <li>
+            <button class="sc-button bt-remove"
+               :title="$t('action.remove')" 
+               @click="closeParticipation">
+            </button>
+         </li>
       </ul>
    </td>
 </tr>
@@ -45,6 +51,11 @@ export default {
          }
       }
    },
-   emits: ['remove']
+   emits: ['remove'],
+   methods: {
+      closeParticiapation() {
+         
+      }
+   }
 }
 </script>

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

@@ -17,17 +17,17 @@
             v-for="participation in participations" 
             v-bind:participation="participation" 
             v-bind:key="participation.id" 
-            @remove="removePerson">
+            @remove="removeParticipation">
          </person-item>
       </tbody>
    </table>
    <add-persons></add-persons>
    <ul class="record_actions">
-      <li>
+      <!--li>
          <button class="sc-button orange" @click="savePersons">
             {{ $t('action.save') }}
          </button>
-      </li>
+      </li-->
    </ul>
 </div>
 </template>
@@ -48,12 +48,14 @@ export default {
       counter: state => state.accompanying_course.participations.length
    }),
    methods: {
-      removePerson(item) {
+      removeParticipation(item) {
          this.$store.dispatch('removeParticipation', item)
       },
+      /*
       savePersons() {
          console.log('[wip] saving persons');
       }
+*/
    }
 }
 </script>

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

@@ -25,10 +25,13 @@ let getDataPromise = getAccompanyingCourse(id)
          },
          mutations: {
             removeParticipation(state, item) {
-               //console.log('remove item', item.id);
+               //console.log('mutation: remove item', item.id);
-               state.accompanying_course.participations = state.accompanying_course.participations.filter(
+               state.accompanying_course.participations = state.accompanying_course.participations.filter(participation => participation !== item);
-                  participation => participation !== item
+            },
-               );
+            closeParticipation(state, item) {
+               console.log('mutation: close item', item.id);
+               let participation = state.accompanying_course.participations.filter(participation => participation === item);
+               console.log('participation', participation);
             },
             addParticipation(state, item) {
                //console.log('add new item');

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

@@ -43,6 +43,9 @@
                   v-bind:item="item" 
                   v-bind:key="item.id">
                </person-suggestion>
+               <button v-if="query.length >= 3" class="sc-button bt-create ml-5 mt-2" name="createPerson">
+                  Ajouter "{{ query }}"
+               </button>
             </div>
          </template>
                
@@ -112,17 +115,6 @@ export default {
       addPersons() {
          console.log('add persons');
          // code here
-         /*
-         addPerson() {
-            console.log('[wip] opening add persons modal');
-            this.$store.dispatch('addParticipation', {
-               id: SimpsonId++,
-               person: { firstName: "Lisa", lastName: "Simpson", id: SimpsonId },
-               startDate: { datetime: "1975-09-15T00:00:00+0100" }, 
-               endDate: { datetime: "1975-09-28T00:00:00+0100" }, 
-            })
-         },
-         */
          this.modal.showModal = false;
       }
    }