From 2f28e02f65d62eec884a2119fb38afafff85c186 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Fri, 13 Aug 2021 15:43:37 +0200 Subject: [PATCH] prepare vue Address to be used too in accompanyingCourse context i18n is managed by root component: * ok for person and household implementation (=> they use Address root component) * but must be imported in vue i18n file if called from another component submitAddress is emit to parent, it allow to control final action: * casting final submitNewAddress with POST requests (for person or household entity); * or dispatching changes from store, casting only payload to be used. remove and simplify some options: backurl is always used with person/household, and never if called from another vue component. --- .../Resources/public/vuejs/Address/App.vue | 32 ++++----- .../vuejs/Address/components/AddAddress.vue | 66 +++++++++---------- .../Resources/public/vuejs/Address/index.js | 10 ++- .../Resources/public/vuejs/_api/AddAddress.js | 30 ++++++++- 4 files changed, 79 insertions(+), 59 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue index 94042d446..028544b4a 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue @@ -4,25 +4,12 @@ {{ error }} -
-
-

{{ addAddress.result.street }} - {{ addAddress.result.streetNumber }} -

-

- {{ addAddress.result.postcode.code }} - {{ addAddress.result.postcode.name }} -

-

{{ addAddress.result.country.name.fr }}

-
-
- @@ -78,19 +65,22 @@ export default { bindModal: { step1: window.binModalStep1, //boolean, default: true step2: window.binModalStep2 //boolean, default: true - }, - - // Options only for root parent component - displayResult: true, - redirectToBackUrl: true - }, - result: null // <== returned from addAddress component + } + } } } }, methods: { displayErrors() { return this.$refs.addAddress.errorMsg; + }, + submitAddress() { + console.log('@@@ click on Submit Address Button'); + + // Cast child method + this.$refs.addAddress.submitNewAddress(); + // it fetch post request only for person and household + // else get returned payload then dispatch from here (parent) } } } diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress.vue index 6139f5e8e..aef94feb9 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress.vue @@ -18,7 +18,7 @@

{{ $t(getTextTitle) }} - Loading... + {{ $t('loading') }}

@@ -41,7 +41,7 @@ {{ $t('action.edit')}} @@ -59,7 +59,7 @@ v-bind:flag="this.flag" ref="showAddress" v-bind:insideModal="false" @openEditPane="openEditPane" - @submitAddress="submitAddress"> + @submitAddress="$emit('submitAddress')"> @@ -73,7 +73,7 @@

{{ $t(getTextTitle) }} - Loading... + {{ $t('loading') }}

@@ -125,14 +125,10 @@ import { postAddressToPerson, postAddressToHousehold } from "ChillPersonAssets/v import ShowAddress from './ShowAddress.vue'; import EditAddress from './EditAddress.vue'; -import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n' -import { addressMessages } from '../i18n' -const i18n = _createI18n(addressMessages); - export default { name: "AddAddress", props: ['context', 'options', 'result'], - i18n, + emits: ['submitAddress'], components: { Modal, ShowAddress, @@ -519,9 +515,10 @@ export default { * When submit address * (get out step1 show pane, submit button) */ - submitAddress() + submitNewAddress() { let payload = { + entity: this.context.entity.type, entityId: this.context.entity.id, addressId: this.entity.address.address_id, body: { @@ -532,25 +529,32 @@ export default { backUrl: this.context.backUrl } - console.log('@@@ CLICK button submitAddress for', this.context.entity.type, 'with payload', payload); - this.addDateToAddressAndAddressTo(payload, this.context.entity.type); + if ( payload.entity !== 'person' && payload.entity !== 'household' ) { + + // just return payload to parent + // (changes will be patched in parent store) + this.initForm(); + this.flag.showPane = false; + return payload; + } + + console.log('submitNewAddress with', payload); + this.addDateToAddressAndAddressTo(payload); this.initForm(); this.flag.showPane = false; }, - addDateToAddressAndAddressTo(payload, postTo) + addDateToAddressAndAddressTo(payload) { - console.log('addDateToAddressAndAddressTo', postTo) + console.log('addDateToAddressAndAddressTo', payload.entity) this.flag.loading = true; - patchAddress(payload.addressId, payload.body) + return patchAddress(payload.addressId, payload.body) .then(address => new Promise((resolve, reject) => { this.valid.from = address.validFrom; resolve(); }) - .then( - this.postAddressTo(payload, postTo) - ) + .then(this.postAddressTo(payload)) ) .catch((error) => { this.errorMsg.push(error); @@ -558,11 +562,11 @@ export default { }); }, - postAddressTo(payload, postTo) + postAddressTo(payload) { - console.log('postAddressTo', postTo); + console.log('postAddressTo', payload.entity); if (!this.context.edit) { - switch (postTo) { + switch (payload.entity) { case 'household': postAddressToHousehold(payload.entityId, payload.addressId) .then(household => new Promise((resolve, reject) => { @@ -571,9 +575,7 @@ export default { this.flag.loading = false; this.flag.success = true; - if (this.options.redirectToBackUrl) { - window.location.assign(payload.backUrl); - } + window.location.assign(payload.backUrl); resolve(); })) .catch((error) => { @@ -582,9 +584,7 @@ export default { }) ; break; - case 'person': - default: postAddressToPerson(payload.entityId, payload.addressId) .then(person => new Promise((resolve, reject) => { @@ -593,9 +593,7 @@ export default { this.flag.loading = false; this.flag.success = true; - if (this.options.redirectToBackUrl) { - window.location.assign(payload.backUrl); - } + window.location.assign(payload.backUrl); resolve(); })) .catch((error) => { @@ -603,12 +601,12 @@ export default { this.flag.loading = false; }) ; + break; + default: + this.errorMsg.push('That entity is not managed by address !'); } - } else { - // address is already posted, just finish ! - if (this.options.redirectToBackUrl) { - window.location.assign(payload.backUrl); - } + } else { // address is already linked, just finish ! + window.location.assign(payload.backUrl); } }, diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js index c69991c0f..d662ebf5a 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js @@ -1,11 +1,15 @@ -import { createApp } from 'vue' -import { store } from './store' +import { createApp } from 'vue'; import App from './App.vue'; +import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n'; +import { addressMessages } from './i18n'; + +//import { createI18n } from 'vue-i18n'; +//const i18n = createI18n(); +const i18n = _createI18n( addressMessages ); const app = createApp({ template: ``, }) -.use(store) .use(i18n) .component('app', App) .mount('#address'); diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_api/AddAddress.js b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_api/AddAddress.js index 3b8c35e79..cc78df00d 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_api/AddAddress.js +++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_api/AddAddress.js @@ -48,4 +48,32 @@ const postAddressToHousehold = (householdId, addressId) => { }; -export { postAddressToPerson, postAddressToHousehold }; +/* +* Endpoint AccompanyingPeriod +* method POST, post AccompanyingPeriod AddressLocation (temporary address) +* +* @id integer - id of AccompanyingPeriod +* @body Object - dictionary with changes to post +*/ +const patchAddressToAccompanyingPeriod = (accompanyingPeriodId, addressId) => { + const body = { + 'type': 'accompanying_period', + 'id': accompanyingPeriodId, + 'personLocation': null, + 'addressLocation': { + 'id': addressId + } + }; + const url = `/api/1.0/person/accompanying-course/${accompanyingPeriodId}.json`; + return fetch (url, { + method: 'PATCH', + 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'); + }); +}; + +export { postAddressToPerson, postAddressToHousehold, patchAddressToAccompanyingPeriod };