Refactor address vue app and create a PickAddressType

src/Bundle/ChillThirdPartyBundle/Entity/ThirdParty.php

@@ -550,9 +550,9 @@ class ThirdParty implements TrackCreationInterface, TrackUpdateInterface
      * @param string $acronym
      * @return $this
      */
-    public function setAcronym(string $acronym): ThirdParty
+    public function setAcronym(?string $acronym = null): ThirdParty
     {
-        $this->acronym = $acronym;
+        $this->acronym = (string) $acronym;
         return $this;
     }
 

src/Bundle/ChillThirdPartyBundle/Form/ThirdPartyType.php

@@ -5,6 +5,7 @@ namespace Chill\ThirdPartyBundle\Form;
 use Chill\MainBundle\Entity\Address;
 use Chill\MainBundle\Entity\Civility;
 use Chill\MainBundle\Form\Type\ChillCollectionType;
+use Chill\MainBundle\Form\Type\PickAddressType;
 use Chill\MainBundle\Form\Type\PickCenterType;
 use Chill\MainBundle\Form\Type\ChillTextareaType;
 use Chill\MainBundle\Templating\TranslatableStringHelper;
@@ -88,7 +89,9 @@ class ThirdPartyType extends AbstractType
             ])
         ;
 
+        /*
         $builder
+            /*
             ->add('address', HiddenType::class)
             ->get('address')
                 ->addModelTransformer(new CallbackTransformer(
@@ -106,8 +109,7 @@ class ThirdPartyType extends AbstractType
                             ->getRepository(Address::class)
                             ->findOneBy(['id' => (int) $addressId]);
                     }
-                ))
-        ;
+                ))*/
 
         // Contact Person ThirdParty (child)
         if (ThirdParty::KIND_CONTACT === $options['kind'] || ThirdParty::KIND_CHILD === $options['kind']) {
@@ -147,6 +149,9 @@ class ThirdPartyType extends AbstractType
         // Institutional ThirdParty (parent)
         } else {
             $builder
+                ->add('address', PickAddressType::class, [
+                    'label' => 'Address'
+                ])
                 ->add('nameCompany', TextType::class, [
                     'label' => 'thirdparty.NameCompany',
                     'required' => false

src/Bundle/ChillThirdPartyBundle/Resources/public/vuejs/_components/OnTheFly/ThirdParty.vue

@@ -20,11 +20,11 @@
    </div>
    <div v-else-if="action === 'edit' || action === 'create'">
 
-       <div class="form-floating mb-3">
+       <div class="form-floating mb-3" v-if="thirdparty.kind !== 'child'">
            <div class="form-check">
                <input class="form-check-input mt-0" type="radio" v-model="kind" value="company" id="tpartyKindInstitution">
                <label for="tpartyKindInstitution" class="required">
-                   <span class="badge bg-thirdparty-company">
+                   <span class="badge bg-thirdparty-company" style="padding-top: 0;">
                        {{ $t('tparty.company')}}
                    </span>
                </label>
@@ -32,24 +32,43 @@
            <div class="form-check">
                <input class="form-check-input mt-0" type="radio" v-model="kind" value="contact" id="tpartyKindContact">
                <label for="tpartyKindContact" class="required">
-                   <span class="badge bg-thirdparty-contact">
+                   <span class="badge bg-thirdparty-contact" style="padding-top: 0;">
                        {{ $t('tparty.contact')}}
                    </span>
                </label>
            </div>
        </div>
+       <div v-else>
+           <p>Contact de&nbsp;:</p>
+          <third-party-render-box :thirdparty="thirdparty.parent"
+              :options="{
+                   addInfo: true,
+                   addEntity: false,
+                   addAltNames: true,
+                   addId: false,
+                   addLink: false,
+                   addAge: false,
+                   hLevel: 4,
+                   addCenter: false,
+                   addNoData: true,
+                   isMultiline: false
+            }"></third-party-render-box>
+       </div>
       <div class="form-floating mb-3">
          <input class="form-control form-control-lg" id="name" v-model="thirdparty.text" v-bind:placeholder="$t('thirdparty.name')" />
          <label for="name">{{ $t('thirdparty.name') }}</label>
       </div>
 
-       <add-address
-           key="thirdparty"
-           :context="context"
-           :options="addAddress.options"
-           :address-changed-callback="submitAddress"
-           ref="addAddress">
-       </add-address>
+       <template
+           v-if="thirdparty.kind !== 'child'">
+           <add-address
+               key="thirdparty"
+               :context="context"
+               :options="addAddress.options"
+               :address-changed-callback="submitAddress"
+               ref="addAddress">
+           </add-address>
+       </template>
 
       <div class="input-group mb-3">
          <span class="input-group-text" id="email"><i class="fa fa-fw fa-envelope"></i></span>
@@ -140,7 +159,7 @@ export default {
             edit: false,
             addressId: null
          };
-         if ( typeof this.thirdparty.address !== 'undefined'
+         if ( !(this.thirdparty.address === undefined || this.thirdparty.address === null)
              && this.thirdparty.address.address_id !== null
          ) { // to complete
              context.addressId = this.thirdparty.address.address_id;
@@ -155,10 +174,13 @@ export default {
       loadData(){
          getThirdparty(this.id).then(thirdparty => new Promise((resolve, reject) => {
             this.thirdparty = thirdparty;
+            this.thirdparty.kind = thirdparty.kind;
             console.log('get thirdparty', thirdparty);
             if (this.action !== 'show') {
-                // bof! we force getInitialAddress because addressId not available when mounted
-                this.$refs.addAddress.getInitialAddress(thirdparty.address.address_id);
+                if (thirdparty.address !== null) {
+                    // bof! we force getInitialAddress because addressId not available when mounted
+                    this.$refs.addAddress.getInitialAddress(thirdparty.address.address_id);
+                }
             }
             resolve();
          }));
@@ -174,6 +196,7 @@ export default {
       }
    },
    mounted() {
+       console.log('mounted', this.action);
       if (this.action !== 'create') {
          this.loadData();
       } else {

src/Bundle/ChillThirdPartyBundle/Resources/views/ThirdParty/_form.html.twig

@@ -28,12 +28,16 @@
     {{ form_widget(form.activeChildren) }}
 {% endif %}
 
+{{ form_row(form.address) }}
+
+{#
 <div class="mb-3 row">
     {{ form_label(form.address) }}
     {{ form_widget(form.address) }}
+
     <div class="col-sm-8">
         {% if thirdParty.address %}
-            {# include vue_address component #}
+            {# include vue_address component #
             {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
                 targetEntity: { name: 'thirdparty', id: thirdParty.id },
                 mode: 'edit',
@@ -42,9 +46,9 @@
             } %}
             {#
             backUrl: path('chill_3party_3party_new'),
-            #}
+            #
         {% else %}
-            {# include vue_address component #}
+            {# include vue_address component #
             {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
                 targetEntity: { name: 'thirdparty', id: thirdParty.id },
                 mode: 'new',
@@ -55,6 +59,7 @@
         {% endif %}
     </div>
 </div>
+#}
 
 {{ form_row(form.comment) }}
 {{ form_row(form.centers) }}

src/Bundle/ChillThirdPartyBundle/Resources/views/ThirdParty/new.html.twig

@@ -19,3 +19,11 @@
     </div>
 </div>
 {% endblock %}
+
+{% block js %}
+    {{ encore_entry_script_tags('mod_input_address') }}
+{% endblock %}
+
+{% block css %}
+    {{ encore_entry_link_tags('mod_input_address') }}
+{% endblock %}

src/Bundle/ChillThirdPartyBundle/Resources/views/ThirdParty/update.html.twig

@@ -36,87 +36,10 @@
     </div>
 {% endblock %}
 
-
-{% block content_not %}
-<div class="thirdparty-edit my-5">
-    <div class="row justify-content-center">
-        <div class="col-md-10">
-
-
-
-            {{ form_start(form) }}
-
-            {% if form.civility is defined %}
-                {{ form_row(form.civility) }}
-            {% endif %}
-
-            {{ form_row(form.name) }}
-
-            {% if form.nameCompany is defined %}
-                {{ form_row(form.nameCompany) }}
-                {{ form_row(form.acronym) }}
-            {% endif %}
-
-            {% if form.profession is defined %}
-                {{ form_row(form.profession) }}
-            {% endif %}
-
-            {{ form_row(form.types) }}
-            {{ form_row(form.categories) }}
-
-            {{ form_row(form.telephone) }}
-            {{ form_row(form.email) }}
-
-            <div class="mb-3 row">
-                {{ form_label(form.address) }}
-                {{ form_widget(form.address) }}
-                <div class="col-sm-8">
-                    {% if thirdParty.address %}
-                        {# include vue_address component #}
-                        {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
-                            targetEntity: { name: 'thirdparty', id: thirdParty.id },
-                            mode: 'edit',
-                            addressId: thirdParty.address.id,
-                            buttonSize: 'btn-sm',
-                        } %}
-                        {#
-                            backUrl: path('chill_3party_3party_update', { thirdparty_id: thirdParty.id }),
-                        #}
-                    {% else %}
-                        {# include vue_address component #}
-                        {% include '@ChillMain/Address/_insert_vue_address.html.twig' with {
-                            targetEntity: { name: 'thirdparty', id: thirdParty.id },
-                            mode: 'new',
-                            buttonSize: 'btn-sm',
-                            buttonText: 'Create a new address',
-                            modalTitle: 'Create a new address',
-                        } %}
-                    {% endif %}
-                </div>
-            </div>
-
-            {{ form_row(form.comment) }}
-            {{ form_row(form.centers) }}
-
-            {{ form_row(form.active) }}
-
-            <ul class="record_actions sticky-form-buttons">
-                <li class="cancel">
-                    <a class="btn btn-cancel" href="{{ chill_path_forward_return_path('chill_3party_3party_index') }}">
-                        {{ 'Back to the list'|trans }}
-                    </a>
-                </li>
-                <li>
-
-                </li>
-                <li>
-                    {{ form_widget(form.submit, {'label': 'Update', 'attr': {'class': 'btn btn-update' }}) }}
-                </li>
-            </ul>
-
-            {{ form_end(form) }}
-
-        </div>
-    </div>
-</div>
+{% block js %}
+    {{ encore_entry_script_tags('mod_input_address') }}
+{% endblock %}
+
+{% block css %}
+    {{ encore_entry_link_tags('mod_input_address') }}
 {% endblock %}