address added to personrenderbox w/ ShowAddress. Adapted to include a multiline option

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

@@ -1,5 +1,5 @@
 <template>
-   <div class="address multiline">
+   <component :is="component" :class="'address'+ isMultiline">
       <p v-if="address.text"
          class="street">
          {{ address.text }}
@@ -48,17 +48,33 @@
             <b>{{ $t('distribution') }}</b>: {{ address.distribution }}
          </span>
       </div>
-   </div>
+   </component>
 </template>
 
 <script>
 
 export default {
    name: 'ShowAddress',
-   props: ['address'],
+   props: {
+      address: {
+         type: Object
+      },
+      multiline: {
+         default: true,
+         type: Boolean
+      }
+   },
    data() {
       return {
       }
    },
+   computed: {
+      component(){
+         return this.multiline == true ? "div" : "span";
+      },
+      isMultiline(){
+         return this.multiline == true ? " multiline" : "";
+      }
+   }
 };
 </script>

src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.js

@@ -63,6 +63,14 @@ const messages = {
             thirdparty: "un nouveau tiers professionnel"
          },         
       },
+      renderbox: {
+         person: "Person",
+         birthday: {
+            man: "Né le",
+            woman: "Née le"
+         } ,
+         no_information: "Pas d'information"
+      }
    }
 };
 

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/AddressRenderBox.vue

@@ -2,7 +2,7 @@
 
         <li v-if="address" class="chill-entity entity-address">
             <i v-if="options.with_picto == true" class="fa fa-fw fa-map-marker"></i>
-            <span v-if="options.render == 'list' || options.render == 'list'" class="address">
+            <span v-if="options.render == 'list' || options.render == 'list'" :class="'address ' + {'multiline' : options.multiline === true}">
                 
                     
                     <!-- if address.street is not empty -->

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue

@@ -35,7 +35,7 @@
                     </span>
 
                     <!-- IF ADD ENTITY OPTION -->
-                    <span v-if="this.options.addEntity ==  true" class="badge rounded-pill bg-secondary">Person</span>
+                    <span v-if="this.options.addEntity ==  true" class="badge rounded-pill bg-secondary">{{ $t('renderbox.person') }}</span>
                     <span v-if="this.options.addId ==  true" class="id-number" :title="'n° ' + person.id">{{ person.id }}</span>
 
                 </div>
@@ -43,9 +43,10 @@
 
                 <!-- BIRTHDATE / DEATHDATE AND AGE -->
                 <p v-if="this.options.addInfo == true" class="moreinfo">
-                    <i :class="'fa fa-fw ' + getGender" title="{{ getGender }}"></i>
+                    <!-- todo: change icon if person is deceased? -->
+                    <i :class="'fa fa-fw ' + getGenderIcon" title="{{ getGender }}"></i>
                     <time v-if="person.birthdate" datetime="{{ person.birthdate }}" title="{{ birthdate }}">
-                        Birthday {{ birthdate }}
+                        {{ $t(getGender) + ' ' + $d(birthdate, 'text') }}
                     </time>
                     <time v-else-if="person.deathdate" datetime="{{ person.deathdate }}" title="{{ person.deathdate }}">
                         {{ birthdate }} - {{ deathdate }}
@@ -60,20 +61,13 @@
         <!-- EXTRA INFO AND ACTIONS-->
         <div class="item-col">
             <ul class="list-content fa-ul">
-                
-                <address-render-box
-                :options="{
-                    render: 'list',
-                    with_picto: true,
-                    multiline: false,
-                    extended_infos: false,
-                    with_valid_from: false
-                }"
-                :address="person.current_household_address"
-                ></address-render-box>
-                
-
+                <!-- ADDRESS -->
+                <li v-if="person.current_household_address" class="chill-entity entity-address">
+                    <i class="fa fa-fw fa-map-marker"></i>
+                    <show-address :address="person.current_household_address" :multiline="false"></show-address>
+                </li>
                 <!-- PHONENUMBER -->
+                <!-- todo: change href for phonenumbers -->
                 <li v-if="this.person.mobilenumber">
                     <i class="fa fa-li fa-mobile"></i>
                     <a href="#">{{ person.mobilenumber }}</a>
@@ -82,7 +76,7 @@
                     <i class="fa fa-li fa-phone"></i>
                     <a href="#">{{ person.phonenumber }}</a>
                 </li>
-                <span v-else class="chill-no-data-statement">Pas d'information</span>
+                <span v-else class="chill-no-data-statement">{{ $t('renderbox.no_information') }}</span>
                 
             </ul>
             <!-- END ADDRESS AND PHONE NUMBER -->
@@ -102,15 +96,20 @@
 // import OnTheFly from 'ChillMainAssets/vuejs/_components/OnTheFly.vue';
 import {dateToISO} from 'ChillMainAssets/chill/js/date.js';
 import AddressRenderBox from './AddressRenderBox.vue';
+import ShowAddress from 'ChillMainAssets/vuejs/Address/components/ShowAddress.vue';
 
 export default {
     name: "PersonRenderBox",
     components: {
-        AddressRenderBox
+        AddressRenderBox,
+        ShowAddress
     },
     props: ['person', 'options'],
     computed: {
         getGender: function() {
+            return this.person.gender == 'woman' ? 'renderbox.birthday.woman' : 'renderbox.birthday.man';
+        },
+        getGenderIcon: function() {
             return this.person.gender == 'woman' ? 'fa-venus' : this.person.gender == 'man' ? 'fa-mars' : 'fa-neuter';
         },
         birthdate: function(){