injecting person data into renderbox, no styling yet

This commit is contained in:
Julie Lenaerts 2021-08-12 16:23:58 +02:00
parent c48586cd0e
commit 6bb5440220
2 changed files with 37 additions and 17 deletions

View File

@ -1,8 +1,12 @@
<template> <template>
<tr> <tr>
<td> <td>
{{ participation.person.firstName }} <!-- {{ participation.person.firstName }}
{{ participation.person.lastName }} {{ participation.person.lastName }} -->
<person-render-box
v-bind:options="options"
v-bind:participation="participation"
></person-render-box>
</td> </td>
<td><span v-if="participation.startDate"> <td><span v-if="participation.startDate">
{{ $d(participation.startDate.datetime, 'short') }}</span> {{ $d(participation.startDate.datetime, 'short') }}</span>
@ -47,13 +51,28 @@
<script> <script>
import OnTheFly from 'ChillMainAssets/vuejs/_components/OnTheFly.vue'; import OnTheFly from 'ChillMainAssets/vuejs/_components/OnTheFly.vue';
import PersonRenderBox from '../../../_components/Entity/PersonRenderBox.vue';
export default { export default {
name: 'ParticipationItem', name: 'ParticipationItem',
components: { components: {
OnTheFly OnTheFly,
PersonRenderBox
}, },
props: ['participation'], props: ['participation'],
emits: ['remove', 'close'], emits: ['remove', 'close'],
data() {
return {
PersonRenderBox: {
participation : 'participation',
options : {
addInfo : true,
addId : true,
addAge : false,
hLevel : 1
}
}
}
}
} }
</script> </script>

View File

@ -3,7 +3,7 @@
<div class="item-row entity-bloc"> <div class="item-row entity-bloc">
<!-- LABEL --> <!-- LABEL -->
<div class="item-col"> <div class="item-col">
<div class="entity-label"> <div class="entity-label">
<!-- NAME TAG --> <!-- NAME TAG -->
@ -11,19 +11,19 @@
<!-- NAME IF ADD LINK AND PERMISSION GRANTED --> <!-- NAME IF ADD LINK AND PERMISSION GRANTED -->
<a href="#"> <a href="#">
<span class="firstname">**firstname**</span> <span class="firstname">{{ participation.person.firstName }}</span>
<span class="lastname">**lastname**</span> <span class="lastname">{{ participation.person.lastName }}</span>
<!-- IF ALT NAMES --> <!-- IF ALT NAMES -->
<!-- <span class="altnames"> --> <span class="altnames">
<!-- LOOP THROUGH ALT NAMES --> <!-- LOOP THROUGH ALT NAMES -->
<!-- <span class="altname altname-**key**">**label**</span> --> <span class="altname altname-**key**">**label**</span>
<!-- END LOOP --> <!-- END LOOP -->
<!-- </span> --> </span>
</a> </a>
<!-- WITHOUT LINK JUST NAME --> <!-- WITHOUT LINK JUST NAME -->
<span class="firstname">**firstname**</span> <span class="firstname">{{ participation.person.firstName }}</span>
<span class="lastname">**lastname**</span> <span class="lastname">{{ participation.person.lastName }}</span>
<!-- IF ALT NAMES --> <!-- IF ALT NAMES -->
<span class="altnames"> <span class="altnames">
<!-- LOOP THROUGH ALT NAMES --> <!-- LOOP THROUGH ALT NAMES -->
@ -33,7 +33,7 @@
<!-- IF ADD ENTITY OPTION --> <!-- IF ADD ENTITY OPTION -->
<span class="badge rounded-pill bg-secondary">**Person object?**</span> <span class="badge rounded-pill bg-secondary">**Person object?**</span>
<span class="id-number" title="**n°person_id**">**person_id**</span> <span class="id-number" title="n° participation.person.id">{{ participation.person.id }}</span>
</div> </div>
<!-- END NAME TAG --> <!-- END NAME TAG -->
@ -42,9 +42,9 @@
<p class="moreinfo"> <p class="moreinfo">
<i class="fa fa-fw **gender**" title="**gender title**"></i> <i class="fa fa-fw **gender**" title="**gender title**"></i>
<time datetime="13/05/1867" title="**birthdate**"> <time datetime="13/05/1867" title="**birthdate**">
birthdate {{ participation.person.birthdate }}
</time> </time>
<span class="age">**age**</span> <span class="age">{{ participation.person.age }}</span>
</p> </p>
<!-- END BIRTH/DEATH AND AGE --> <!-- END BIRTH/DEATH AND AGE -->
@ -61,9 +61,9 @@
<!-- PHONENUMBER --> <!-- PHONENUMBER -->
<li> <li>
<i class="fa fa-li fa-mobile"></i><a href="#">**mobilenumber**</a> <i class="fa fa-li fa-mobile"></i><a href="#">{{ participation.person.mobilenumber }}</a>
<i class="fa fa-li fa-phone"></i> <i class="fa fa-li fa-phone"></i>
<a href="#">**regular phonenumber**</a> <a href="#">{{ participation.person.phonenumber }}</a>
<span class="chill-no-data-statement">**no phonenumber**</span> <span class="chill-no-data-statement">**no phonenumber**</span>
</li> </li>
</ul> </ul>
@ -87,7 +87,8 @@
export default { export default {
name: "PersonRenderBox", name: "PersonRenderBox",
props: [ props: [
'options' 'options',
'participation'
], ],
data() { data() {
return { return {