Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-11-04 03:08:25 +00:00
Code Issues Actions Projects Releases Wiki Activity

Merge branch 'address_refactoring' into add-location-period

Browse Source
This commit is contained in:
Mathieu Jaumotte
2021-08-08 22:31:18 +02:00
parent fae196d3eb 840ffe42a6
commit da98b42c8c
22 changed files with 339 additions and 561 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/Bundle/ChillMainBundle/Resources/public/chill/scss/render_box.scss
View File

@@ -93,7 +93,8 @@ section.chill-entity {
font-style: italic;
}
span.address-valid {
.address-valid {
margin-top: 2em;
&.date-since {}
&.date-until {}
}

33
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue
View File

@@ -19,7 +19,7 @@
</div>
<add-address
v-bind:key="addAddress.type"
v-bind:key="context.entity.type"
v-bind:context="context"
v-bind:options="addAddress.options"
v-bind:result="addAddress.result"
@@ -28,6 +28,13 @@
</template>
<script>
/*
* Address component is a uniq component for many contexts.
* Allow to create/attach/edit an address to
* - a person (new or edit address),
* - a household (move or edit address)
*
* */
import AddAddress from './components/AddAddress.vue';
export default {
@@ -39,40 +46,44 @@ export default {
return {
context: {
edit: window.mode === 'edit',
personId: window.personId,
addressId: window.addressId,
entity: {
type: window.entityType,
id: window.entityId
},
addressId: window.addressId | null,
backUrl: window.backUrl,
},
addAddress: {
options: {
/// Options override default.
/// null value take default component value
/// null value take default component value defined in AddAddress data()
button: {
text: {
/// if create or edit address
create: window.buttonText || null,
edit: window.buttonText || null
},
type: window.button.type || null,
size: window.button.size || null,
display: window.button.display
type: window.buttonType || null,
size: window.buttonSize || null,
display: window.buttonDisplay //boolean, default: true
},
/// Modal title text if create or edit address (trans chain, see i18n)
title: {
create: window.modalTitle || null,
edit: window.modalTitle || null
},
/// Display each step in page or Modal
bindModal: {
step1: window.binModalStep1,
step2: window.binModalStep2
step1: window.binModalStep1, //boolean, default: true
step2: window.binModalStep2 //boolean, default: true
},
// Options only for root parent component
displayResult: true,
redirectToBackUrl: true
},
type: 'person',
result: null // <== returned from addAddress component
}
}

26
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/api.js
View File

@@ -125,31 +125,6 @@ const postPostalCode = (postalCode) => {
});
};
/*
* Endpoint chill_api_single_person_address
* method POST, post Person instance
*
* @id integer - id of Person
* @body Object - dictionary with changes to post
*/
const postAddressToPerson = (personId, addressId) => {
//console.log(personId);
//console.log(addressId);
const body = {
'id': addressId
};
const url = `/api/1.0/person/person/${personId}/address.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');
});
};
/*
* Endpoint chill_api_single_address__index
* method GET, get Address Object
@@ -174,6 +149,5 @@ export {
postAddress,
patchAddress,
postPostalCode,
postAddressToPerson,
getAddress
};

239
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress.vue
View File

@@ -1,5 +1,6 @@
<template>
<!-- start with a button -->
<button v-if="step1WithModal"
@click="openShowPane"
class="btn" :class="getClassButton"
@@ -28,6 +29,7 @@
v-bind:options="this.options"
v-bind:default="this.default"
v-bind:entity="this.entity"
v-bind:valid="this.valid"
v-bind:flag="this.flag"
ref="showAddress">
</show-address>
@@ -53,6 +55,7 @@
v-bind:options="this.options"
v-bind:default="this.default"
v-bind:entity="this.entity"
v-bind:valid="this.valid"
v-bind:flag="this.flag"
ref="showAddress"
v-bind:insideModal="false" @openEditPane="openEditPane"
@@ -117,13 +120,11 @@
<script>
import Modal from 'ChillMainAssets/vuejs/_components/Modal';
import { getAddress, fetchCountries, fetchCities, fetchReferenceAddresses, patchAddress, postAddress, postPostalCode } from '../api';
import { postAddressToPerson } from "ChillPersonAssets/vuejs/_api/AddAddress/Person.js";
import { postAddressToHousehold } from "ChillPersonAssets/vuejs/_api/AddAddress/Household.js";
import ShowAddress from './ShowAddress.vue';
import EditAddress from './EditAddress.vue';
import {
getAddress,
fetchCountries, fetchCities, fetchReferenceAddresses,
patchAddress, postAddress, postPostalCode, postAddressToPerson
} from '../api'
export default {
name: "AddAddress",
@@ -182,7 +183,7 @@ export default {
},
},
valid: {
from: null,
from: new Date(),
to: null
},
errorMsg: []
@@ -227,7 +228,7 @@ export default {
},
mounted() {
if (!this.step1WithModal) {
console.log('Mounted now !');
//console.log('Mounted now !');
this.openShowPane();
}
},
@@ -238,9 +239,11 @@ export default {
*/
openShowPane() {
console.log('open the Show Panel');
if (this.context.addressId) {
if (this.context.edit) {
this.getInitialAddress(this.context.addressId);
}
// when create new address, start first with editPane
if ( this.context.edit === false
&& this.flag.editPane === false
@@ -260,7 +263,7 @@ export default {
},
closeEditPane() {
console.log('close the Edit Panel (with validation)');
console.log('close the Edit Panel');
this.applyChanges();
this.flag.showPane = true;
this.flag.editPane = false;
@@ -359,12 +362,12 @@ export default {
},
/*
* When changes are validated,
* When changes are validated (get out step2 edit pane, button valid),
* apply some transformations before asyncing with backend
* from entity.selected to entity.address
*/
applyChanges() {
applyChanges()
{
let newAddress = {
'isNoAddress': this.entity.selected.isNoAddress,
'street': this.entity.selected.isNoAddress ? '' : this.entity.selected.address.street,
@@ -395,21 +398,71 @@ export default {
}
if (this.context.edit) {
this.updateAddress({ addressId: this.context.addressId, newAddress: newAddress });
this.updateAddress({
addressId: this.context.addressId,
newAddress: newAddress
});
} else {
this.addAddress(newAddress);
}
},
/*
* Async POST transactions,
* creating new address, and receive backend datas when promise is resolved
*/
addAddress(payload)
{
this.flag.loading = true;
if ('newPostcode' in payload) {
let postcodeBody = payload.newPostcode;
if (this.context.entity.type === 'person') {
postcodeBody = Object.assign(postcodeBody, {'origin': 3});
}
postPostalCode(postcodeBody)
.then(postalCode => {
let body = payload;
body.postcode = {'id': postalCode.id },
postAddress(body)
.then(address => new Promise((resolve, reject) => {
this.entity.address = address;
this.flag.loading = false;
this.flag.success = true;
resolve();
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
});
})
} else {
postAddress(payload)
.then(address => new Promise((resolve, reject) => {
this.entity.address = address;
this.flag.loading = false;
this.flag.success = true;
resolve();
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
});
}
},
/*
* Async PATCH transactions,
* then update existing address with backend datas when promise is resolved
*/
updateAddress(payload) {
updateAddress(payload)
{
// TODO change the condition because it writes new postal code in edit mode now: !writeNewPostalCode
this.flag.loading = true;
if ('newPostcode' in payload.newAddress) {
let postcodeBody = payload.newAddress.newPostcode;
postcodeBody = Object.assign(postcodeBody, {'origin': 3});
@@ -421,6 +474,7 @@ export default {
.then(address => new Promise((resolve, reject) => {
this.entity.address = address;
this.flag.loading = false;
this.flag.success = true;
resolve();
}))
.catch((error) => {
@@ -434,6 +488,7 @@ export default {
.then(address => new Promise((resolve, reject) => {
this.entity.address = address;
this.flag.loading = false;
this.flag.success = true;
resolve();
}))
.catch((error) => {
@@ -444,93 +499,101 @@ export default {
},
/*
* Async POST transactions,
* creating new address, and receive backend datas when promise is resolved
* When submit address
* (get out step1 show pane, submit button)
*/
addAddress(payload) {
this.flag.loading = true;
if('newPostcode' in payload){
let postcodeBody = payload.newPostcode;
postcodeBody = Object.assign(postcodeBody, {'origin': 3});
postPostalCode(postcodeBody)
.then(postalCode => {
let body = payload;
body.postcode = {'id': postalCode.id},
postAddress(body)
.then(address => new Promise((resolve, reject) => {
this.entity.address = address;
resolve();
this.flag.loading = false;
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
});
})
} else {
postAddress(payload)
.then(address => new Promise((resolve, reject) => {
this.entity.address = address;
resolve();
this.flag.loading = false;
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
});
}
},
/*
* When submited
*/
submitAddress() {
console.log('@@@ CLICK button submitAddress');
this.addDateToAddressAndAddressToPerson({
personId: this.context.personId,
submitAddress()
{
let payload = {
entityId: this.context.entity.id,
addressId: this.entity.address.address_id,
body: { validFrom: { datetime: `${this.$refs.showAddress.validFrom}T00:00:00+0100`}},
body: {
validFrom: {
datetime: `${this.valid.from.toISOString().split('T')[0]}T00:00:00+0100`
}
},
backUrl: this.context.backUrl
});
}
console.log('@@@ CLICK button submitAddress for', this.context.entity.type, 'with payload', payload);
this.addDateToAddressAndAddressTo(payload, this.context.entity.type);
this.initForm();
this.flag.showPane = false;
},
addDateToAddressAndAddressToPerson(payload) {
console.log('addDateToAddressAndAddressToPerson payload', payload);
addDateToAddressAndAddressTo(payload, postTo)
{
console.log('addDateToAddressAndAddressTo', postTo)
this.flag.loading = true;
patchAddress(payload.addressId, payload.body)
.then(address => new Promise((resolve, reject) => {
this.valid.from = address.validFrom;
resolve();
}).then(
postAddressToPerson(payload.personId, payload.addressId)
.then(person => new Promise((resolve, reject) => {
console.log('commit addAddressToPerson !!!', person);
this.$props.result = person;
this.flag.loading = false;
this.flag.success = true;
if (this.options.redirectToBackUrl) {
window.location.assign(payload.backUrl);
}
resolve();
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
})
))
this.valid.from = address.validFrom;
resolve();
})
.then(
this.postAddressTo(payload, postTo)
)
)
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
});
}
},
postAddressTo(payload, postTo)
{
console.log('postAddressTo', postTo);
if (!this.context.edit) {
switch (postTo) {
case 'household':
postAddressToHousehold(payload.entityId, payload.addressId)
.then(household => new Promise((resolve, reject) => {
console.log('commit addAddressToHousehold', household);
this.flag.loading = false;
this.flag.success = true;
if (this.options.redirectToBackUrl) {
window.location.assign(payload.backUrl);
}
resolve();
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
})
;
break;
case 'person':
default:
postAddressToPerson(payload.entityId, payload.addressId)
.then(person => new Promise((resolve, reject) => {
console.log('commit addAddressToPerson !!!', person);
this.flag.loading = false;
this.flag.success = true;
if (this.options.redirectToBackUrl) {
window.location.assign(payload.backUrl);
}
resolve();
}))
.catch((error) => {
this.errorMsg.push(error);
this.flag.loading = false;
})
;
}
} else {
// address is already posted, just finish !
if (this.options.redirectToBackUrl) {
window.location.assign(payload.backUrl);
}
}
},
}
}
</script>

4
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress/CountrySelection.vue
View File

@@ -31,7 +31,7 @@ export default {
},
computed: {
sortedCountries() {
console.log('sorted countries');
//console.log('sorted countries');
const countries = this.entity.loaded.countries;
let sortedCountries = [];
sortedCountries.push(...countries.filter(c => c.countryCode === 'FR'))
@@ -56,7 +56,7 @@ export default {
return name.fr //TODO multilang
},
selectCountry(value) {
console.log('select country', value);
//console.log('select country', value);
this.entity.selected.country = value;
this.$emit('getCities', value);
}

0
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/components/SelectHouseholdAddress.vue → src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/AddAddress/SelectHouseholdAddress.vue
View File

51
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/ShowAddress.vue
View File

@@ -3,7 +3,13 @@
<div v-if="insideModal == false" class="loading">
<i v-if="flag.loading" class="fa fa-circle-o-notch fa-spin fa-2x fa-fw"></i>
<span class="sr-only">Loading...</span>
<span class="sr-only">{{ $t('loading') }}</span>
</div>
<div v-if="errorMsg && errorMsg.length > 0" class="alert alert-danger">
{{ errorMsg }}
</div>
<div v-if="flag.success" class="alert alert-success">
{{ $t(getSuccessText) }}
</div>
<div class="address multiline">
@@ -59,24 +65,15 @@
</div>
<div v-if="!context.edit" class='address-valid date-since'>
<h3>{{ $t('date') }}</h3>
<h3>{{ $t(getValidFromDateText) }}</h3>
<div class="input-group mb-3">
<span class="input-group-text" id="validFrom"><i class="fa fa-fw fa-calendar"></i></span>
<input type="date" class="form-control form-control-lg" name="validFrom"
v-bind:placeholder="$t('validFrom')"
v-bind:placeholder="$t(getValidFromDateText)"
v-model="validFrom"
aria-describedby="validFrom"
/>
</div>
<!--div v-if="errorMsg.length > 0">
{{ errors }}
</div-->
<div v-if="flag.loading">
{{ $t('loading') }}
</div>
<div v-if="flag.success">
{{ $t('person_address_creation_success') }}
</div>
</div>
</div>
@@ -95,7 +92,7 @@
</li>
<li>
<a class="btn btn-save"
@click.prevent="$emit('submitAddress', { getSubmited , flag })">
@click.prevent="$emit('submitAddress')">
{{ $t('action.save')}}
</a>
</li>
@@ -103,6 +100,7 @@
</template>
<script>
import { dateToISO, ISOToDate, ISOToDatetime } from 'ChillMainAssets/chill/js/date.js';
export default {
name: 'ShowAddress',
@@ -112,10 +110,11 @@ export default {
'default',
'flag',
'entity',
'valid',
'errorMsg',
'insideModal'
],
emits: ['openEditPane', 'submitAddress', 'validFrom'],
emits: ['openEditPane', 'submitAddress'], //?
computed: {
address() {
return this.entity.address;
@@ -132,8 +131,28 @@ export default {
getSubmited() {
return this.entity.address;
},
validFrom() {
return new Date().toISOString().split('T')[0];
validFrom: {
set(value) {
this.valid.from = ISOToDate(value);
},
get() {
return dateToISO(this.valid.from);
}
},
getValidFromDateText() {
return (this.context.entity.type === 'household') ? 'move_date' : 'validFrom';
},
getSuccessText() {
switch (this.context.entity.type) {
/*
case 'household':
return (this.context.edit) ? 'household_address_edit_success' : 'household_address_move_success';
case 'person':
return (this.context.edit) ? 'person_address_edit_success' : 'person_address_creation_success';
*/
default:
return (this.context.edit) ? 'address_edit_success' : 'address_new_success';
}
}
}
};

17
src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/i18n.js
View File

@@ -29,11 +29,24 @@ const addressMessages = {
postalCode_name: 'Nom',
postalCode_code: 'Code postal',
date: 'Date de la nouvelle adresse',
add_an_address_to_person: 'Ajouter l\'adresse à la personne',
validFrom: 'Date de la nouvelle adresse',
back_to_the_list: 'Retour à la liste',
loading: 'chargement en cours...',
address_new_success: 'La nouvelle adresse est enregistrée',
address_edit_success: 'L\'adresse a été mise à jour',
// person specific
add_an_address_to_person: 'Ajouter l\'adresse à la personne',
person_address_creation_success: 'La nouvelle adresse de la personne est enregistrée',
loading: 'chargement en cours...'
person_address_edit_success: 'L\'adresse de la personne a été mise à jour',
// household specific
move_date: 'Date du déménagement',
select_a_existing_address: 'Sélectionner une adresse existante',
add_an_address_to_household: 'Enregistrer',
household_address_move_success: 'La nouvelle adresse du ménage est enregistrée',
household_address_edit_success: 'L\'adresse du ménage a été mise à jour',
}
};

160
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/App.vue
View File

@@ -1,160 +0,0 @@
<template>
<div class='chill-entity entity-address'>
<div class="my-3">
<h2 v-if="!edit">{{ $t('create_a_new_address') }}</h2>
<h2 v-else>{{ $t('edit_address') }}</h2>
<show-address
v-if="newAddress"
v-bind:address="newAddress">
</show-address>
<add-address
modalAddTitle="add_an_address_title"
modalEditTitle="edit_address"
@addNewAddress="addNewAddress">
</add-address>
</div>
<div v-if="!edit" class='address-valid'>
<h2>{{ $t('move_date') }}</h2>
<div class="input-group mb-3">
<span class="input-group-text" id="validFrom"><i class="fa fa-fw fa-calendar"></i></span>
<input type="date" class="form-control form-control-lg" name="validFrom"
v-bind:placeholder="$t('validFrom')"
v-model="validFrom"
aria-describedby="validFrom" />
</div>
<div v-if="errors.length > 0">
{{ errors }}
</div>
<div v-if="loading">
{{ $t('loading') }}
</div>
<div v-if="success && !edit">
{{ $t('household_address_move_success') }}
</div>
</div>
<div v-if="success && edit">
{{ $t('household_address_edit_success') }}
</div>
<ul class="record_actions sticky-form-buttons">
<li class="cancel">
<a :href="backUrl" class="btn btn-cancel">{{ $t('back_to_the_list') }}</a>
</li>
<li v-if="!edit">
<button type="submit" class="btn btn-update" @click="addToHousehold">
{{ $t('add_an_address_to_household') }}
</button>
</li>
</ul>
</div>
</template>
<script>
import AddAddress from 'ChillMainAssets/vuejs/Address/components/AddAddress.vue';
import ShowAddress from 'ChillMainAssets/vuejs/Address/components/ShowAddress.vue';
export default {
name: 'App',
components: {
AddAddress,
ShowAddress
},
data() {
return {
edit: window.mode === 'edit',
householdId: window.householdId,
addressId: window.addressId,
backUrl: `/fr/person/household/${householdId}/addresses`, //TODO better way to pass this
validFrom: new Date().toISOString().split('T')[0]
}
},
computed: {
newAddress() {
return this.$store.state.newAddress;
},
errors() {
return this.$store.state.errorMsg;
},
loading() {
return this.$store.state.loading;
},
success() {
return this.$store.state.success;
}
},
methods: {
addNewAddress({ address, modal }) {
console.log('@@@ CLICK button addNewAdress', address);
let createdAddress = {
'isNoAddress': address.isNoAddress,
'street': address.isNoAddress ? '' : address.street,
'streetNumber': address.isNoAddress ? '' : 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){
createdAddress = Object.assign(createdAddress, {
'point': address.selected.address.point.coordinates
});
}
if(address.writeNewPostalCode){
let newPostalCode = address.newPostalCode;
newPostalCode = Object.assign(newPostalCode, {
'country': {'id': address.selected.country.id },
});
createdAddress = Object.assign(createdAddress, {
'newPostalCode': newPostalCode
});
}
if (this.edit){
this.$store.dispatch('updateAddress', {
addressId: this.addressId,
newAddress: createdAddress
});
} else {
this.$store.dispatch('addAddress', createdAddress);
}
modal.showModal = false;
},
addToHousehold() {
this.$store.dispatch('addDateToAddressAndAddressToHousehold', {
householdId: this.householdId,
addressId: this.$store.state.newAddress.address_id,
body: { validFrom: {datetime: `${this.validFrom}T00:00:00+0100`}},
backUrl: this.backUrl
})
},
getEditAddress() {
this.$store.dispatch('getEditAddress', this.addressId);
}
},
mounted() {
if (this.edit) {
this.getEditAddress();
}
},
};
</script>
<style lang="scss">
div.entity-address {
border: 1px dashed grey;
}
</style>

25
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/index.js
View File

@@ -1,25 +0,0 @@
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');

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

@@ -1,160 +0,0 @@
import 'es6-promise/auto';
import { createStore } from 'vuex';
import { postAddress, postPostalCode, patchAddress, getAddress } from 'ChillMainAssets/vuejs/Address/api';
import { postAddressToHousehold } from '../api';
const debug = process.env.NODE_ENV !== 'production';
const store = createStore({
strict: debug,
state: {
newAddress: {},
editAddress: {}, //TODO or should be newAddress?
household: {},
validFrom: {},
errorMsg: [],
loading: false,
success: false
},
getters: {
},
mutations: {
catchError(state, error) {
state.errorMsg.push(error);
},
addAddress(state, address) {
console.log('@M addAddress address', address);
state.newAddress = address;
},
updateAddress(state, address) {
console.log('@M updateAddress address', address);
state.newAddress = address;
},
addAddressToHousehold(state, household) {
console.log('@M addAddressToHousehold household', household);
state.household = household;
},
addDateToAddress(state, validFrom) {
console.log('@M addDateToAddress address.validFrom', validFrom);
state.validFrom = validFrom;
},
getEditAddress(state, address) {
console.log('@M getEditAddress address', address);
state.editAddress = address;
},
setLoading(state, b) {
state.loading = b;
},
setSuccess(state, b) {
state.success = b;
}
},
actions: {
addAddress({ commit }, payload) {
console.log('@A addAddress payload', payload);
commit('setLoading', true);
if('newPostalCode' in payload){
postPostalCode(payload.newPostalCode)
.then(postalCode => {
let body = payload;
body.postcode = {'id': postalCode.id },
postAddress(body)
.then(address => new Promise((resolve, reject) => {
commit('addAddress', address);
resolve();
commit('setLoading', false);
}))
.catch((error) => {
commit('catchError', error);
commit('setLoading', false);
});
})
} else {
postAddress(payload)
.then(address => new Promise((resolve, reject) => {
commit('addAddress', address);
resolve();
commit('setLoading', false);
}))
.catch((error) => {
commit('catchError', error);
commit('setLoading', false);
});
}
},
addDateToAddressAndAddressToHousehold({ commit }, payload) {
console.log('@A addDateToAddressAndAddressToHousehold payload', payload);
commit('setLoading', true);
patchAddress(payload.addressId, payload.body)
.then(address => new Promise((resolve, reject) => {
commit('addDateToAddress', address.validFrom);
resolve();
}).then(
postAddressToHousehold(payload.householdId, payload.addressId)
.then(household => new Promise((resolve, reject) => {
commit('addAddressToHousehold', household);
commit('setSuccess', true);
commit('setLoading', false);
window.location.assign(payload.backUrl);
resolve();
}))
.catch((error) => {
commit('catchError', error);
commit('setLoading', false);
})
))
.catch((error) => {
commit('catchError', error);
commit('setLoading', false);
});
},
updateAddress({ commit }, payload) {
console.log('@A updateAddress payload', payload);
if('newPostalCode' in payload.newAddress){ // TODO change the condition because it writes new postal code in edit mode now: !writeNewPostalCode
let postalCodeBody = payload.newAddress.newPostalCode;
postalCodeBody = Object.assign(postalCodeBody, {'origin': 3});
postPostalCode(postalCodeBody)
.then(postalCode => {
let body = payload.newAddress;
body.postcode = {'id': postalCode.id },
patchAddress(payload.addressId, body)
.then(address => new Promise((resolve, reject) => {
commit('updateAddress', address);
commit('setSuccess', true);
resolve();
}))
.catch((error) => {
commit('catchError', error);
});
})
} else {
patchAddress(payload.addressId, payload.newAddress)
.then(address => new Promise((resolve, reject) => {
commit('updateAddress', address);
commit('setSuccess', true);
resolve();
}))
.catch((error) => {
commit('catchError', error);
});
}
},
getEditAddress({ commit }, payload) {
console.log('@A getEditAddress payload', payload);
getAddress(payload).then(address => new Promise((resolve, reject) => {
commit('getEditAddress', address);
resolve();
}))
.catch((error) => {
commit('catchError', error);
});
},
}
});
export { store };

0
src/Bundle/ChillPersonBundle/Resources/public/vuejs/HouseholdAddress/api.js → src/Bundle/ChillPersonBundle/Resources/public/vuejs/_api/AddAddress/Household.js
View File

27
src/Bundle/ChillPersonBundle/Resources/public/vuejs/_api/AddAddress/Person.js Normal file
View File

@@ -0,0 +1,27 @@
/*
* Endpoint chill_api_single_person_address
* method POST, post Person instance
*
* @id integer - id of Person
* @body Object - dictionary with changes to post
*/
const postAddressToPerson = (personId, addressId) => {
//console.log(personId);
//console.log(addressId);
const body = {
'id': addressId
};
const url = `/api/1.0/person/person/${personId}/address.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');
});
};
export { postAddressToPerson };

100
src/Bundle/ChillPersonBundle/Resources/views/Address/_insert_vue_address.html.twig
View File

@@ -1,38 +1,76 @@
<div id="address"></div>{# <== vue_address component #}
{#
This Twig template include load vue_address component.
It push all variables from context in Address/App.vue.
OPTIONS
* mode string ['edit*'|'new'|'create']
* address_id integer
* backUrl twig route: path('route', {parameters})
* modalTitle twig translated chain
* buttonText twig translated chain
* buttonType chill class like 'btn-update'
* buttonSize bootstrap class like 'btn-sm'
#}
<div id="address"></div>
<script type="text/javascript">
window.vueRootComponent = 'app';
window.mode = '{{ mode|e('js') }}';
window.personId = {{ person.id|e('js') }};
window.addressId = {{ address_id|e('js') }};
{% if backUrl is defined %}
window.backUrl = '{{ backUrl|e('js') }}';
{% else %}
window.backUrl = '{{ path('chill_person_address_list', { 'person_id': person.id })|e('js') }}';
{% endif %}
{% if modalTitle is defined %}
window.modalTitle = '{{ modalTitle|trans|e('js') }}';
{% endif %}
window.button = {};
{% if buttonText is defined %}
window.buttonText = '{{ buttonText|trans|e('js') }}';
{% endif %}
{% if buttonType is defined %}
window.button.type = '{{ buttonType|e('js') }}';
{% endif %}
{% if buttonSize is defined %}
window.button.size = '{{ buttonSize|e('js') }}';
{% endif %}
{% if buttonDisplay is defined and buttonDisplay == false %}
window.button.display = false;
{% endif %}
{% if binModalStep1 is defined and binModalStep1 == false %}
window.binModalStep1 = false;
{% endif %}
{% if binModalStep2 is defined and binModalStep2 == false %}
window.binModalStep2 = false;
{% endif %}
{% if person is defined %}
window.entityType = 'person';
window.entityId = {{ person.id|e('js') }};
{% elseif household is defined %}
window.entityType = 'household';
window.entityId = {{ household.id|e('js') }};
{% endif %}
{% if 'edit' in app.request.get('_route') %}
window.addressId = {{ app.request.get('address_id')|e('js') }};
window.mode = 'edit';
{% elseif mode is defined and mode == 'edit' %}
window.addressId = {{ address_id|e('js') }};
window.mode = 'edit';
{% endif %}
{% if backUrl is not defined %}
{% if person is defined %}
window.backUrl = '{{ path('chill_person_address_list', { 'person_id': person.id })|e('js') }}';
{% elseif household is defined %}
window.backUrl = '{{ path('chill_person_household_addresses', { 'household_id': household.id })|e('js') }}';
{% endif %}
{% else %}
window.backUrl = '{{ backUrl|e('js') }}';
{% endif %}
{% if modalTitle is defined %}
window.modalTitle = '{{ modalTitle|trans|e('js') }}';
{% endif %}
{% if buttonText is defined %}
window.buttonText = '{{ buttonText|trans|e('js') }}';
{% endif %}
{% if buttonType is defined %}
window.buttonType = '{{ buttonType|e('js') }}';
{% endif %}
{% if buttonSize is defined %}
window.buttonSize = '{{ buttonSize|e('js') }}';
{% endif %}
{% if buttonDisplay is defined and buttonDisplay == false %}
window.buttonDisplay = false;
{% endif %}
{% if binModalStep1 is defined and binModalStep1 == false %}
window.binModalStep1 = false;
{% endif %}
{% if binModalStep2 is defined and binModalStep2 == false %}
window.binModalStep2 = false;
{% endif %}
</script>
{{ encore_entry_script_tags('vue_address') }}

2
src/Bundle/ChillPersonBundle/Resources/views/Address/edit.html.twig
View File

@@ -28,8 +28,6 @@
{# include vue_address component #}
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
address_id: person.lastAddress.id,
mode: 'edit',
binModalStep1: false,
binModalStep2: false,
} %}

1
src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig
View File

@@ -30,7 +30,6 @@
{# include vue_address component #}
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
address_id: person.lastAddress.id,
mode: 'new',
buttonSize: 'btn-lg',
buttonText: 'Add an address',

2
src/Bundle/ChillPersonBundle/Resources/views/Address/new.html.twig
View File

@@ -28,8 +28,6 @@
{# include vue_address component #}
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
address_id: person.lastAddress.id,
mode: 'new',
binModalStep1: false,
binModalStep2: false,
} %}

19
src/Bundle/ChillPersonBundle/Resources/views/Household/address_edit.html.twig
View File

@@ -7,21 +7,10 @@
<div>
{# include vue_address component #}
<div id="household-address"></div>
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
binModalStep1: false,
binModalStep2: false,
} %}
</div>
{% block stylesheets %}
{{ encore_entry_link_tags('vue_address') }}
{% endblock %}
{% block js %}
<script type="text/javascript">
window.householdId = {{ household.id|e('js') }};
window.addressId = {{ address.id|e('js') }};
window.mode = 'edit';
window.vueRootComponent = 'app';
</script>
{{ encore_entry_script_tags('vue_household_address') }}
{% endblock %}
{% endblock %}

17
src/Bundle/ChillPersonBundle/Resources/views/Household/address_move.html.twig
View File

@@ -7,19 +7,10 @@
<div>
{# include vue_address component #}
<div id="household-address"></div>
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
binModalStep1: false,
binModalStep2: false,
} %}
</div>
{% block stylesheets %}
{{ encore_entry_link_tags('vue_address') }}
{% endblock %}
{% block js %}
<script type="text/javascript">
window.householdId = {{ household.id|e('js') }};
window.vueRootComponent = 'app';
</script>
{{ encore_entry_script_tags('vue_household_address') }}
{% endblock %}
{% endblock %}

11
src/Bundle/ChillPersonBundle/Resources/views/Household/addresses.html.twig
View File

@@ -15,10 +15,13 @@
<li style="margin: auto;">
{# include vue_address component #}
<a class="btn btn-lg btn-create"
href="{{ chill_path_add_return_path('chill_person_household_address_move', { 'household_id': household.id }) }}">
{{ 'Move household'|trans }}
</a>
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
mode: 'new',
backUrl: chill_path_add_return_path('chill_person_household_address_move', { 'household_id': household.id }),
buttonSize: 'btn-lg',
buttonText: 'Move household',
modalTitle: 'Move household',
} %}
</li>
</ul>

2
src/Bundle/ChillPersonBundle/Resources/views/Person/view.html.twig
View File

@@ -202,9 +202,9 @@ This view should receive those arguments:
<li class="list-inline-item">
{# include vue_address component #}
{% include '@ChillPerson/Address/_insert_vue_address.html.twig' with {
mode: 'edit',
address_id: person.lastAddress.id,
backUrl: path('chill_person_view', { 'person_id': person.id }),
mode: 'edit',
modalTitle: 'Edit address',
buttonText: 'Edit address',
buttonType: 'btn-update',

1
src/Bundle/ChillPersonBundle/chill.webpack.config.js
View File

@@ -8,7 +8,6 @@ module.exports = function(encore, entries)
ChillPersonAssets: __dirname + '/Resources/public'
});
encore.addEntry('vue_household_address', __dirname + '/Resources/public/vuejs/HouseholdAddress/index.js');
encore.addEntry('vue_household_members_editor', __dirname + '/Resources/public/vuejs/HouseholdMembersEditor/index.js');
encore.addEntry('vue_accourse', __dirname + '/Resources/public/vuejs/AccompanyingCourse/index.js');