household address: add a button for posting to household

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

@@ -8,20 +8,31 @@
    <add-address
       @addNewAddress="addNewAddress">
    </add-address>
+   <!-- <add-address-to-household
+      @addAddressToHousehold="addAddressToHousehold">
+   </add-address-to-household> -->
+   <button class="sc-button bt-create centered mt-4" @click="addAddressToHousehold">
+      {{ $t('add_an_address_to_household') }}
+   </button>
 </template>
 
 <script>
 
 import AddAddress from 'ChillMainAssets/vuejs/_components/AddAddress.vue';
+//import AddAddressToHousehold from './components/AddAddressToHousehold.vue';
 
 export default {
    name: 'App',
    components: {
-      AddAddress
+      AddAddress,
+      //AddAddressToHousehold
    },
    computed: {
       address() {
          return this.$store.state.address;
+      },
+      householdId() {
+         return window.householdId;
       }
    },
    methods: {
@@ -48,6 +59,13 @@ export default {
 
          this.$store.dispatch('addAddress', newAddress);
          modal.showModal = false;
+      },
+      addAddressToHousehold() {
+         const household = householdId;
+         const address = address;
+         console.log(household);
+         console.log(address)
+         this.$store.dispatch('addAddressToHousehold', household, address);
       }
    }
 };

src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/api.js

@@ -0,0 +1,19 @@
+/*
+* Endpoint household
+* method POST, post Household instance //TODO should be PATCH?
+*
+*  @id     integer - id of household
+*  @body   Object - dictionary with changes to post
+*/
+export const postAddressToHousehold = (id, body) => {
+   const url = `/api/1.0/person/household/${id}.json`
+   return fetch(url, {
+         method: 'POST',
+         headers: {'Content-Type': 'application/json;charset=utf-8'},
+         body: JSON.stringify(body)
+      })
+      .then(response => {
+         if (response.ok) { return response.json(); }
+         throw Error('Error with request resource response');
+      });
+};

src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/components/AddAddressToHousehold.vue

@@ -0,0 +1,31 @@
+<template>
+   <button class="sc-button bt-create centered mt-4" @click="doSmthg">
+      {{ $t('add_an_address_to_household') }}
+   </button>
+</template>
+
+<script>
+
+
+export default {
+    name: 'AddAddressToHousehold',
+    components: {
+    },
+    props: [
+    ],
+    //emits: ['addNewAddress'],
+    data() {
+        return {
+            household: {
+            }, //TODO needed?
+            errorMsg: {}
+        }
+    },
+    methods: {
+        doSmthg() {
+            //TODO
+            console.log('click btn add_an_address_to_household')
+        },
+    }
+}
+</script>

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

@@ -1,7 +1,8 @@
 import 'es6-promise/auto';
 import { createStore } from 'vuex';
 
-import { postAddress } from 'ChillMainAssets/vuejs/_api/AddAddress'
+import { postAddress } from 'ChillMainAssets/vuejs/_api/AddAddress';
+import { postAddressToHousehold } from '../api';
 
 const debug = process.env.NODE_ENV !== 'production';
 
@@ -9,6 +10,7 @@ const store = createStore({
    strict: debug,
    state: {
       address: {},
+      household: {},
       errorMsg: []
    },
    getters: {
@@ -20,6 +22,10 @@ const store = createStore({
       addAddress(state, address) {
          console.log('@M addAddress address', address);
          state.address = address;
+      },
+      addAddressToHousehold(state, household) {
+         console.log('@M addAddress address', household);
+         state.household = household;
       }
    },
    actions: {
@@ -34,6 +40,18 @@ const store = createStore({
             .catch((error) => {
                commit('catchError', error);
             });
+      },
+      addAddressToHousehold({ commit }, payload) {
+         console.log('@A addAddressToHousehold payload', payload);
+
+         postAddressToHousehold(payload)
+            .then(household => new Promise((resolve, reject) => {
+               commit('addAddressToHousehold', household);
+               resolve();
+            }))
+            .catch((error) => {
+               commit('catchError', error);
+            });
       }
    }
 });