Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

date formatting using dateToISO function, still fix with translations. + record-actions inserted via <slot>

Browse Source
This commit is contained in:
Julie Lenaerts 2021-08-17 14:05:48 +02:00
parent 77fe497994
commit 1a6c0529cc
2 changed files with 71 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated/ParticipationItem.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="flex-table mb-3">
<person-render-box
:options="{
addInfo : true,
@ -10,8 +10,47 @@
addAge : false,
hLevel : 1
}"
:participation="participation"
></person-render-box>
:person="participation.person"
>
<template v-slot:record-actions>
<ul class="record_actions">
<li>
<on-the-fly
v-bind:type="participation.person.type"
v-bind:id="participation.person.id"
action="show">
</on-the-fly>
</li>
<li>
<on-the-fly
v-bind:type="participation.person.type"
v-bind:id="participation.person.id"
action="edit">
</on-the-fly>
</li>
<!-- <li>
<button class="btn btn-delete"
:title="$t('action.delete')"
@click.prevent="$emit('remove', participation)">
</button>
</li> -->
<li>
<button v-if="!participation.endDate"
class="btn btn-remove"
v-bind:title="$t('action.remove')"
@click.prevent="$emit('close', participation)">
</button>
<button v-else class="btn btn-remove disabled"></button>
</li>
</ul>
</template>
</person-render-box>
</div>
</template>
<!-- <tr>
<td>
{{ participation.person.firstName }}
@ -28,39 +67,9 @@
{{ $d(participation.endDate.datetime, 'short') }}</span>
</td>
<td>
<ul class="record_actions">
<li>
<on-the-fly
v-bind:type="participation.person.type"
v-bind:id="participation.person.id"
action="show">
</on-the-fly>
</li>
<li>
<on-the-fly
v-bind:type="participation.person.type"
v-bind:id="participation.person.id"
action="edit">
</on-the-fly>
</li>
li>
<button class="btn btn-delete"
:title="$t('action.delete')"
@click.prevent="$emit('remove', participation)">
</button>
</li
<li>
<button v-if="!participation.endDate"
class="btn btn-remove"
v-bind:title="$t('action.remove')"
@click.prevent="$emit('close', participation)">
</button>
<button v-else class="btn btn-remove disabled"></button>
</li>
</ul>
</td>
</tr> -->
</template>
<script>
import OnTheFly from 'ChillMainAssets/vuejs/_components/OnTheFly.vue';
@ -77,7 +86,7 @@ export default {
data() {
return {
PersonRenderBox: {
participation : 'participation',
person : 'participation.person',
options : {
addInfo : false,
addId : true,

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

@ -1,5 +1,5 @@
<template>
<div class="flex-table mb-3">
<div class="item-bloc">
<section class="chill-entity entity-person">
<!-- ENTIRE RENDER_BOX -->
@ -14,8 +14,8 @@
<!-- NAME IF ADD LINK AND PERMISSION GRANTED -->
<a v-if="this.options.addLink == true" href="#">
<span class="firstname">{{ participation.person.firstName }}</span>
<span class="lastname">{{ participation.person.lastName }}</span>
<span class="firstname">{{ person.firstName }}</span>
<span class="lastname">{{ person.lastName }}</span>
<!-- IF ALT NAMES -->
<span v-if="this.options.addAltNames == true" class="altnames">
<!-- LOOP THROUGH ALT NAMES -->
@ -25,8 +25,8 @@
</a>
<!-- WITHOUT LINK JUST NAME -->
<span class="firstname">{{ participation.person.firstName }}</span>
<span class="lastname">{{ participation.person.lastName }}</span>
<span class="firstname">{{ person.firstName }}</span>
<span class="lastname">{{ person.lastName }}</span>
<!-- IF ALT NAMES -->
<span v-if="this.options.addAltNames == true" class="altnames">
<!-- LOOP THROUGH ALT NAMES -->
@ -36,7 +36,7 @@
<!-- IF ADD ENTITY OPTION -->
<span v-if="this.options.addEntity == true" class="badge rounded-pill bg-secondary">Person</span>
<span v-if="this.options.addId == true" class="id-number" title="n° participation.person.id">{{ participation.person.id }}</span>
<span v-if="this.options.addId == true" class="id-number" :title="'n° ' + person.id">{{ person.id }}</span>
</div>
<!-- END NAME TAG -->
@ -44,10 +44,10 @@
<!-- BIRTHDATE / DEATHDATE AND AGE -->
<p v-if="this.options.addInfo == true" class="moreinfo">
<i :class="'fa fa-fw ' + getGender" title="{{ getGender }}"></i>
<time datetime="{{ participation.person.birthdate }}" title="**birthdate**">
<time datetime="{{ person.birthdate }}" title="**birthdate**">
Né le {{ birthdate }}
</time>
<span class="age">{{ participation.person.age }}</span>
<span class="age">{{ person.age }}</span>
</p>
<!-- END BIRTH/DEATH AND AGE -->
</div>
@ -63,96 +63,61 @@
<!-- PHONENUMBER -->
<li>
<div v-if="this.participation.person.mobilenumber">
<div v-if="this.person.mobilenumber">
<i class="fa fa-li fa-mobile"></i>
<a href="#">{{ participation.person.mobilenumber }}</a>
<a href="#">{{ person.mobilenumber }}</a>
</div>
<div v-else-if="this.participation.person.phonenumber">
<div v-else-if="this.person.phonenumber">
<i class="fa fa-li fa-phone"></i>
<a href="#">{{ participation.person.phonenumber }}</a>
<a href="#">{{ person.phonenumber }}</a>
</div>
<span v-else class="chill-no-data-statement">Pas d'information</span>
</li>
</ul>
<ul class="record_actions">
<li>
<on-the-fly
v-bind:type="participation.person.type"
v-bind:id="participation.person.id"
action="show">
</on-the-fly>
</li>
<li>
<on-the-fly
v-bind:type="participation.person.type"
v-bind:id="participation.person.id"
action="edit">
</on-the-fly>
</li>
<li>
<button class="btn btn-delete"
:title="$t('action.delete')"
@click.prevent="$emit('remove', participation)">
</button>
</li>
<li>
<button v-if="!participation.endDate"
class="btn btn-remove"
v-bind:title="$t('action.remove')"
@click.prevent="$emit('close', participation)">
</button>
<button v-else class="btn btn-remove disabled"></button>
</li>
</ul>
<!-- END ADDRESS AND PHONE NUMBER -->
<!-- ACTION BUTTONS -->
<!-- <ul class="record_actions">
<li>
<a class="btn btn-show" target="_blank" title="Show person"
href="#"></a>
</li>
</ul> -->
<slot name="record-actions"></slot>
<!-- END ACTIONS -->
</div>
<!-- END EXTRA INFO AND ACTIONS -->
</div>
</section>
</div>
</div>
</template>
<script>
import OnTheFly from 'ChillMainAssets/vuejs/_components/OnTheFly.vue';
import {dateToISO} from 'ChillMainAssets/chill/js/date.js';
export default {
name: "PersonRenderBox",
components: {
OnTheFly
},
props: ['participation', 'options'],
props: ['person', 'options'],
computed: {
getGender: function() {
// gender
return this.participation.person.gender == 'woman' ? 'fa-venus' : this.participation.person.gender == 'man' ? 'fa-mars' : 'fa-neuter';
return this.person.gender == 'woman' ? 'fa-venus' : this.person.gender == 'man' ? 'fa-mars' : 'fa-neuter';
},
birthdate: function(){
var date = new Date(this.participation.person.birthdate.datetime);
var day = date.getDate()
var months = ["Jan.", "Fevr.", "Mars", "Avril", "Mai", "Juin", "Juill.", "Août", "Sept.", "Oct.", "Nov.", "Dec."]
var month = date.getMonth()
var year = date.getFullYear()
return `${day} ${months[month]} ${year}`;
var date = new Date(this.person.birthdate.datetime);
// var day = date.getDate()
// var months = ["Jan.", "Fevr.", "Mars", "Avril", "Mai", "Juin", "Juill.", "Août", "Sept.", "Oct.", "Nov.", "Dec."]
// var month = date.getMonth()
// var year = date.getFullYear()
return dateToISO(date);
},
altNameLabel: function(){
for(let i = 0; i < this.participation.person.altNames.length; i++){
return this.participation.person.altNames[i].label
for(let i = 0; i < this.person.altNames.length; i++){
return this.person.altNames[i].label
}
},
altNameKey: function(){
for(let i = 0; i < this.participation.person.altNames.length; i++){
return this.participation.person.altNames[i].key
for(let i = 0; i < this.person.altNames.length; i++){
return this.person.altNames[i].key
}
},
}