From 88362bd284a1c77e8ab00b1a1b0d9625e8d7f386 Mon Sep 17 00:00:00 2001
From: Julie Lenaerts <julielenaerts@gmail.com>
Date: Wed, 25 Aug 2021 17:46:51 +0200
Subject: [PATCH] start of updating personrenderbox to display age. only one
 scenario done

---
 .../Resources/public/vuejs/_js/i18n.js        |  3 ++-
 .../_components/Entity/PersonRenderBox.vue    | 22 +++++++++++++++----
 2 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.js b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.js
index 84db72236..9c28c9fdb 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.js
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.js
@@ -76,7 +76,8 @@ const messages = {
          birthday: {
             man: "Né le",
             woman: "Née le"
-         } ,
+         },
+         years_old: "ans",
          no_data: "Aucune information renseignée",
          type: {
             thirdparty: "Tiers",
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue
index 464e2190e..0a8a8da9f 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue
@@ -27,7 +27,7 @@
 
                 </div>
 
-                <p v-if="this.options.addInfo == true" class="moreinfo">
+                <p v-if="options.addInfo == true" class="moreinfo">
                     <i :class="'fa fa-fw ' + getGenderIcon" title="{{ getGender }}"></i>
                     <time v-if="person.birthdate" datetime="{{ person.birthdate }}" title="{{ birthdate }}">
                         {{ $t(getGender) + ' ' + $d(birthdate, 'text') }}
@@ -35,7 +35,7 @@
                     <time v-else-if="person.deathdate" datetime="{{ person.deathdate }}" title="{{ person.deathdate }}">
                         {{ birthdate }} - {{ deathdate }}
                     </time>
-                    <!-- <span class="age">{{ person.age }}</span> -->
+                    <span v-if="options.addAge" class="age">{{ getAge }} {{ $t('renderbox.years_old')}}</span>
                 </p>
             </div>
         </div>
@@ -114,12 +114,14 @@ export default {
             return this.person.gender == 'woman' ? 'fa-venus' : this.person.gender == 'man' ? 'fa-mars' : 'fa-neuter';
         },
         birthdate: function(){
-            var date = new Date(this.person.birthdate.datetime);
+            const date = new Date(this.person.birthdate.datetime);
             return dateToISO(date);
         },
         deathdate: function(){
-            var date = new Date(this.person.deathdate.datetime);
+            if(this.person.deathdate){
+            const date = new Date(this.person.deathdate.datetime);
             return dateToISO(date);
+            }
         },
         altNameLabel: function(){
             for(let i = 0; i < this.person.altNames.length; i++){
@@ -131,6 +133,12 @@ export default {
                 return this.person.altNames[i].key
             }
         },
+        getAge: function(){
+            if(this.person.birthdate && !this.person.deathdate){
+                const birthday = new Date(this.person.birthdate.datetime)
+                const now = new Date()
+                return (now.getFullYear() - birthday.getFullYear())
+        }
     }
 }
 </script>
@@ -153,6 +161,12 @@ div.flex-table {
       }
    }
 }
+
+.age{
+    margin-left: 0.5em;
+    &:before { content: '('; }
+    &:after { content: ')'; }
+}
 </style>