committing actions added to component

Author: Schillaci767

src/components/HomeSideDropDownItems/VuexForm.vue

@@ -73,7 +73,7 @@ Description:
       id="add-actions-btn"
       color="secondary"
       label="Add Action(s)"
-      @click="addActionToComponent"
+      @click="addActionToComp"
     />
       </div>
     </template>
@@ -102,15 +102,15 @@ export default {
       'componentMap',
       'activeComponent',
       'activeRoute',
-      'routes',
+      'selectedActions',
       'userActions'
     ]),
     options () {
       return this.userActions
     }
   },
   methods: {
-    ...mapActions(['setActiveComponent', 'createAction', 'addActionSelected']),
+    ...mapActions(['setActiveComponent', 'createAction', 'addActionSelected', 'addActionToComponent']),
     selectAction (value) {
       this.addActionSelected(value)
     },
@@ -123,6 +123,12 @@ export default {
         this.text = ''
       }
     },
+    addActionToComp () {
+      this.addActionToComponent(this.selectedActions)
+      console.log('activeComponent', (this.routes[this.activeRoute].filter(comp => {
+        return comp.componentName === this.activeComponent
+      })[0]))
+    },
     // when multiselect is opened activeComponent is deselected to allow for parentSelected action
     resetActiveComponent () {
       if (this.activeComponent !== '') {

src/store/actions.js

@@ -121,6 +121,10 @@ const actions = {
   [types.addActionSelected]: ({ commit }, payload) => {
     commit(types.ADD_ACTION_SELECTED, payload)
   },
+
+  [types.addActionToComponent]: ({ commit }, payload) => {
+    commit(types.ADD_ACTION_TO_COMPONENT, payload)
+  },
   // End of Vuex Actions section //////////////////////////////////////////
 
   // Actions dispatched from left hand panel////////////////////////////////////////

src/store/mutations.js

@@ -91,6 +91,20 @@ const mutations = {
     // state.selectedActions.push(payload);
   },
 
+  [types.ADD_ACTION_TO_COMPONENT]: (state, payload) => {
+    let active = (state.routes[state.activeRoute].filter(comp => {
+      return comp.componentName === state.activeComponent
+    })[0])
+
+    if (!active.actions) {
+      active.actions = payload
+    } else {
+      for (let action of payload) {
+        if (!active.actions.includes(action)) { active.actions.push(action) }
+      }
+    }
+  },
+
   // *** HTML ELEMENTS *** //////////////////////////////////////////////
 
   [types.ADD_NESTED_HTML]: (state, payload) => {

src/store/types.js

@@ -1,5 +1,6 @@
 // Mutations
 export const ADD_ACTION_SELECTED = 'ADD_ACTION_SELECTED'
+export const ADD_ACTION_TO_COMPONENT = 'ADD_ACTION_TO_COMPONENT'
 export const ADD_COMPONENT_TO_ACTIVE_ROUTE_CHILDREN = 'ADD_COMPONENT_TO_ACTIVE_ROUTE_CHILDREN'
 export const ADD_COMPONENT_TO_ACTIVE_ROUTE_IN_ROUTE_MAP = 'ADD_COMPONENT_TO_ACTIVE_ROUTE_IN_ROUTE_MAP'
 export const ADD_COMPONENT_TO_COMPONENT_CHILDREN = 'ADD_COMPONENT_TO_COMPONENT_CHILDREN'
@@ -49,6 +50,7 @@ export const UPDATE_OPEN_MODAL = 'UPDATE_OPEN_MODAL'
 
 // Actions
 export const addActionSelected = 'addActionSelected'
+export const addActionToComponent = 'addActionToComponent'
 export const addNestedHTML = 'addNestedHTML'
 export const addNestedNoActive = 'addNestedNoActive'
 export const addProject = 'addProject'