household address: init vue component for household address

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

@@ -0,0 +1,56 @@
+<template>
+   <div v-if="address.text">
+      {{ address.text }}
+   </div>
+   <div v-if="address.postcode">
+      {{ address.postcode.name }}
+   </div>
+   <add-address
+      @addNewAddress="addNewAddress">
+   </add-address>
+</template>
+
+<script>
+
+import AddAddress from 'ChillMainAssets/vuejs/_components/AddAddress.vue';
+
+export default {
+   name: 'App',
+   components: {
+      AddAddress
+   },
+   computed: {
+      address() {
+         return this.$store.state.address;
+      }
+   },
+   methods: {
+      addNewAddress({ address, modal }) {
+         console.log('@@@ CLICK button addNewAdress', address);
+
+         let newAddress = {
+            'isNoAddress': address.isNoAddress,
+            'street': address.selected.address.street,
+            'streetNumber': address.selected.address.streetNumber,
+            'postcode': {'id': address.selected.city.id },
+            'floor': address.floor,
+            'corridor': address.corridor,
+            'steps': address.steps,
+            'flat': address.flat,
+            'buildingName': address.buildingName,
+            'distribution': address.distribution,
+            'extra': address.extra
+         };
+
+         if (address.selected.address.point !== undefined){
+            newAddress = Object.assign(newAddress, {'point': address.selected.address.point.coordinates});
+         }
+
+         this.$store.dispatch('addAddress', newAddress);
+         modal.showModal = false;
+      }
+   }
+};
+
+</script>
+

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

@@ -0,0 +1,25 @@
+import { createApp } from 'vue'
+import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n'
+import { appMessages } from './js/i18n'
+import { store } from './store'
+
+import App from './App.vue';
+
+const root = window.vueRootComponent;
+
+/*
+*  Load all App component, for Household edition page
+*/
+
+const i18n = _createI18n(appMessages);
+
+const app = createApp({
+   template: `<app></app>`,
+})
+.use(store)
+.use(i18n)
+.component('app', App)
+.mount('#household-address');
+
+
+

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

@@ -0,0 +1,12 @@
+import { addressMessages } from 'ChillMainAssets/vuejs/Address/js/i18n'
+
+const appMessages = {
+   fr: {
+   }
+};
+
+Object.assign(appMessages.fr, addressMessages.fr);
+
+export {
+   appMessages
+};

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

@@ -0,0 +1,41 @@
+import 'es6-promise/auto';
+import { createStore } from 'vuex';
+
+import { postAddress } from 'ChillMainAssets/vuejs/_api/AddAddress'
+
+const debug = process.env.NODE_ENV !== 'production';
+
+const store = createStore({
+   strict: debug,
+   state: {
+      address: {},
+      errorMsg: []
+   },
+   getters: {
+   },
+   mutations: {
+      catchError(state, error) {
+         state.errorMsg.push(error);
+      },
+      addAddress(state, address) {
+         console.log('@M addAddress address', address);
+         state.address = address;
+      }
+   },
+   actions: {
+      addAddress({ commit }, payload) {
+         console.log('@A addAddress payload', payload);
+
+         postAddress(payload)
+            .then(address => new Promise((resolve, reject) => {
+               commit('addAddress', address);
+               resolve();
+            }))
+            .catch((error) => {
+               commit('catchError', error);
+            });
+      }
+   }
+});
+
+export { store };