add addPersons subcomponent

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

@@ -1,16 +1,54 @@
 <template>
-  hello
+  
+  <teleport to="#add-persons">
+     <add-persons 
+        buttonTitle="activities.add_persons"
+        modalTitle="activities.add_persons"
+        v-bind:key="addPersons.key"
+        v-bind:options="addPersons.options"
+        @addNewPersons="addNewPersons"
+        ref="addPersons"> <!-- to cast child method -->
+     </add-persons>
+  </teleport>
+ 
 </template>
 
 <script>
 import { mapState } from 'vuex';
+import AddPersons from 'ChillPersonAssets/vuejs/_components/AddPersons.vue';
 
 export default {
    name: "App",
-   components: {},
+   components: {
+      AddPersons
+   },
+   data() {
+      return {
+         addPersons: {
+            key: 'activity',
+            options: {
+               type: ['person', 'thirdparty'],
+               priority: null,
+               uniq: false,
+            }
+         }
+      }
+   },
    computed: mapState([
       'activity'
-   ])
+   ]),
+   methods: {
+      addNewPersons({ selected, modal }) {
+         console.log('@@@ CLICK button addNewPersons', selected);
+         selected.forEach(function(item) {
+               //this.$store.dispatch('addResource', item);
+               console.log('item', item);
+            }, this
+         );
+         this.$refs.addPersons.resetSearch(); // to cast child method
+         modal.showModal = false;
+      }
+   }
 }
 </script>