Merge branch 'improve_address' into person_renderbox_thirdparty_onthefly

This commit is contained in:
Mathieu Jaumotte 2021-09-20 20:16:39 +02:00
commit 7d2e82d69b
8 changed files with 56 additions and 38 deletions

View File

@ -31,8 +31,8 @@ export default {
} }
}, },
mounted() { mounted() {
//console.log('AddAddress: data context', this.context); console.log('AddAddress: data context', this.context);
//console.log('AddAddress: data options', this.options); console.log('AddAddress: data options', this.options);
}, },
methods: { methods: {
displayErrors() { displayErrors() {
@ -45,7 +45,7 @@ export default {
if (this.context.edit) { if (this.context.edit) {
// address is already linked, just finish ! // address is already linked, just finish !
this.$refs.addAddress.lastPaneAction(); this.$refs.addAddress.afterLastPaneAction({});
// New created address // New created address
} else { } else {
@ -83,17 +83,17 @@ export default {
* Post new created address to targetEntity * Post new created address to targetEntity
*/ */
postAddressTo(payload) { postAddressTo(payload) {
console.log('postAddressTo', payload.target); console.log('postAddress', payload.addressId, 'To', payload.target, payload.targetId);
switch (payload.target) { switch (payload.target) {
case 'household': case 'household':
postAddressToHousehold(payload.targetId, payload.addressId) postAddressToHousehold(payload.targetId, payload.addressId)
.then(household => new Promise((resolve, reject) => { .then(address => new Promise((resolve, reject) => {
console.log('..toHousehold', household); console.log('..household address', address);
this.$refs.addAddress.flag.loading = false; this.$refs.addAddress.flag.loading = false;
this.$refs.addAddress.flag.success = true; this.$refs.addAddress.flag.success = true;
// finish // finish
this.$refs.addAddress.lastPaneAction(); this.$refs.addAddress.afterLastPaneAction({ addressId: address.address_id });
resolve(); resolve();
})) }))
@ -105,13 +105,13 @@ export default {
break; break;
case 'person': case 'person':
postAddressToPerson(payload.targetId, payload.addressId) postAddressToPerson(payload.targetId, payload.addressId)
.then(person => new Promise((resolve, reject) => { .then(address => new Promise((resolve, reject) => {
console.log('..toPerson', person); console.log('..person address', address);
this.$refs.addAddress.flag.loading = false; this.$refs.addAddress.flag.loading = false;
this.$refs.addAddress.flag.success = true; this.$refs.addAddress.flag.success = true;
// finish // finish
this.$refs.addAddress.lastPaneAction(); this.$refs.addAddress.afterLastPaneAction({ addressId: address.address_id });
resolve(); resolve();
})) }))

View File

@ -104,7 +104,11 @@
<button class="btn btn-cancel change-icon" @click="resetPane"> <button class="btn btn-cancel change-icon" @click="resetPane">
{{ $t('action.cancel') }} {{ $t('action.cancel') }}
</button> </button>
<button class="btn btn-save" @click="closeEditPane"> <button v-if="useDatePane" class="btn btn-misc" @click="closeEditPane">
{{ $t('nav.next')}}
<i class="fa fa-fw fa-arrow-right"></i>
</button>
<button v-else class="btn btn-save" @click="closeEditPane">
{{ $t('action.save')}} {{ $t('action.save')}}
</button> </button>
</template> </template>
@ -128,7 +132,13 @@
</a> </a>
</template> </template>
<template v-slot:action> <template v-slot:action>
<li> <li v-if="useDatePane">
<button class="btn btn-misc" @click="closeEditPane">
{{ $t('nav.next')}}
<i class="fa fa-fw fa-arrow-right"></i>
</button>
</li>
<li v-else>
<button class="btn btn-save" @click="closeEditPane"> <button class="btn btn-save" @click="closeEditPane">
{{ $t('action.save')}} {{ $t('action.save')}}
</button> </button>
@ -189,7 +199,7 @@
<template v-slot:action> <template v-slot:action>
<li> <li>
<button class="btn btn-update" @click="openEditPane"> <button class="btn btn-update" @click="closeDatePane">
{{ $t('action.edit')}} {{ $t('action.edit')}}
</button> </button>
</li> </li>
@ -323,7 +333,7 @@ export default {
//console.log('options bindModal.step2', this.options.bindModal.step2); //console.log('options bindModal.step2', this.options.bindModal.step2);
//console.log('options useDate.validFrom', this.options.useDate.validFrom); //console.log('options useDate.validFrom', this.options.useDate.validFrom);
//console.log('options useDate.validTo', this.options.useDate.validTo); //console.log('options useDate.validTo', this.options.useDate.validTo);
//console.log('useDatePane', this.useDatePane); console.log('useDatePane', this.useDatePane);
console.log('Mounted now !'); console.log('Mounted now !');
if (this.context.edit) { if (this.context.edit) {
@ -378,13 +388,15 @@ export default {
} }
}, },
closeEditPane() { closeEditPane() {
this.applyChanges();
this.flag.editPane = false; this.flag.editPane = false;
console.log('step2: close the Edit Panel'); console.log('step2: close the Edit Panel');
if (!this.context.edit && this.useDatePane) { if (!this.context.edit && this.useDatePane) {
this.openDatePane(); this.openDatePane();
} else { } else {
this.openShowPane() this.applyChanges();
if (!this.options.forceRedirect) {
this.openShowPane();
}
} }
}, },
openDatePane() { openDatePane() {
@ -392,6 +404,7 @@ export default {
console.log('step3: open the Date Panel'); console.log('step3: open the Date Panel');
}, },
closeDatePane() { closeDatePane() {
this.applyChanges();
this.flag.datePane = false; this.flag.datePane = false;
console.log('step3: close the Date Panel'); console.log('step3: close the Date Panel');
}, },
@ -402,13 +415,25 @@ export default {
this.flag.datePane = false; this.flag.datePane = false;
this.openShowPane(); this.openShowPane();
}, },
lastPaneAction() {
/*
* What happens when submitting last Pane:
* - redirect or reset pane,
* - change context to editing
*/
afterLastPaneAction(params) {
this.initForm();
if (this.options.forceRedirect === true) { if (this.options.forceRedirect === true) {
console.log("redirect to backUrl"); console.log("redirect to backUrl");
window.location.assign(this.context.backUrl); window.location.assign(this.context.backUrl);
} else { } else {
console.log("don't redirect"); console.log("don't redirect");
this.resetPane(); this.resetPane();
if (!this.context.edit) {
this.context.edit = true;
this.context.addressId = params.addressId;
console.log("context is now edit, with address", params.addressId);
}
} }
}, },
@ -546,14 +571,14 @@ export default {
if (!this.context.edit) { if (!this.context.edit) {
this.addNewAddress(newAddress) this.addNewAddress(newAddress)
.then(payload => this.closePaneAndCallbackSubmit(payload)); .then(payload => this.addressChangedCallback(payload));
} else { } else {
this.updateAddress({ this.updateAddress({
addressId: this.context.addressId, addressId: this.context.addressId,
newAddress: newAddress newAddress: newAddress
}) })
.then(payload => this.closePaneAndCallbackSubmit(payload)); .then(payload => this.addressChangedCallback(payload));
} }
}, },
@ -563,7 +588,7 @@ export default {
*/ */
addNewAddress(payload) addNewAddress(payload)
{ {
//console.log('addNewAddress', payload); console.log('addNewAddress', payload);
this.flag.loading = true; this.flag.loading = true;
if ('newPostcode' in payload) { if ('newPostcode' in payload) {
@ -583,8 +608,9 @@ export default {
} }
}, },
postNewAddress(payload) { postNewAddress(payload)
//console.log('postNewAddress', payload); {
console.log('postNewAddress', payload);
return postAddress(payload) return postAddress(payload)
.then(address => new Promise((resolve, reject) => { .then(address => new Promise((resolve, reject) => {
this.entity.address = address; this.entity.address = address;
@ -654,18 +680,15 @@ export default {
/* /*
* Method just add closing pane to the callback method * Method just add closing pane to the callback method
* (get out step1 show pane, submit button) * (get out step1 show pane, submit button)
*/
closePaneAndCallbackSubmit(payload) closePaneAndCallbackSubmit(payload)
{ {
//this.initForm();
this.initForm(); //this.resetPane(); // because parent callback will cast afterLastPaneAction()
this.resetPane();
console.log('will call parent callback method', payload); console.log('will call parent callback method', payload);
// callback props method from parent // callback props method from parent
this.addressChangedCallback(payload); this.addressChangedCallback(payload);
} }
*/
} }
} }
</script> </script>

View File

@ -9,10 +9,6 @@
{{ errorMsg }} {{ errorMsg }}
</div> </div>
<div v-if="flag.success" class="alert alert-success">
{{ $t(getSuccessText) }}
</div>
<address-render-box :address="address"></address-render-box> <address-render-box :address="address"></address-render-box>
<div v-if="showDateFrom" class='address-valid date-since'> <div v-if="showDateFrom" class='address-valid date-since'>

View File

@ -7,8 +7,6 @@
<div v-if="errorMsg && errorMsg.length > 0" class="alert alert-danger">{{ errorMsg }}</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>
<h4 class="h3">{{ $t('address_suggestions') }}</h4> <h4 class="h3">{{ $t('address_suggestions') }}</h4>
<div class="flex-table AddressSuggestionList"> <div class="flex-table AddressSuggestionList">

View File

@ -16,10 +16,10 @@ containers.forEach((container) => {
context: { context: {
target: { target: {
name: container.dataset.targetName, name: container.dataset.targetName,
id: container.dataset.targetId id: parseInt(container.dataset.targetId)
}, },
edit: container.dataset.mode === 'edit', //boolean edit: container.dataset.mode === 'edit', //boolean
addressId: container.dataset.addressId || null, addressId: parseInt(container.dataset.addressId) || null,
backUrl: container.dataset.backUrl || null backUrl: container.dataset.backUrl || null
}, },
options: { options: {

View File

@ -30,11 +30,11 @@
{% include '@ChillMain/Address/_insert_vue_address.html.twig' with { {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
targetEntity: { name: 'person', id: person.id }, targetEntity: { name: 'person', id: person.id },
backUrl: path('chill_person_address_list', { 'person_id': person.id }), backUrl: path('chill_person_address_list', { 'person_id': person.id }),
useValidFrom: true,
openPanesInModal: false, openPanesInModal: false,
stickyActions: true, stickyActions: true,
} %} } %}
{# {#
useValidFrom: true,
#} #}
{% endblock %} {% endblock %}

View File

@ -10,6 +10,7 @@
{% include '@ChillMain/Address/_insert_vue_address.html.twig' with { {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
targetEntity: { name: 'household', id: household.id }, targetEntity: { name: 'household', id: household.id },
backUrl: path('chill_person_household_addresses', { 'household_id': household.id }), backUrl: path('chill_person_household_addresses', { 'household_id': household.id }),
forceRedirect: true,
stickyActions: true, stickyActions: true,
} %} } %}
{# {#

View File

@ -18,12 +18,12 @@
{% include '@ChillMain/Address/_insert_vue_address.html.twig' with { {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
targetEntity: { name: 'household', id: household.id }, targetEntity: { name: 'household', id: household.id },
backUrl: path('chill_person_household_addresses', { 'household_id': household.id }), backUrl: path('chill_person_household_addresses', { 'household_id': household.id }),
forceRedirect: true,
mode: 'new', mode: 'new',
useValidFrom: true, useValidFrom: true,
buttonSize: 'btn-lg', buttonSize: 'btn-lg',
buttonText: 'Move household', buttonText: 'Move household',
modalTitle: 'Move household', modalTitle: 'Move household',
forceRedirect: true,
} %} } %}
{# {#
#} #}