diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue index 249b53588..15635842d 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/App.vue @@ -1,22 +1,14 @@ diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/ShowAddressPane.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/ShowAddressPane.vue index d3894f972..4e9e59874 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/ShowAddressPane.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/ShowAddressPane.vue @@ -4,9 +4,11 @@ {{ $t('loading') }} +
{{ errorMsg }}
+
{{ $t(getSuccessText) }}
@@ -26,23 +28,24 @@ @@ -65,7 +68,7 @@ export default { 'errorMsg', 'insideModal' ], - emits: ['openEditPane', 'submitAddress'], //? + emits: ['openEditPane'], // 'submitAddress' computed: { address() { return this.entity.address; @@ -79,10 +82,10 @@ export default { } }, getValidFromDateText() { - return (this.context.entity.type === 'household') ? 'move_date' : 'validFrom'; + return (this.context.entity.name === 'household') ? 'move_date' : 'validFrom'; }, getSuccessText() { - switch (this.context.entity.type) { + switch (this.context.entity.name) { /* case 'household': return (this.context.edit) ? 'household_address_edit_success' : 'household_address_move_success'; diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js index bb2dd6543..a4d933cdd 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/index.js @@ -1,13 +1,59 @@ import { createApp } from 'vue'; -import App from './App.vue'; import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n'; import { addressMessages } from './i18n'; +import App from './App.vue'; const i18n = _createI18n( addressMessages ); -const app = createApp({ - template: ``, -}) -.use(i18n) -.component('app', App) -.mount('#address'); +let containers = document.querySelectorAll('.address-container'); +containers.forEach((container) => { + + const app = createApp({ + template: ``, + data() { + return { + addAddress: { + context: { + entity: { + name: container.dataset.targetEntityName, + id: container.dataset.targetEntityId + }, + edit: container.dataset.mode === 'edit', //boolean + addressId: container.dataset.addressId || null, + backUrl: container.dataset.backUrl || null, + valid: { + from: new Date() + }, + }, + options: { + /// Options override default. + /// null value take default component value defined in AddAddress data() + button: { + text: { + create: container.dataset.buttonText || null, + edit: container.dataset.buttonText || null + }, + size: container.dataset.buttonSize || null, + displayText: container.dataset.buttonDisplayText !== 'false' //boolean, default: true + }, + /// Modal title text if create or edit address (trans chain, see i18n) + title: { + create: container.dataset.modalTitle || null, + edit: container.dataset.modalTitle || null + }, + /// Display each step in page or Modal + bindModal: { + step1: container.dataset.bindModalStep1 !== 'false', //boolean, default: true + step2: container.dataset.bindModalStep2 !== 'false' //boolean, default: true + } + } + } + } + } + }) + .use(i18n) + .component('app', App) + .mount(container); + + console.log('container dataset', container.dataset); +}); diff --git a/src/Bundle/ChillMainBundle/Resources/views/Address/_insert_vue_address.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Address/_insert_vue_address.html.twig index fabfc69cb..4b38f288f 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Address/_insert_vue_address.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Address/_insert_vue_address.html.twig @@ -14,54 +14,51 @@ * buttonText twig translated chain * buttonSize bootstrap class like 'btn-sm' * buttonDisplayText bool - * binModalStep1 bool - * binModalStep2 bool + * bindModalStep1 bool + * bindModalStep2 bool #} -
+
- window.vueRootComponent = 'app'; - - window.entityType = '{{ targetEntity.name|e('js') }}'; - window.entityId = '{{ targetEntity.id|e('js') }}'; + data-target-entity-name="{{ targetEntity.name|e('html_attr') }}" + data-target-entity-id="{{ targetEntity.id|e('html_attr') }}" {% if 'edit' in app.request.get('_route') %} - window.mode = 'edit'; - window.addressId = {{ app.request.get('address_id')|e('js') }}; + data-mode="edit" + data-address-id="{{ app.request.get('address_id')|e('html_attr') }}" {% elseif mode is defined and mode == 'edit' %} - window.mode = 'edit'; - window.addressId = {{ addressId|e('js') }}; + data-mode="edit" + data-address-id="{{ addressId|e('html_attr') }}" {% endif %} {% if backUrl is defined %} - window.backUrl = '{{ backUrl|e('js') }}'; + data-back-url="{{ backUrl|e('html_attr') }}" {% endif %} {% if modalTitle is defined %} - window.modalTitle = '{{ modalTitle|trans|e('js') }}'; + data-modal-title="{{ modalTitle|trans|e('html_attr') }}" {% endif %} {% if buttonText is defined %} - window.buttonText = '{{ buttonText|trans|e('js') }}'; + data-button-text="{{ buttonText|trans|e('html_attr') }}" {% endif %} {% if buttonSize is defined %} - window.buttonSize = '{{ buttonSize|e('js') }}'; + data-button-size="{{ buttonSize|e('html_attr') }}" {% endif %} - {% if buttonDisplayText is defined and buttonDisplayText == false %} - window.buttonDisplayText = false; + {% if buttonDisplayText is defined and buttonDisplayText != 1 %} + data-button-display-text="false" {% endif %} - {% if binModalStep1 is defined and binModalStep1 == false %} - window.binModalStep1 = false; + {% if bindModalStep1 is defined and bindModalStep1 != 1 %} + data-bind-modal-step1="false" {% endif %} - {% if binModalStep2 is defined and binModalStep2 == false %} - window.binModalStep2 = false; + {% if bindModalStep2 is defined and bindModalStep2 != 1 %} + data-bind-modal-step2="false" {% endif %} - +>
{{ encore_entry_script_tags('vue_address') }} {{ encore_entry_link_tags('vue_address') }} diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/ButtonLocation.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/ButtonLocation.vue index f4f2f1c78..86f9cb4f8 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/ButtonLocation.vue +++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/ButtonLocation.vue @@ -54,7 +54,7 @@ export default { assignAddress() { //console.log('assignAddress id', this.person.current_household_address); let payload = { - entity: this.context.entity.type, + entity: this.context.entity.name, entityId: this.context.entity.id, locationStatusTo: 'person', personId: this.person.id diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/CourseLocation.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/CourseLocation.vue index fab49a20b..002265024 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/CourseLocation.vue +++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/CourseLocation.vue @@ -41,7 +41,7 @@ :key="addAddress.type" :options="addAddress.options" :result="addAddress.result" - @submitAddress="submitTemporaryAddress" + :addressChanged="submitTemporaryAddress" ref="addAddress"> @@ -118,7 +118,7 @@ export default { initAddressContext() { let context = { entity: { - type: this.accompanyingCourse.type, + name: this.accompanyingCourse.type, id: this.accompanyingCourse.id }, edit: false, @@ -133,7 +133,7 @@ export default { removeAddress() { //console.log('remove address'); let payload = { - entity: this.context.entity.type, + entity: this.context.entity.name, entityId: this.context.entity.id, locationStatusTo: 'none' }; @@ -142,9 +142,8 @@ export default { displayErrors() { return this.$refs.addAddress.errorMsg; }, - submitTemporaryAddress() { + submitTemporaryAddress(payload) { //console.log('@@@ click on Submit Temporary Address Button'); - let payload = this.$refs.addAddress.submitNewAddress(); payload['locationStatusTo'] = 'address'; // <== temporary, not none, not person this.$store.dispatch('updateLocation', payload); this.$store.commit('setEditContextTrue'); diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Address/edit.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Address/edit.html.twig index 954bbf348..20713ec49 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Address/edit.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Address/edit.html.twig @@ -30,8 +30,8 @@ {% include '@ChillMain/Address/_insert_vue_address.html.twig' with { targetEntity: { name: 'person', id: person.id }, backUrl: path('chill_person_address_list', { 'person_id': person.id }), - binModalStep1: false, - binModalStep2: false, + bindModalStep1: false, + bindModalStep2: false, } %} {% endblock %} diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig index 811858f97..15a777f9f 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Address/list.html.twig @@ -74,8 +74,8 @@ backUrl: path('chill_person_address_list', { 'person_id': person.id }), mode: 'edit', addressId: address.id, - binModalStep1: false, - binModalStep2: false, + bindModalStep1: false, + bindModalStep2: false, } %} #} @@ -90,8 +90,8 @@ backUrl: path('chill_person_address_list', { 'person_id': person.id }), mode: 'edit', addressId: address.id, - binModalStep1: false, - binModalStep2: false, + bindModalStep1: false, + bindModalStep2: false, } %} #} diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Address/new.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Address/new.html.twig index d5a55c760..96c317234 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Address/new.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Address/new.html.twig @@ -30,8 +30,8 @@ {% include '@ChillMain/Address/_insert_vue_address.html.twig' with { targetEntity: { name: 'person', id: person.id }, backUrl: path('chill_person_address_list', { 'person_id': person.id }), - binModalStep1: false, - binModalStep2: false, + bindModalStep1: false, + bindModalStep2: false, } %} {% endblock %} diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Household/address_edit.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Household/address_edit.html.twig index 63ff0a041..353ba09a5 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Household/address_edit.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Household/address_edit.html.twig @@ -10,8 +10,8 @@ {% include '@ChillMain/Address/_insert_vue_address.html.twig' with { targetEntity: { name: 'household', id: household.id }, backUrl: path('chill_person_household_addresses', { 'household_id': household.id }) - binModalStep1: false, - binModalStep2: false, + bindModalStep1: false, + bindModalStep2: false, } %} diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Household/address_move.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Household/address_move.html.twig index f744f5d9f..b6fc39dd9 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Household/address_move.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Household/address_move.html.twig @@ -10,8 +10,8 @@ {% include '@ChillMain/Address/_insert_vue_address.html.twig' with { targetEntity: { name: 'household', id: household.id }, backUrl: path('chill_person_household_addresses', { 'household_id': household.id }) - binModalStep1: false, - binModalStep2: false, + bindModalStep1: false, + bindModalStep2: false, } %} diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig index faf9f13d6..a680f18f2 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Household/summary.html.twig @@ -37,8 +37,12 @@ buttonSize: 'btn-sm', buttonText: 'Move household', modalTitle: 'Move household', - buttonDisplayText: false + buttonDisplayText: false, } %} + {# + bindModalStep1: false, + bindModalStep2: true, + #}
  • {{ 'No address given'|trans }} {% else %} - {{ thirdParty.address|chill_entity_render_box({'with_valid_from': false }) }} + {{ thirdParty.address|chill_entity_render_box({'with_valid_from': false, 'extended_infos': true }) }} {% endif %} @@ -103,7 +103,7 @@